dtable-statistic 4.4.24 → 5.0.0-alpha.2

package/es/stat-editor/stat-settings/basic-chart-settings/advance-bar-chart-settings.js

@@ -1,153 +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 _dataSortSetting = _interopRequireDefault(require("../public-setting/data-sort-setting"));
-var _barChartStyleSetting = _interopRequireDefault(require("./style-setting/bar-chart-style-setting"));
-var _groupbySettings = _interopRequireDefault(require("./groupby-settings"));
-var _yAxisGroupSettings = _interopRequireDefault(require("./y-axis-group-settings"));
-var _constants = require("../../../constants");
-class AdvanceBarChartSettings extends _react.Component {
-  constructor() {
-    super(...arguments);
-    this.onSelectGroupbyColumn = (type, groupbyColumnKey, groupbyDateGranularity, groupbyGeolocationGranularity) => {
-      let updated = {
-        x_axis_column_key: groupbyColumnKey,
-        x_axis_date_granularity: groupbyDateGranularity,
-        x_axis_geolocation_granularity: groupbyGeolocationGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.onSelectGroupbyDateGranularity = (type, dateGranularity) => {
-      let updated = {
-        x_axis_date_granularity: dateGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.onSelectGroupbyGeolocationGranularity = (type, geolocationGranularity) => {
-      let updated = {
-        x_axis_geolocation_granularity: geolocationGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.updatedSummaryType = (summaryType, summaryColumnKey, summaryMethod) => {
-      let {
-        statItem
-      } = this.props;
-      let updated = {
-        y_axis_summary_type: summaryType,
-        y_axis_column_key: summaryColumnKey,
-        y_axis_summary_method: summaryMethod
-      };
-      this.props.updateStatItem(Object.assign({}, statItem, updated));
-    };
-    this.updateSummaryColumn = summaryColumnKey => {
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, {
-        y_axis_column_key: summaryColumnKey
-      }));
-    };
-    this.updateSummaryMethod = summaryMethod => {
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, {
-        y_axis_summary_method: summaryMethod
-      }));
-    };
-  }
-  render() {
-    let {
-      getTables,
-      getViews,
-      getTableById,
-      statItem,
-      labelColorConfigs,
-      eventBus,
-      selectedTable,
-      generalColumnsOptions,
-      numericColumnsOptions,
-      dateGranularityOptions,
-      geolocationGranularityOptions,
-      renderIncludeEmpty,
-      settingType,
-      columnGroupbyColumnsOptions
-    } = this.props;
-    let {
-      type,
-      table_id: selectedTableId,
-      view_id: selectedViewId,
-      x_axis_column_key,
-      x_axis_date_granularity,
-      x_axis_geolocation_granularity,
-      y_axis_summary_type,
-      y_axis_column_key,
-      y_axis_summary_method
-    } = statItem || {};
-    if (settingType === 'style') {
-      return /*#__PURE__*/_react.default.createElement(_barChartStyleSetting.default, {
-        showRangeSetting: type !== _constants.STAT_TYPE.BAR_STACK,
-        statItem: statItem,
-        labelColorConfigs: labelColorConfigs,
-        eventBus: eventBus,
-        getTableById: 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('X-axis'),
-      groupbyColumnKey: x_axis_column_key,
-      groupbyDateGranularity: x_axis_date_granularity,
-      groupbyGeolocationGranularity: x_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(_yAxisGroupSettings.default, {
-      label: _reactIntlUniversal.default.get('Y-axis'),
-      statItem: statItem,
-      selectedTable: selectedTable,
-      summaryType: y_axis_summary_type,
-      summaryColumnKey: y_axis_column_key,
-      summaryMethod: y_axis_summary_method,
-      columnGroupbyColumnsOptions: columnGroupbyColumnsOptions,
-      dateGranularityOptions: dateGranularityOptions,
-      geolocationGranularityOptions: geolocationGranularityOptions,
-      numericColumnsOptions: numericColumnsOptions,
-      getSelectedColumnOption: this.props.getSelectedColumnOption,
-      onChangeColumnGroupbyType: this.updateColumnGroupby,
-      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
-    }), type === _constants.STAT_TYPE.BAR_STACK && /*#__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 = AdvanceBarChartSettings;

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

@@ -1,144 +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 _barChartStyleSetting = _interopRequireDefault(require("./style-setting/bar-chart-style-setting"));
-var _groupbySettings = _interopRequireDefault(require("./groupby-settings"));
-var _summarySettings = _interopRequireDefault(require("./summary-settings"));
-var _dataSortSetting = _interopRequireDefault(require("../public-setting/data-sort-setting"));
-var _constants = require("../../../constants");
-class BarSettings extends _react.Component {
-  constructor() {
-    super(...arguments);
-    this.onSelectGroupbyColumn = (type, groupbyColumnKey, groupbyDateGranularity, groupbyGeolocationGranularity) => {
-      let updated = {
-        x_axis_column_key: groupbyColumnKey,
-        x_axis_date_granularity: groupbyDateGranularity,
-        x_axis_geolocation_granularity: groupbyGeolocationGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.onSelectGroupbyDateGranularity = (type, dateGranularity) => {
-      let updated = {
-        x_axis_date_granularity: dateGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.onSelectGroupbyGeolocationGranularity = (type, geolocationGranularity) => {
-      let updated = {
-        x_axis_geolocation_granularity: geolocationGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.updatedSummaryType = (summaryType, summaryColumnKey, summaryMethod) => {
-      let {
-        statItem
-      } = this.props;
-      let updated = {
-        y_axis_summary_type: summaryType,
-        y_axis_column_key: summaryColumnKey,
-        y_axis_summary_method: summaryMethod
-      };
-      this.props.updateStatItem(Object.assign({}, statItem, updated));
-    };
-    this.updateSummaryColumn = summaryColumnKey => {
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, {
-        y_axis_column_key: summaryColumnKey
-      }));
-    };
-    this.updateSummaryMethod = summaryMethod => {
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, {
-        y_axis_summary_method: summaryMethod
-      }));
-    };
-  }
-  render() {
-    let {
-      getTables,
-      getViews,
-      getTableById,
-      statItem,
-      labelColorConfigs,
-      eventBus,
-      selectedTable,
-      generalColumnsOptions,
-      numericColumnsOptions,
-      dateGranularityOptions,
-      geolocationGranularityOptions,
-      renderIncludeEmpty,
-      settingType
-    } = this.props;
-    let {
-      table_id: selectedTableId,
-      view_id: selectedViewId,
-      x_axis_column_key,
-      x_axis_date_granularity,
-      x_axis_geolocation_granularity,
-      y_axis_summary_type,
-      y_axis_column_key,
-      y_axis_summary_method
-    } = statItem || {};
-    if (settingType === 'style') {
-      return /*#__PURE__*/_react.default.createElement(_barChartStyleSetting.default, {
-        statItem: statItem,
-        labelColorConfigs: labelColorConfigs,
-        eventBus: eventBus,
-        getTableById: 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('X-axis'),
-      placeholder: _reactIntlUniversal.default.get('Select_column'),
-      groupbyColumnKey: x_axis_column_key,
-      groupbyDateGranularity: x_axis_date_granularity,
-      groupbyGeolocationGranularity: x_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(_summarySettings.default, {
-      statItem: statItem,
-      label: _reactIntlUniversal.default.get('Y-axis'),
-      numericColumnsOptions: numericColumnsOptions,
-      summaryType: y_axis_summary_type,
-      summaryColumnKey: y_axis_column_key,
-      summaryMethod: y_axis_summary_method,
-      getSelectedColumnOption: this.props.getSelectedColumnOption,
-      onChangeSummaryType: this.updatedSummaryType,
-      onSelectNumericColumn: this.updateSummaryColumn,
-      onSelectSummaryMethod: this.updateSummaryMethod
-    }), /*#__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 = BarSettings;

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

@@ -1,214 +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 _dtableUtils = require("dtable-utils");
-var _DTableSelect = _interopRequireDefault(require("dtable-ui-component/lib/DTableSelect"));
-var _completenessStyle = _interopRequireDefault(require("./style-setting/completeness-style"));
-var _groupbySettings = _interopRequireDefault(require("./groupby-settings"));
-var _baseSettings = _interopRequireDefault(require("../public-setting/base-settings"));
-var _dataSortSetting = _interopRequireDefault(require("../public-setting/data-sort-setting"));
-var _constants = require("../../../constants");
-const COLUMN_TYPES = [_dtableUtils.CellType.TEXT, _dtableUtils.CellType.COLLABORATOR, _dtableUtils.CellType.SINGLE_SELECT];
-class CompletenessSetting extends _react.Component {
-  constructor(props) {
-    super(props);
-    this.renderNameSettings = () => {
-      const {
-        statItem,
-        getSelectedColumnOption
-      } = this.props;
-      const {
-        name_column
-      } = statItem;
-      const selectedItem = getSelectedColumnOption(name_column, this.columnOptions);
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: "statistic-chart-parameter-item"
-      }, /*#__PURE__*/_react.default.createElement("label", null, _reactIntlUniversal.default.get('Name_field')), /*#__PURE__*/_react.default.createElement(_DTableSelect.default, {
-        placeholder: _reactIntlUniversal.default.get('Select_column'),
-        value: selectedItem,
-        onChange: this.onSelectGroupColumn,
-        options: this.columnOptions
-      }));
-    };
-    this.onSelectGroupColumn = option => {
-      const {
-        statItem
-      } = this.props;
-      this.props.updateStatItem(Object.assign({}, statItem, {
-        name_column: option.value.key
-      }));
-    };
-    this.renderCompletionSettings = () => {
-      const {
-        statItem,
-        getSelectedColumnOption
-      } = this.props;
-      const {
-        completed_column
-      } = statItem;
-      const selectedItem = getSelectedColumnOption(completed_column, this.props.numericColumnsOptions);
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: "statistic-chart-parameter-item"
-      }, /*#__PURE__*/_react.default.createElement("label", null, _reactIntlUniversal.default.get('Completion_value_field')), /*#__PURE__*/_react.default.createElement(_DTableSelect.default, {
-        placeholder: _reactIntlUniversal.default.get('Select_column'),
-        value: selectedItem,
-        onChange: this.onSelectCompletionColumn,
-        options: this.props.numericColumnsOptions
-      }));
-    };
-    this.renderGroupSettings = () => {
-      const {
-        selectedTable,
-        columnGroupbyColumnsOptions,
-        dateGranularityOptions,
-        geolocationGranularityOptions,
-        statItem,
-        getSelectedColumnOption
-      } = this.props;
-      const {
-        group_column,
-        date_granularity,
-        geolocation_granularity
-      } = statItem;
-      return /*#__PURE__*/_react.default.createElement(_groupbySettings.default, {
-        selectedTable: selectedTable,
-        columnsOptions: columnGroupbyColumnsOptions,
-        dateGranularityOptions: dateGranularityOptions,
-        geolocationGranularityOptions: geolocationGranularityOptions,
-        label: _reactIntlUniversal.default.get('Group_by'),
-        groupbyColumnKey: group_column,
-        groupbyDateGranularity: date_granularity,
-        groupbyGeolocationGranularity: geolocation_granularity,
-        getSelectedColumnOption: getSelectedColumnOption,
-        onSelectGroupbyColumn: this.onSelectColumnGroupColumn,
-        onSelectGroupbyDateGranularity: this.onSelectDateGranularity,
-        onSelectGroupbyGeolocationGranularity: this.onSelectGeolocationGranularity
-      });
-    };
-    this.onSelectColumnGroupColumn = key => {
-      const {
-        statItem,
-        selectedTable
-      } = this.props;
-      if (key === statItem.group_column) return;
-      const selectedColumn = (0, _dtableUtils.getTableColumnByKey)(selectedTable, key);
-      const newStatItem = {};
-      if (selectedColumn && _constants.TIME_COLUMN_LIST.includes(selectedColumn.type)) {
-        newStatItem.date_granularity = 'month';
-      }
-      if (selectedColumn.type === _dtableUtils.CellType.GEOLOCATION) {
-        newStatItem.geolocation_granularity = 'district';
-      }
-      newStatItem.group_column = key;
-      this.props.updateStatItem(Object.assign({}, statItem, newStatItem));
-    };
-    this.onSelectDateGranularity = key => {
-      const {
-        statItem
-      } = this.props;
-      if (key === statItem.date_granularity) return;
-      this.props.updateStatItem(Object.assign({}, statItem, {
-        date_granularity: key
-      }));
-    };
-    this.onSelectGeolocationGranularity = key => {
-      const {
-        statItem
-      } = this.props;
-      if (key === statItem.geolocation_granularity) return;
-      this.props.updateStatItem(Object.assign({}, statItem, {
-        geolocation_granularity: key
-      }));
-    };
-    this.onSelectCompletionColumn = option => {
-      const {
-        statItem
-      } = this.props;
-      this.props.updateStatItem(Object.assign({}, statItem, {
-        completed_column: option.value.key
-      }));
-    };
-    this.renderTotalValueSettings = () => {
-      const {
-        statItem,
-        getSelectedColumnOption
-      } = this.props;
-      const {
-        target_column
-      } = statItem;
-      const selectedItem = getSelectedColumnOption(target_column, this.props.numericColumnsOptions);
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: "statistic-chart-parameter-item"
-      }, /*#__PURE__*/_react.default.createElement("label", null, _reactIntlUniversal.default.get('Total_value_field')), /*#__PURE__*/_react.default.createElement(_DTableSelect.default, {
-        placeholder: _reactIntlUniversal.default.get('Select_column'),
-        value: selectedItem,
-        onChange: this.onSelectTotalColumn,
-        options: this.props.numericColumnsOptions
-      }));
-    };
-    this.onSelectTotalColumn = option => {
-      const {
-        statItem
-      } = this.props;
-      this.props.updateStatItem(Object.assign({}, statItem, {
-        target_column: option.value.key
-      }));
-    };
-    this.columnOptions = props.generalColumnsOptions.filter(item => {
-      return COLUMN_TYPES.includes(item.value.type);
-    });
-  }
-  componentWillReceiveProps(nextProps, props) {
-    if (nextProps.selectedTable._id !== this.props.selectedTable._id) {
-      this.columnOptions = nextProps.generalColumnsOptions.filter(item => {
-        return COLUMN_TYPES.includes(item.value.type);
-      });
-    }
-  }
-  render() {
-    let {
-      getTables,
-      getViews,
-      statItem,
-      settingType
-    } = this.props;
-    let {
-      table_id: selectedTableId,
-      view_id: selectedViewId
-    } = statItem || {};
-    const isGroupChart = statItem.type === _constants.STAT_TYPE.GROUP_COMPLETENESS_CHART;
-    if (settingType === 'style') {
-      return /*#__PURE__*/_react.default.createElement(_completenessStyle.default, {
-        statItem: statItem,
-        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"
-    }), this.renderNameSettings(), /*#__PURE__*/_react.default.createElement("div", {
-      className: "statistic-chart-parameter-divider"
-    }), this.renderCompletionSettings(), this.renderTotalValueSettings(), isGroupChart && this.renderGroupSettings(), !isGroupChart && /*#__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 = CompletenessSetting;

package/es/stat-editor/stat-settings/basic-chart-settings/custom-bar-settings.js

@@ -1,121 +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 _groupbySettings = _interopRequireDefault(require("./groupby-settings"));
-var _stacksSettings = _interopRequireDefault(require("./stacks-settings"));
-var _barChartStyleSetting = _interopRequireDefault(require("./style-setting/bar-chart-style-setting"));
-var _constants = require("../../../constants");
-class CustomBarSettings extends _react.Component {
-  constructor() {
-    super(...arguments);
-    this.onSelectGroupbyColumn = (type, groupbyColumnKey, groupbyDateGranularity, groupbyGeolocationGranularity) => {
-      let updated = {
-        x_axis_column_key: groupbyColumnKey,
-        x_axis_date_granularity: groupbyDateGranularity,
-        x_axis_geolocation_granularity: groupbyGeolocationGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.onSelectGroupbyDateGranularity = (type, dateGranularity) => {
-      let updated = {
-        x_axis_date_granularity: dateGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.onSelectGroupbyGeolocationGranularity = (type, geolocationGranularity) => {
-      let updated = {
-        x_axis_geolocation_granularity: geolocationGranularity
-      };
-      this.props.updateStatItem(Object.assign({}, this.props.statItem, updated));
-    };
-    this.hasYAxisStack = () => {
-      const {
-        y_axises
-      } = this.props.statItem;
-      return Array.isArray(y_axises) && y_axises.some(yAxis => yAxis.type === _constants.STAT_TYPE.BAR_STACK);
-    };
-  }
-  render() {
-    const {
-      getTableById,
-      getTables,
-      getViews,
-      statItem,
-      labelColorConfigs,
-      eventBus,
-      selectedTable,
-      generalColumnsOptions,
-      numericColumnsOptions,
-      dateGranularityOptions,
-      geolocationGranularityOptions,
-      renderIncludeEmpty,
-      settingType
-    } = this.props;
-    const {
-      table_id,
-      view_id,
-      x_axis_column_key,
-      x_axis_date_granularity,
-      x_axis_geolocation_granularity
-    } = statItem || {};
-    const hasYAxisStack = this.hasYAxisStack();
-    if (settingType === 'style') {
-      return /*#__PURE__*/_react.default.createElement(_barChartStyleSetting.default, {
-        showRangeSetting: false,
-        hideDisplayDataSetting: true,
-        enableYAxisCustomTitle: hasYAxisStack,
-        isDisplayEachBlockData: hasYAxisStack,
-        statItem: statItem,
-        labelColorConfigs: labelColorConfigs,
-        eventBus: eventBus,
-        getTableById: getTableById,
-        updateStatItem: this.props.updateStatItem
-      });
-    }
-    return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_baseSettings.default, {
-      statItem: statItem,
-      selectedTableId: table_id,
-      selectedViewId: view_id,
-      getTableById: getTableById,
-      getTables: getTables,
-      getViews: getViews,
-      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('X-axis'),
-      groupbyColumnKey: x_axis_column_key,
-      groupbyDateGranularity: x_axis_date_granularity,
-      groupbyGeolocationGranularity: x_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("div", {
-      className: "statistic-chart-parameter-item"
-    }, /*#__PURE__*/_react.default.createElement("label", null, _reactIntlUniversal.default.get('Y-axis')), /*#__PURE__*/_react.default.createElement("div", {
-      className: "statistic-custom-bar-setting-y-axises"
-    }, /*#__PURE__*/_react.default.createElement(_stacksSettings.default, {
-      statItem: statItem,
-      numericColumnsOptions: numericColumnsOptions,
-      updateStatItem: this.props.updateStatItem
-    }))));
-  }
-}
-var _default = exports.default = CustomBarSettings;