dtable-statistic 5.0.0 → 5.0.2

package/es/stat-editor/stat-settings/basic-chart-settings/horizontal-group-chart-settings.js

@@ -1,150 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactIntlUniversal = _interopRequireDefault(require("react-intl-universal"));
-var _baseSettings = _interopRequireDefault(require("../public-setting/base-settings"));
-var _horizontalBarChartStyle = _interopRequireDefault(require("./style-setting/horizontal-bar-chart-style"));
-var _groupbySettings = _interopRequireDefault(require("./groupby-settings"));
-var _horizontalAxisGroupSettings = _interopRequireDefault(require("./horizontal-axis-group-settings"));
-var _dataSortSetting = _interopRequireDefault(require("../public-setting/data-sort-setting"));
-var _constants = require("../../../constants");
-class HorizontalGroupBarChartSettings extends _react.Component {
-  constructor() {
-    super(...arguments);
-    this.onSelectGroupbyColumn = (type, groupbyColumnKey, groupbyDateGranularity, groupbyGeolocationGranularity) => {
-      let updated = {
-        vertical_axis_column_key: groupbyColumnKey,
-        vertical_axis_date_granularity: groupbyDateGranularity,
-        vertical_axis_geolocation_granularity: groupbyGeolocationGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.onSelectGroupbyDateGranularity = (type, dateGranularity) => {
-      let updated = {
-        vertical_axis_date_granularity: dateGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.onSelectGroupbyGeolocationGranularity = (type, geolocationGranularity) => {
-      let updated = {
-        vertical_axis_geolocation_granularity: geolocationGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.updatedSummaryType = (summaryType, summaryColumnKey, summaryMethod) => {
-      let {
-        statItem
-      } = this.props;
-      let updated = {
-        horizontal_axis_summary_type: summaryType,
-        horizontal_axis_column_key: summaryColumnKey,
-        horizontal_axis_summary_method: summaryMethod
-      };
-      this.props.updateStatItem(Object.assign({}, statItem, updated));
-    };
-    this.updateSummaryColumn = summaryColumnKey => {
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, {
-        horizontal_axis_column_key: summaryColumnKey
-      }));
-    };
-    this.updateSummaryMethod = summaryMethod => {
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, {
-        horizontal_axis_summary_method: summaryMethod
-      }));
-    };
-  }
-  render() {
-    let {
-      getTables,
-      getViews,
-      eventBus,
-      statItem,
-      labelColorConfigs,
-      selectedTable,
-      generalColumnsOptions,
-      numericColumnsOptions,
-      dateGranularityOptions,
-      geolocationGranularityOptions,
-      renderIncludeEmpty,
-      settingType,
-      columnGroupbyColumnsOptions
-    } = this.props;
-    let {
-      table_id: selectedTableId,
-      view_id: selectedViewId,
-      vertical_axis_column_key,
-      vertical_axis_date_granularity,
-      vertical_axis_geolocation_granularity,
-      horizontal_axis_summary_type,
-      horizontal_axis_column_key,
-      horizontal_axis_summary_method
-    } = statItem || {};
-    if (settingType === 'style') {
-      return /*#__PURE__*/_react.default.createElement(_horizontalBarChartStyle.default, {
-        statItem: statItem,
-        labelColorConfigs: labelColorConfigs,
-        eventBus: eventBus,
-        getTableById: this.props.getTableById,
-        updateStatItem: this.props.updateStatItem
-      });
-    }
-    return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_baseSettings.default, {
-      statItem: statItem,
-      selectedTableId: selectedTableId,
-      selectedViewId: selectedViewId,
-      getTables: getTables,
-      getViews: getViews,
-      getTableById: this.props.getTableById,
-      getConvertedChart: this.props.getConvertedChart,
-      updateStatItem: this.props.updateStatItem
-    }), /*#__PURE__*/_react.default.createElement("div", {
-      className: "statistic-chart-parameter-divider"
-    }), /*#__PURE__*/_react.default.createElement(_groupbySettings.default, {
-      selectedTable: selectedTable,
-      columnsOptions: generalColumnsOptions,
-      dateGranularityOptions: dateGranularityOptions,
-      geolocationGranularityOptions: geolocationGranularityOptions,
-      label: _reactIntlUniversal.default.get('Vertical_axis'),
-      groupbyColumnKey: vertical_axis_column_key,
-      groupbyDateGranularity: vertical_axis_date_granularity,
-      groupbyGeolocationGranularity: vertical_axis_geolocation_granularity,
-      getSelectedColumnOption: this.props.getSelectedColumnOption,
-      onSelectGroupbyColumn: this.onSelectGroupbyColumn.bind(this, _constants.GROUPBY_TYPE.ROW),
-      onSelectGroupbyDateGranularity: this.onSelectGroupbyDateGranularity.bind(this, _constants.GROUPBY_TYPE.ROW),
-      onSelectGroupbyGeolocationGranularity: this.onSelectGroupbyGeolocationGranularity.bind(this, _constants.GROUPBY_TYPE.ROW),
-      renderIncludeEmpty: renderIncludeEmpty
-    }), /*#__PURE__*/_react.default.createElement("div", {
-      className: "statistic-chart-parameter-divider"
-    }), /*#__PURE__*/_react.default.createElement(_horizontalAxisGroupSettings.default, {
-      label: _reactIntlUniversal.default.get('Horizontal_axis'),
-      statItem: statItem,
-      selectedTable: selectedTable,
-      summaryType: horizontal_axis_summary_type,
-      summaryColumnKey: horizontal_axis_column_key,
-      summaryMethod: horizontal_axis_summary_method,
-      columnGroupbyColumnsOptions: columnGroupbyColumnsOptions,
-      dateGranularityOptions: dateGranularityOptions,
-      geolocationGranularityOptions: geolocationGranularityOptions,
-      numericColumnsOptions: numericColumnsOptions,
-      getSelectedColumnOption: this.props.getSelectedColumnOption,
-      onChangeColumnGroupbyType: this.updateColumnGroupbys,
-      onSelectGroupbyColumn: this.onSelectGroupbyColumn.bind(this, _constants.GROUPBY_TYPE.COLUMN),
-      onSelectGroupbyDateGranularity: this.onSelectGroupbyDateGranularity.bind(this, _constants.GROUPBY_TYPE.COLUMN),
-      onSelectGroupbyGeolocationGranularity: this.onSelectGroupbyGeolocationGranularity.bind(this, _constants.GROUPBY_TYPE.COLUMN),
-      updatedColumnGroupbyNumericColumns: this.updatedColumnGroupbyNumericColumns,
-      updateStatItem: this.props.updateStatItem
-    }), statItem.type === _constants.STAT_TYPE.STACKED_HORIZONTAL_BAR && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-      className: "statistic-chart-parameter-divider"
-    }), /*#__PURE__*/_react.default.createElement(_dataSortSetting.default, {
-      statItem: statItem,
-      updateStatItem: this.props.updateStatItem
-    })));
-  }
-}
-var _default = exports.default = HorizontalGroupBarChartSettings;

