dtable-ui-component 0.1.74 → 0.1.75-beta3

package/es/css/cell-formatter.css

@@ -2,246 +2,3 @@
   overflow: hidden;
   line-height: 1;
 }
-
-/* collaborator */
-.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;
-}
-
-/* long-text */
-.dtable-ui.long-text-formatter {
-  display: flex;
-  align-items: center;
-  height: 28px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.dtable-ui.long-text-formatter.article {
-  display: block;
-  height: auto;
-  overflow: auto;
-}
-
-.dtable-ui.long-text-formatter .long-text-links,
-.dtable-ui.long-text-formatter .long-text-check-list {
-  display: inline-block;
-  height: 20px;
-  padding: 2px;
-  margin: 4px;
-  color: #9c9c9c;
-  background-color: #f0f0f0;
-  border-radius: 3px;
-  line-height: 16px;
-}
-
-.dtable-ui.long-text-formatter .long-text-check-list .dtable-font,
-.dtable-ui.long-text-formatter .long-text-links .dtable-font {
-  margin-right: 4px;
-  font-size: 12px;
-}
-
-.dtable-ui.long-text-formatter .long-text-check-list .long-text-check-list-completed {
-  color: #61BD4F;
-}
-
-.dtable-ui.long-text-formatter .long-text-images {
-  margin-right: -10px;
-}
-
-.dtable-ui.long-text-formatter .long-text-images img {
-  max-width: 28px;
-  max-height: 28px;
-  border: 1px solid #f0f0f0;
-  box-sizing: border-box;
-  border-radius: 3px;
-}
-
-.dtable-ui.long-text-formatter .long-text-images .image-number {
-  display: inline-block;
-  min-width: 14px;
-  padding: 0 3px;
-  line-height: 14px;
-  font-style: normal;
-  font-size: 12px;
-  border-radius: 6px;
-  background-color: #999;
-  color: #fff;
-  transform: translate(-50%, 9px) scale(0.8);
-}
-
-.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);
-}
-
-
-.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);
-}
-
-.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;
-}
-
-/* 
-* url formatter 
-* email formatter 
-*/
-
-.dtable-ui.url-formatter,
-.dtable-ui.email-formatter {
-  text-decoration: underline;
-}
-
-.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;
-}
-
-/* button */
-.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/formatterConfig/index.js

