sea-chart 0.0.1 → 0.0.2

package/lib/components/settings/basic-number-card/data-settings.js

@@ -1,121 +0,0 @@
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import React, { useCallback, useMemo } from 'react';
-import { FormGroup } from 'reactstrap';
-import { COLUMNS_ICON_CONFIG, getTableById } from 'dtable-utils';
-import DTableSelect from "dtable-ui-component/lib/DTableSelect";
-import CommonDataSettings from '../widgets/common-data-settings';
-import { StatisticsUtils } from '../../../utils';
-import { STATISTIC_SUMMARY_SHOW, STATISTIC_SUMMARY_CALCULATION_METHOD, STATISTIC_SUPPORT_COLUMNS, BASIC_NUMBER_CARD_CALCULATION_METHOD } from '../../../constants';
-import intl from '../../../intl';
-var DataSettings = function DataSettings(_ref) {
-  var tables = _ref.tables,
-    statistic = _ref.statistic,
-    FilterSettings = _ref.FilterSettings,
-    onChange = _ref.onChange;
-  var summaryMethodsOptions = useMemo(function () {
-    var numberCardSummaryMethod = [BASIC_NUMBER_CARD_CALCULATION_METHOD].concat(_toConsumableArray(STATISTIC_SUMMARY_CALCULATION_METHOD));
-    return numberCardSummaryMethod.map(function (method) {
-      return {
-        label: /*#__PURE__*/React.createElement("span", {
-          className: "select-option-name"
-        }, intl.get(STATISTIC_SUMMARY_SHOW[method])),
-        value: method
-      };
-    });
-  }, []);
-  var selectedTable = useMemo(function () {
-    var selectedTableId = statistic.config.table_id;
-    return getTableById(tables, selectedTableId);
-  }, [statistic.config, tables]);
-  var validColumns = useMemo(function () {
-    var columns = selectedTable && Array.isArray(selectedTable.columns) ? selectedTable.columns : [];
-    if (!columns || !Array.isArray(columns)) return [];
-    return columns.filter(function (column) {
-      return STATISTIC_SUPPORT_COLUMNS.includes(column.type);
-    });
-  }, [selectedTable]);
-  var numericColumns = useMemo(function () {
-    return validColumns.filter(function (column) {
-      return StatisticsUtils.isNumericSummaryColumn(column);
-    });
-  }, [validColumns]);
-  var numericColumnOptions = useMemo(function () {
-    var options = numericColumns.map(function (column) {
-      return {
-        value: column,
-        label: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
-          className: "header-icon"
-        }, /*#__PURE__*/React.createElement("i", {
-          className: COLUMNS_ICON_CONFIG[column.type]
-        })), /*#__PURE__*/React.createElement("span", {
-          className: 'select-module select-module-name ml-0'
-        }, column.name))
-      };
-    });
-    return [{
-      value: {
-        key: 'Groupby_null'
-      },
-      label: /*#__PURE__*/React.createElement("span", {
-        className: 'select-module select-module-name null-option-name ml-0'
-      }, intl.get('Select_a_column')),
-      style: {
-        color: 'rgba(0, 0, 0, .25)'
-      }
-    }].concat(_toConsumableArray(options));
-  }, [numericColumns]);
-  var onSelectColumnChange = useCallback(function (option) {
-    var config = statistic.config;
-    var numeric_column_key = config.numeric_column_key;
-    var newColumnKey = option.value.key;
-    if (numeric_column_key === newColumnKey) return;
-    onChange && onChange({
-      numeric_column_key: newColumnKey
-    });
-  }, [statistic, onChange]);
-  var onSelectSummaryMethod = useCallback(function (option) {
-    var config = statistic.config;
-    var summary_method = config.summary_method;
-    var newSummaryMethod = option.value;
-    if (newSummaryMethod === summary_method) return;
-    onChange && onChange({
-      summary_method: newSummaryMethod
-    });
-  }, [statistic, onChange]);
-  var getSelectedMethodOption = useCallback(function (method, summaryMethodsOptions) {
-    return summaryMethodsOptions.find(function (m) {
-      return m.value === method;
-    }) || summaryMethodsOptions[0];
-  }, []);
-  var renderSummaryMethod = useCallback(function () {
-    var summary_method = statistic.config.summary_method;
-    var selectedMethodOption = getSelectedMethodOption(summary_method, summaryMethodsOptions);
-    return /*#__PURE__*/React.createElement("div", {
-      className: "dtable-plugin-stat-parameter-item"
-    }, /*#__PURE__*/React.createElement("label", null, intl.get('Summary_method')), /*#__PURE__*/React.createElement(DTableSelect, {
-      value: selectedMethodOption,
-      onChange: onSelectSummaryMethod,
-      options: summaryMethodsOptions
-    }));
-  }, [statistic, getSelectedMethodOption, onSelectSummaryMethod, summaryMethodsOptions]);
-  var config = statistic.config;
-  var selectedColumnOption = numericColumnOptions.find(function (option) {
-    return option.value.key === config.numeric_column_key;
-  }) || numericColumnOptions[0];
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CommonDataSettings, {
-    statistic: statistic,
-    tables: tables,
-    FilterSettings: FilterSettings,
-    onChange: onChange
-  }), /*#__PURE__*/React.createElement(FormGroup, {
-    className: "seastatistic-parameter-item"
-  }, /*#__PURE__*/React.createElement("label", null, intl.get('Statistic_field')), /*#__PURE__*/React.createElement(DTableSelect, {
-    value: selectedColumnOption,
-    options: numericColumnOptions,
-    placeholder: intl.get('Select_a_column'),
-    onChange: onSelectColumnChange
-  })), /*#__PURE__*/React.createElement(FormGroup, {
-    className: "seastatistic-parameter-item"
-  }, renderSummaryMethod()));
-};
-export default DataSettings;

