dtable-ui-component 7.0.15 → 7.0.17

package/lib/DTableColorPicker/index.js

@@ -1,11 +1,12 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactstrap = require("reactstrap");
 var _reactColor = require("react-color");
@@ -179,10 +180,9 @@ const DTableColorPicker = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
       setSpecColor(value[specColor]);
       return;
     }
-    const newValue = {
-      ...value,
+    const newValue = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, value), {}, {
       [specColor]: val
-    };
+    });
     updateValue(newValue);
   };
   const updateValue = newValue => {
@@ -195,10 +195,9 @@ const DTableColorPicker = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
       setAlphaVal((0, _utils.toPercentage)(value.a));
       return;
     }
-    const newValue = {
-      ...value,
+    const newValue = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, value), {}, {
       a: parseFloat(alphaVal) / 100
-    };
+    });
     updateValue(newValue);
   };
   const onKeyDown = (event, callBack) => {
@@ -246,18 +245,18 @@ const DTableColorPicker = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
         children: colors.map((color, index) => {
           const isLight = (0, _utils.isLightColor)(color);
           return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-            className: `color-item mr-2 ${isLight ? '' : 'dark'}`,
+            className: "color-item mr-2 ".concat(isLight ? '' : 'dark'),
             onClick: () => onSelectDefaultColor(color),
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
               className: "colorinput-color d-flex align-items-center justify-content-center",
               style: {
                 backgroundColor: color
               },
-              children: color === `${(0, _utils.rgbaToHex)(value)}` && alphaVal === 100 && /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+              children: color === "".concat((0, _utils.rgbaToHex)(value)) && alphaVal === 100 && /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
                 className: "dtable-icon-color-check dtable-font dtable-icon-check-mark"
               })
             })
-          }, `default-color-${index}`);
+          }, "default-color-".concat(index));
         })
       })]
     });
@@ -271,7 +270,7 @@ const DTableColorPicker = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
         color: value,
         onChange: onChangeChromePicker
       }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: `color-setting d-flex align-items-center ${colorMode}`,
+        className: "color-setting d-flex align-items-center ".concat(colorMode),
         children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
           className: "mode-btn d-flex",
           onClick: onChangeMode,
@@ -345,7 +344,7 @@ const DTableColorPicker = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
           children: currentUsedColors.map((color, index) => {
             const isLight = (0, _utils.isLightColor)(color);
             return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-              className: `color-item mr-2 ${isLight ? '' : 'dark'}`,
+              className: "color-item mr-2 ".concat(isLight ? '' : 'dark'),
               onClick: () => onSelectDefaultColor(color),
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
                 className: "colorinput-color d-flex align-items-center justify-content-center",
@@ -353,7 +352,7 @@ const DTableColorPicker = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
                   backgroundColor: color
                 }
               })
-            }, `default-color-${index}`);
+            }, "default-color-".concat(index));
           })
         }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           className: "blank-placeholder d-flex align-items-center justify-content-center",

package/lib/DTableColorPicker/utils.js

@@ -54,7 +54,7 @@ const rgbaToHex = function (color) {
     return hex.length === 1 ? '0' + hex : hex;
   };
   const alpha = a !== undefined && a !== 1 ? toHex(Math.round(a * 255)) : '';
-  return `${isNeedPrefix ? '#' : ''}${toHex(r)}${toHex(g)}${toHex(b)}${isNeedAlpha ? alpha : ''}`;
+  return "".concat(isNeedPrefix ? '#' : '').concat(toHex(r)).concat(toHex(g)).concat(toHex(b)).concat(isNeedAlpha ? alpha : '');
 };
 exports.rgbaToHex = rgbaToHex;
 const isLightColor = color => {

package/lib/DTableCommonAddTool/index.js

@@ -18,11 +18,11 @@ function DTableCommonAddTool(_ref) {
     style
   } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: `dtable-ui add-item-btn ${className ? className : ''}`,
+    className: "dtable-ui add-item-btn ".concat(className ? className : ''),
     style: style,
     onClick: e => callBack(e),
     children: [!hideIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-      className: `dtable-font dtable-icon-add-table ${addIconClassName || ''}`
+      className: "dtable-font dtable-icon-add-table ".concat(addIconClassName || '')
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       className: "add-new-option text-truncate",
       children: footerName

package/lib/DTableDropdownItem/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _reactstrap = require("reactstrap");
@@ -31,11 +32,10 @@ const DTableDropdownItem = _ref => {
     tabIndex
   } = _ref;
   if (divider) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.DropdownItem, {
-      ...itemProps,
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.DropdownItem, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, itemProps), {}, {
       divider: true,
       className: className
-    });
+    }));
   }
   const renderedIcon = () => {
     if (!icon || ! /*#__PURE__*/_react.default.isValidElement(icon)) return null;
@@ -44,9 +44,7 @@ const DTableDropdownItem = _ref => {
       'aria-hidden': 'true'
     });
   };