@@ -0,0 +1,31 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+
+var _FormatterConfig;
+
+import React from 'react';
+import { CellType } from '../constants';
+import CheckboxFormatter from '../CheckboxFormatter';
+import ImageFormatter from '../ImageFormatter';
+import LongTextFormatter from '../LongTextFormatter';
+import TextCellFormatter from '../TextFormatter';
+import SingleSelectFormatter from '../SingleSelectFormatter';
+import MultipleSelectFormatter from '../MultipleSelectFormatter';
+import FileFormatter from '../FileFormatter';
+import LinkFormatter from '../LinkFormatter';
+import CollaboratorFormatter from '../CollaboratorFormatter';
+import NumberFormatter from '../NumberFormatter';
+import DateFormatter from '../DateFormatter';
+import CreatorFormatter from '../CreatorFormatter';
+import CTimeFormatter from '../CTimeFormatter';
+import LastModifierFormatter from '../LastModifierFormatter';
+import MTimeFormatter from '../MTimeFormatter';
+import GeolocationFormatter from '../GeolocationFormatter';
+import FormulaFormatter from '../FormulaFormatter';
+import AutoNumberFormatter from '../AutoNumberFormatter';
+import UrlFormatter from '../UrlFormatter';
+import EmailFormatter from '../EmailFormatter';
+import DurationFormatter from '../DurationFormatter';
+import RateFormatter from '../RateFormatter';
+import ButtonFormatter from '../ButtonFormatter';
+var FormatterConfig = (_FormatterConfig = {}, _defineProperty(_FormatterConfig, CellType.DEFAULT, /*#__PURE__*/React.createElement(TextCellFormatter, null)), _defineProperty(_FormatterConfig, CellType.TEXT, /*#__PURE__*/React.createElement(TextCellFormatter, null)), _defineProperty(_FormatterConfig, CellType.CHECKBOX, /*#__PURE__*/React.createElement(CheckboxFormatter, null)), _defineProperty(_FormatterConfig, CellType.LONG_TEXT, /*#__PURE__*/React.createElement(LongTextFormatter, null)), _defineProperty(_FormatterConfig, CellType.SINGLE_SELECT, /*#__PURE__*/React.createElement(SingleSelectFormatter, null)), _defineProperty(_FormatterConfig, CellType.IMAGE, /*#__PURE__*/React.createElement(ImageFormatter, null)), _defineProperty(_FormatterConfig, CellType.FILE, /*#__PURE__*/React.createElement(FileFormatter, null)), _defineProperty(_FormatterConfig, CellType.MULTIPLE_SELECT, /*#__PURE__*/React.createElement(MultipleSelectFormatter, null)), _defineProperty(_FormatterConfig, CellType.COLLABORATOR, /*#__PURE__*/React.createElement(CollaboratorFormatter, null)), _defineProperty(_FormatterConfig, CellType.NUMBER, /*#__PURE__*/React.createElement(NumberFormatter, null)), _defineProperty(_FormatterConfig, CellType.DATE, /*#__PURE__*/React.createElement(DateFormatter, null)), _defineProperty(_FormatterConfig, CellType.LINK, /*#__PURE__*/React.createElement(LinkFormatter, null)), _defineProperty(_FormatterConfig, CellType.CREATOR, /*#__PURE__*/React.createElement(CreatorFormatter, null)), _defineProperty(_FormatterConfig, CellType.CTIME, /*#__PURE__*/React.createElement(CTimeFormatter, null)), _defineProperty(_FormatterConfig, CellType.LAST_MODIFIER, /*#__PURE__*/React.createElement(LastModifierFormatter, null)), _defineProperty(_FormatterConfig, CellType.MTIME, /*#__PURE__*/React.createElement(MTimeFormatter, null)), _defineProperty(_FormatterConfig, CellType.GEOLOCATION, /*#__PURE__*/React.createElement(GeolocationFormatter, null)), _defineProperty(_FormatterConfig, CellType.FORMULA, /*#__PURE__*/React.createElement(FormulaFormatter, null)), _defineProperty(_FormatterConfig, CellType.AUTO_NUMBER, /*#__PURE__*/React.createElement(AutoNumberFormatter, null)), _defineProperty(_FormatterConfig, CellType.URL, /*#__PURE__*/React.createElement(UrlFormatter, null)), _defineProperty(_FormatterConfig, CellType.EMAIL, /*#__PURE__*/React.createElement(EmailFormatter, null)), _defineProperty(_FormatterConfig, CellType.DURATION, /*#__PURE__*/React.createElement(DurationFormatter, null)), _defineProperty(_FormatterConfig, CellType.RATE, /*#__PURE__*/React.createElement(RateFormatter, null)), _defineProperty(_FormatterConfig, CellType.BUTTON, /*#__PURE__*/React.createElement(ButtonFormatter, null)), _FormatterConfig);
+export default FormatterConfig;

package/es/index.js

@@ -1,5 +1,31 @@
-export { default as toaster } from './components/toast';
+export { default as toaster } from './toaster';
 export { setLocale } from './lang';
 export { getDateDisplayString, getNumberDisplayString, 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, CollaboratorItem } from './components/cell-formatter';
+export { default as CheckboxFormatter } from './CheckboxFormatter';
+export { default as ImageFormatter } from './ImageFormatter';
+export { default as LongTextFormatter } from './LongTextFormatter';
+export { default as TextFormatter } from './TextFormatter';
+export { default as SingleSelectFormatter } from './SingleSelectFormatter';
+export { default as MultipleSelectFormatter } from './MultipleSelectFormatter';
+export { default as FileFormatter } from './FileFormatter';
+export { default as LinkFormatter } from './LinkFormatter';
+export { default as CollaboratorFormatter } from './CollaboratorFormatter';
+export { default as NumberFormatter } from './NumberFormatter';
+export { default as DateFormatter } from './DateFormatter';
+export { default as CreatorFormatter } from './CreatorFormatter';
+export { default as CTimeFormatter } from './CTimeFormatter';
+export { default as LastModifierFormatter } from './LastModifierFormatter';
+export { default as MTimeFormatter } from './MTimeFormatter';
+export { default as GeolocationFormatter } from './GeolocationFormatter';
+export { default as FormulaFormatter } from './FormulaFormatter';
+export { default as AutoNumberFormatter } from './AutoNumberFormatter';
+export { default as UrlFormatter } from './UrlFormatter';
+export { default as EmailFormatter } from './EmailFormatter';
+export { default as DurationFormatter } from './DurationFormatter';
+export { default as RateFormatter } from './RateFormatter';
+export { default as ButtonFormatter } from './ButtonFormatter';
+export { default as ImagePreviewerLightbox } from './ImagePreviewerLightbox';
+export { default as CollaboratorItem } from './CollaboratorItem';
+export { default as FileItemFormatter } from './FileItemFormatter';
+export { default as Loading } from './Loading';
+export { TextEditor, NumberEditor, CheckboxEditor, SingleSelectEditor, CollaboratorEditor, DateEditor, LinkEditor } from './components/cell-editor';

