dtable-ui-component 0.1.42 → 0.1.46

package/es/components/cell-formatter/creator-formatter.js

@@ -4,14 +4,14 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
 import cn from 'astro-classname';
-import ColloboratorItem from '../common/collaborator-item';
+import CollaboratorItem from '../common/collaborator-item';
 import DefaultAvatar from '../../assets/images/avatar/default_avatar.png';
 
 // there will be there conditions
 // 1 value is not exist, typeof value is array, but it's length is 0
 // 2 value is exist, but can't find in collaborators
 // 3 value is exist, typeof value is a string
-// 4 vlaue is exist, typeof value is array
+// 4 value is exist, typeof value is array
 var CreatorFormatter = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(CreatorFormatter, _React$PureComponent);
 
@@ -50,7 +50,7 @@ var CreatorFormatter = /*#__PURE__*/function (_React$PureComponent) {
         }
 
         ;
-        return /*#__PURE__*/React.createElement(ColloboratorItem, {
+        return /*#__PURE__*/React.createElement(CollaboratorItem, {
           key: index,
           collaborator: collaborator
         });

package/es/components/cell-formatter/formula-formatter.js

@@ -13,7 +13,6 @@ import { isFunction } from '../../utils/utils';
 import TextFormatter from './text-formatter';
 var SIMPLE_CELL_FORMATTER_COLUMNS = [CellTypes.TEXT, CellTypes.NUMBER, CellTypes.DATE, CellTypes.CTIME, CellTypes.MTIME, CellTypes.GEOLOCATION, CellTypes.AUTO_NUMBER, CellTypes.URL, CellTypes.EMAIL, CellTypes.DURATION];
 var ARRAY_FORMAL_COLUMNS = [CellTypes.IMAGE, CellTypes.FILE, CellTypes.MULTIPLE_SELECT, CellTypes.COLLABORATOR];
-var FORMULA_COLUMN_TYPES = [CellTypes.FORMULA, CellTypes.LINK_FORMULA];
 
 var FormulaFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(FormulaFormatter, _React$Component);
@@ -70,6 +69,19 @@ var FormulaFormatter = /*#__PURE__*/function (_React$Component) {
           {
             formatterProps.column = column;
             Formatter = FormulaFormatter;
+            break;
+          }
+
+        case CellTypes.CREATOR:
+        case CellTypes.LAST_MODIFIER:
+          {
+            formatterProps.collaborators = collaborators;
+            break;
+          }
+
+        default:
+          {
+            break;
           }
       }
 
@@ -101,12 +113,7 @@ var FormulaFormatter = /*#__PURE__*/function (_React$Component) {
         return column.key === display_column_key;
       });
       if (!linkedColumn) return null;
-      var linkedColumnType = linkedColumn.type,
-          linkedColumnData = linkedColumn.data;
-
-      if (FORMULA_COLUMN_TYPES.includes(linkedColumnType) && linkedColumnData && linkedColumnData.result_type === FORMULA_RESULT_TYPE.COLUMN) {
-        return null;
-      }
+      var linkedColumnType = linkedColumn.type;
 
       if (!ARRAY_FORMAL_COLUMNS.includes(linkedColumnType) && Object.prototype.toString.call(value) === '[object Array]') {
         var contentItemClassName = cn('formula-formatter-content-item', {
@@ -152,7 +159,6 @@ var FormulaFormatter = /*#__PURE__*/function (_React$Component) {
           containerClassName = _this$props2.containerClassName,
           column = _this$props2.column;
       var columnData = column.data;
-      if (!columnData) return null;
       var resultType = columnData.result_type;
 
       if (resultType === FORMULA_RESULT_TYPE.COLUMN) {

package/es/components/cell-formatter/geolocation-formatter.js

@@ -4,6 +4,7 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
 import cn from 'astro-classname';
+import { getGeolocationDisplayString } from '../../utils/value-format-utils';
 
 var GeolocationFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(GeolocationFormatter, _React$Component);
@@ -21,16 +22,17 @@ var GeolocationFormatter = /*#__PURE__*/function (_React$Component) {
     value: function render() {
       var _this$props = this.props,
           value = _this$props.value,
+          data = _this$props.data,
           containerClassName = _this$props.containerClassName;
-      var classname = cn('dtable-ui cell-formatter-container geolocation-formatter', containerClassName);
+      var className = cn('dtable-ui cell-formatter-container geolocation-formatter', containerClassName);
 
       if (typeof value !== 'object') {
         return null;
       }
 
       return /*#__PURE__*/React.createElement("div", {
-        className: classname
-      }, "".concat(value.province || '', " ").concat(value.city || '', " ").concat(value.district || '', " ").concat(value.detail || ''));
+        className: className
+      }, getGeolocationDisplayString(value, data));
     }
   }]);
 
@@ -44,6 +46,7 @@ GeolocationFormatter.defaultProps = {
     district: '',
     detail: ''
   },
+  data: {},
   containerClassName: ''
 };
 export default GeolocationFormatter;

package/es/components/cell-formatter/index.js

@@ -23,4 +23,5 @@ export { default as DurationFormatter } from './duration-formatter';
 export { default as RateFormatter } from './rate-formatter';
 export { default as ButtonFormatter } from './button-formatter';
 export { default as FileItemFormatter } from './widgets/file-item-formatter';
-export { default as ImagePreviewerLightbox } from './widgets/image-previewer-lightbox';
+export { default as ImagePreviewerLightbox } from './widgets/image-previewer-lightbox';
+export { default as CollaboratorItem } from '../common/collaborator-item';

package/es/components/cell-formatter/multiple-select-formatter.js

@@ -26,16 +26,17 @@ var MultipleSelectFormatter = /*#__PURE__*/function (_React$PureComponent) {
       var _this$props = _this.props,
           value = _this$props.value,
           options = _this$props.options;
-      if (!Array.isArray(value)) return [];
-      var selectedOptions = options.filter(function (option) {
-        return value.includes(option.id);
-      });
-      if (selectedOptions.length === 0) return [];
-      return selectedOptions.map(function (option) {
-        return /*#__PURE__*/React.createElement(SelectItem, {
-          key: option.id,
-          option: option
+      return value.map(function (item) {
+        var option = options.find(function (option) {
+          return option.id === item || option.name === item;
         });
+
+        if (option) {
+          return /*#__PURE__*/React.createElement(SelectItem, {
+            key: item,
+            option: option
+          });
+        }
       });
     };
 

package/es/index.js

@@ -1,5 +1,5 @@
 export { setLocale } from './lang';
 export { formatDateToString, formatNumberToString, formatStringToNumber, formatNumberString } from './utils/value-format-utils';
 export { default as Loading } from './components/loading';
-export { TextFormatter, NumberFormatter, CheckboxFormatter, DateFormatter, SingleSelectFormatter, MultipleSelectFormatter, CollaboratorFormatter, ImageFormatter, FileFormatter, LongTextFormatter, GeolocationFormatter, LinkFormatter, FormulaFormatter, CTimeFormatter, CreatorFormatter, LastModifierFormatter, MTimeFormatter, AutoNumberFormatter, UrlFormatter, EmailFormatter, DurationFormatter, RateFormatter, ButtonFormatter, FileItemFormatter, ImagePreviewerLightbox } from './components/cell-formatter';
+export { TextFormatter, NumberFormatter, CheckboxFormatter, DateFormatter, SingleSelectFormatter, MultipleSelectFormatter, CollaboratorFormatter, ImageFormatter, FileFormatter, LongTextFormatter, GeolocationFormatter, LinkFormatter, FormulaFormatter, CTimeFormatter, CreatorFormatter, LastModifierFormatter, MTimeFormatter, AutoNumberFormatter, UrlFormatter, EmailFormatter, DurationFormatter, RateFormatter, ButtonFormatter, FileItemFormatter, ImagePreviewerLightbox, CollaboratorItem } from './components/cell-formatter';
 export { TextEditor, NumberEditor, CheckboxEditor, SingleSelectEdtior, CollaboratorEditor, DateEditor, LinkEditor } from './components/cell-editor';

package/es/utils/value-format-utils.js

@@ -278,4 +278,38 @@ var getDurationDecimalSuffix = function getDurationDecimalSuffix(duration_format
   }
 
   return '';
+};
+
+export var getGeolocationDisplayString = function getGeolocationDisplayString(value, columnData) {
+  var _ref3 = columnData || {},
+      geo_format = _ref3.geo_format;
+
+  var cellValue = value || {};
+
+  if (!value) {
+    return null;
+  }
+
+  if (geo_format === 'lng_lat' && value.lng && value.lat) {
+    return "".concat(cellValue.lng, ", ").concat(cellValue.lat);
+  }
+
+  if (geo_format === 'country_region' && cellValue.country_region) {
+    return value.country_region || '';
+  }
+
+  var province = cellValue.province,
+      city = cellValue.city,
+      district = cellValue.district,
+      detail = cellValue.detail;
+
+  if (geo_format === 'province') {
+    return "".concat(province || '');
+  }
+
+  if (geo_format === 'province_city') {
+    return "".concat(province || '').concat(city || '');
+  }
+
+  return "".concat(province || '').concat(city || '').concat(district || '').concat(detail || '');
 };

package/lib/components/cell-formatter/creator-formatter.js

@@ -34,7 +34,7 @@ var propTypes = {
 // 1 value is not exist, typeof value is array, but it's length is 0
 // 2 value is exist, but can't find in collaborators
 // 3 value is exist, typeof value is a string
-// 4 vlaue is exist, typeof value is array
+// 4 value is exist, typeof value is array
 
 var CreatorFormatter = /*#__PURE__*/function (_React$PureComponent) {
   (0, _inheritsLoose2.default)(CreatorFormatter, _React$PureComponent);

package/lib/components/cell-formatter/formula-formatter.js

@@ -39,7 +39,6 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 var SIMPLE_CELL_FORMATTER_COLUMNS = [CellTypes.TEXT, CellTypes.NUMBER, CellTypes.DATE, CellTypes.CTIME, CellTypes.MTIME, CellTypes.GEOLOCATION, CellTypes.AUTO_NUMBER, CellTypes.URL, CellTypes.EMAIL, CellTypes.DURATION];
 var ARRAY_FORMAL_COLUMNS = [CellTypes.IMAGE, CellTypes.FILE, CellTypes.MULTIPLE_SELECT, CellTypes.COLLABORATOR];
-var FORMULA_COLUMN_TYPES = [CellTypes.FORMULA, CellTypes.LINK_FORMULA];
 var propTypes = {
   value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number, _propTypes.default.object, _propTypes.default.bool]),
   column: _propTypes.default.Object,
@@ -99,6 +98,19 @@ var FormulaFormatter = /*#__PURE__*/function (_React$Component) {
           {
             formatterProps.column = column;
             Formatter = FormulaFormatter;
+            break;
+          }
+
+        case CellTypes.CREATOR:
+        case CellTypes.LAST_MODIFIER:
+          {
+            formatterProps.collaborators = collaborators;
+            break;
+          }
+
+        default:
+          {
+            break;
           }
       }
 
@@ -129,12 +141,7 @@ var FormulaFormatter = /*#__PURE__*/function (_React$Component) {
         return column.key === display_column_key;
       });
       if (!linkedColumn) return null;
-      var linkedColumnType = linkedColumn.type,
-          linkedColumnData = linkedColumn.data;
-
-      if (FORMULA_COLUMN_TYPES.includes(linkedColumnType) && linkedColumnData && linkedColumnData.result_type === _constants.FORMULA_RESULT_TYPE.COLUMN) {
-        return null;
-      }
+      var linkedColumnType = linkedColumn.type;
 
       if (!ARRAY_FORMAL_COLUMNS.includes(linkedColumnType) && Object.prototype.toString.call(value) === '[object Array]') {
         var contentItemClassName = (0, _astroClassname.default)('formula-formatter-content-item', {
@@ -178,7 +185,6 @@ var FormulaFormatter = /*#__PURE__*/function (_React$Component) {
         containerClassName = _this$props2.containerClassName,
         column = _this$props2.column;
     var columnData = column.data;
-    if (!columnData) return null;
     var resultType = columnData.result_type;
 
     if (resultType === _constants.FORMULA_RESULT_TYPE.COLUMN) {

package/lib/components/cell-formatter/geolocation-formatter.js

@@ -15,8 +15,11 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _astroClassname = _interopRequireDefault(require("astro-classname"));
 
+var _valueFormatUtils = require("../../utils/value-format-utils");
+
 var propTypes = {
   value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
+  data: _propTypes.default.object,
   containerClassName: _propTypes.default.string
 };
 
@@ -32,16 +35,17 @@ var GeolocationFormatter = /*#__PURE__*/function (_React$Component) {
   _proto.render = function render() {
     var _this$props = this.props,
         value = _this$props.value,
+        data = _this$props.data,
         containerClassName = _this$props.containerClassName;
-    var classname = (0, _astroClassname.default)('dtable-ui cell-formatter-container geolocation-formatter', containerClassName);
+    var className = (0, _astroClassname.default)('dtable-ui cell-formatter-container geolocation-formatter', containerClassName);
 
     if (typeof value !== 'object') {
       return null;
     }
 
     return /*#__PURE__*/_react.default.createElement("div", {
-      className: classname
-    }, (value.province || '') + " " + (value.city || '') + " " + (value.district || '') + " " + (value.detail || ''));
+      className: className
+    }, (0, _valueFormatUtils.getGeolocationDisplayString)(value, data));
   };
 
   return GeolocationFormatter;
@@ -54,6 +58,7 @@ var GeolocationFormatter = /*#__PURE__*/function (_React$Component) {
     district: '',
     detail: ''
   },
+  data: {},
   containerClassName: ''
 });
 GeolocationFormatter.propTypes = propTypes;

package/lib/components/cell-formatter/index.js

@@ -3,7 +3,7 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 exports.__esModule = true;
-exports.ImagePreviewerLightbox = exports.FileItemFormatter = exports.ButtonFormatter = exports.RateFormatter = exports.DurationFormatter = exports.EmailFormatter = exports.UrlFormatter = exports.AutoNumberFormatter = exports.LinkFormatter = exports.FormulaFormatter = exports.MTimeFormatter = exports.LastModifierFormatter = exports.CreatorFormatter = exports.CTimeFormatter = exports.GeolocationFormatter = exports.ImageFormatter = exports.FileFormatter = exports.LongTextFormatter = exports.MultipleSelectFormatter = exports.SingleSelectFormatter = exports.CollaboratorFormatter = exports.CheckboxFormatter = exports.DateFormatter = exports.NumberFormatter = exports.TextFormatter = void 0;
+exports.CollaboratorItem = exports.ImagePreviewerLightbox = exports.FileItemFormatter = exports.ButtonFormatter = exports.RateFormatter = exports.DurationFormatter = exports.EmailFormatter = exports.UrlFormatter = exports.AutoNumberFormatter = exports.LinkFormatter = exports.FormulaFormatter = exports.MTimeFormatter = exports.LastModifierFormatter = exports.CreatorFormatter = exports.CTimeFormatter = exports.GeolocationFormatter = exports.ImageFormatter = exports.FileFormatter = exports.LongTextFormatter = exports.MultipleSelectFormatter = exports.SingleSelectFormatter = exports.CollaboratorFormatter = exports.CheckboxFormatter = exports.DateFormatter = exports.NumberFormatter = exports.TextFormatter = void 0;
 
 require("../../css/cell-formatter.css");
 
@@ -105,4 +105,8 @@ exports.FileItemFormatter = _fileItemFormatter.default;
 
 var _imagePreviewerLightbox = _interopRequireDefault(require("./widgets/image-previewer-lightbox"));
 
-exports.ImagePreviewerLightbox = _imagePreviewerLightbox.default;
+exports.ImagePreviewerLightbox = _imagePreviewerLightbox.default;
+
+var _collaboratorItem = _interopRequireDefault(require("../common/collaborator-item"));
+
+exports.CollaboratorItem = _collaboratorItem.default;

package/lib/components/cell-formatter/multiple-select-formatter.js

@@ -41,16 +41,17 @@ var MultipleSelectFormatter = /*#__PURE__*/function (_React$PureComponent) {
       var _this$props = _this.props,
           value = _this$props.value,
           options = _this$props.options;
-      if (!Array.isArray(value)) return [];
-      var selectedOptions = options.filter(function (option) {
-        return value.includes(option.id);
-      });
-      if (selectedOptions.length === 0) return [];
-      return selectedOptions.map(function (option) {
-        return /*#__PURE__*/_react.default.createElement(_selectItem.default, {
-          key: option.id,
-          option: option
+      return value.map(function (item) {
+        var option = options.find(function (option) {
+          return option.id === item || option.name === item;
         });
+
+        if (option) {
+          return /*#__PURE__*/_react.default.createElement(_selectItem.default, {
+            key: item,
+            option: option
+          });
+        }
       });
     });
     return _this;

package/lib/index.js

@@ -3,7 +3,7 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 exports.__esModule = true;
-exports.LinkEditor = exports.DateEditor = exports.CollaboratorEditor = exports.SingleSelectEdtior = exports.CheckboxEditor = exports.NumberEditor = exports.TextEditor = exports.ImagePreviewerLightbox = exports.FileItemFormatter = exports.ButtonFormatter = exports.RateFormatter = exports.DurationFormatter = exports.EmailFormatter = exports.UrlFormatter = exports.AutoNumberFormatter = exports.MTimeFormatter = exports.LastModifierFormatter = exports.CreatorFormatter = exports.CTimeFormatter = exports.FormulaFormatter = exports.LinkFormatter = exports.GeolocationFormatter = exports.LongTextFormatter = exports.FileFormatter = exports.ImageFormatter = exports.CollaboratorFormatter = exports.MultipleSelectFormatter = exports.SingleSelectFormatter = exports.DateFormatter = exports.CheckboxFormatter = exports.NumberFormatter = exports.TextFormatter = exports.Loading = exports.formatNumberString = exports.formatStringToNumber = exports.formatNumberToString = exports.formatDateToString = exports.setLocale = void 0;
+exports.LinkEditor = exports.DateEditor = exports.CollaboratorEditor = exports.SingleSelectEdtior = exports.CheckboxEditor = exports.NumberEditor = exports.TextEditor = exports.CollaboratorItem = exports.ImagePreviewerLightbox = exports.FileItemFormatter = exports.ButtonFormatter = exports.RateFormatter = exports.DurationFormatter = exports.EmailFormatter = exports.UrlFormatter = exports.AutoNumberFormatter = exports.MTimeFormatter = exports.LastModifierFormatter = exports.CreatorFormatter = exports.CTimeFormatter = exports.FormulaFormatter = exports.LinkFormatter = exports.GeolocationFormatter = exports.LongTextFormatter = exports.FileFormatter = exports.ImageFormatter = exports.CollaboratorFormatter = exports.MultipleSelectFormatter = exports.SingleSelectFormatter = exports.DateFormatter = exports.CheckboxFormatter = exports.NumberFormatter = exports.TextFormatter = exports.Loading = exports.formatNumberString = exports.formatStringToNumber = exports.formatNumberToString = exports.formatDateToString = exports.setLocale = void 0;
 
 var _lang = require("./lang");
 
@@ -47,6 +47,7 @@ exports.RateFormatter = _cellFormatter.RateFormatter;
 exports.ButtonFormatter = _cellFormatter.ButtonFormatter;
 exports.FileItemFormatter = _cellFormatter.FileItemFormatter;
 exports.ImagePreviewerLightbox = _cellFormatter.ImagePreviewerLightbox;
+exports.CollaboratorItem = _cellFormatter.CollaboratorItem;
 
 var _cellEditor = require("./components/cell-editor");
 

package/lib/utils/value-format-utils.js

@@ -3,7 +3,7 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 exports.__esModule = true;
-exports.getDurationDisplayString = exports.formatDateToString = exports.formatNumberString = exports.formatStringToNumber = exports.formatNumberToString = void 0;
+exports.getGeolocationDisplayString = exports.getDurationDisplayString = exports.formatDateToString = exports.formatNumberString = exports.formatStringToNumber = exports.formatNumberToString = void 0;
 
 var _moment = _interopRequireDefault(require("moment"));
 
@@ -303,4 +303,40 @@ var getDurationDecimalSuffix = function getDurationDecimalSuffix(duration_format
   }
 
   return '';
-};
+};
+
+var getGeolocationDisplayString = function getGeolocationDisplayString(value, columnData) {
+  var _ref3 = columnData || {},
+      geo_format = _ref3.geo_format;
+
+  var cellValue = value || {};
+
+  if (!value) {
+    return null;
+  }
+
+  if (geo_format === 'lng_lat' && value.lng && value.lat) {
+    return cellValue.lng + ", " + cellValue.lat;
+  }
+
+  if (geo_format === 'country_region' && cellValue.country_region) {
+    return value.country_region || '';
+  }
+
+  var province = cellValue.province,
+      city = cellValue.city,
+      district = cellValue.district,
+      detail = cellValue.detail;
+
+  if (geo_format === 'province') {
+    return "" + (province || '');
+  }
+
+  if (geo_format === 'province_city') {
+    return "" + (province || '') + (city || '');
+  }
+
+  return "" + (province || '') + (city || '') + (district || '') + (detail || '');
+};
+
+exports.getGeolocationDisplayString = getGeolocationDisplayString;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtable-ui-component",
-  "version": "0.1.42",
+  "version": "0.1.46",
   "main": "./es/index.js",
   "dependencies": {
     "@seafile/seafile-calendar": "0.0.15",