dtable-ui-component 0.1.73 → 0.1.75-beta2

package/assets/dtable-font.css

@@ -1,11 +1,11 @@
 @font-face {
   font-family: "dtable-font"; /* Project id 1206632 */
-  src: url('./dtable-fonts/dtable-font.eot?t=1631248254616'); /* IE9 */
-  src: url('./dtable-fonts/dtable-font.eot?t=1631248254616#iefix') format('embedded-opentype'), /* IE6-IE8 */
-       url('./dtable-fonts/dtable-font.woff2?t=1631248254616') format('woff2'),
-       url('./dtable-fonts/dtable-font.woff?t=1631248254616') format('woff'),
-       url('./dtable-fonts/dtable-font.ttf?t=1631248254616') format('truetype'),
-       url('./dtable-fonts/dtable-font.svg?t=1631248254616#dtable-font') format('svg');
+  src: url('./dtable-font/dtable-font.eot?t=1631248254616'); /* IE9 */
+  src: url('./dtable-font/dtable-font.eot?t=1631248254616#iefix') format('embedded-opentype'), /* IE6-IE8 */
+       url('./dtable-font/dtable-font.woff2?t=1631248254616') format('woff2'),
+       url('./dtable-font/dtable-font.woff?t=1631248254616') format('woff'),
+       url('./dtable-font/dtable-font.ttf?t=1631248254616') format('truetype'),
+       url('./dtable-font/dtable-font.svg?t=1631248254616#dtable-font') format('svg');
 }
 
 .dtable-font {

package/lib/AutoNumberFormatter/index.css

@@ -0,0 +1 @@
+@import url('../css/cell-formatter.css');

package/{es/components/cell-formatter/auto-number-formatter.js → lib/AutoNumberFormatter/index.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 './index.css';
 
 var AutoNumberFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(AutoNumberFormatter, _React$Component);

package/lib/ButtonFormatter/index.css

@@ -0,0 +1,13 @@
+@import url('../css/cell-formatter.css');
+
+.dtable-ui.button-formatter {
+  height: 26px;
+  width: 80px;
+  padding: 5px 8px;
+  border-width: 1px;
+  border-style: solid;
+  border-radius: 3px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}

package/{es/components/cell-formatter/button-formatter.js → lib/ButtonFormatter/index.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 './index.css';
 
 var ButtonFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(ButtonFormatter, _React$Component);

package/lib/CTimeFormatter/index.css

@@ -0,0 +1 @@
+@import url('../css/cell-formatter.css');

package/{es/components/cell-formatter/ctime-formatter.js → lib/CTimeFormatter/index.js}

@@ -5,6 +5,7 @@ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
 import cn from 'astro-classname';
 import moment from 'moment';
+import './index.css';
 
 var CTimeFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(CTimeFormatter, _React$Component);

package/lib/CheckboxFormatter/index.css

@@ -0,0 +1 @@
+@import url('../css/cell-formatter.css');

package/{es/components/cell-formatter/checkbox-formatter.js → lib/CheckboxFormatter/index.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 './index.css';
 
 var CheckboxFormatter = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(CheckboxFormatter, _React$PureComponent);

package/lib/CollaboratorFormatter/index.css

@@ -0,0 +1 @@
+@import url('../css/cell-formatter.css');

package/{es/components/cell-formatter/collaborator-formatter.js → lib/CollaboratorFormatter/index.js}

@@ -4,8 +4,9 @@ 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 CollaboratorItem from '../common/collaborator-item';
-import DefaultAvatar from '../../assets/images/avatar/default_avatar.png';
+import CollaboratorItem from '../CollaboratorItem';
+import DefaultAvatar from '../assets/images/avatar/default_avatar.png';
+import './index.css';
 
 // there will be there conditions
 // 1 value is not exist, typeof value is array, but it's length is 0

package/lib/CollaboratorItem/index.css

@@ -0,0 +1,49 @@
+.dtable-ui.collaborator-item {
+  display: inline-flex;
+  align-items: center;
+  margin-right: 10px;
+  padding: 0 8px 0 2px;
+  height: 20px;
+  font-size: 13px;
+  border-radius: 10px;
+  background: #eaeaea;
+}
+
+.dtable-ui.collaborator-item .collaborator-avatar,
+.dtable-ui.collaborator-item .collaborator-name,
+.dtable-ui.collaborator-item .collaborator-remove {
+  height: 20px;
+  line-height: 20px;
+}
+
+.dtable-ui.collaborator-item .collaborator-avatar {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0 4px 0 2px;
+}
+
+.dtable-ui.collaborator-item .collaborator-avatar img {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+}
+
+.dtable-ui.collaborator-item .collaborator-remove {
+  display: inline-block;
+  width: 14px;
+  margin: 0 -2px 0 2px;
+}
+
+.dtable-ui.collaborator-item .collaborator-remove .dtable-font {
+  display: inline-block;
+  font-size: 12px;
+  color: #909090;
+  transform: scale(.8);
+  cursor: pointer;
+}
+
+.dtable-ui.collaborator-item .collaborator-remove .dtable-font:hover {
+  color: #666666;
+  cursor: pointer;
+}

package/lib/CollaboratorItem/index.js

@@ -0,0 +1,64 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+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';
+import './index.css';
+
+var CollaboratorItem = /*#__PURE__*/function (_React$Component) {
+  _inherits(CollaboratorItem, _React$Component);
+
+  var _super = _createSuper(CollaboratorItem);
+
+  function CollaboratorItem() {
+    var _this;
+
+    _classCallCheck(this, CollaboratorItem);
+
+    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.onDeleteCollaborator = function () {
+      var collaborator = _this.props.collaborator;
+
+      _this.props.onDeleteCollaborator(collaborator);
+    };
+
+    return _this;
+  }
+
+  _createClass(CollaboratorItem, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          collaborator = _this$props.collaborator,
+          enableDeleteCollaborator = _this$props.enableDeleteCollaborator;
+      return /*#__PURE__*/React.createElement("div", {
+        className: "dtable-ui collaborator-item"
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "collaborator-avatar"
+      }, /*#__PURE__*/React.createElement("img", {
+        className: "collaborator-avatar-icon",
+        alt: collaborator.name,
+        src: collaborator.avatar_url
+      })), /*#__PURE__*/React.createElement("span", {
+        className: "collaborator-name"
+      }, collaborator.name), enableDeleteCollaborator && /*#__PURE__*/React.createElement("span", {
+        className: "collaborator-remove",
+        onClick: this.onDeleteCollaborator
+      }, /*#__PURE__*/React.createElement("i", {
+        className: "dtable-font dtable-icon-fork-number"
+      })));
+    }
+  }]);
+
+  return CollaboratorItem;
+}(React.Component);
+
+CollaboratorItem.defaultProps = {
+  enableDelete: false
+};
+export default CollaboratorItem;

