dtable-ui-component 0.3.20 → 0.3.21

package/lib/RowExpandImageFormatter/row-expand-image-item-formatter.js

@@ -4,33 +4,26 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React, { Component } from 'react';
 import { Tooltip } from 'reactstrap';
+import MediaQuery from 'react-responsive';
 import { getLocale } from '../lang';
 import DeleteTip from '../common/delete-tip';
-
 var RowExpandImageItemFormatter = /*#__PURE__*/function (_Component) {
   _inherits(RowExpandImageItemFormatter, _Component);
-
   var _super = _createSuper(RowExpandImageItemFormatter);
-
   function RowExpandImageItemFormatter(props) {
     var _this;
-
     _classCallCheck(this, RowExpandImageItemFormatter);
-
     _this = _super.call(this, props);
-
     _this.toggleTooltip = function () {
       _this.setState({
         isTooltipOpen: !_this.state.isTooltipOpen
       });
     };
-
     _this.closeDeleteTip = function () {
       _this.setState({
         isDeleteTipOpen: false
       });
     };
-
     _this.onClickDelete = function (e) {
       e.preventDefault();
       e.stopPropagation();
@@ -38,48 +31,39 @@ var RowExpandImageItemFormatter = /*#__PURE__*/function (_Component) {
         top: e.clientY,
         left: e.clientX
       };
-
       _this.setState({
         isDeleteTipOpen: true
       });
     };
-
     _this.onClickDownload = function (e) {
       e.preventDefault();
       e.stopPropagation();
-
       _this.props.downloadFile(_this.props.url, e);
     };
-
     _this.onDelete = function (e) {
       e.stopPropagation();
-
       _this.closeDeleteTip();
-
       _this.props.deleteFile(_this.props.index);
     };
-
     _this.onClickImage = function () {
       _this.props.onImageClick(_this.props.index);
     };
-
     _this.state = {
       isTooltipOpen: false,
       isDeleteTipOpen: false
     };
     return _this;
   }
-
   _createClass(RowExpandImageItemFormatter, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          url = _this$props.url,
-          column = _this$props.column,
-          index = _this$props.index,
-          readOnly = _this$props.readOnly,
-          downloadFile = _this$props.downloadFile,
-          deleteFile = _this$props.deleteFile;
+        url = _this$props.url,
+        column = _this$props.column,
+        index = _this$props.index,
+        readOnly = _this$props.readOnly,
+        downloadFile = _this$props.downloadFile,
+        deleteFile = _this$props.deleteFile;
       var id = 'image-list-preview-item' + column.key + index;
       var name = decodeURI(url.slice(url.lastIndexOf('/') + 1));
       return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
@@ -108,7 +92,9 @@ var RowExpandImageItemFormatter = /*#__PURE__*/function (_Component) {
         toggle: this.closeDeleteTip,
         onDelete: this.onDelete,
         deleteTip: getLocale('Are_you_sure_you_want_to_delete_this_image')
-      }), /*#__PURE__*/React.createElement(Tooltip, {
+      }), /*#__PURE__*/React.createElement(MediaQuery, {
+        query: '(min-width: 768px)'
+      }, /*#__PURE__*/React.createElement(Tooltip, {
         placement: "bottom",
         isOpen: this.state.isTooltipOpen,
         toggle: this.toggleTooltip,
@@ -118,11 +104,9 @@ var RowExpandImageItemFormatter = /*#__PURE__*/function (_Component) {
           hide: 0
         },
         fade: false
-      }, name));
+      }, name)));
     }
   }]);
-
   return RowExpandImageItemFormatter;
 }(Component);
-
 export { RowExpandImageItemFormatter as default };

package/lib/RowExpandImageFormatter/utils.js

@@ -2,6 +2,5 @@ export var getImageThumbnailUrl = function getImageThumbnailUrl(url, server) {
   if (server && url.indexOf(server) > -1) {
     return url.replace('/workspace', '/thumbnail/workspace') + '?size=256';
   }
-
   return url;
 };

