dtable-ui-component 5.0.9-beta.1 → 5.0.9-beta.2

package/lib/RowExpandFormatter/index.js

@@ -34,6 +34,7 @@ var _DigitalSignFormatter = _interopRequireDefault(require("../DigitalSignFormat
 var _DepartmentSingleSelectFormatter = _interopRequireDefault(require("../DepartmentSingleSelectFormatter"));
 var _constants = require("../constants");
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 class EditorFormatter extends _react.default.Component {
   constructor(_props) {
     super(_props);
@@ -78,7 +79,7 @@ class EditorFormatter extends _react.default.Component {
       }
     };
     this.renderEmpty = () => {
-      return /*#__PURE__*/_react.default.createElement("div", {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "d-flex align-items-center form-control disabled h-auto"
       });
     };
@@ -99,120 +100,130 @@ class EditorFormatter extends _react.default.Component {
       switch (columnType) {
         case _constants.CellType.TEXT:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
-              className: "form-control d-flex align-items-center w-100"
-            }, /*#__PURE__*/_react.default.createElement(_TextFormatter.default, {
-              value: cellValue,
-              containerClassName: containerClassName
-            }));
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "form-control d-flex align-items-center w-100",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextFormatter.default, {
+                value: cellValue,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.COLLABORATOR:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
-              className: "form-control d-flex align-items-center w-100 h-auto"
-            }, /*#__PURE__*/_react.default.createElement(_CollaboratorFormatter.default, {
-              value: cellValue,
-              collaborators: collaborators,
-              containerClassName: containerClassName
-            }));
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "form-control d-flex align-items-center w-100 h-auto",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CollaboratorFormatter.default, {
+                value: cellValue,
+                collaborators: collaborators,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.LONG_TEXT:
           {
             if (!cellValue) return null;
-            return /*#__PURE__*/_react.default.createElement("div", {
-              className: "longtext-formatter-container"
-            }, /*#__PURE__*/_react.default.createElement(_LongTextFormatter.default, {
-              value: cellValue,
-              containerClassName: containerClassName,
-              isSample: false
-            }));
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "longtext-formatter-container",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_LongTextFormatter.default, {
+                value: cellValue,
+                containerClassName: containerClassName,
+                isSample: false
+              })
+            });
           }
         case _constants.CellType.GEOLOCATION:
           {
             if (typeof cellValue !== 'object') return null;
-            return /*#__PURE__*/_react.default.createElement("div", {
-              className: "geolocation-formatter-container"
-            }, /*#__PURE__*/_react.default.createElement(_GeolocationFormatter.default, {
-              value: cellValue,
-              data: column.data,
-              containerClassName: containerClassName
-            }));
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "geolocation-formatter-container",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeolocationFormatter.default, {
+                value: cellValue,
+                data: column.data,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.NUMBER:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "form-control d-flex align-items-center",
               style: {
                 width: 320
-              }
-            }, /*#__PURE__*/_react.default.createElement(_NumberFormatter.default, {
-              value: cellValue,
-              data: column.data,
-              containerClassName: containerClassName
-            }));
+              },
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_NumberFormatter.default, {
+                value: cellValue,
+                data: column.data,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.DATE:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "form-control d-flex align-items-center",
               style: {
                 width: 320
-              }
-            }, /*#__PURE__*/_react.default.createElement(_DateFormatter.default, {
-              value: cellValue,
-              format: column.data.format,
-              containerClassName: containerClassName
-            }));
+              },
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DateFormatter.default, {
+                value: cellValue,
+                format: column.data.format,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.CTIME:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "form-control d-flex align-items-center ctime-formatter-container",
               style: {
                 width: 320
-              }
-            }, /*#__PURE__*/_react.default.createElement(_CTimeFormatter.default, {
-              value: row._ctime,
-              containerClassName: containerClassName
-            }));
+              },
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CTimeFormatter.default, {
+                value: row._ctime,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.MTIME:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "form-control d-flex align-items-center mtime-formatter-container",
               style: {
                 width: 320
-              }
-            }, /*#__PURE__*/_react.default.createElement(_MTimeFormatter.default, {
-              value: row._mtime,
-              containerClassName: containerClassName
-            }));
+              },
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MTimeFormatter.default, {
+                value: row._mtime,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.MULTIPLE_SELECT:
           {
             const options = column.data ? column.data.options : [];
-            return /*#__PURE__*/_react.default.createElement("div", {
-              className: "form-control d-flex align-items-center w-100 h-auto"
-            }, /*#__PURE__*/_react.default.createElement(_MultipleSelectFormatter.default, {
-              value: cellValue,
-              options: options,
-              containerClassName: containerClassName
-            }));
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "form-control d-flex align-items-center w-100 h-auto",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MultipleSelectFormatter.default, {
+                value: cellValue,
+                options: options,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.SINGLE_SELECT:
           {
             const options = column.data ? column.data.options : [];
-            return /*#__PURE__*/_react.default.createElement("div", {
-              className: "form-control d-flex align-items-center w-100"
-            }, /*#__PURE__*/_react.default.createElement(_SingleSelectFormatter.default, {
-              value: cellValue,
-              options: options,
-              containerClassName: containerClassName
-            }));
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "form-control d-flex align-items-center w-100",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SingleSelectFormatter.default, {
+                value: cellValue,
+                options: options,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.FILE:
           {
-            return /*#__PURE__*/_react.default.createElement(_RowExpandFileFormatter.default, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowExpandFileFormatter.default, {
               value: cellValue,
               column: column,
               downloadFile: this.props.downloadFile,
@@ -221,7 +232,7 @@ class EditorFormatter extends _react.default.Component {
           }
         case _constants.CellType.IMAGE:
           {
-            return /*#__PURE__*/_react.default.createElement(_RowExpandImageFormatter.default, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowExpandImageFormatter.default, {
               value: cellValue,
               column: column,
               downloadImage: this.props.downloadImage,
@@ -231,15 +242,16 @@ class EditorFormatter extends _react.default.Component {
           }
         case _constants.CellType.CHECKBOX:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
-              className: "checkbox-formatter-container"
-            }, /*#__PURE__*/_react.default.createElement(_CheckboxFormatter.default, {
-              value: cellValue
-            }));
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "checkbox-formatter-container",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckboxFormatter.default, {
+                value: cellValue
+              })
+            });
           }
         case _constants.CellType.CREATOR:
           {
-            return /*#__PURE__*/_react.default.createElement(_CreatorFormatter.default, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CreatorFormatter.default, {
               collaborators: collaborators,
               value: cellValue,
               containerClassName: containerClassName
@@ -247,7 +259,7 @@ class EditorFormatter extends _react.default.Component {
           }
         case _constants.CellType.LAST_MODIFIER:
           {
-            return /*#__PURE__*/_react.default.createElement(_LastModifierFormatter.default, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_LastModifierFormatter.default, {
               collaborators: collaborators,
               value: cellValue,
               containerClassName: containerClassName
@@ -256,7 +268,7 @@ class EditorFormatter extends _react.default.Component {
         case _constants.CellType.FORMULA:
         case _constants.CellType.LINK_FORMULA:
           {
-            return /*#__PURE__*/_react.default.createElement(_RowExpandFormulaFormatter.default, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowExpandFormulaFormatter.default, {
               value: cellValue,
               column: column,
               collaborators: collaborators,
@@ -287,7 +299,7 @@ class EditorFormatter extends _react.default.Component {
                 }
               };
             }
-            return /*#__PURE__*/_react.default.createElement(_RowExpandLinkFormatter.default, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowExpandLinkFormatter.default, {
               value: cellValue,
               column: column,
               collaborators: collaborators,
@@ -297,58 +309,62 @@ class EditorFormatter extends _react.default.Component {
           }
         case _constants.CellType.AUTO_NUMBER:
           {
-            return /*#__PURE__*/_react.default.createElement(_AutoNumberFormatter.default, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_AutoNumberFormatter.default, {
               value: cellValue,
               containerClassName: containerClassName
             });
           }
         case _constants.CellType.URL:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
-              className: "form-control d-flex align-items-center w-100"
-            }, /*#__PURE__*/_react.default.createElement(_RowExpandUrlFormatter.default, {
-              value: cellValue,
-              containerClassName: containerClassName
-            }));
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "form-control d-flex align-items-center w-100",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowExpandUrlFormatter.default, {
+                value: cellValue,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.EMAIL:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
-              className: "form-control d-flex align-items-center w-100"
-            }, /*#__PURE__*/_react.default.createElement(_RowExpandEmailFormatter.default, {
-              value: cellValue,
-              containerClassName: containerClassName
-            }));
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "form-control d-flex align-items-center w-100",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowExpandEmailFormatter.default, {
+                value: cellValue,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.DURATION:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "form-control d-flex align-items-center",
               style: {
                 width: 320
-              }
-            }, /*#__PURE__*/_react.default.createElement(_DurationFormatter.default, {
-              value: cellValue,
-              format: column.data.duration_format,
-              containerClassName: containerClassName
-            }));
+              },
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DurationFormatter.default, {
+                value: cellValue,
+                format: column.data.duration_format,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.RATE:
           {
-            return /*#__PURE__*/_react.default.createElement("div", {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "form-control d-flex align-items-center",
               style: {
                 width: 320
-              }
-            }, /*#__PURE__*/_react.default.createElement(_RowExpandRateFormatter.default, {
-              value: cellValue,
-              data: column.data,
-              containerClassName: containerClassName
-            }));
+              },
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowExpandRateFormatter.default, {
+                value: cellValue,
+                data: column.data,
+                containerClassName: containerClassName
+              })
+            });
           }
         case _constants.CellType.BUTTON:
           {
-            return /*#__PURE__*/_react.default.createElement(_ButtonFormatter.default, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonFormatter.default, {
               data: column.data,
               containerClassName: containerClassName,
               onClickButton: this.props.onClickButton
@@ -356,7 +372,7 @@ class EditorFormatter extends _react.default.Component {
           }
         case _constants.CellType.DIGITAL_SIGN:
           {
-            return /*#__PURE__*/_react.default.createElement(_DigitalSignFormatter.default, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_DigitalSignFormatter.default, {
               value: cellValue,
               containerClassName: containerClassName,
               config: this.props.config
@@ -364,7 +380,7 @@ class EditorFormatter extends _react.default.Component {
           }
         case _constants.CellType.DEPARTMENT_SINGLE_SELECT:
           {
-            return /*#__PURE__*/_react.default.createElement(_DepartmentSingleSelectFormatter.default, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_DepartmentSingleSelectFormatter.default, {
               value: cellValue,
               departments: this.props.departments
             });
@@ -395,11 +411,12 @@ class EditorFormatter extends _react.default.Component {
     const {
       className
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: (0, _classnames.default)('dtable-ui dtable-row-expand-formatter', {
         [className]: className
-      })
-    }, this.renderFormatter());
+      }),
+      children: this.renderFormatter()
+    });
   }
 }
 exports.default = EditorFormatter;

package/lib/RowExpandFormulaFormatter/index.js

@@ -15,6 +15,7 @@ var _cellValueValidator = _interopRequireDefault(require("../FormulaFormatter/ce
 var _toaster = _interopRequireDefault(require("../toaster"));
 var _lang = require("../lang");
 require("../FormulaFormatter/index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 class RowExpandFormulaFormatter extends _react.default.Component {
   constructor() {
     super(...arguments);
@@ -53,10 +54,11 @@ class RowExpandFormulaFormatter extends _react.default.Component {
           position: 'relative'
         };
       }
-      return /*#__PURE__*/_react.default.createElement("div", {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "d-flex align-items-center form-control disabled h-auto",
-        style: style
-      }, dom);
+        style: style,
+        children: dom
+      });
     };
     this.renderOtherColumnFormatter = () => {
       const {
@@ -92,27 +94,28 @@ class RowExpandFormulaFormatter extends _react.default.Component {
         formulaEmail = cellValue[0];
         formulaEmail = formulaEmail ? formulaEmail.trim() : '';
       }
-      return this.renderBorder( /*#__PURE__*/_react.default.createElement("div", {
-        className: "dtable-ui formula-formatter multiple"
-      }, cellValue.map((v, index) => {
-        formatterProps.value = v;
-        return /*#__PURE__*/_react.default.createElement("div", {
-          className: (0, _classnames.default)('formula-formatter-content-item', {
-            'simple-cell-formatter': (0, _utils.isSimpleCellFormatter)(array_type)
-          }, {
-            'formula-url-formatter-column': formulaUrl || formulaEmail
-          }),
-          key: "formula-formatter-content-item-".concat(index)
-        }, formulaUrl && /*#__PURE__*/_react.default.createElement("span", {
-          "aria-hidden": "true",
-          className: "dtable-font dtable-icon-url formula-url-link",
-          onClick: this.onOpenUrlLink.bind(this, formulaUrl)
-        }), formulaEmail && /*#__PURE__*/_react.default.createElement("span", {
-          "aria-hidden": "true",
-          className: "dtable-font dtable-icon-email formula-email-link",
-          onClick: this.onOpenEmailLink.bind(this, formulaEmail)
-        }), this.createColumnFormatter(Formatter, formatterProps));
-      })));
+      return this.renderBorder( /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "dtable-ui formula-formatter multiple",
+        children: cellValue.map((v, index) => {
+          formatterProps.value = v;
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            className: (0, _classnames.default)('formula-formatter-content-item', {
+              'simple-cell-formatter': (0, _utils.isSimpleCellFormatter)(array_type)
+            }, {
+              'formula-url-formatter-column': formulaUrl || formulaEmail
+            }),
+            children: [formulaUrl && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+              "aria-hidden": "true",
+              className: "dtable-font dtable-icon-url formula-url-link",
+              onClick: this.onOpenUrlLink.bind(this, formulaUrl)
+            }), formulaEmail && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+              "aria-hidden": "true",
+              className: "dtable-font dtable-icon-email formula-email-link",
+              onClick: this.onOpenEmailLink.bind(this, formulaEmail)
+            }), this.createColumnFormatter(Formatter, formatterProps)]
+          }, "formula-formatter-content-item-".concat(index));
+        })
+      }));
     };
     this.getFormatterProps = (array_type, array_data, collaborators) => {
       switch (array_type) {
@@ -149,9 +152,13 @@ class RowExpandFormulaFormatter extends _react.default.Component {
         ...formatterProps
       });
     } else if ((0, _utils.isFunction)(Formatter)) {
-      return /*#__PURE__*/_react.default.createElement(Formatter, formatterProps);
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(Formatter, {
+        ...formatterProps
+      });
     } else {
-      return /*#__PURE__*/_react.default.createElement(_TextFormatter.default, formatterProps);
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextFormatter.default, {
+        ...formatterProps
+      });
     }
   }
   render() {
@@ -188,11 +195,12 @@ class RowExpandFormulaFormatter extends _react.default.Component {
     if (result_type === _dtableUtils.FORMULA_RESULT_TYPE.NUMBER) {
       className = className + ' text-right';
     }
-    return this.renderBorder( /*#__PURE__*/_react.default.createElement("div", {
+    return this.renderBorder( /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: className,
       title: formattedValue,
-      "aria-label": formattedValue
-    }, formattedValue));
+      "aria-label": formattedValue,
+      children: formattedValue
+    }));
   }
 }
 exports.default = RowExpandFormulaFormatter;