package/lib/CreatorFormatter/index.css

@@ -0,0 +1 @@
+@import url('../css/cell-formatter.css');

package/{es/components/cell-formatter/creator-formatter.js → lib/CreatorFormatter/index.js}

@@ -4,8 +4,9 @@ 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 CollaboratorItem from '../common/collaborator-item';
-import DefaultAvatar from '../../assets/images/avatar/default_avatar.png';
+import CollaboratorItem from '../CollaboratorItem';
+import DefaultAvatar from '../assets/images/avatar/default_avatar.png';
+import './index.css';
 
 // there will be there conditions
 // 1 value is not exist, typeof value is array, but it's length is 0

package/lib/DateFormatter/index.css

@@ -0,0 +1 @@
+@import url('../css/cell-formatter.css');

package/{es/components/cell-formatter/date-formatter.js → lib/DateFormatter/index.js}

@@ -4,7 +4,8 @@ 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 { getDateDisplayString } from '../../utils/value-format-utils';
+import { getDateDisplayString } from '../utils/value-format-utils';
+import './index.css';
 
 var DateFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(DateFormatter, _React$Component);

package/lib/DurationFormatter/index.css

@@ -0,0 +1 @@
+@import url('../css/cell-formatter.css');

package/{es/components/cell-formatter/duration-formatter.js → lib/DurationFormatter/index.js}

@@ -4,7 +4,8 @@ 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 { getDurationDisplayString } from '../../utils/value-format-utils';
+import { getDurationDisplayString } from '../utils/value-format-utils';
+import './index.css';
 
 var DurationFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(DurationFormatter, _React$Component);

package/lib/EmailFormatter/index.css

@@ -0,0 +1,5 @@
+@import url('../css/cell-formatter.css');
+
+.dtable-ui.email-formatter {
+  text-decoration: underline;
+}

