dtable-ui-component 0.3.20 → 0.3.21-beta.1

package/lib/AutoNumberFormatter/index.js

@@ -5,34 +5,27 @@ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
 import classnames from 'classnames';
 import './index.css';
-
 var AutoNumberFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(AutoNumberFormatter, _React$Component);
-
   var _super = _createSuper(AutoNumberFormatter);
-
   function AutoNumberFormatter() {
     _classCallCheck(this, AutoNumberFormatter);
-
     return _super.apply(this, arguments);
   }
-
   _createClass(AutoNumberFormatter, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          containerClassName = _this$props.containerClassName,
-          value = _this$props.value;
+        containerClassName = _this$props.containerClassName,
+        value = _this$props.value;
       var classname = classnames('dtable-ui cell-formatter-container auto-number-formatter', containerClassName);
       return /*#__PURE__*/React.createElement("div", {
         className: classname
       }, value);
     }
   }]);
-
   return AutoNumberFormatter;
 }(React.Component);
-
 AutoNumberFormatter.defaultProps = {
   value: ''
 };

package/lib/ButtonFormatter/index.js

@@ -7,43 +7,32 @@ import classnames from 'classnames';
 import { SELECT_OPTION_COLORS } from 'dtable-utils';
 import './index.css';
 var WHITE = '#FFFFFF';
-
 var ButtonFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(ButtonFormatter, _React$Component);
-
   var _super = _createSuper(ButtonFormatter);
-
   function ButtonFormatter() {
     var _this;
-
     _classCallCheck(this, ButtonFormatter);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _super.call.apply(_super, [this].concat(args));
-
     _this.handleClick = function () {
       if (_this.props.onClickButton) {
         _this.props.onClickButton(_this.props.data);
       }
     };
-
     return _this;
   }
-
   _createClass(ButtonFormatter, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          data = _this$props.data,
-          containerClassName = _this$props.containerClassName;
-
+        data = _this$props.data,
+        containerClassName = _this$props.containerClassName;
       var _ref = data || {},
-          button_color = _ref.button_color,
-          button_name = _ref.button_name;
-
+        button_color = _ref.button_color,
+        button_name = _ref.button_name;
       var colorObj = SELECT_OPTION_COLORS.find(function (item) {
         return item.COLOR === button_color;
       }) || SELECT_OPTION_COLORS[0];
@@ -59,8 +48,6 @@ var ButtonFormatter = /*#__PURE__*/function (_React$Component) {
       }, button_name));
     }
   }]);
-
   return ButtonFormatter;
 }(React.Component);
-
 export default ButtonFormatter;

package/lib/CTimeFormatter/index.js

@@ -6,51 +6,38 @@ import React from 'react';
 import classnames from 'classnames';
 import dayjs from 'dayjs';
 import './index.css';
-
 var CTimeFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(CTimeFormatter, _React$Component);
-
   var _super = _createSuper(CTimeFormatter);
-
   function CTimeFormatter() {
     var _this;
-
     _classCallCheck(this, CTimeFormatter);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _super.call.apply(_super, [this].concat(args));
-
     _this.formatDate = function (date) {
       return dayjs(date).format('YYYY-MM-DD HH:mm:ss');
     };
-
     return _this;
   }
-
   _createClass(CTimeFormatter, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          date = _this$props.value,
-          containerClassName = _this$props.containerClassName;
+        date = _this$props.value,
+        containerClassName = _this$props.containerClassName;
       var classname = classnames('dtable-ui cell-formatter-container ctime-formatter', containerClassName);
-
       if (date !== '') {
         date = this.formatDate(date);
       }
-
       return /*#__PURE__*/React.createElement("div", {
         className: classname
       }, date);
     }
   }]);
-
   return CTimeFormatter;
 }(React.Component);
-
 CTimeFormatter.defaultProps = {
   value: '',
   containerClassName: ''

package/lib/CheckboxEditor/index.js

@@ -4,45 +4,34 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
 import './index.css';
-
 var CheckboxEditor = /*#__PURE__*/function (_React$Component) {
   _inherits(CheckboxEditor, _React$Component);
-
   var _super = _createSuper(CheckboxEditor);
-
   function CheckboxEditor(props) {
     var _this;
-
     _classCallCheck(this, CheckboxEditor);
-
     _this = _super.call(this, props);
-
     _this.onCommit = function () {
       var updated = {};
       var column = _this.props.column;
       updated[column.name] = _this.state.value;
-
       _this.props.onCommit(updated);
     };
-
     _this.onChange = function (event) {
       if (_this.props.isReadOnly) {
         return;
       }
-
       _this.setState({
         value: !_this.state.value
       }, function () {
         _this.onCommit();
       });
     };
-
     _this.state = {
       value: props.value ? props.value : false
     };
     return _this;
   }
-
   _createClass(CheckboxEditor, [{
     key: "render",
     value: function render() {
@@ -66,10 +55,8 @@ var CheckboxEditor = /*#__PURE__*/function (_React$Component) {
       })));
     }
   }]);