-  let customItemProps = {
-    ...itemProps
-  };
+  let customItemProps = (0, _objectSpread2.default)({}, itemProps);
   if (typeof onClick === 'function') {
     customItemProps.onClick = onClick;
   }
@@ -59,11 +57,11 @@ const DTableDropdownItem = _ref => {
   if (typeof tabIndex === 'number') {
     customItemProps.tabIndex = tabIndex;
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactstrap.DropdownItem, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactstrap.DropdownItem, (0, _objectSpread2.default)((0, _objectSpread2.default)({
     className: className,
     disabled: disabled,
-    id: id,
-    ...customItemProps,
+    id: id
+  }, customItemProps), {}, {
     children: [(leftSlotContent || showChecked) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
       className: "dtable-dropdown-item-left-slot",
       children: [checked && /*#__PURE__*/(0, _jsxRuntime.jsx)(_svgIcon.default, {
@@ -89,6 +87,6 @@ const DTableDropdownItem = _ref => {
       }],
       children: tooltip
     })]
-  });
+  }));
 };
 var _default = exports.default = DTableDropdownItem;

package/lib/DTableDropdownMenu/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _reactstrap = require("reactstrap");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -19,9 +20,7 @@ const DTableDropdownMenu = _ref => {
     menuProps,
     children
   } = _ref;
-  let customMenuProps = {
-    ...menuProps
-  };
+  let customMenuProps = (0, _objectSpread2.default)({}, menuProps);
   customMenuProps.modifiers = [{
     name: 'preventOverflow',
     options: {
@@ -40,11 +39,11 @@ const DTableDropdownMenu = _ref => {
   if (typeof flip === 'boolean') {
     customMenuProps.flip = flip;
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.DropdownMenu, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.DropdownMenu, (0, _objectSpread2.default)((0, _objectSpread2.default)({
     id: id,
-    className: (0, _classnames.default)('dtable-dropdown-menu', className),
-    ...customMenuProps,
+    className: (0, _classnames.default)('dtable-dropdown-menu', className)
+  }, customMenuProps), {}, {
     children: children
-  });
+  }));
 };
 var _default = exports.default = DTableDropdownMenu;

package/lib/DTableFiltersPopover/index.js

@@ -156,7 +156,7 @@ var _jsxRuntime = require("react/jsx-runtime");
           firstDayOfWeek: firstDayOfWeek,
           updateFilters: this.updateFilters
         }), !isSupportAdvanced && !readOnly && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableCommonAddTool.default, {
-          className: `popover-add-tool ${canAddFilter ? '' : 'disabled'}`,
+          className: "popover-add-tool ".concat(canAddFilter ? '' : 'disabled'),
           callBack: canAddFilter ? () => this.addFilter() : () => {},
           footerName: (0, _lang.getLocale)('Add_filter'),
           addIconClassName: "popover-add-icon"

package/lib/DTableFiltersPopover/utils/index.js

@@ -407,7 +407,7 @@ const getMediaUrl = () => {
 };
 const generateDefaultUser = name => {
   const mediaUrl = getMediaUrl();
-  const defaultAvatarUrl = `${mediaUrl}avatars/default.png`;
+  const defaultAvatarUrl = "".concat(mediaUrl, "avatars/default.png");
   return {
     name,
     email: name,

package/lib/DTableFiltersPopover/widgets/filter-group.js

@@ -146,7 +146,7 @@ class FilterGroup extends _react.Component {
           updateConjunction: this.modifyConjunctionInGroup,
           deleteFilter: this.deleteFilterInGroup,
           updateFilter: this.updateFilterInGroup
-        }, `filter-in-group-${groupIndex}-${subFilterIndex}`);
+        }, "filter-in-group-".concat(groupIndex, "-").concat(subFilterIndex));
       });
     };
   }