package/es/stat-editor/stat-settings/basic-chart-settings/index.js

@@ -1,473 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _reactIntlUniversal = _interopRequireDefault(require("react-intl-universal"));
-var _dtableUtils = require("dtable-utils");
-var _toggleSetting = _interopRequireDefault(require("../public-setting/toggle-setting"));
-var _pieSettings = _interopRequireDefault(require("./pie-settings"));
-var _scatterSettings = _interopRequireDefault(require("./scatter-settings"));
-var _barSettings = _interopRequireDefault(require("./bar-settings"));
-var _advanceBarChartSettings = _interopRequireDefault(require("./advance-bar-chart-settings"));
-var _horizontalBarSettings = _interopRequireDefault(require("./horizontal-bar-settings"));
-var _horizontalGroupChartSettings = _interopRequireDefault(require("./horizontal-group-chart-settings"));
-var _timeComparisonSettings = _interopRequireDefault(require("./time-comparison-settings"));
-var _completenessChartSettings = _interopRequireDefault(require("./completeness-chart-settings"));
-var _pivotTableSettings = _interopRequireDefault(require("./pivot-table-settings"));
-var _customBarSettings = _interopRequireDefault(require("./custom-bar-settings"));
-var _constants = require("../../../constants");
-const DATE_GRANULARITY_LIST = [_constants.DATE_GRANULARITY.DAY, _constants.DATE_GRANULARITY.WEEK, _constants.DATE_GRANULARITY.MONTH, _constants.DATE_GRANULARITY.QUARTER, _constants.DATE_GRANULARITY.YEAR];
-const GEOLOCATION_GRANULARITY_LIST = [_constants.GEOLOCATION_GRANULARITY.PROVINCE, _constants.GEOLOCATION_GRANULARITY.CITY, _constants.GEOLOCATION_GRANULARITY.DISTRICT];
-class BasicChartSettings extends _react.Component {
-  constructor(props) {
-    super(props);
-    this.setData = selectedTable => {
-      this.availableColumns = this.getAvailableColumns(selectedTable.columns);
-      this.columnsOptions = this.getColumnsOptions(this.availableColumns);
-      this.generalColumnsOptions = this.getGeneralColumnsOptions(this.columnsOptions);
-      this.columnGroupbyColumnsOptions = this.getColumnGroupbyColumnsOptions(this.columnsOptions);
-      const numericColumns = this.getNumericColumns(this.availableColumns);
-      this.numericColumnsOptions = this.getColumnsOptions(numericColumns);
-      this.pivotTableSummaryColumnOptions = this.getPivotTableSummaryColumnOptions(this.availableColumns);
-    };
-    this.renderIncludeEmpty = () => {
-      const {
-        statItem
-      } = this.props;
-      const {
-        type,
-        groupby_include_empty_cells,
-        x_axis_include_empty,
-        vertical_axis_include_empty
-      } = statItem || {};
-      let includeEmptyCells;
-      if (type === _constants.STAT_TYPE.PIE || type === _constants.STAT_TYPE.RING || type === _constants.STAT_TYPE.TREEMAP || type === _constants.STAT_TYPE.PIVOT_TABLE) {
-        includeEmptyCells = groupby_include_empty_cells;
-      } else if (type === _constants.STAT_TYPE.HORIZONTAL_BAR || type === _constants.STAT_TYPE.HORIZONTAL_GROUP_BAR || type === _constants.STAT_TYPE.STACKED_HORIZONTAL_BAR) {
-        includeEmptyCells = vertical_axis_include_empty;
-      } else {
-        includeEmptyCells = x_axis_include_empty;
-      }
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: "mt-1"
-      }, /*#__PURE__*/_react.default.createElement(_toggleSetting.default, {
-        isChecked: includeEmptyCells || false,
-        handleToggleChange: this.onToggleIncludeEmpty,
-        label: _reactIntlUniversal.default.get('Including_empty_cell')
-      }));
-    };
-    this.getAvailableColumns = columns => {
-      if (!columns || !Array.isArray(columns)) return [];
-      return columns.filter(column => _constants.BASIC_CHART_COLUMN_LIST.includes(column.type));
-    };
-    this.getPivotTableSummaryColumnOptions = columns => {
-      const summaryColumns = columns.filter(column => {
-        return column && ((0, _dtableUtils.isNumericColumn)(column) || _constants.TIME_COLUMN_LIST.includes(column.type));
-      });
-      return this.getColumnsOptions(summaryColumns);
-    };
-    this.getColumnsOptions = columns => {
-      if (!Array.isArray(columns)) return [];
-      return columns.map(column => {
-        let option = _dtableUtils.COLUMN_OPTIONS.find(o => o.type === column.type) || {};
-        const {
-          name,
-          key,
-          type
-        } = column;
-        return {
-          label: /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
-            className: "header-icon"
-          }, /*#__PURE__*/_react.default.createElement("i", {
-            className: option.iconClass
-          })), /*#__PURE__*/_react.default.createElement("span", {
-            className: "select-option-name"
-          }, name)),
-          value: {
-            name,
-            key,
-            type
-          }
-        };
-      });
-    };
-    this.getGeneralColumnsOptions = columnsOptions => {
-      const {
-        statItem
-      } = this.props;
-      const list = [...columnsOptions];
-      if (statItem.type === _constants.STAT_TYPE.PIVOT_TABLE) {
-        list.unshift({
-          label: /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
-            className: "header-icon"
-          }), /*#__PURE__*/_react.default.createElement("span", {
-            style: {
-              color: '#999999'
-            },
-            className: "select-option-name"
-          }, _reactIntlUniversal.default.get('Not_used'))),
-          value: {
-            key: null
-          }
-        });
-      }
-      return list;
-    };
-    this.getColumnGroupbyColumnsOptions = columnsOptions => {
-      let statItem = this.props.statItem || {};
-      let availableOptions = columnsOptions.filter(o => o.value.key !== statItem.x_axis_column_key);
-      return availableOptions;
-    };
-    this.getNumericColumns = columns => {
-      if (!columns) return [];
-      return columns.filter(column => column && (0, _dtableUtils.isNumericColumn)(column));
-    };
-    this.getSelectedColumnOption = (key, columnsOptions) => {
-      if (!key || !Array.isArray(columnsOptions) || columnsOptions.length === 0) {
-        return null;
-      }
-      return columnsOptions.find(o => o.value.key === key) || columnsOptions[0];
-    };
-    this.getGranularityOptions = options => {
-      return options.map(g => {
-        return {
-          value: g,
-          label: /*#__PURE__*/_react.default.createElement("span", {
-            className: 'select-module select-module-name'
-          }, _reactIntlUniversal.default.get(_constants.STATISTICS_COUNT_SHOW[g]))
-        };
-      });
-    };
-    this.getSettingsByType = () => {
-      const {
-        statItem,
-        labelColorConfigs,
-        eventBus,
-        getTableById,
-        getTables,
-        getViews
-      } = this.props;
-      const {
-        selectedTable,
-        settingType
-      } = this.state;
-      const type = statItem.type;
-      switch (statItem.type) {
-        case _constants.STAT_TYPE.BAR:
-        case _constants.STAT_TYPE.LINE:
-        case _constants.STAT_TYPE.AREA_CHART:
-          {
-            return /*#__PURE__*/_react.default.createElement(_barSettings.default, {
-              settingType: settingType,
-              statItem: statItem,
-              labelColorConfigs: labelColorConfigs,
-              eventBus: eventBus,
-              getTables: getTables,
-              getViews: getViews,
-              getTableById: getTableById,
-              selectedTable: selectedTable,
-              generalColumnsOptions: this.generalColumnsOptions,
-              columnGroupbyColumnsOptions: this.columnGroupbyColumnsOptions,
-              numericColumnsOptions: this.numericColumnsOptions,
-              dateGranularityOptions: this.dateGranularityOptions,
-              geolocationGranularityOptions: this.geolocationGranularityOptions,
-              getSelectedColumnOption: this.getSelectedColumnOption,
-              getConvertedChart: this.props.getConvertedChart,
-              updateStatItem: this.props.updateStatItem,
-              renderIncludeEmpty: this.renderIncludeEmpty
-            });
-          }
-        case _constants.STAT_TYPE.COMPARE_BAR:
-          {
-            return /*#__PURE__*/_react.default.createElement(_timeComparisonSettings.default, {
-              settingType: settingType,
-              statItem: statItem,
-              labelColorConfigs: labelColorConfigs,
-              eventBus: eventBus,
-              getTables: getTables,
-              getViews: getViews,
-              getTableById: getTableById,
-              selectedTable: selectedTable,
-              generalColumnsOptions: this.generalColumnsOptions,
-              numericColumnsOptions: this.numericColumnsOptions,
-              dateGranularityOptions: this.dateGranularityOptions,
-              getSelectedColumnOption: this.getSelectedColumnOption,
-              getConvertedChart: this.props.getConvertedChart,
-              updateStatItem: this.props.updateStatItem
-            });
-          }
-        case _constants.STAT_TYPE.BAR_GROUP:
-        case _constants.STAT_TYPE.BAR_STACK:
-        case _constants.STAT_TYPE.GROUP_LINE:
-        case _constants.STAT_TYPE.AREA_GROUP_CHART:
-          {
-            return /*#__PURE__*/_react.default.createElement(_advanceBarChartSettings.default, {
-              chartType: type,
-              settingType: settingType,
-              statItem: statItem,
-              labelColorConfigs: labelColorConfigs,
-              eventBus: eventBus,
-              getTables: getTables,
-              getViews: getViews,
-              getTableById: getTableById,
-              selectedTable: selectedTable,
-              generalColumnsOptions: this.generalColumnsOptions,
-              columnGroupbyColumnsOptions: this.columnGroupbyColumnsOptions,
-              numericColumnsOptions: this.numericColumnsOptions,
-              dateGranularityOptions: this.dateGranularityOptions,
-              geolocationGranularityOptions: this.geolocationGranularityOptions,
-              getSelectedColumnOption: this.getSelectedColumnOption,
-              getConvertedChart: this.props.getConvertedChart,
-              updateStatItem: this.props.updateStatItem,
-              renderIncludeEmpty: this.renderIncludeEmpty
-            });
-          }
-        case _constants.STAT_TYPE.CUSTOM_BAR:
-          {
-            return /*#__PURE__*/_react.default.createElement(_customBarSettings.default, {
-              chartType: type,
-              settingType: settingType,
-              statItem: statItem,
-              labelColorConfigs: labelColorConfigs,
-              eventBus: eventBus,
-              getTables: getTables,
-              getViews: getViews,
-              getTableById: getTableById,
-              selectedTable: selectedTable,
-              generalColumnsOptions: this.generalColumnsOptions,
-              numericColumnsOptions: this.numericColumnsOptions,
-              dateGranularityOptions: this.dateGranularityOptions,
-              geolocationGranularityOptions: this.geolocationGranularityOptions,
-              getSelectedColumnOption: this.getSelectedColumnOption,
-              getConvertedChart: this.props.getConvertedChart,
-              updateStatItem: this.props.updateStatItem,
-              renderIncludeEmpty: this.renderIncludeEmpty
-            });
-          }
-        case _constants.STAT_TYPE.PIE:
-        case _constants.STAT_TYPE.RING:
-        case _constants.STAT_TYPE.TREEMAP:
-          {
-            return /*#__PURE__*/_react.default.createElement(_pieSettings.default, {
-              settingType: settingType,
-              statItem: statItem,
-              labelColorConfigs: labelColorConfigs,
-              eventBus: eventBus,
-              getTables: getTables,
-              getViews: getViews,
-              getTableById: getTableById,
-              selectedTable: selectedTable,
-              getConvertedChart: this.props.getConvertedChart,
-              columnsOptions: this.generalColumnsOptions,
-              numericColumnsOptions: this.numericColumnsOptions,
-              dateGranularityOptions: this.dateGranularityOptions,
-              geolocationGranularityOptions: this.geolocationGranularityOptions,
-              getSelectedColumnOption: this.getSelectedColumnOption,
-              updateStatisticsSettings: this.props.updateStatItem,
-              renderIncludeEmpty: this.renderIncludeEmpty
-            });
-          }
-        case _constants.STAT_TYPE.SCATTER:
-          {
-            return /*#__PURE__*/_react.default.createElement(_scatterSettings.default, {
-              settingType: settingType,
-              statItem: statItem,
-              labelColorConfigs: labelColorConfigs,
-              eventBus: eventBus,
-              getTables: getTables,
-              getViews: getViews,
-              getTableById: getTableById,
-              getConvertedChart: this.props.getConvertedChart,
-              numericColumnsOptions: this.numericColumnsOptions,
-              generalColumnsOptions: this.generalColumnsOptions,
-              columnGroupbyColumnsOptions: this.columnGroupbyColumnsOptions,
-              getSelectedColumnOption: this.getSelectedColumnOption,
-              updateStatItem: this.props.updateStatItem
-            });
-          }
-        case _constants.STAT_TYPE.HORIZONTAL_BAR:
-          {
-            return /*#__PURE__*/_react.default.createElement(_horizontalBarSettings.default, {
-              settingType: settingType,
-              statItem: statItem,
-              labelColorConfigs: labelColorConfigs,
-              eventBus: eventBus,
-              getTables: getTables,
-              getViews: getViews,
-              getTableById: getTableById,
-              selectedTable: selectedTable,
-              getConvertedChart: this.props.getConvertedChart,
-              generalColumnsOptions: this.generalColumnsOptions,
-              columnGroupbyColumnsOptions: this.columnGroupbyColumnsOptions,
-              numericColumnsOptions: this.numericColumnsOptions,
-              dateGranularityOptions: this.dateGranularityOptions,
-              geolocationGranularityOptions: this.geolocationGranularityOptions,
-              getSelectedColumnOption: this.getSelectedColumnOption,
-              updateStatItem: this.props.updateStatItem,
-              renderIncludeEmpty: this.renderIncludeEmpty
-            });
-          }
-        case _constants.STAT_TYPE.HORIZONTAL_GROUP_BAR:
-        case _constants.STAT_TYPE.STACKED_HORIZONTAL_BAR:
-          {
-            return /*#__PURE__*/_react.default.createElement(_horizontalGroupChartSettings.default, {
-              settingType: settingType,
-              statItem: statItem,
-              labelColorConfigs: labelColorConfigs,
-              eventBus: eventBus,
-              getTables: getTables,
-              getViews: getViews,
-              getTableById: getTableById,
-              selectedTable: selectedTable,
-              generalColumnsOptions: this.generalColumnsOptions,
-              columnGroupbyColumnsOptions: this.columnGroupbyColumnsOptions,
-              numericColumnsOptions: this.numericColumnsOptions,
-              dateGranularityOptions: this.dateGranularityOptions,
-              geolocationGranularityOptions: this.geolocationGranularityOptions,
-              getSelectedColumnOption: this.getSelectedColumnOption,
-              updateStatItem: this.props.updateStatItem,
-              getConvertedChart: this.props.getConvertedChart,
-              renderIncludeEmpty: this.renderIncludeEmpty
-            });
-          }
-        case _constants.STAT_TYPE.COMPLETENESS_CHART:
-        case _constants.STAT_TYPE.GROUP_COMPLETENESS_CHART:
-          {
-            return /*#__PURE__*/_react.default.createElement(_completenessChartSettings.default, {
-              settingType: settingType,
-              statItem: statItem,
-              labelColorConfigs: labelColorConfigs,
-              eventBus: eventBus,
-              getTables: getTables,
-              getViews: getViews,
-              getTableById: getTableById,
-              getConvertedChart: this.props.getConvertedChart,
-              selectedTable: selectedTable,
-              generalColumnsOptions: this.generalColumnsOptions,
-              numericColumnsOptions: this.numericColumnsOptions,
-              updateStatItem: this.props.updateStatItem,
-              getSelectedColumnOption: this.getSelectedColumnOption,
-              columnGroupbyColumnsOptions: this.columnGroupbyColumnsOptions,
-              geolocationGranularityOptions: this.geolocationGranularityOptions,
-              dateGranularityOptions: this.dateGranularityOptions
-            });
-          }
-        case _constants.STAT_TYPE.PIVOT_TABLE:
-          {
-            return /*#__PURE__*/_react.default.createElement(_pivotTableSettings.default, {
-              settingType: settingType,
-              statItem: statItem,
-              labelColorConfigs: labelColorConfigs,
-              eventBus: eventBus,
-              getTables: getTables,
-              getViews: getViews,
-              getTableById: getTableById,
-              getConvertedChart: this.props.getConvertedChart,
-              selectedTable: selectedTable,
-              generalColumnsOptions: this.generalColumnsOptions,
-              pivotTableSummaryColumnOptions: this.pivotTableSummaryColumnOptions,
-              updateStatItem: this.props.updateStatItem,
-              getSelectedColumnOption: this.getSelectedColumnOption,
-              columnGroupbyColumnsOptions: this.columnGroupbyColumnsOptions,
-              geolocationGranularityOptions: this.geolocationGranularityOptions,
-              dateGranularityOptions: this.dateGranularityOptions,
-              renderIncludeEmpty: this.renderIncludeEmpty
-            });
-          }
-        default:
-          {
-            return null;
-          }
-      }
-    };
-    this.onToggleIncludeEmpty = () => {
-      let {
-        statItem
-      } = this.props;
-      let {
-        type,
-        groupby_include_empty_cells,
-        x_axis_include_empty,
-        vertical_axis_include_empty
-      } = statItem || {};
-      let updated;
-      if (type === _constants.STAT_TYPE.PIE || type === _constants.STAT_TYPE.RING || type === _constants.STAT_TYPE.TREEMAP || type === _constants.STAT_TYPE.PIVOT_TABLE) {
-        updated = {
-          groupby_include_empty_cells: !groupby_include_empty_cells
-        };
-      } else if (type === _constants.STAT_TYPE.HORIZONTAL_BAR || type === _constants.STAT_TYPE.HORIZONTAL_GROUP_BAR || type === _constants.STAT_TYPE.STACKED_HORIZONTAL_BAR) {
-        updated = {
-          vertical_axis_include_empty: !vertical_axis_include_empty
-        };
-      } else {
-        updated = {
-          x_axis_include_empty: !x_axis_include_empty
-        };
-      }
-      this.props.updateStatItem(Object.assign({}, statItem, updated));
-    };
-    this.selectEditType = type => {
-      this.setState({
-        settingType: type
-      });
-    };
-    const {
-      getTableById: _getTableById,
-      statItem: _statItem
-    } = props;
-    let _selectedTable = _getTableById(_statItem.table_id);
-    this.state = {
-      selectedTable: _selectedTable,
-      settingType: 'data'
-    };
-    this.setData(_selectedTable);
-    this.dateGranularityOptions = this.getGranularityOptions(DATE_GRANULARITY_LIST);
-    this.geolocationGranularityOptions = this.getGranularityOptions(GEOLOCATION_GRANULARITY_LIST);
-  }
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    const {
-      getTableById
-    } = this.props;
-    if (nextProps.statItem.table_id !== this.props.statItem.table_id) {
-      const {
-        statItem
-      } = nextProps;
-      const selectedTable = getTableById(statItem.table_id);
-      this.setState({
-        selectedTable
-      });
-      this.setData(selectedTable);
-    }
-  }
-  render() {
-    const {
-      settingType
-    } = this.state;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "statistic-chart-settings"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "statistic-chart-settings-type"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      onClick: () => this.selectEditType('data'),
-      className: (0, _classnames.default)('statistic-type-item', {
-        'selected-statistic-type-item': settingType === 'data'
-      })
-    }, _reactIntlUniversal.default.get('Data_settings')), /*#__PURE__*/_react.default.createElement("div", {
-      onClick: () => this.selectEditType('style'),
-      className: (0, _classnames.default)('statistic-type-item', {
-        'selected-statistic-type-item': settingType === 'style'
-      })
-    }, _reactIntlUniversal.default.get('Style_settings'))), /*#__PURE__*/_react.default.createElement("div", {
-      className: "statistic-chart-settings-container"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "statistic-chart-settings-parameter-list pt-4"
-    }, this.getSettingsByType())));
-  }
-}
-var _default = exports.default = BasicChartSettings;