package/lib/components/settings/basic-number-card/style-settings.js

@@ -1,42 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useCallback, useState } from 'react';
-import { Input, FormGroup } from 'reactstrap';
-import intl from '../../../intl';
-var StyleSettings = function StyleSettings(_ref) {
-  var statistic = _ref.statistic,
-    onChange = _ref.onChange;
-  var _useState = useState(statistic.config.name || ''),
-    _useState2 = _slicedToArray(_useState, 2),
-    name = _useState2[0],
-    setName = _useState2[1];
-  var onChangeName = useCallback(function (event) {
-    var newName = event.target.value;
-    if (newName === name) return;
-    setName(newName);
-  }, [name]);
-  var onSaveName = useCallback(function () {
-    var oldName = statistic.config.name || '';
-    if (oldName === name) return;
-    onChange && onChange({
-      name: name
-    });
-  }, [name, statistic, onChange]);
-  var onKeyDown = useCallback(function (e) {
-    if (e.key === 'Enter') {
-      e.preventDefault();
-      e.target.blur();
-    }
-  }, []);
-  var config = statistic.config;
-  return /*#__PURE__*/React.createElement(FormGroup, {
-    className: "seastatistic-parameter-item"
-  }, /*#__PURE__*/React.createElement("label", null, intl.get('Label')), /*#__PURE__*/React.createElement(Input, {
-    type: "text",
-    value: name,
-    placeholder: config.name || '',
-    onBlur: onSaveName,
-    onChange: onChangeName,
-    onKeyDown: onKeyDown
-  }));
-};
-export default StyleSettings;

package/lib/components/settings/combination-settings/data-settings.js