package/es/utils/cell-value-validator.js

@@ -2,8 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 
 var _validators;
 
-import * as CellType from '../constants/cell-types';
-import { FORMULA_RESULT_TYPE } from '../constants';
+import { FORMULA_RESULT_TYPE, CellType } from '../constants';
 
 var numberValidator = function numberValidator(value) {
   return (value || value === 0) && Object.prototype.toString.call(value) === '[object Number]';

package/es/utils/editor-utils.js

@@ -0,0 +1,71 @@
+var zhCN = require('@seafile/seafile-calendar/lib/locale/zh_CN');
+
+var zhTW = require('@seafile/seafile-calendar/lib/locale/zh_TW');
+
+var enUS = require('@seafile/seafile-calendar/lib/locale/en_US');
+
+var frFR = require('@seafile/seafile-calendar/lib/locale/fr_FR');
+
+var deDE = require('@seafile/seafile-calendar/lib/locale/de_DE');
+
+var esES = require('@seafile/seafile-calendar/lib/locale/es_ES');
+
+var plPL = require('@seafile/seafile-calendar/lib/locale/pl_PL');
+
+var csCZ = require('@seafile/seafile-calendar/lib/locale/cs_CZ');
+
+export var initDateEditorLanguage = function initDateEditorLanguage(lang) {
+  var language;
+
+  switch (lang) {
+    case 'zh-cn':
+      language = zhCN;
+      break;
+
+    case 'zh-tw':
+      language = zhTW;
+      break;
+
+    case 'en':
+      language = enUS;
+      break;
+
+    case 'fr':
+      language = frFR;
+      break;
+
+    case 'de':
+      language = deDE;
+      break;
+
+    case 'es':
+      language = esES;
+      break;
+
+    case 'es-ar':
+      language = esES;
+      break;
+
+    case 'es-mx':
+      language = esES;
+      break;
+
+    case 'pl':
+      language = plPL;
+      break;
+
+    case 'cs':
+      language = csCZ;
+      break;
+
+    default:
+      language = zhCN;
+  }
+
+  return language;
+};
+export var getSelectOptionItem = function getSelectOptionItem(options, optionId) {
+  return options.find(function (option) {
+    return option.id === optionId;
+  });
+};

package/es/utils/normalize-long-text-value.js

@@ -1,5 +1,5 @@
 var hrefReg = /\[.+\]\(\S+\)|<img src=(\S+).+\/>|!\[\]\(\S+\)|<\S+>/g;
-var imageReg1 = /^<img src="(\S+)" .+\/>/;
+var imageReg1 = /^<img( width=[\\|/|"](\d)+[\\|/|"])? src="(\S+)" .?\/>/;
 var imageReg2 = /^!\[\]\((\S+)\)/;
 var linkReg1 = /^\[.+\]\(\S+\)/;
 var linkReg2 = /^<\S+>$/;
@@ -39,7 +39,7 @@ var getPreviewContent = function getPreviewContent(markdownContent) {
       preview += newMarkdownContent[index];
     }
 
-    if (preview.length === 30) {
+    if (preview.length === 150) {
       break;
     }
   }

package/es/utils/number-precision.js

@@ -48,6 +48,7 @@ function float2Fixed(num) {
 function checkBoundary(num) {
   if (_boundaryCheckingState) {
     if (num > Number.MAX_SAFE_INTEGER || num < Number.MIN_SAFE_INTEGER) {
+      // eslint-disable-next-line no-console
       console.warn("".concat(num, " is beyond boundary when transfer to integer, the results may not be accurate"));
     }
   }

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

@@ -1,3 +1,4 @@
+/* eslint-disable no-case-declarations */
 import moment from 'moment';
 import NP from './number-precision';
 import { NUMBER_TYPES, DEFAULT_NUMBER_FORMAT, DURATION_FORMATS_MAP, DURATION_FORMATS, DURATION_ZERO_DISPLAY, DURATION_DECIMAL_DIGITS, FORMULA_RESULT_TYPE, COLLABORATOR_COLUMN_TYPES, ARRAY_FORMAL_COLUMNS_TYPES, DEFAULT_DATE_FORMAT } from '../constants';
@@ -167,6 +168,7 @@ export var getDateDisplayString = function getDateDisplayString(value, format) {
   switch (format) {
     case 'D/M/YYYY':
     case 'DD/MM/YYYY':
+      // no-case-declarations
       var formatValue = date.format('YYYY-MM-DD');
       var formatValueList = formatValue.split('-');
       return "".concat(formatValueList[2], "/").concat(formatValueList[1], "/").concat(formatValueList[0]);

package/lib/AutoNumberFormatter/index.css

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

package/lib/AutoNumberFormatter/index.js

@@ -0,0 +1,47 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _astroClassname = _interopRequireDefault(require("astro-classname"));
+
+require("./index.css");
+
+var propTypes = {
+  value: _propTypes.default.string.isRequired,
+  containerClassName: _propTypes.default.string
+};
+
+var AutoNumberFormatter = /*#__PURE__*/function (_React$Component) {
+  (0, _inheritsLoose2.default)(AutoNumberFormatter, _React$Component);
+
+  function AutoNumberFormatter() {
+    return _React$Component.apply(this, arguments) || this;
+  }
+
+  var _proto = AutoNumberFormatter.prototype;
+
+  _proto.render = function render() {
+    var _this$props = this.props,
+        containerClassName = _this$props.containerClassName,
+        value = _this$props.value;
+    var classname = (0, _astroClassname.default)('dtable-ui cell-formatter-container auto-number-formatter', containerClassName);
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: classname
+    }, value);
+  };
+
+  return AutoNumberFormatter;
+}(_react.default.Component);
+
+AutoNumberFormatter.propTypes = propTypes;
+var _default = AutoNumberFormatter;
+exports.default = _default;

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/lib/ButtonFormatter/index.js

@@ -0,0 +1,68 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _astroClassname = _interopRequireDefault(require("astro-classname"));
+
+require("./index.css");
+
+var propTypes = {
+  data: _propTypes.default.object,
+  containerClassName: _propTypes.default.string,
+  optionColors: _propTypes.default.array
+};
+
+var ButtonFormatter = /*#__PURE__*/function (_React$Component) {
+  (0, _inheritsLoose2.default)(ButtonFormatter, _React$Component);
+
+  function ButtonFormatter() {
+    return _React$Component.apply(this, arguments) || this;
+  }
+
+  var _proto = ButtonFormatter.prototype;
+
+  _proto.render = function render() {
+    var _this$props = this.props,
+        data = _this$props.data,
+        containerClassName = _this$props.containerClassName,
+        optionColors = _this$props.optionColors;
+
+    var _ref = data || {},
+        button_color = _ref.button_color,
+        button_type = _ref.button_type,
+        button_name = _ref.button_name;
+
+    if (!button_type) return null;
+    var colorOption = Array.isArray(optionColors) ? optionColors.find(function (item) {
+      return item.COLOR === button_color;
+    }) || optionColors[0] : {
+      COLOR: '#FFFCB5',
+      BORDER_COLOR: '#E8E79D',
+      TEXT_COLOR: '#202428'
+    };
+    var btnStyle = {
+      backgroundColor: colorOption.COLOR,
+      borderColor: colorOption.BORDER_COLOR,
+      color: colorOption.TEXT_COLOR
+    };
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _astroClassname.default)('dtable-ui cell-formatter-container button-formatter', containerClassName),
+      style: btnStyle
+    }, button_name);
+  };
+
+  return ButtonFormatter;
+}(_react.default.Component);
+
+ButtonFormatter.propTypes = propTypes;
+var _default = ButtonFormatter;
+exports.default = _default;