package/lib/RowExpandLinkFormatter/collaborator-item-formatter.js

@@ -5,101 +5,77 @@ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React, { Component } from 'react';
 import { isValidEmail } from 'dtable-utils';
 import CollaboratorItem from '../CollaboratorItem';
-
 var CollaboratorItemFormatter = /*#__PURE__*/function (_Component) {
   _inherits(CollaboratorItemFormatter, _Component);
-
   var _super = _createSuper(CollaboratorItemFormatter);
-
   function CollaboratorItemFormatter(_props) {
     var _this;
-
     _classCallCheck(this, CollaboratorItemFormatter);
-
     _this = _super.call(this, _props);
-
     _this.calculateCollaboratorData = function (props) {
       var _this$props = _this.props,
-          context = _this$props.context,
-          collaborators = _this$props.collaborators;
+        context = _this$props.context,
+        collaborators = _this$props.collaborators;
       var cellValue = props.cellValue;
-
       if (!cellValue) {
         _this.setState({
           isDataLoaded: true,
           collaborator: null
         });
-
         return;
       }
-
       _this.setState({
         isDataLoaded: false,
         collaborator: null
       });
-
       var collaborator = collaborators && collaborators.find(function (c) {
         return c.name === cellValue;
       });
-
       if (collaborator) {
         _this.setState({
           isDataLoaded: true,
           collaborator: collaborator
         });
-
         return;
       }
-
       if (!context) return;
       var mediaUrl = context.getSetting('mediaUrl');
       var defaultAvatarUrl = "".concat(mediaUrl, "/avatars/default.png");
-
       if (cellValue === 'anonymous') {
         collaborator = {
           name: 'anonymous',
           avatar_url: defaultAvatarUrl
         };
-
         _this.setState({
           isDataLoaded: true,
           collaborator: collaborator
         });
-
         return;
       }
-
       var collaboratorsCache = context.getSetting('collaboratorsCache');
       collaborator = collaboratorsCache[cellValue];
-
       if (collaborator) {
         _this.setState({
           isDataLoaded: true,
           collaborator: collaborator
         });
-
         return;
       }
-
       if (!isValidEmail(cellValue)) {
         collaborator = {
           name: cellValue,
           avatar_url: defaultAvatarUrl
         };
         collaboratorsCache[cellValue] = collaborator;
-
         _this.setState({
           isDataLoaded: true,
           collaborator: collaborator
         });
-
         return;
       }
-
       _this.props.context.getUserCommonInfo(cellValue).then(function (res) {
         collaborator = res.data;
         collaboratorsCache[cellValue] = collaborator;
-
         _this.setState({
           isDataLoaded: true,
           collaborator: collaborator
@@ -110,21 +86,18 @@ var CollaboratorItemFormatter = /*#__PURE__*/function (_Component) {
           avatar_url: defaultAvatarUrl
         };
         collaboratorsCache[cellValue] = collaborator;
-
         _this.setState({
           isDataLoaded: true,
           collaborator: collaborator
         });
       });
     };
-
     _this.state = {
       isDataLoaded: false,
       collaborator: null
     };
     return _this;
   }
-
   _createClass(CollaboratorItemFormatter, [{
     key: "componentDidMount",
     value: function componentDidMount() {
@@ -140,21 +113,17 @@ var CollaboratorItemFormatter = /*#__PURE__*/function (_Component) {
     value: function render() {
       var cellValue = this.props.cellValue;
       var _this$state = this.state,
-          collaborator = _this$state.collaborator,
-          isDataLoaded = _this$state.isDataLoaded;
-
+        collaborator = _this$state.collaborator,
+        isDataLoaded = _this$state.isDataLoaded;
       if (!isDataLoaded || !cellValue || !collaborator) {
         return this.props.renderEmpty();
       }
-
       return /*#__PURE__*/React.createElement(CollaboratorItem, {
         collaborator: collaborator,
         enableDeleteCollaborator: false
       });
     }
   }]);
-
   return CollaboratorItemFormatter;
 }(Component);
-
 export { CollaboratorItemFormatter as default };

package/lib/RowExpandLinkFormatter/index.js

@@ -10,47 +10,36 @@ import CollaboratorItemFormatter from './collaborator-item-formatter';
 import { getFormulaArrayValue, isArrayFormatColumn } from './utils';
 import { getCellDisplayValue } from './value-display-utils';
 import './index.css';
-
 var RowExpandLinkFormatter = /*#__PURE__*/function (_Component) {
   _inherits(RowExpandLinkFormatter, _Component);
-
   var _super = _createSuper(RowExpandLinkFormatter);
-
   function RowExpandLinkFormatter() {
     _classCallCheck(this, RowExpandLinkFormatter);
-
     return _super.apply(this, arguments);
   }
-
   _createClass(RowExpandLinkFormatter, [{
     key: "render",
     value: function render() {
       var props = this.props;
       var column = props.column,
-          value = props.value,
-          containerClassName = props.containerClassName,
-          collaborators = props.collaborators;
+        value = props.value,
+        containerClassName = props.containerClassName,
+        collaborators = props.collaborators;
       var data = column.data;
-
       if (!Array.isArray(value) || value.length === 0) {
         return props.renderEmpty();
       }
-
       var _ref = data || {},
-          displayColumn = _ref.display_column;
-
+        displayColumn = _ref.display_column;
       if (!displayColumn) {
         return props.renderEmpty();
       }
-
       var displayColumnType = displayColumn.type,
-          displayColumnData = displayColumn.data;
+        displayColumnData = displayColumn.data;
       var cellValue = getFormulaArrayValue(value, !isArrayFormatColumn(displayColumnType));
-
       if (!Array.isArray(cellValue) || cellValue.length === 0) {
         return props.renderEmpty();
       }
-
       switch (displayColumnType) {
         case CellType.TEXT:
         case CellType.AUTO_NUMBER:
@@ -69,17 +58,14 @@ var RowExpandLinkFormatter = /*#__PURE__*/function (_Component) {
               }, value);
             }));
           }
-
         case CellType.DATE:
           {
             return /*#__PURE__*/React.createElement("div", {
               className: containerClassName
             }, cellValue.map(function (value, index) {
               if (!value || typeof value !== 'string') return null;
-
               var _ref2 = displayColumnData || {},
-                  format = _ref2.format;
-
+                format = _ref2.format;
               return /*#__PURE__*/React.createElement(DateFormatter, {
                 key: "link-".concat(displayColumnType, "-").concat(index),
                 value: value,
@@ -88,7 +74,6 @@ var RowExpandLinkFormatter = /*#__PURE__*/function (_Component) {
               });
             }));
           }
-
         case CellType.CTIME:
           {
             return /*#__PURE__*/React.createElement("div", {
@@ -102,7 +87,6 @@ var RowExpandLinkFormatter = /*#__PURE__*/function (_Component) {
               });
             }));
           }
-
         case CellType.MTIME:
           {
             return /*#__PURE__*/React.createElement("div", {
@@ -116,7 +100,6 @@ var RowExpandLinkFormatter = /*#__PURE__*/function (_Component) {
               });
             }));
           }
-
         case CellType.CREATOR:
         case CellType.LAST_MODIFIER:
           {
@@ -133,7 +116,6 @@ var RowExpandLinkFormatter = /*#__PURE__*/function (_Component) {
               });
             }));
           }