@@ -1,256 +0,0 @@
-import React, { useCallback } from 'react';
-import { CellType, DATE_COLUMN_OPTIONS } from 'dtable-utils';
-import CommonDataSettings from '../widgets/common-data-settings';
-import Divider from '../widgets/divider';
-import GroupBy from '../widgets/group-by';
-import Switch from '../widgets/switch';
-import SummarySettings from '../widgets/summary-settings';
-import { eventStopPropagation } from '../../../utils';
-import { STATISTIC_SUMMARY_TYPE, STATISTIC_Y_GROUP_TYPE, STATISTIC_SUMMARY_CALCULATION_METHOD, GEOLOCATION_FORMAT_CITY, GEOLOCATION_FORMAT_MAP, COMBINATION_POSITION } from '../../../constants';
-import intl from '../../../intl';
-var DataSettings = function DataSettings(_ref) {
-  var statistic = _ref.statistic,
-    tables = _ref.tables,
-    xLabel = _ref.xLabel,
-    FilterSettings = _ref.FilterSettings,
-    onChange = _ref.onChange;
-  var onXAxisColumnChange = useCallback(function (option) {
-    var config = statistic.config;
-    var x_axis_column_key = config.x_axis_column_key;
-    var column = option.value;
-    var newXAxisColumnKey = column.key,
-      type = column.type;
-    var validValue = newXAxisColumnKey === 'Groupby_null' ? null : newXAxisColumnKey;
-    if (x_axis_column_key === validValue) return;
-    var update = {
-      x_axis_column_key: validValue
-    };
-    if (!validValue) {
-      update['x_axis_date_granularity'] = null;
-      update['x_axis_geolocation_granularity'] = null;
-    } else {
-      if (DATE_COLUMN_OPTIONS.includes(type)) {
-        update['x_axis_date_granularity'] = STATISTIC_SUMMARY_TYPE.MONTH;
-        update['x_axis_geolocation_granularity'] = null;
-      } else if (type === CellType.GEOLOCATION) {
-        var _ref2 = column.data || {},
-          geo_format = _ref2.geo_format;
-        if (geo_format === GEOLOCATION_FORMAT_MAP.PROVINCE) {
-          update['x_axis_geolocation_granularity'] = GEOLOCATION_FORMAT_MAP.PROVINCE;
-        } else if (geo_format === GEOLOCATION_FORMAT_MAP.PROVINCE_CITY) {
-          update['x_axis_geolocation_granularity'] = GEOLOCATION_FORMAT_CITY;
-        } else if (geo_format === GEOLOCATION_FORMAT_MAP.GEOLOCATION || !geo_format) {
-          update['x_axis_geolocation_granularity'] = 'district';
-        } else {
-          update['x_axis_geolocation_granularity'] = null;
-        }
-        update['x_axis_date_granularity'] = null;
-      }
-    }
-    onChange && onChange(update);
-  }, [statistic, onChange]);
-  var onGroupbyDateGranularityChange = useCallback(function (option) {
-    var config = statistic.config;
-    var x_axis_date_granularity = config.x_axis_date_granularity;
-    var value = option.value;
-    if (value === x_axis_date_granularity) return;
-    onChange && onChange({
-      x_axis_date_granularity: value
-    });
-  }, [statistic, onChange]);
-  var onGroupbyGeolocationGranularityChange = useCallback(function (option) {
-    var config = statistic.config;
-    var x_axis_geolocation_granularity = config.x_axis_geolocation_granularity;
-    var value = option.value;
-    if (value === x_axis_geolocation_granularity) return;
-    onChange && onChange({
-      x_axis_geolocation_granularity: value
-    });
-  }, [statistic, onChange]);
-  var onIncludeEmptyChange = useCallback(function (event) {
-    eventStopPropagation(event);
-    var config = statistic.config;
-    var x_axis_include_empty_cells = config.x_axis_include_empty_cells;
-    onChange && onChange({
-      x_axis_include_empty_cells: !x_axis_include_empty_cells
-    });
-  }, [statistic, onChange]);
-  var _onChangeSummaryType = useCallback(function (option, position) {
-    var config = statistic.config;
-    var y_axis_right_summary_type = config.y_axis_right_summary_type,
-      y_axis_left_summary_type = config.y_axis_left_summary_type,
-      y_axis_right_summary_column = config.y_axis_right_summary_column,
-      y_axis_left_summary_column = config.y_axis_left_summary_column,
-      y_axis_left_group_by_multiple_numeric_column = config.y_axis_left_group_by_multiple_numeric_column,
-      y_axis_left_summary_method = config.y_axis_left_summary_method,
-      y_axis_left_group_by_numeric_columns = config.y_axis_left_group_by_numeric_columns;
-    var newSummaryType = option === STATISTIC_Y_GROUP_TYPE.COUNT ? STATISTIC_SUMMARY_TYPE.COUNT : STATISTIC_SUMMARY_TYPE.ADVANCED;
-    if (position === COMBINATION_POSITION.LEFT) {
-      if (newSummaryType === STATISTIC_SUMMARY_TYPE.COUNT && y_axis_left_summary_type === STATISTIC_SUMMARY_TYPE.COUNT) return;
-      if (option === STATISTIC_Y_GROUP_TYPE.SINGLE_NUMERIC_COLUMN && !y_axis_left_group_by_multiple_numeric_column && y_axis_left_summary_type !== STATISTIC_SUMMARY_TYPE.COUNT) return;
-      if (option === STATISTIC_Y_GROUP_TYPE.MULTIPLE_NUMERIC_COLUMN && y_axis_left_group_by_multiple_numeric_column) return;
-      if (option === STATISTIC_Y_GROUP_TYPE.COUNT) {
-        y_axis_left_summary_column = null;
-        y_axis_left_summary_method = 'sum';
-        y_axis_left_group_by_multiple_numeric_column = false;
-        y_axis_left_group_by_numeric_columns = [];
-      }
-      if (option === STATISTIC_Y_GROUP_TYPE.SINGLE_NUMERIC_COLUMN) {
-        y_axis_left_summary_column = null;
-        y_axis_left_summary_method = STATISTIC_SUMMARY_CALCULATION_METHOD[0];
-        y_axis_left_group_by_multiple_numeric_column = false;
-        y_axis_left_group_by_numeric_columns = [];
-      }
-      if (option === STATISTIC_Y_GROUP_TYPE.MULTIPLE_NUMERIC_COLUMN) {
-        y_axis_left_summary_column = null;
-        y_axis_left_summary_method = STATISTIC_SUMMARY_CALCULATION_METHOD[0];
-        y_axis_left_group_by_multiple_numeric_column = true;
-        y_axis_left_group_by_numeric_columns = [];
-      }
-      onChange && onChange({
-        y_axis_left_summary_type: newSummaryType,
-        y_axis_left_summary_column: y_axis_left_summary_column,
-        y_axis_left_summary_method: y_axis_left_summary_method,
-        y_axis_left_group_by_multiple_numeric_column: y_axis_left_group_by_multiple_numeric_column,
-        y_axis_left_group_by_numeric_columns: y_axis_left_group_by_numeric_columns
-      });
-      return;
-    }
-    if (y_axis_right_summary_type === newSummaryType) return;
-    y_axis_right_summary_type = newSummaryType;
-    var y_axis_right_summary_method = STATISTIC_SUMMARY_CALCULATION_METHOD[0];
-    if (newSummaryType === STATISTIC_SUMMARY_TYPE.COUNT) {
-      y_axis_right_summary_column = null;
-      y_axis_right_summary_method = 'sum';
-    }
-    onChange && onChange({
-      y_axis_right_summary_type: newSummaryType,
-      y_axis_right_summary_column: y_axis_right_summary_column,
-      y_axis_right_summary_method: y_axis_right_summary_method
-    });
-  }, [statistic, onChange]);
-  var _onSelectSummaryColumn = useCallback(function (option, position) {
-    var config = statistic.config;
-    var y_axis_right_summary_column = config.y_axis_right_summary_column,
-      y_axis_left_summary_column = config.y_axis_left_summary_column,
-      y_axis_left_summary_method = config.y_axis_left_summary_method,
-      y_axis_right_summary_method = config.y_axis_right_summary_method;
-    var newSummaryColumnKey = option;
-    if (position === COMBINATION_POSITION.LEFT) {
-      if (y_axis_left_summary_column === newSummaryColumnKey) return;
-      if (!y_axis_left_summary_method) {
-        y_axis_left_summary_method = 'Sum';
-      }
-      onChange && onChange({
-        y_axis_left_summary_column: newSummaryColumnKey,
-        y_axis_left_summary_method: y_axis_left_summary_method
-      });
-      return;
-    }
-    if (y_axis_right_summary_column === newSummaryColumnKey) return;
-    if (!y_axis_right_summary_method) {
-      y_axis_right_summary_method = 'Sum';
-    }
-    onChange && onChange({
-      y_axis_right_summary_column: newSummaryColumnKey,
-      y_axis_right_summary_method: y_axis_right_summary_method
-    });
-  }, [statistic, onChange]);
-  var _onSelectSummaryMethod = useCallback(function (option, position) {
-    var config = statistic.config;
-    var y_axis_right_summary_method = config.y_axis_right_summary_method,
-      y_axis_left_summary_method = config.y_axis_left_summary_method;
-    var newSummaryColumnMethod = option;
-    if (position === COMBINATION_POSITION.LEFT) {
-      if (y_axis_left_summary_method !== newSummaryColumnMethod) {
-        onChange && onChange({
-          y_axis_left_summary_method: newSummaryColumnMethod
-        });
-      }
-      return;
-    }
-    if (y_axis_right_summary_method === newSummaryColumnMethod) return;
-    onChange && onChange({
-      y_axis_right_summary_method: newSummaryColumnMethod
-    });
-  }, [statistic, onChange]);
-  var config = statistic.config;
-  var table_id = config.table_id,
-    x_axis_column_key = config.x_axis_column_key,
-    x_axis_date_granularity = config.x_axis_date_granularity,
-    x_axis_geolocation_granularity = config.x_axis_geolocation_granularity,
-    x_axis_include_empty_cells = config.x_axis_include_empty_cells,
-    y_axis_right_summary_type = config.y_axis_right_summary_type,
-    y_axis_right_summary_method = config.y_axis_right_summary_method,
-    y_axis_right_summary_column = config.y_axis_right_summary_column,
-    y_axis_left_summary_type = config.y_axis_left_summary_type,
-    y_axis_left_summary_method = config.y_axis_left_summary_method,
-    y_axis_left_summary_column = config.y_axis_left_summary_column;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CommonDataSettings, {
-    statistic: statistic,
-    tables: tables,
-    FilterSettings: FilterSettings,
-    onChange: onChange
-  }), /*#__PURE__*/React.createElement(GroupBy, {
-    tables: tables,
-    className: "selected-x-axis",
-    label: intl.get(xLabel),
-    selectedTableId: table_id,
-    selectedColumnKey: x_axis_column_key,
-    selectedDateGranularity: x_axis_date_granularity,
-    selectedGeolocationGranularity: x_axis_geolocation_granularity,
-    onGroupByChange: onXAxisColumnChange,
-    onGroupbyDateGranularityChange: onGroupbyDateGranularityChange,
-    onGroupbyGeolocationGranularityChange: onGroupbyGeolocationGranularityChange
-  }), /*#__PURE__*/React.createElement(Switch, {
-    key: "x_axis_include_empty_cells",
-    checked: x_axis_include_empty_cells,
-    placeholder: intl.get('Include_empty'),
-    onChange: onIncludeEmptyChange
-  }), /*#__PURE__*/React.createElement(Divider, {
-    className: "mt-4"
-  }), /*#__PURE__*/React.createElement(SummarySettings, {
-    chartType: 'combination_chart',
-    label: intl.get('Y-axis(left side)'),
-    config: config,
-    statistic: statistic,
-    summaryType: y_axis_left_summary_type,
-    summaryMethod: y_axis_left_summary_method,
-    summaryColumn: y_axis_left_summary_column,
-    onChangeSummaryType: function onChangeSummaryType(option) {
-      return _onChangeSummaryType(option, COMBINATION_POSITION.LEFT);
-    },
-    onSelectSummaryColumn: function onSelectSummaryColumn(option) {
-      return _onSelectSummaryColumn(option, COMBINATION_POSITION.LEFT);
-    },
-    onSelectSummaryMethod: function onSelectSummaryMethod(option) {
-      return _onSelectSummaryMethod(option, COMBINATION_POSITION.LEFT);
-    },
-    useMultipleSummaryColumns: true,
-    tables: tables,
-    onChange: onChange
-  }), /*#__PURE__*/React.createElement(SummarySettings, {
-    chartType: 'combination_chart',
-    label: intl.get('Y-axis(right side)'),
-    config: config,
-    summaryType: y_axis_right_summary_type,
-    summaryMethod: y_axis_right_summary_method,
-    summaryColumn: y_axis_right_summary_column,
-    onChangeSummaryType: function onChangeSummaryType(option) {
-      return _onChangeSummaryType(option, COMBINATION_POSITION.RIGHT);
-    },
-    onSelectSummaryColumn: function onSelectSummaryColumn(option) {
-      return _onSelectSummaryColumn(option, COMBINATION_POSITION.RIGHT);
-    },
-    onSelectSummaryMethod: function onSelectSummaryMethod(option) {
-      return _onSelectSummaryMethod(option, COMBINATION_POSITION.RIGHT);
-    },
-    tables: tables,
-    statistic: statistic,
-    onChange: onChange
-  }));
-};
-DataSettings.defaultProps = {
-  xLabel: 'X_axis'
-};
-export default DataSettings;