-
   return CheckboxEditor;
 }(React.Component);
-
 CheckboxEditor.defaultProps = {
   isReadOnly: false,
   value: false

package/lib/CheckboxFormatter/index.js

@@ -5,27 +5,21 @@ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
 import classnames from 'classnames';
 import './index.css';
-
 var CheckboxFormatter = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(CheckboxFormatter, _React$PureComponent);
-
   var _super = _createSuper(CheckboxFormatter);
-
   function CheckboxFormatter() {
     _classCallCheck(this, CheckboxFormatter);
-
     return _super.apply(this, arguments);
   }
-
   _createClass(CheckboxFormatter, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          value = _this$props.value,
-          containerClassName = _this$props.containerClassName;
+        value = _this$props.value,
+        containerClassName = _this$props.containerClassName;
       value = value === true ? true : false;
       var classname = classnames('dtable-ui cell-formatter-container checkbox-formatter d-flex align-items-center justify-content-center', containerClassName);
-
       if (value) {
         return /*#__PURE__*/React.createElement("div", {
           className: classname
@@ -33,14 +27,11 @@ var CheckboxFormatter = /*#__PURE__*/function (_React$PureComponent) {
           className: "dtable-font dtable-icon-check-mark checkbox-checked-mark"
         }));
       }
-
       return null;
     }
   }]);
-
   return CheckboxFormatter;
 }(React.PureComponent);
-
 CheckboxFormatter.defaultProps = {
   value: false
 };

package/lib/CollaboratorEditor/index.js

@@ -10,28 +10,20 @@ import EditEditorButton from '../EditEditorButton';
 import PCCollaboratorEditorPopover from './pc-collaborator-editor-popover';
 import MBCollaboratorEditorPopover from './mb-collaborator-editor-popover';
 import './index.css';