-
         case CellType.SINGLE_SELECT:
           {
             var options = displayColumnData && Array.isArray(displayColumnData.options) ? displayColumnData.options : [];
@@ -142,7 +124,6 @@ var RowExpandLinkFormatter = /*#__PURE__*/function (_Component) {
               options: options || []
             });
           }
-
         case CellType.FORMULA:
           {
             return /*#__PURE__*/React.createElement("div", {
@@ -155,7 +136,6 @@ var RowExpandLinkFormatter = /*#__PURE__*/function (_Component) {
               }, getCellDisplayValue(_defineProperty({}, displayColumn.key, value), displayColumn, collaborators));
             }));
           }
-
         default:
           {
             return props.renderEmpty();
@@ -163,8 +143,6 @@ var RowExpandLinkFormatter = /*#__PURE__*/function (_Component) {
       }
     }
   }]);
-
   return RowExpandLinkFormatter;
 }(Component);
-
 export { RowExpandLinkFormatter as default };

package/lib/RowExpandLinkFormatter/utils.js

@@ -15,7 +15,6 @@ export var getFormulaArrayValue = function getFormulaArrayValue(value) {
     if (Object.prototype.toString.call(item) !== '[object Object]') {
       return item;
     }
-
     if (!Object.prototype.hasOwnProperty.call(item, 'display_value')) return item;
     var display_value = item.display_value;
     if (!Array.isArray(display_value) || display_value.length === 0) return display_value;
@@ -25,7 +24,6 @@ export var getFormulaArrayValue = function getFormulaArrayValue(value) {
         var _display_value = i.display_value;
         return _display_value;
       }
-
       return i;
     });
   }).flat().filter(function (item) {
@@ -38,7 +36,6 @@ export var getTwoDimensionArrayValue = function getTwoDimensionArrayValue(value)
     if (Object.prototype.toString.call(item) !== '[object Object]') {
       return item;
     }
-
     if (!Object.prototype.hasOwnProperty.call(item, 'display_value')) return item;
     var display_value = item.display_value;
     if (!Array.isArray(display_value) || display_value.length === 0) return display_value;
@@ -48,7 +45,6 @@ export var getTwoDimensionArrayValue = function getTwoDimensionArrayValue(value)
         var _display_value2 = i.display_value;
         return _display_value2;
       }
-
       return i;
     });
   });