package/lib/components/settings/combination-settings/style-settings.js

@@ -1,183 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import React, { useCallback, useMemo } from 'react';
-import { Label, FormGroup } from 'reactstrap';
-import DTableSelect from "dtable-ui-component/lib/DTableSelect";
-import Switch from '../widgets/switch';
-import Divider from '../widgets/divider';
-import MinMaxSetting from '../widgets/min-max-setting';
-import DisplayValuesSettings from '../widgets/display-values-settings';
-import { eventStopPropagation } from '../../../utils';
-import { X_LABEL_POSITIONS, Y_LABEL_POSITIONS, LABEL_POSITION_TYPE_SHOW } from '../../../constants';
-import intl from '../../../intl';
-var StyleSettings = function StyleSettings(_ref) {
-  var statistic = _ref.statistic,
-    onChange = _ref.onChange,
-    xLabel = _ref.xLabel;
-  var xAxisLabelOptions = useMemo(function () {
-    return X_LABEL_POSITIONS.map(function (item) {
-      return {
-        value: item,
-        label: intl.get(LABEL_POSITION_TYPE_SHOW[item])
-      };
-    });
-  }, []);
-  var yAxisLabelOptions = useMemo(function () {
-    return Y_LABEL_POSITIONS.map(function (item) {
-      return {
-        value: item,
-        label: intl.get(LABEL_POSITION_TYPE_SHOW[item])
-      };
-    });
-  }, []);
-  var onAxisLabelShowChange = useCallback(function (event, labelKey) {
-    eventStopPropagation(event);
-    var config = statistic.config;
-    var value = config[labelKey];
-    onChange && onChange(_defineProperty({}, labelKey, !value));
-  }, [statistic, onChange]);
-  var onAxisLabelPositionChange = useCallback(function (option, positionKey) {
-    var position = option.value;
-    var config = statistic.config;
-    var oldValue = config[positionKey];
-    if (position === oldValue) return;
-    onChange && onChange(_defineProperty({}, positionKey, position));
-  }, [statistic, onChange]);
-  var onToggleYAxisAutoRange = useCallback(function (key) {
-    var config = statistic.config;
-    var update = _defineProperty({}, key, config[key] === undefined ? false : !config[key]);
-    onChange && onChange(update);
-  }, [statistic, onChange]);
-  var onYAxisMinChange = useCallback(function (key, min) {
-    var newMin = parseInt(min);
-    if (Number.isNaN(newMin)) return;
-    var update = _defineProperty({}, key, newMin);
-    onChange && onChange(update);
-  }, [onChange]);
-  var onYAxisMaxChange = useCallback(function (key, max) {
-    var newMax = parseInt(max);
-    if (Number.isNaN(newMax)) return;
-    var update = _defineProperty({}, key, newMax);
-    onChange && onChange(update);
-  }, [onChange]);
-  var onDisplayValueChange = useCallback(function (update) {
-    onChange && onChange(update);
-  }, [onChange]);
-  var config = statistic.config;
-  var x_axis_show_label = config.x_axis_show_label,
-    x_axis_label_position = config.x_axis_label_position,
-    show_y_axis_left_label = config.show_y_axis_left_label,
-    y_axis_left_label_position = config.y_axis_left_label_position,
-    y_axis_right_label_position = config.y_axis_right_label_position,
-    show_y_axis_right_label = config.show_y_axis_right_label,
-    y_axis_min_left = config.y_axis_min_left,
-    y_axis_auto_range_left = config.y_axis_auto_range_left,
-    y_axis_max_left = config.y_axis_max_left,
-    y_axis_auto_range_right = config.y_axis_auto_range_right,
-    y_axis_min_right = config.y_axis_min_right,
-    y_axis_max_right = config.y_axis_max_right,
-    display_data = config.display_data,
-    label_font_size = config.label_font_size;
-  var xAxisLabelPosition = xAxisLabelOptions.find(function (option) {
-    return option.value === x_axis_label_position;
-  }) || xAxisLabelOptions[0];
-  var yLeftAxisLabelPosition = yAxisLabelOptions.find(function (option) {
-    return option.value === y_axis_left_label_position;
-  }) || yAxisLabelOptions[0];
-  var yRightAxisLabelPosition = yAxisLabelOptions.find(function (option) {
-    return option.value === y_axis_right_label_position;
-  }) || yAxisLabelOptions[0];
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormGroup, {
-    className: "seastatistic-parameter-item"
-  }, /*#__PURE__*/React.createElement(Label, null, intl.get(xLabel)), /*#__PURE__*/React.createElement(Switch, {
-    key: "x_axis_show_label",
-    checked: x_axis_show_label || false,
-    placeholder: intl.get('Display_title'),
-    onChange: function onChange(event) {
-      return onAxisLabelShowChange(event, 'x_axis_show_label');
-    }
-  }), x_axis_show_label && /*#__PURE__*/React.createElement(DTableSelect, {
-    value: xAxisLabelPosition,
-    options: xAxisLabelOptions,
-    onChange: function onChange(option) {
-      return onAxisLabelPositionChange(option, 'x_axis_label_position');
-    }
-  })), /*#__PURE__*/React.createElement(Divider, null), /*#__PURE__*/React.createElement(FormGroup, {
-    className: "seastatistic-parameter-item"
-  }, /*#__PURE__*/React.createElement(Label, null, intl.get('Y-axis(left side)')), /*#__PURE__*/React.createElement(Switch, {
-    key: "show_y_axis_left_label",
-    checked: show_y_axis_left_label || false,
-    placeholder: intl.get('Display_title'),
-    onChange: function onChange(event) {
-      return onAxisLabelShowChange(event, 'show_y_axis_left_label');
-    }
-  }), show_y_axis_left_label && /*#__PURE__*/React.createElement("div", {
-    className: "seastatistic-parameter-container"
-  }, /*#__PURE__*/React.createElement(DTableSelect, {
-    value: yLeftAxisLabelPosition,
-    classNamePrefix: "chart-y-axis-label-position",
-    options: yAxisLabelOptions,
-    onChange: function onChange(option) {
-      return onAxisLabelPositionChange(option, 'y_axis_left_label_position');
-    }
-  })), /*#__PURE__*/React.createElement(Switch, {
-    key: "y_axis_auto_range_left",
-    checked: y_axis_auto_range_left,
-    placeholder: intl.get('Auto_range'),
-    onChange: function onChange() {
-      return onToggleYAxisAutoRange('y_axis_auto_range_left');
-    }
-  }), !y_axis_auto_range_left && /*#__PURE__*/React.createElement(MinMaxSetting, {
-    min: y_axis_min_left,
-    max: y_axis_max_left,
-    onMinChange: function onMinChange(value) {
-      return onYAxisMinChange('y_axis_min_left', value);
-    },
-    onMaxChange: function onMaxChange(value) {
-      return onYAxisMaxChange('y_axis_max_left', value);
-    }
-  })), /*#__PURE__*/React.createElement(Divider, null), /*#__PURE__*/React.createElement(FormGroup, {
-    className: "seastatistic-parameter-item"
-  }, /*#__PURE__*/React.createElement(Label, null, intl.get('Y-axis(right side)')), /*#__PURE__*/React.createElement(Switch, {
-    key: "show_y_axis_right_label",
-    checked: show_y_axis_right_label || false,
-    placeholder: intl.get('Display_title'),
-    onChange: function onChange(event) {
-      return onAxisLabelShowChange(event, 'show_y_axis_right_label');
-    }
-  }), show_y_axis_right_label && /*#__PURE__*/React.createElement("div", {
-    className: "seastatistic-parameter-container"
-  }, /*#__PURE__*/React.createElement(DTableSelect, {
-    value: yRightAxisLabelPosition,
-    classNamePrefix: "chart-y-axis-label-position",
-    options: yAxisLabelOptions,
-    onChange: function onChange(option) {
-      return onAxisLabelPositionChange(option, 'y_axis_right_label_position');
-    }
-  })), /*#__PURE__*/React.createElement(Switch, {
-    key: "y_axis_auto_range_right",
-    checked: y_axis_auto_range_right,
-    placeholder: intl.get('Auto_range'),
-    onChange: function onChange() {
-      return onToggleYAxisAutoRange('y_axis_auto_range_right');
-    }
-  }), !y_axis_auto_range_right && /*#__PURE__*/React.createElement(MinMaxSetting, {
-    min: y_axis_min_right,
-    max: y_axis_max_right,
-    onMinChange: function onMinChange(value) {
-      return onYAxisMinChange('y_axis_min_right', value);
-    },
-    onMaxChange: function onMaxChange(value) {
-      return onYAxisMaxChange('y_axis_max_right', value);
-    }
-  })), /*#__PURE__*/React.createElement(DisplayValuesSettings, {
-    isShowValueKey: "display_data",
-    isShowValue: display_data,
-    fontSizeKey: "label_font_size",
-    fontSize: label_font_size,
-    onChange: onDisplayValueChange
-  }));
-};
-StyleSettings.defaultProps = {
-  xLabel: 'X_axis'
-};
-export default StyleSettings;