@@ -157,7 +157,7 @@ class FilterGroup extends _react.Component {
       readOnly
     } = this.props;
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: (0, _classnames.default)('filter-item', 'filter-group', `level-${level}`),
+      className: (0, _classnames.default)('filter-item', 'filter-group', "level-".concat(level)),
       children: [!readOnly && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "delete-filter seatable-icon-btn",
         onClick: this.deleteFilterGroup,

package/lib/DTableFiltersPopover/widgets/filter-item.js

@@ -794,7 +794,7 @@ class FilterItem extends _react.default.Component {
               isLocked: readOnly
             })
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-            className: `filter-predicate ml-2 ${_isCheckboxColumn ? 'filter-checkbox-predicate' : ''}`,
+            className: "filter-predicate ml-2 ".concat(_isCheckboxColumn ? 'filter-checkbox-predicate' : ''),
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableCustomizeSelect.default, {
               value: activePredicate,
               options: filterPredicateOptions,

package/lib/DTableFiltersPopover/widgets/filter-list/index.js

@@ -261,7 +261,7 @@ class FiltersList extends _react.Component {
           modifyConjunctionInGroup: this.modifyConjunctionInGroup,
           deleteFilterInGroup: this.deleteFilterInGroup,
           updateFilterInGroup: this.updateFilterInGroup
-        }, `filter-group-${index}`);
+        }, "filter-group-".concat(index));
       }
       const {
         error_message

package/lib/DTableFiltersPopover/widgets/rate-item.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _react = _interopRequireDefault(require("react"));
 var _DTableToolTip = _interopRequireDefault(require("../../DTableToolTip"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -56,20 +57,19 @@ class RateItem extends _react.default.Component {
     };
     let style = itemStyle;
     if (enterRateItemIndex >= rateItemIndex) {
-      style = {
-        ...itemStyle,
+      style = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, itemStyle), {}, {
         color: rate_style_color,
         opacity: 0.4
-      };
+      });
     }
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       onMouseEnter: this.onMouseEnterRateItem,
       onMouseLeave: this.onMouseLeaveRateItem,
       style: style,
       onClick: this.onChangeRateNumber,
-      className: `rate-item ${value >= rateItemIndex ? 'rate-item-active' : ''}`,
+      className: "rate-item ".concat(value >= rateItemIndex ? 'rate-item-active' : ''),
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: `dtable-font ${rateShowType}`,
+        className: "dtable-font ".concat(rateShowType),
         ref: this.tooltipRef
       }), editable && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableToolTip.default, {
         placement: "bottom",

package/lib/DTableIcon/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _svgIcon = _interopRequireDefault(require("./svg-icon"));
 require("./index.css");
@@ -23,15 +24,14 @@ const DTableIcon = _ref => {
     if (ariaHidden) {
       customProps['aria-hidden'] = ariaHidden;
     }
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("i", (0, _objectSpread2.default)({
       className: (0, _classnames.default)(symbol, className, {
         'dtable-font': !symbol.includes('dtable-font')
       }),
       style: {
         color
-      },
-      ...customProps
-    });
+      }
+    }, customProps));
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_svgIcon.default, {
     symbol: symbol,

package/lib/DTableIcon/svg-icon.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _jsxRuntime = require("react/jsx-runtime");
 let svgIconComponents = null;
@@ -48,9 +49,8 @@ const SvgIcon = _ref => {
     IconComponent = getSvg(symbol);
   }
   if (!IconComponent) return null;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
-    className: (0, _classnames.default)('multicolor-icon', className, `multicolor-icon-${symbol}`),
-    ...props
-  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, (0, _objectSpread2.default)({
+    className: (0, _classnames.default)('multicolor-icon', className, "multicolor-icon-".concat(symbol))
+  }, props));
 };
 var _default = exports.default = SvgIcon;

package/lib/DTableModalHeader/index.js