package/lib/RowExpandLinkFormatter/value-display-utils.js

@@ -3,8 +3,8 @@ var DOWNLOAD_NAME_COLUMN_TYPES = [CellType.TEXT, CellType.NUMBER, CellType.DATE,
 export var getCellDisplayValue = function getCellDisplayValue(record, column, collaborators) {
   if (!column || !DOWNLOAD_NAME_COLUMN_TYPES.includes(column.type)) return '';
   var key = column.key,
-      type = column.type,
-      data = column.data;
+    type = column.type,
+    data = column.data;
   return getCellValueDisplayString(record, type, key, {
     data: data,
     collaborators: collaborators,

package/lib/RowExpandRateFormatter/index.js

@@ -5,38 +5,28 @@ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
 import classnames from 'classnames';
 import './index.css';
-
 var RateExpendRateFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(RateExpendRateFormatter, _React$Component);
-
   var _super = _createSuper(RateExpendRateFormatter);
-
   function RateExpendRateFormatter() {
     var _this;
-
     _classCallCheck(this, RateExpendRateFormatter);
-
     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.getRateList = function () {
       var _this$props = _this.props,
-          data = _this$props.data,
-          value = _this$props.value;
-
+        data = _this$props.data,
+        value = _this$props.value;
       var _ref = data || {},
-          _ref$rate_max_number = _ref.rate_max_number,
-          rate_max_number = _ref$rate_max_number === void 0 ? 5 : _ref$rate_max_number,
-          _ref$rate_style_color = _ref.rate_style_color,
-          rate_style_color = _ref$rate_style_color === void 0 ? '#e5e5e5' : _ref$rate_style_color,
-          _ref$rate_style_type = _ref.rate_style_type,
-          rate_style_type = _ref$rate_style_type === void 0 ? 'dtable-icon-rate' : _ref$rate_style_type;
-
+        _ref$rate_max_number = _ref.rate_max_number,
+        rate_max_number = _ref$rate_max_number === void 0 ? 5 : _ref$rate_max_number,
+        _ref$rate_style_color = _ref.rate_style_color,
+        rate_style_color = _ref$rate_style_color === void 0 ? '#e5e5e5' : _ref$rate_style_color,
+        _ref$rate_style_type = _ref.rate_style_type,
+        rate_style_type = _ref$rate_style_type === void 0 ? 'dtable-icon-rate' : _ref$rate_style_type;
       var rateList = [];
-
       for (var i = 0; i < rate_max_number; i++) {
         var style = {
           color: value >= i + 1 ? rate_style_color : '#e5e5e5'
@@ -47,13 +37,10 @@ var RateExpendRateFormatter = /*#__PURE__*/function (_React$Component) {
           style: style
         }));
       }
-
       return rateList;
     };
-
     return _this;
   }
-
   _createClass(RateExpendRateFormatter, [{
     key: "render",
     value: function render() {
@@ -65,10 +52,8 @@ var RateExpendRateFormatter = /*#__PURE__*/function (_React$Component) {
       }, rateList);
     }
   }]);
-
   return RateExpendRateFormatter;
 }(React.Component);
-
 RateExpendRateFormatter.defaultProps = {
   value: '',
   containerClassName: ''

package/lib/RowExpandUrlFormatter/index.js

@@ -7,28 +7,20 @@ import classnames from 'classnames';
 import toaster from '../toaster';
 import { isValidUrl, getTrimmedString } from '../utils/editor-utils';
 import './index.css';
-
 var UrlFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(UrlFormatter, _React$Component);
-
   var _super = _createSuper(UrlFormatter);
-
   function UrlFormatter() {
     var _this;
-
     _classCallCheck(this, UrlFormatter);
-
     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.onOpenUrlLink = function () {
       var value = _this.props.value;
       var url = getTrimmedString(value);
       var validUrl = isValidUrl(url) ? url : "http://".concat(url);
-
       try {
         var a = document.createElement('a');
         document.body.appendChild(a);
@@ -41,16 +33,14 @@ var UrlFormatter = /*#__PURE__*/function (_React$Component) {
         toaster.danger('The url is invalid');
       }
     };
-
     return _this;
   }
-
   _createClass(UrlFormatter, [{
     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 url-formatter', containerClassName);
       return /*#__PURE__*/React.createElement("div", {
         className: classname
@@ -62,8 +52,6 @@ var UrlFormatter = /*#__PURE__*/function (_React$Component) {
       }));
     }
   }]);
-
   return UrlFormatter;
 }(React.Component);
-
 export default UrlFormatter;

package/lib/SelectItem/index.js

@@ -3,23 +3,16 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
-
 var SelectItem = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(SelectItem, _React$PureComponent);
-
   var _super = _createSuper(SelectItem);
-
   function SelectItem() {
     var _this;
-
     _classCallCheck(this, SelectItem);
-
     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.getStyle = function (option, fontSize) {
       return {
         display: 'inline-block',
@@ -35,16 +28,14 @@ var SelectItem = /*#__PURE__*/function (_React$PureComponent) {
         color: option.textColor || null
       };
     };
-
     return _this;
   }
-
   _createClass(SelectItem, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          option = _this$props.option,
-          fontSize = _this$props.fontSize;
+        option = _this$props.option,
+        fontSize = _this$props.fontSize;
       var style = this.getStyle(option, fontSize);
       return /*#__PURE__*/React.createElement("div", {
         className: "dtable-ui select-item text-truncate",
@@ -53,8 +44,6 @@ var SelectItem = /*#__PURE__*/function (_React$PureComponent) {
       }, option.name);
     }
   }]);
-
   return SelectItem;
 }(React.PureComponent);
-
 export { SelectItem as default };