package/{es/components/cell-formatter/email-formatter.js → lib/EmailFormatter/index.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 './index.css';
 
 var EmailFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(EmailFormatter, _React$Component);

package/lib/FileFormatter/index.css

@@ -0,0 +1,29 @@
+@import url('../css/cell-formatter.css');
+
+.dtable-ui.file-formatter {
+  display: flex;
+  align-items: center;
+}
+
+.dtable-ui.file-formatter .file-item-icon {
+  display: inline-block;
+  height: 28px;
+  width: 28px;
+  border: 1px solid #f0f0f0;
+}
+
+.dtable-ui.file-formatter .file-item-count {
+  display: inline-block;
+  padding: 0 3px;
+  min-width: 14px;
+  line-height: 14px;
+  font-size: 12px;
+  border-radius: 6px;
+  text-align: center;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: #fff;
+  background-color: #999;
+  -webkit-transform: translate(-50%, 8px) scale(.8);
+  transform: translate(-50%, 8px) scale(.8);
+}

package/{es/components/cell-formatter/file-formatter.js → lib/FileFormatter/index.js}

@@ -4,7 +4,8 @@ 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 FileItemFormatter from './widgets/file-item-formatter';
+import FileItemFormatter from '../FileItemFormatter';
+import './index.css';
 
 var FileFormatter = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(FileFormatter, _React$PureComponent);

package/{es/components/cell-formatter/widgets/file-item-formatter.js → lib/FileItemFormatter/index.js}

@@ -3,7 +3,7 @@ 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, { Component } from 'react';
-import { getFileIconUrl } from '../../../utils/utils';
+import { getFileIconUrl } from '../utils/utils';
 
 var FileItemFormatter = /*#__PURE__*/function (_Component) {
   _inherits(FileItemFormatter, _Component);
@@ -24,7 +24,7 @@ var FileItemFormatter = /*#__PURE__*/function (_Component) {
     _this.getFileIconData = function (item) {
       var fileIconUrl = getFileIconUrl(item.name, item.type);
 
-      var fileIconData = require('../../../' + fileIconUrl);
+      var fileIconData = require(fileIconUrl);
 
       return fileIconData;
     };

package/lib/FormulaFormatter/index.css

@@ -0,0 +1,19 @@
+@import url('../css/cell-formatter.css');
+
+.dtable-ui.formula-formatter.multiple .formula-formatter-content-item {
+  display: inline-flex;
+  margin-right: 10px;
+}
+
+
+.dtable-ui.formula-formatter.multiple .formula-formatter-content-item.simple-cell-formatter {
+  height: 20px;
+  padding: 0 8px;
+  align-items: center;
+  background: #eceff4;
+  border-radius: 3px;
+}
+
+.dtable-ui.formula-formatter.multiple .formula-formatter-content-item .collaborator {
+  margin-right: 0;
+}

package/{es/components/cell-formatter/formula-formatter.js → lib/FormulaFormatter/index.js}

@@ -4,14 +4,14 @@ 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';
-import { FORMULA_RESULT_TYPE } from '../../constants';
-import cellFormatterFactory from '../cell-factory/cell-formatter-factory';
-import * as CellType from '../../constants/cell-types';
-import { isFunction } from '../../utils/utils';
-import TextFormatter from './text-formatter';
-import { isArrayFormalColumn, isSimpleCellFormatter } from '../../utils/column-utils';
-import cellValueValidator from '../../utils/cell-value-validator';
-import { getFormulaDisplayString } from '../../utils/value-format-utils';
+import { FORMULA_RESULT_TYPE, CellType } from '../constants';
+import cellFormatterFactory from '../cellFormatterFactory';
+import { isFunction } from '../utils/utils';
+import TextFormatter from '../TextFormatter';
+import { isArrayFormalColumn, isSimpleCellFormatter } from '../utils/column-utils';
+import cellValueValidator from '../utils/cell-value-validator';
+import { getFormulaDisplayString } from '../utils/value-format-utils';
+import './index.css';
 
 var FormulaFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(FormulaFormatter, _React$Component);

package/lib/GeolocationFormatter/index.css

@@ -0,0 +1 @@
+@import url('../css/cell-formatter.css');

package/{es/components/cell-formatter/geolocation-formatter.js → lib/GeolocationFormatter/index.js}

@@ -4,7 +4,8 @@ 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';
+import { getGeolocationDisplayString } from '../utils/value-format-utils';
+import './index.css';
 
 var GeolocationFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(GeolocationFormatter, _React$Component);

package/{es/components/common → lib/ImageFormatter}/images-lazy-load.js

@@ -3,8 +3,8 @@ 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';
-import Loading from '../loading';
-import { getImageThumbnailUrl } from '../../utils/utils';
+import Loading from '../Loading';
+import { getImageThumbnailUrl } from '../utils/utils';
 
 var ImagesLazyLoad = /*#__PURE__*/function (_React$Component) {
   _inherits(ImagesLazyLoad, _React$Component);

package/lib/ImageFormatter/index.css

@@ -0,0 +1,34 @@
+@import url('../css/cell-formatter.css');
+
+.dtable-ui.image-formatter {
+  display: flex;
+  align-items: center;
+}
+
+.dtable-ui.image-formatter .image-item {
+  display: inline-block;
+  height: 28px;
+  width: 28px;
+  margin-right: 4px;
+  border: 1px solid #f0f0f0;
+}
+
+.dtable-ui.image-formatter .image-item:hover {
+  border: 1px solid #c9c9c9;
+}
+
+.dtable-ui.image-formatter .image-item-count {
+  display: inline-block;
+  padding: 0 3px;
+  min-width: 14px;
+  line-height: 14px;
+  font-size: 12px;
+  border-radius: 6px;
+  text-align: center;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: #fff;
+  background-color: #999;
+  -webkit-transform: translate(-50%, 8px) scale(.8);
+  transform: translate(-50%, 8px) scale(.8);
+}

package/{es/components/cell-formatter/image-formatter.js → lib/ImageFormatter/index.js}

@@ -4,9 +4,10 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React, { Fragment } from 'react';
 import cn from 'astro-classname';
-import ImagesLazyLoad from '../common/images-lazy-load';
-import { getImageThumbnailUrl } from '../../utils/utils';
-import ImagePreviewerLightbox from './widgets/image-previewer-lightbox';
+import ImagesLazyLoad from './images-lazy-load';
+import { getImageThumbnailUrl } from '../utils/utils';
+import ImagePreviewerLightbox from '../ImagePreviewerLightbox';
+import './index.css';
 
 var ImageFormatter = /*#__PURE__*/function (_React$Component) {
   _inherits(ImageFormatter, _React$Component);

package/{es/components/cell-formatter/widgets/image-previewer-lightbox.js → lib/ImagePreviewerLightbox/index.js}

@@ -1,10 +1,10 @@
 import React, { Fragment } from 'react';
 import MediaQuery from 'react-responsive';
-import ModalPortal from '../../common/modal-portal';
+import ModalPortal from '../ModalPortal';
 import Lightbox from '@seafile/react-image-lightbox';
-import { checkSVGImage, isInternalImg } from '../../../utils/utils';
+import { checkSVGImage, isInternalImg } from '../utils/utils';
 import '@seafile/react-image-lightbox/style.css';
-import '../../../css/image-previewer-ligntbox.css';
+import './index.css';
 
 function ImagePreviewerLightbox(props) {
   var imageItems = props.imageItems,

package/lib/LastModifierFormatter/index.css

@@ -0,0 +1 @@
+@import url('../css/cell-formatter.css');

package/{es/components/cell-formatter/last-modifier-formatter.js → lib/LastModifierFormatter/index.js}

@@ -4,14 +4,15 @@ 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 DefaultAvatar from '../../assets/images/avatar/default_avatar.png';
+import CollaboratorItem from '../CollaboratorItem';
+import DefaultAvatar from '../assets/images/avatar/default_avatar.png';
+import './index.css';
 
 // 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 LastModifierFormatter = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(LastModifierFormatter, _React$PureComponent);
 
@@ -49,7 +50,7 @@ var LastModifierFormatter = /*#__PURE__*/function (_React$PureComponent) {
           };
         }
 
-        return /*#__PURE__*/React.createElement(ColloboratorItem, {
+        return /*#__PURE__*/React.createElement(CollaboratorItem, {
           key: index,
           collaborator: collaborator
         });

package/lib/LinkFormatter/index.css

@@ -0,0 +1,27 @@
+@import url('../css/cell-formatter.css');
+
+.dtable-ui.link-formmatter {
+  display: inline-flex;
+  align-items: center;
+  overflow: hidden;
+  flex-wrap: nowrap;
+}
+
+.dtable-ui.link-formatter .link-item {
+  display: inline-flex;
+  height: 20px;
+  max-width: 230px;
+  padding: 0 8px 0 2px;
+  align-items: center;
+  font-size: 13px;
+  margin-right: 10px;
+  border-radius: 3px;
+  background: #eceff4;
+  cursor: pointer;
+}
+
+.dtable-ui.link-formatter .link-item .link-name {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}

package/{es/components/cell-formatter/link-formatter.js → lib/LinkFormatter/index.js}

@@ -5,8 +5,8 @@ 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 * as CellTypes from '../../constants/cell-types';
-import { getNumberDisplayString, getDateDisplayString } from '../../utils/value-format-utils';
+import * as CellTypes from '../constants/cell-types';
+import { getNumberDisplayString, getDateDisplayString } from '../utils/value-format-utils';
 
 // link value is  get form parant's interface
 var LinkFormatter = /*#__PURE__*/function (_React$Component) {

package/{es/components/loading.js → lib/Loading/index.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import '../css/loading.css';
+import './index.css';
 export default function Loading() {
   return /*#__PURE__*/React.createElement("span", {
     className: "loading-icon loading-tip"

package/{es/components/cell-formatter/widgets/long-text-formatter → lib/LongTextFormatter}/html-long-text-formatter.js

@@ -3,7 +3,7 @@ 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, { Component } from 'react';
-import { processor } from '../../../../utils/markdown2html';
+import { processor } from '../utils/markdown2html';
 
 var HtmlLongTextFormatter = /*#__PURE__*/function (_Component) {
   _inherits(HtmlLongTextFormatter, _Component);