@@ -5,26 +5,28 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
 var _reactstrap = require("reactstrap");
 var _IconButton = _interopRequireDefault(require("../IconButton"));
 require("./index.css");
 var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["children"];
 const DTableModalHeader = _ref => {
   let {
-    children,
-    ...props
-  } = _ref;
+      children
+    } = _ref,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   const customCloseBtn = /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
     icon: "x",
     "aria-label": "Close",
     onClick: props.toggle,
     className: "modal-close-btn"
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.ModalHeader, {
-    ...props,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.ModalHeader, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
     close: customCloseBtn,
     children: children
-  });
+  }));
 };
 var _default = exports.default = DTableModalHeader;

package/lib/DTablePopover/index.js

@@ -70,7 +70,7 @@ class DTablePopover extends _react.default.Component {
       fade: false,
       hideArrow: hideArrow,
       innerClassName: innerClassName,
-      className: `dtable-popove ${popoverClassName}`,
+      className: "dtable-popove ".concat(popoverClassName),
       modifiers: modifiers,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         ref: ref => this.dtablePopoverRef = ref,

package/lib/DTableRadioGroup/index.js

@@ -49,7 +49,7 @@ class DTableRadioGroup extends _react.default.Component {
       options
     } = this.props;
     if (!this.btn || !this.slider || !Array.isArray(options)) return;
-    this.slider.style.width = `${100 / options.length}%`;
+    this.slider.style.width = "".concat(100 / options.length, "%");
     this.setSliderTransition();
   }
   componentDidUpdate(prevProps) {
@@ -77,13 +77,13 @@ class DTableRadioGroup extends _react.default.Component {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "radio-group-wrapper",
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: `radio-group-options ${readOnly ? 'read-only' : ''}`,
+        className: "radio-group-options ".concat(readOnly ? 'read-only' : ''),
         children: [options.map(option => {
           const isActive = activeOption === option ? true : false;
           const displayOption = optionsDisplay && optionsDisplay[option] || '';
           return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
             ref: ref => this.btn = ref,
-            className: `radio-group-button ${isActive ? 'active' : ''}`,
+            className: "radio-group-button ".concat(isActive ? 'active' : ''),
             "data-option": option,
             onClick: this.onSelectChanged,
             children: displayOption

package/lib/DTableSearchInput/index.js

@@ -82,6 +82,20 @@ class DtableSearchInput extends _react.Component {
         children: "\xD7"
       });
     };
+    this.renderExactMatch = () => {
+      const {
+        components = {}
+      } = this.props;
+      const {
+        ExactMatchIndicator
+      } = components;
+      if (/*#__PURE__*/_react.default.isValidElement(ExactMatchIndicator)) {
+        return ExactMatchIndicator;
+      } else if ((0, _utils.isFunction)(ExactMatchIndicator)) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(ExactMatchIndicator, {});
+      }
+      return null;
+    };
     this.state = {
       searchValue: props.value
     };
@@ -127,7 +141,7 @@ class DtableSearchInput extends _react.Component {
         onKeyDown: onKeyDown,
         disabled: disabled,
         style: style
-      }), this.renderClear()]
+      }), this.renderClear(), this.renderExactMatch()]
     });
   }
 }

package/lib/DTableSelect/dtable-select-label.js

@@ -15,7 +15,7 @@ function DTableSelectLabel(_ref) {
     isSelect = false
   } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: `${classname} w-100 d-flex justify-content-between`,
+    className: "".concat(classname, " w-100 d-flex justify-content-between"),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       children: name
     }), isSelect && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/lib/DTableSelect/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _react = _interopRequireDefault(require("react"));
 var _reactSelect = _interopRequireDefault(require("react-select"));
 var _utils = require("./utils");
@@ -33,13 +34,12 @@ class DTableSelect extends _react.default.Component {
       onMenuClose,
       components: userComponents
     } = this.props;
-    const mergedComponents = {
+    const mergedComponents = (0, _objectSpread2.default)({
       Option: _utils.Option,
       DropdownIndicator: _utils.DropdownIndicator,
       MenuList: _utils.MenuList,
-      ClearIndicator: _utils.ClearIndicator,
-      ...userComponents
-    };
+      ClearIndicator: _utils.ClearIndicator
+    }, userComponents);
     const processedOptions = (0, _utils.processOptionsWithClear)(options, isClearable);
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.default, {
       value: value,