dtable-ui-component 0.3.2 → 0.3.4-alpha1

package/lib/CTimeFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import dayjs from 'dayjs';
 import './index.css';
 
@@ -36,7 +36,7 @@ var CTimeFormatter = /*#__PURE__*/function (_React$Component) {
       var _this$props = this.props,
           date = _this$props.value,
           containerClassName = _this$props.containerClassName;
-      var classname = cn('dtable-ui cell-formatter-container ctime-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container ctime-formatter', containerClassName);
 
       if (date !== '') {
         date = this.formatDate(date);

package/lib/CheckboxFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import './index.css';
 
 var CheckboxFormatter = /*#__PURE__*/function (_React$PureComponent) {
@@ -24,7 +24,7 @@ var CheckboxFormatter = /*#__PURE__*/function (_React$PureComponent) {
           value = _this$props.value,
           containerClassName = _this$props.containerClassName;
       value = value === true ? true : false;
-      var classname = cn('dtable-ui cell-formatter-container checkbox-formatter d-flex align-items-center justify-content-center', containerClassName);
+      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", {

package/lib/CollaboratorFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import CollaboratorItem from '../CollaboratorItem';
 import DefaultAvatar from '../assets/images/avatar/default_avatar.png';
 import './index.css';
@@ -70,7 +70,7 @@ var CollaboratorFormatter = /*#__PURE__*/function (_React$PureComponent) {
       var _this$props2 = this.props,
           containerClassName = _this$props2.containerClassName,
           value = _this$props2.value;
-      var classname = cn('dtable-ui cell-formatter-container collaborator-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container collaborator-formatter', containerClassName);
 
       if (!value || Array.isArray(value) && value.length === 0) {
         return /*#__PURE__*/React.createElement("div", {

package/lib/CreatorFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import CollaboratorItem from '../CollaboratorItem';
 import DefaultAvatar from '../assets/images/avatar/default_avatar.png';
 import './index.css';
@@ -66,7 +66,7 @@ var CreatorFormatter = /*#__PURE__*/function (_React$PureComponent) {
       var _this$props2 = this.props,
           containerClassName = _this$props2.containerClassName,
           value = _this$props2.value;
-      var classname = cn('dtable-ui cell-formatter-container creator-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container creator-formatter', containerClassName);
 
       if (!value || Array.isArray(value) && value.length === 0) {
         return /*#__PURE__*/React.createElement("div", {

package/lib/DTableCustomizeCollaboratorSelect/index.css

@@ -18,7 +18,7 @@
   padding: 0.5rem 0;
   box-shadow: 0 1px 2px 0 rgb(0 0 0 / 5%);
   background: #fff;
-  border: 1px solid rgba(0,40,100,.12);
+  border: 1px solid rgba(0, 40, 100, 0.12);
   border-radius: 3px;
   z-index: 10001;
 }

package/lib/DTableSearchInput/index.js

@@ -103,8 +103,8 @@ var DtableSearchInput = /*#__PURE__*/function (_Component) {
   }
 
   _createClass(DtableSearchInput, [{
-    key: "componentWillReceiveProps",
-    value: function componentWillReceiveProps(nextProps) {
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(nextProps) {
       if (nextProps.value !== this.props.value) {
         this.setState({
           searchValue: nextProps.value

package/lib/DateFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import { getDateDisplayString } from '../utils/value-format-utils';
 import './index.css';
 
@@ -37,7 +37,7 @@ var DateFormatter = /*#__PURE__*/function (_React$Component) {
           date = _this$props.value,
           format = _this$props.format,
           containerClassName = _this$props.containerClassName;
-      var classname = cn('dtable-ui cell-formatter-container date-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container date-formatter', containerClassName);
 
       if (date !== '') {
         date = this.formatDate(date, format);

package/lib/DigitalSignFormatter/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 cn from 'astro-classname';
+import classnames from 'classnames';
 import ImagesLazyLoad from '../ImageFormatter/images-lazy-load';
 import ImagePreviewerLightbox from '../ImagePreviewerLightbox';
 import { getDigitalSignImageUrl } from './utils';
@@ -79,7 +79,7 @@ var DigitalSignFormatter = /*#__PURE__*/function (_Component) {
           readOnly = _this$props2.readOnly,
           config = _this$props2.config,
           isSample = _this$props2.isSample;
-      var className = cn('dtable-ui cell-formatter-container digital-sign-formatter', containerClassName);
+      var className = classnames('dtable-ui cell-formatter-container digital-sign-formatter', containerClassName);
       var signImages = this.getSignImages();
       if (signImages.length === 0) return null;
       var _this$state = this.state,

package/lib/DurationFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import { getDurationDisplayString } from '../utils/value-format-utils';
 import './index.css';
 
@@ -25,7 +25,7 @@ var DurationFormatter = /*#__PURE__*/function (_React$Component) {
           value = _this$props.value,
           containerClassName = _this$props.containerClassName,
           format = _this$props.format;
-      var classname = cn('dtable-ui cell-formatter-container duration-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container duration-formatter', containerClassName);
       return /*#__PURE__*/React.createElement("div", {
         className: classname
       }, getDurationDisplayString(value, {

package/lib/EmailFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import './index.css';
 
 var EmailFormatter = /*#__PURE__*/function (_React$Component) {
@@ -23,7 +23,7 @@ var EmailFormatter = /*#__PURE__*/function (_React$Component) {
       var _this$props = this.props,
           containerClassName = _this$props.containerClassName,
           value = _this$props.value;
-      var classname = cn('dtable-ui cell-formatter-container email-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container email-formatter', containerClassName);
       return /*#__PURE__*/React.createElement("div", {
         className: classname
       }, value);

package/lib/FileFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import FileItemFormatter from '../FileItemFormatter';
 import './index.css';
 
@@ -25,12 +25,13 @@ var FileFormatter = /*#__PURE__*/function (_React$PureComponent) {
           isSample = _this$props.isSample,
           value = _this$props.value,
           containerClassName = _this$props.containerClassName;
-      var className = cn('dtable-ui cell-formatter-container file-formatter', containerClassName);
 
       if (!Array.isArray(value) || value.length === 0) {
         return null;
       }
 
+      var className = classnames('dtable-ui cell-formatter-container file-formatter', containerClassName);
+
       if (isSample) {
         var item = value[0];
         return /*#__PURE__*/React.createElement("div", {
@@ -61,4 +62,4 @@ FileFormatter.defaultProps = {
   value: [],
   containerClassName: ''
 };
-export default FileFormatter;
+export { FileFormatter as default };

package/lib/FileItemFormatter/index.js

@@ -47,4 +47,4 @@ var FileItemFormatter = /*#__PURE__*/function (_Component) {
   return FileItemFormatter;
 }(Component);
 
-export default FileItemFormatter;
+export { FileItemFormatter as default };

package/lib/FormulaFormatter/index.js

@@ -7,7 +7,7 @@ import React from 'react';
 import { FORMULA_RESULT_TYPE, CellType } from '../constants';
 import BaseFormatterConfig from '../formatterConfig/base-formatter-config';
 import TextFormatter from '../TextFormatter';
-import { isArrayFormalColumn, isSimpleCellFormatter, isFunction } from './utils';
+import { isArrayFormalColumn, isSimpleCellFormatter, isFunction, getFormulaArrayValue, convertValueToDtableLongTextValue } from './utils';
 import cellValueValidator from './cell-value-validator';
 import { getFormulaDisplayString } from '../utils/value-format-utils';
 import './index.css';
@@ -130,12 +130,31 @@ var FormulaFormatter = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var _this$props2 = this.props,
-          value = _this$props2.value,
           containerClassName = _this$props2.containerClassName,
           column = _this$props2.column,
           collaborators = _this$props2.collaborators;
-      var columnData = column.data;
-      var resultType = columnData.result_type;
+      var data = column.data;
+      var array_type = data.array_type,
+          resultType = data.result_type;
+      var value = this.props.value;
+
+      if (Array.isArray(value)) {
+        value = getFormulaArrayValue(value);
+
+        if (array_type === CellType.DATE || resultType === FORMULA_RESULT_TYPE.DATE) {
+          value = value.map(function (item) {
+            return item.replace('T', ' ').replace('Z', '');
+          });
+        } else if (array_type === CellType.LONG_TEXT) {
+          value = value.map(function (item) {
+            return convertValueToDtableLongTextValue(item);
+          });
+        }
+      } else {
+        if (resultType === FORMULA_RESULT_TYPE.DATE) {
+          value = value.replace('T', ' ').replace('Z', '');
+        }
+      }
 
       if (resultType === FORMULA_RESULT_TYPE.ARRAY) {
         return this.renderOtherColumnFormatter();
@@ -146,7 +165,7 @@ var FormulaFormatter = /*#__PURE__*/function (_React$Component) {
       }
 
       var gridCellClassName = this.getGridCellClassName(resultType);
-      var formattedValue = getFormulaDisplayString(value, columnData, {
+      var formattedValue = getFormulaDisplayString(value, data, {
         collaborators: collaborators
       });
       return /*#__PURE__*/React.createElement("div", {

package/lib/FormulaFormatter/utils.js

@@ -1,4 +1,5 @@
 import { ARRAY_FORMAL_COLUMNS, SIMPLE_CELL_COLUMNS, SIMPLE_CELL_FORMULA_RESULTS } from '../constants';
+import getPreviewContent from '../SimpleLongTextFormatter/normalize-long-text-value';
 export function isSimpleCellFormatter(type) {
   return SIMPLE_CELL_COLUMNS.includes(type) || SIMPLE_CELL_FORMULA_RESULTS.includes(type);
 }
@@ -8,4 +9,94 @@ export function isArrayFormalColumn(columnType) {
 export var isFunction = function isFunction(functionToCheck) {
   var getType = {};
   return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]';
+};
+export var isValidCellValue = function isValidCellValue(value) {
+  if (value === undefined) return false;
+  if (value === null) return false;
+  if (value === '') return false;
+  if (JSON.stringify(value) === '{}') return false;
+  if (JSON.stringify(value) === '[]') return false;
+  return true;
+};
+export var getFormulaArrayValue = function getFormulaArrayValue(value) {
+  var isFlat = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+
+  if (!Array.isArray(value)) {
+    return [];
+  }
+
+  if (!isFlat) {
+    return getTwoDimensionArrayValue(value);
+  }
+
+  return value.map(function (item) {
+    if (Object.prototype.toString.call(item) !== '[object Object]' || !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;
+    }
+
+    return display_value.map(function (i) {
+      if (Object.prototype.toString.call(i) === '[object Object]') {
+        if (!Object.prototype.hasOwnProperty.call(i, 'display_value')) {
+          return i;
+        }
+
+        var _display_value = i.display_value;
+        return _display_value;
+      }
+
+      return i;
+    });
+  }).flat().filter(function (item) {
+    return isValidCellValue(item);
+  });
+};
+export var getTwoDimensionArrayValue = function getTwoDimensionArrayValue(value) {
+  if (!Array.isArray(value)) return [];
+  return value.map(function (item) {
+    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;
+    }
+
+    return display_value.map(function (i) {
+      if (Object.prototype.toString.call(i) === '[object Object]') {
+        if (!Object.prototype.hasOwnProperty.call(i, 'display_value')) {
+          return i;
+        }
+
+        var _display_value2 = i.display_value;
+        return _display_value2;
+      }
+
+      return i;
+    });
+  });
+};
+export var convertValueToDtableLongTextValue = function convertValueToDtableLongTextValue(value) {
+  var valueType = Object.prototype.toString.call(value);
+
+  if (value && valueType === '[object String]') {
+    return getPreviewContent(value);
+  }
+
+  if (valueType === '[object Object]') {
+    return value;
+  }
+
+  return '';
 };

package/lib/GeolocationFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import { getGeolocationDisplayString } from '../utils/value-format-utils';
 import './index.css';
 
@@ -25,7 +25,7 @@ var GeolocationFormatter = /*#__PURE__*/function (_React$Component) {
           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 = classnames('dtable-ui cell-formatter-container geolocation-formatter', containerClassName);
 
       if (typeof value !== 'object') {
         return null;

package/lib/HtmlLongTextFormatter/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 cn from 'astro-classname';
+import classnames from 'classnames';
 import { processor } from './markdown2html';
 import './index.css';
 
@@ -82,7 +82,7 @@ var HtmlLongTextFormatter = /*#__PURE__*/function (_Component) {
     value: function render() {
       var innerHtml = this.state.innerHtml;
       var containerClassName = this.props.containerClassName;
-      var className = cn('dtable-ui cell-formatter-container long-text-formatter', containerClassName);
+      var className = classnames('dtable-ui cell-formatter-container long-text-formatter', containerClassName);
       if (!innerHtml) return null;
       return /*#__PURE__*/React.createElement("div", {
         className: "".concat(className, " article"),

package/lib/ImageFormatter/images-lazy-load.js

@@ -22,7 +22,7 @@ var ImagesLazyLoad = /*#__PURE__*/function (_React$Component) {
       _this.lazyLoadImages(_this.props);
     };
 
-    _this.componentWillReceiveProps = function (nextProps) {
+    _this.UNSAFE_componentWillReceiveProps = function (nextProps) {
       if (nextProps.images.toString() !== _this.props.images.toString()) {
         _this.lazyLoadImages(nextProps);
       }
@@ -134,22 +134,18 @@ var ImagesLazyLoad = /*#__PURE__*/function (_React$Component) {
         }, /*#__PURE__*/React.createElement(Loading, null));
       }
 
-      if (images.length === loadedCount) {
-        return loadedImages.map(function (image, index) {
-          return /*#__PURE__*/React.createElement("img", {
-            key: index,
-            className: "image-item",
-            src: image.src,
-            onMouseDown: _this2.onMouseDown,
-            onClick: function onClick(event) {
-              return _this2.onImageClick(event, index);
-            },
-            alt: ""
-          });
+      return loadedImages.map(function (image, index) {
+        return /*#__PURE__*/React.createElement("img", {
+          key: index,
+          className: "image-item",
+          src: image.src,
+          onMouseDown: _this2.onMouseDown,
+          onClick: function onClick(event) {
+            return _this2.onImageClick(event, index);
+          },
+          alt: ""
         });
-      }
-
-      return '';
+      });
     }
   }]);
 

package/lib/ImageFormatter/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, { Fragment } from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import ImagesLazyLoad from './images-lazy-load';
 import { getImageThumbnailUrl } from './utils';
 import ImagePreviewerLightbox from '../ImagePreviewerLightbox';
@@ -101,7 +101,7 @@ var ImageFormatter = /*#__PURE__*/function (_React$Component) {
           server = _this$props.server,
           containerClassName = _this$props.containerClassName,
           readOnly = _this$props.readOnly;
-      var className = cn('dtable-ui cell-formatter-container image-formatter', containerClassName);
+      var className = classnames('dtable-ui cell-formatter-container image-formatter', containerClassName);
       var _this$state = this.state,
           isPreviewImage = _this$state.isPreviewImage,
           previewImageIndex = _this$state.previewImageIndex;

package/lib/ImagePreviewerLightbox/index.js

@@ -1,6 +1,6 @@
 import React, { Fragment } from 'react';
 import MediaQuery from 'react-responsive';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import ModalPortal from '../ModalPortal';
 import Lightbox from '@seafile/react-image-lightbox';
 import { checkSVGImage, isInternalImg } from './utils';
@@ -71,7 +71,7 @@ function ImagePreviewerLightbox(props) {
   return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(MediaQuery, {
     query: "(min-width: 767.8px)"
   }, /*#__PURE__*/React.createElement(Lightbox, {
-    wrapperClassName: cn('PC-image-previewer', className),
+    wrapperClassName: classnames('PC-image-previewer', className),
     imageTitle: imageTitleEl,
     toolbarButtons: toolbarButtons,
     mainSrc: imageItems[imageIndex],
@@ -93,7 +93,7 @@ function ImagePreviewerLightbox(props) {
     query: "(max-width: 767.8px)"
   }, /*#__PURE__*/React.createElement(Lightbox, {
     isDesktop: false,
-    wrapperClassName: cn('mobile-image-previewer dtable-ui-component', className),
+    wrapperClassName: classnames('mobile-image-previewer dtable-ui-component', className),
     mainSrc: imageItems[imageIndex],
     nextSrc: imageItems[(imageIndex + 1) % imageItemsLength],
     prevSrc: imageItems[(imageIndex + imageItemsLength - 1) % imageItemsLength],

package/lib/LastModifierFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import CollaboratorItem from '../CollaboratorItem';
 import DefaultAvatar from '../assets/images/avatar/default_avatar.png';
 import './index.css';
@@ -66,7 +66,7 @@ var LastModifierFormatter = /*#__PURE__*/function (_React$PureComponent) {
       var _this$props2 = this.props,
           containerClassName = _this$props2.containerClassName,
           value = _this$props2.value;
-      var classname = cn('dtable-ui cell-formatter-container last-modified-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container last-modified-formatter', containerClassName);
 
       if (!value || Array.isArray(value) && value.length === 0) {
         return /*#__PURE__*/React.createElement("div", {

package/lib/LinkFormatter/index.js

@@ -4,7 +4,7 @@ import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitial
 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 classnames from 'classnames';
 import * as CellTypes from '../constants/cell-types';
 import { getNumberDisplayString, getDateDisplayString } from '../utils/value-format-utils';
 
@@ -113,8 +113,8 @@ var LinkFormatter = /*#__PURE__*/function (_React$Component) {
   }
 
   _createClass(LinkFormatter, [{
-    key: "componentWillReceiveProps",
-    value: function componentWillReceiveProps(nextProps) {
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(nextProps) {
       var nextRow = nextProps.row;
 
       if (nextRow._id !== this.props.row._id) {
@@ -127,7 +127,7 @@ var LinkFormatter = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var containerClassName = this.props.containerClassName;
-      var classname = cn('dtable-ui cell-formatter-container link-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container link-formatter', containerClassName);
       var displayValues = this.getDisplayValues();
       return /*#__PURE__*/React.createElement("div", {
         className: classname

package/lib/MTimeFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import dayjs from 'dayjs';
 import './index.css';
 
@@ -36,7 +36,7 @@ var MTimeFormatter = /*#__PURE__*/function (_React$Component) {
       var _this$props = this.props,
           date = _this$props.value,
           containerClassName = _this$props.containerClassName;
-      var classname = cn('dtable-ui cell-formatter-container ctime-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container ctime-formatter', containerClassName);
 
       if (date !== '') {
         date = this.formatDate(date);

package/lib/MultipleSelectFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import SelectItem from '../SelectItem';
 import './index.css';
 
@@ -49,7 +49,7 @@ var MultipleSelectFormatter = /*#__PURE__*/function (_React$PureComponent) {
       var _this$props2 = this.props,
           value = _this$props2.value,
           containerClassName = _this$props2.containerClassName;
-      var classname = cn('dtable-ui cell-formatter-container multiple-select-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container multiple-select-formatter', containerClassName);
 
       if (!value || Array.isArray(value) && value.length === 0) {
         return /*#__PURE__*/React.createElement("div", {

package/lib/NumberFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import { getNumberDisplayString } from '../utils/value-format-utils';
 import './index.css';
 
@@ -25,7 +25,7 @@ var NumberFormatter = /*#__PURE__*/function (_React$Component) {
           number = _this$props.value,
           data = _this$props.data,
           containerClassName = _this$props.containerClassName;
-      var classname = cn('dtable-ui cell-formatter-container number-formatter', containerClassName);
+      var classname = classnames('dtable-ui cell-formatter-container number-formatter', containerClassName);
 
       if (number || number === 0) {
         number = getNumberDisplayString(number, data);

package/lib/RateFormatter/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 from 'react';
-import cn from 'astro-classname';
+import classnames from 'classnames';
 import './index.css';
 
 var RateFormatter = /*#__PURE__*/function (_React$Component) {
@@ -60,7 +60,7 @@ var RateFormatter = /*#__PURE__*/function (_React$Component) {
       var _this$props2 = this.props,
           number = _this$props2.value,
           containerClassName = _this$props2.containerClassName;
-      var className = cn('dtable-ui cell-formatter-container rate-formatter', containerClassName);
+      var className = classnames('dtable-ui cell-formatter-container rate-formatter', containerClassName);
       if (!number) return null;
       var rateList = this.getRateList();
       return /*#__PURE__*/React.createElement("div", {