-
 var CollaboratorEditor = /*#__PURE__*/function (_React$Component) {
   _inherits(CollaboratorEditor, _React$Component);
-
   var _super = _createSuper(CollaboratorEditor);
-
   function CollaboratorEditor(props) {
     var _this;
-
     _classCallCheck(this, CollaboratorEditor);
-
     _this = _super.call(this, props);
-
     _this.onDocumentToggle = function (e) {
       if (_this.editorContainer !== e.target && !_this.editorContainer.contains(e.target)) {
         _this.onClosePopover();
       }
     };
-
     _this.getFormattedCollaborators = function () {
       var newValue = _this.state.newValue;
-
       if (Array.isArray(newValue) && newValue.length > 0) {
         var collaborators = _this.props.collaborators;
         return newValue.map(function (collaboratorEmail) {
@@ -42,23 +34,17 @@ var CollaboratorEditor = /*#__PURE__*/function (_React$Component) {
           return !!collaborator;
         });
       }
-
       return [];
     };
-
     _this.onAddOptionToggle = function (event) {
       event.nativeEvent.stopImmediatePropagation();
       event.stopPropagation();
-
       if (_this.props.isReadOnly) {
         return;
       }
-
       var isPopoverShow = !_this.state.isPopoverShow;
-
       if (isPopoverShow) {
         var popoverPosition = _this.caculatePopoverPosition();
-
         _this.setState({
           isPopoverShow: isPopoverShow,
           popoverPosition: popoverPosition
@@ -69,47 +55,36 @@ var CollaboratorEditor = /*#__PURE__*/function (_React$Component) {
         });
       }
     };
-
     _this.onCommit = function (newValue) {
       var updated = {};
       var column = _this.props.column;
       updated[column.name] = newValue;
-
       _this.props.onCommit(updated);
     };
-
     _this.onCollaboratorItemToggle = function (collaborator) {
       var newValue = _this.state.newValue.slice();
-
       var collaboratorIndex = newValue.findIndex(function (collaboratorEmail) {
         return collaboratorEmail === collaborator.email;
       });
-
       if (collaboratorIndex !== -1) {
         newValue.splice(collaboratorIndex, 1);
       } else {
         newValue.push(collaborator.email);
       }
-
       _this.setState({
         newValue: newValue
       }, function () {
         _this.onCommit(newValue);
-
         _this.onClosePopover();
       });
     };
-
     _this.onDeleteCollaborator = function (collaborator) {
       var newValue = _this.state.newValue.slice();
-
       var optionIndex = newValue.findIndex(function (collaboratorEmail) {
         return collaboratorEmail === collaborator.email;
       });
-
       if (optionIndex > -1) {
         newValue.splice(optionIndex, 1);
-
         _this.setState({
           newValue: newValue
         }, function () {
@@ -117,21 +92,17 @@ var CollaboratorEditor = /*#__PURE__*/function (_React$Component) {
         });
       }
     };
-
     _this.caculatePopoverPosition = function () {
       var POPOVER_MAX_HEIGHT = 200;
       var innerHeight = window.innerHeight;
-
       var _this$editor$getClien = _this.editor.getClientRects()[0],
-          top = _this$editor$getClien.top,
-          height = _this$editor$getClien.height;
-
+        top = _this$editor$getClien.top,
+        height = _this$editor$getClien.height;
       var isBelow = innerHeight - (top + height) > POPOVER_MAX_HEIGHT;
       var position = {
         top: height + 1,
         left: 0
       };
-
       if (!isBelow) {
         var bottom = height + 1;
         position = {
@@ -139,24 +110,19 @@ var CollaboratorEditor = /*#__PURE__*/function (_React$Component) {
           left: 0
         };
       }
-
       return position;
     };
-
     _this.onClosePopover = function () {
       _this.setState({
         isPopoverShow: false
       });
     };
-
     _this.setEditorContainerRef = function (editorContainer) {
       _this.editorContainer = editorContainer;
     };
-
     _this.setEditorRef = function (editor) {
       _this.editor = editor;
     };
-
     _this.state = {
       newValue: Array.isArray(props.value) ? props.value : [],
       isPopoverShow: false,
@@ -164,7 +130,6 @@ var CollaboratorEditor = /*#__PURE__*/function (_React$Component) {
     };
     return _this;
   }
-
   _createClass(CollaboratorEditor, [{
     key: "componentDidMount",
     value: function componentDidMount() {
@@ -179,13 +144,12 @@ var CollaboratorEditor = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var _this2 = this;
-
       var _this$props = this.props,
-          collaborators = _this$props.collaborators,
-          isReadOnly = _this$props.isReadOnly;
+        collaborators = _this$props.collaborators,
+        isReadOnly = _this$props.isReadOnly;
       var _this$state = this.state,
-          isPopoverShow = _this$state.isPopoverShow,
-          popoverPosition = _this$state.popoverPosition;
+        isPopoverShow = _this$state.isPopoverShow,
+        popoverPosition = _this$state.popoverPosition;
       var selectedCollaborators = this.getFormattedCollaborators();
       var enableDeleteCollaborator = !isReadOnly;
       return /*#__PURE__*/React.createElement("div", {
@@ -226,10 +190,8 @@ var CollaboratorEditor = /*#__PURE__*/function (_React$Component) {
       }))));
     }
   }]);
-
   return CollaboratorEditor;
 }(React.Component);
-
 CollaboratorEditor.defaultProps = {
   isReadOnly: false,
   value: []

package/lib/CollaboratorEditor/mb-collaborator-editor-popover/index.js

@@ -7,25 +7,17 @@ import React from 'react';
 import { getLocale } from '../../lang';
 import MBEditorHeader from '../../MBEditorHeader';
 import './index.css';
-
 var MBCollaboratorEditorPopover = /*#__PURE__*/function (_React$Component) {
   _inherits(MBCollaboratorEditorPopover, _React$Component);
-
   var _super = _createSuper(MBCollaboratorEditorPopover);
-
   function MBCollaboratorEditorPopover(props) {
     var _this;
-
     _classCallCheck(this, MBCollaboratorEditorPopover);
-
     _this = _super.call(this, props);
-
     _this.handleHistaryBack = function (e) {
       e.preventDefault();
-
       _this.props.onClosePopover();
     };
-
     _this.onContainerClick = function (event) {
       if (_this.editorPopover && _this.editorPopover.contains(event.target)) {
         event.stopPropagation();
@@ -33,35 +25,27 @@ var MBCollaboratorEditorPopover = /*#__PURE__*/function (_React$Component) {
         return false;
       }
     };
-
     _this.onChangeSearch = function (event) {
       var searchVal = _this.state.searchVal;
-
       if (searchVal === event.target.value) {
         return;
       }
-
       searchVal = event.target.value;
-
       _this.setState({
         searchVal: searchVal
       });
     };
-
     _this.getSelectedCollaborators = function () {
       var _this$props = _this.props,
-          value = _this$props.value,
-          collaborators = _this$props.collaborators;
-
+        value = _this$props.value,
+        collaborators = _this$props.collaborators;
       if (!Array.isArray(value)) {
         return [];
       }
-
       return collaborators.filter(function (collaborator) {
         return value.indexOf(collaborator.email) > -1;
       });
     };
-
     _this.getFilteredCollaborators = function () {
       var collaborators = _this.props.collaborators;
       var searchVal = _this.state.searchVal;
@@ -69,15 +53,12 @@ var MBCollaboratorEditorPopover = /*#__PURE__*/function (_React$Component) {
         return item.name.indexOf(searchVal) > -1;
       }) : collaborators;
     };
-
     _this.onSelectCollaborator = function (collaborator) {
       _this.props.onCollaboratorItemToggle(collaborator);
     };
-
     _this.onRemoveCollaborator = function (collaborator) {
       _this.props.onCollaboratorItemToggle(collaborator);
     };
-
     _this.renderFilteredCollaborators = function (collaborators) {
       var value = _this.props.value;
       return collaborators.map(function (collaborator, index) {
@@ -104,22 +85,18 @@ var MBCollaboratorEditorPopover = /*#__PURE__*/function (_React$Component) {
         }));
       });
     };
-
     _this.setEditorPopover = function (editorPopover) {
       _this.editorPopover = editorPopover;
     };
-
     _this.state = {
       searchVal: ''
     };
     return _this;
   }
-
   _createClass(MBCollaboratorEditorPopover, [{
     key: "componentDidMount",
     value: function componentDidMount() {
       history.pushState(null, null, '#'); // eslint-disable-line
-
       window.addEventListener('popstate', this.handleHistaryBack, false);
     }
   }, {
@@ -167,10 +144,8 @@ var MBCollaboratorEditorPopover = /*#__PURE__*/function (_React$Component) {
       }, getLocale('No_collaborators_avaliable')), filteredCollaborators.length > 0 && this.renderFilteredCollaborators(filteredCollaborators)))));
     }
   }]);