package/lib/CTimeFormatter/index.css

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

package/lib/CTimeFormatter/index.js

@@ -0,0 +1,72 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _astroClassname = _interopRequireDefault(require("astro-classname"));
+
+var _moment = _interopRequireDefault(require("moment"));
+
+require("./index.css");
+
+var propTypes = {
+  value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
+  containerClassName: _propTypes.default.string
+};
+
+var CTimeFormatter = /*#__PURE__*/function (_React$Component) {
+  (0, _inheritsLoose2.default)(CTimeFormatter, _React$Component);
+
+  function CTimeFormatter() {
+    var _this;
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "formatDate", function (date) {
+      return (0, _moment.default)(date).format('YYYY-MM-DD HH:mm:ss');
+    });
+    return _this;
+  }
+
+  var _proto = CTimeFormatter.prototype;
+
+  _proto.render = function render() {
+    var _this$props = this.props,
+        date = _this$props.value,
+        containerClassName = _this$props.containerClassName;
+    var classname = (0, _astroClassname.default)('dtable-ui cell-formatter-container ctime-formatter', containerClassName);
+
+    if (date !== '') {
+      date = this.formatDate(date);
+    }
+
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: classname
+    }, date);
+  };
+
+  return CTimeFormatter;
+}(_react.default.Component);
+
+(0, _defineProperty2.default)(CTimeFormatter, "defaultProps", {
+  value: '',
+  containerClassName: ''
+});
+CTimeFormatter.propTypes = propTypes;
+var _default = CTimeFormatter;
+exports.default = _default;

package/lib/CheckboxFormatter/index.css

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