package/lib/RowExpandImageFormatter/index.js

@@ -11,6 +11,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _rowExpandImageItemFormatter = _interopRequireDefault(require("./row-expand-image-item-formatter"));
 var _ImagePreviewerLightbox = _interopRequireDefault(require("../ImagePreviewerLightbox"));
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 class RowExpandImageFormatter extends _react.default.Component {
   constructor(props) {
     super(props);
@@ -62,33 +63,35 @@ class RowExpandImageFormatter extends _react.default.Component {
     if (!Array.isArray(value) || value.length === 0) {
       return null;
     }
-    return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)('dtable-ui cell-formatter-container row-expand-image-formatter', containerClassName)
-    }, value.map((item, index) => {
-      return /*#__PURE__*/_react.default.createElement(_rowExpandImageItemFormatter.default, {
-        url: item,
-        key: index,
-        index: index,
-        column: column,
-        downloadFile: downloadImage,
-        deleteFile: this.props.deleteFile,
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: (0, _classnames.default)('dtable-ui cell-formatter-container row-expand-image-formatter', containerClassName),
+        children: value.map((item, index) => {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_rowExpandImageItemFormatter.default, {
+            url: item,
+            index: index,
+            column: column,
+            downloadFile: downloadImage,
+            deleteFile: this.props.deleteFile,
+            readOnly: readOnly,
+            onImageClick: this.onImageClick
+          }, index);
+        })
+      }), isPreviewImage && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImagePreviewerLightbox.default, {
+        imageItems: value,
+        imageIndex: previewImageIndex,
+        closeImagePopup: this.closeImagePopup,
+        moveToPrevImage: this.movePrev,
+        moveToNextImage: this.moveNext,
+        deleteImage: this.props.deleteFile,
+        downloadImage: downloadImage,
+        onRotateImage: this.props.rotateImage,
         readOnly: readOnly,
-        onImageClick: this.onImageClick
-      });
-    })), isPreviewImage && /*#__PURE__*/_react.default.createElement(_ImagePreviewerLightbox.default, {
-      imageItems: value,
-      imageIndex: previewImageIndex,
-      closeImagePopup: this.closeImagePopup,
-      moveToPrevImage: this.movePrev,
-      moveToNextImage: this.moveNext,
-      deleteImage: this.props.deleteFile,
-      downloadImage: downloadImage,
-      onRotateImage: this.props.rotateImage,
-      readOnly: readOnly,
-      server: server,
-      moveToPrevRowImage: this.props.moveToPrevRowImage,
-      moveToNextRowImage: this.props.moveToNextRowImage
-    }));
+        server: server,
+        moveToPrevRowImage: this.props.moveToPrevRowImage,
+        moveToNextRowImage: this.props.moveToNextRowImage
+      })]
+    });
   }
 }
 exports.default = RowExpandImageFormatter;