-
   return MBCollaboratorEditorPopover;
 }(React.Component);
-
 MBCollaboratorEditorPopover.defaultProps = {
   isReadOnly: false,
   value: []

package/lib/CollaboratorEditor/pc-collaborator-editor-popover/index.js

@@ -7,65 +7,49 @@ import React from 'react';
 import { getLocale } from '../../lang';
 import CollaboratorItem from '../../CollaboratorItem';
 import './index.css';
-
 var PCCollaboratorEditorPopover = /*#__PURE__*/function (_React$Component) {
   _inherits(PCCollaboratorEditorPopover, _React$Component);
-
   var _super = _createSuper(PCCollaboratorEditorPopover);
-
   function PCCollaboratorEditorPopover(props) {
     var _this;
-
     _classCallCheck(this, PCCollaboratorEditorPopover);
-
     _this = _super.call(this, props);
-
     _this.onValueChanged = function (event) {
       var value = event.target.value;
-
       _this.setState({
         searchValue: value
       });
     };
-
     _this.onInputClick = function (event) {
       event.nativeEvent.stopImmediatePropagation();
       event.stopPropagation();
     };
-
     _this.onCollaboratorItemToggle = function (item) {
       _this.props.onCollaboratorItemToggle(item);
     };
-
     _this.getFilterCollaborator = function () {
       var collaborators = _this.props.collaborators;
-
       var filter = _this.state.searchValue.toLowerCase();
-
       if (!filter) {
         return collaborators;
       }
-
       return collaborators.filter(function (collaborator) {
         return collaborator.name.toString().toLowerCase().indexOf(filter) > -1;
       });
     };
-
     _this.state = {
       searchValue: ''
     };
     return _this;
   }
-
   _createClass(PCCollaboratorEditorPopover, [{
     key: "render",
     value: function render() {
       var _this2 = this;
-
       var searchValue = this.state.searchValue;
       var _this$props = this.props,
-          selectedCollaborators = _this$props.selectedCollaborators,
-          popoverPosition = _this$props.popoverPosition;
+        selectedCollaborators = _this$props.selectedCollaborators,
+        popoverPosition = _this$props.popoverPosition;
       var collaborators = this.getFilterCollaborator();
       var popoverStyle = Object.assign({}, _objectSpread({}, popoverPosition), {
         position: 'absolute'
@@ -103,8 +87,6 @@ var PCCollaboratorEditorPopover = /*#__PURE__*/function (_React$Component) {
       }, getLocale('No_collaborators_available'))));
     }
   }]);
-
   return PCCollaboratorEditorPopover;
 }(React.Component);
-
 export default PCCollaboratorEditorPopover;