dtable-ui-component 6.0.117-xms.3 → 6.0.117-xms.8

package/lib/DTableModalHeader/index.js

@@ -10,7 +10,6 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireDefault(require("react"));
 var _reactstrap = require("reactstrap");
 var _IconButton = _interopRequireDefault(require("../IconButton"));
-var _lang = require("../lang");
 require("./index.css");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["children"];
@@ -27,8 +26,7 @@ const DTableModalHeader = _ref => {
     onClick: props.toggle,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
       icon: "x",
-      className: "dtable-modal-close-inner",
-      title: (0, _lang.getLocale)('Close')
+      className: "dtable-modal-close-inner"
     })
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.ModalHeader, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {

package/lib/DTableToolTip/index.css

@@ -1,15 +1,15 @@
 .dtable-tooltip {
-  position: absolute;
+  position: relative;
   z-index: 99999;
 }
 
 .dtable-tooltip .tooltip {
-  max-width: 242px;
-  min-width: max-content;
   opacity: 1;
 }
 
 .dtable-tooltip .tooltip .tooltip-inner {
+  width: fit-content;
+  max-width: 242px;
   font-size: 14px;
   text-align: start;
   background-color: var(--bs-body-color);

package/lib/IconButton/index.js

@@ -1,60 +1,33 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 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 = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
-var _DTableToolTip = _interopRequireDefault(require("../DTableToolTip"));
-var _dtableUtils = require("dtable-utils");
-require("../css/icon-button-styles.css");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["disabled", "className", "icon", "color", "children", "title", "tooltipPlacement", "outline", "noBackground"];
+const _excluded = ["disabled", "className", "icon", "children"];
 const IconButton = _ref => {
   let {
       disabled,
       className,
       icon,
-      color,
-      children,
-      title,
-      tooltipPlacement,
-      outline,
-      noBackground
+      children
     } = _ref,
     otherProperties = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  const buttonId = (0, _react.useMemo)(() => "dtable-icon-button-".concat((0, _dtableUtils.generatorBase64Code)(8)), []);
-  const [mounted, setMounted] = (0, _react.useState)(false);
-  (0, _react.useEffect)(() => {
-    setMounted(true);
-  }, []);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", (0, _objectSpread2.default)((0, _objectSpread2.default)({
-      id: buttonId,
-      className: (0, _classnames.default)('dtable-icon-btn', className, {
-        'disabled': disabled,
-        'outline': outline,
-        'no-background': noBackground
-      }),
-      "aria-label": title
-    }, otherProperties), {}, {
-      children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
-        className: (0, _classnames.default)('seatable-icon dtable-font', "dtable-icon-".concat(icon)),
-        "aria-hidden": "true",
-        style: color ? {
-          color
-        } : undefined
-      }), children]
-    })), title && mounted && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableToolTip.default, {
-      placement: tooltipPlacement || 'bottom',
-      target: buttonId,
-      children: title
-    })]
-  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", (0, _objectSpread2.default)((0, _objectSpread2.default)({
+    className: (0, _classnames.default)('seatable-icon-btn', className, {
+      'disabled': disabled
+    })
+  }, otherProperties), {}, {
+    children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+      className: (0, _classnames.default)('seatable-icon dtable-font', "dtable-icon-".concat(icon)),
+      "aria-hidden": "true"
+    }), children]
+  }));
 };
 var _default = exports.default = IconButton;

package/lib/NotificationPopover/index.js

@@ -8,7 +8,6 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactstrap = require("reactstrap");
 var _IconButton = _interopRequireDefault(require("../IconButton"));
-var _lang = require("../lang");
 require("./index.css");
 var _jsxRuntime = require("react/jsx-runtime");
 class NotificationPopover extends _react.default.Component {
@@ -63,8 +62,7 @@ class NotificationPopover extends _react.default.Component {
           className: "notification-header",
           children: [headerText, /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
             icon: "x",
-            onClick: this.props.onNotificationListToggle,
-            title: (0, _lang.getLocale)('Close')
+            onClick: this.props.onNotificationListToggle
           })]
         }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: "notification-body",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtable-ui-component",
-  "version": "6.0.117xms.3",
+  "version": "6.0.117xms.8",
   "main": "./lib/index.js",
   "dependencies": {
     "@seafile/react-image-lightbox": "^5.0.8",

package/lib/css/icon-button-styles.css

@@ -1,141 +0,0 @@
-.dtable-icon-btn {
-  display: inline-flex !important;
-  align-items: center !important;
-  justify-content: center !important;
-  padding: 0 !important;
-  border: none !important;
-  background-color: transparent !important;
-  color: #666666 !important;
-  cursor: pointer;
-  transition: all 0.2s ease !important;
-  outline: none !important;
-  border-radius: 3px !important;
-  min-width: 24px;
-  min-height: 24px;
-}
-
-.dtable-icon-btn:focus {
-  outline: none !important;
-  box-shadow: none !important;
-}
-
-.dtable-icon-btn:active:focus {
-  box-shadow: none !important;
-}
-
-.dtable-icon-btn.btn-lg,
-.dtable-icon-btn.size-lg {
-  min-width: 40px !important;
-  min-height: 40px !important;
-}
-
-.dtable-icon-btn.btn-lg .dtable-icon-btn__icon,
-.dtable-icon-btn.size-lg .dtable-icon-btn__icon {
-  font-size: 20px !important;
-}
-
-.dtable-icon-btn .dtable-icon-btn__icon {
-  font-size: 16px !important;
-}
-
-.dtable-icon-btn.btn-sm,
-.dtable-icon-btn.size-sm {
-  min-width: 24px !important;
-  min-height: 24px !important;
-}
-
-.dtable-icon-btn.btn-sm .dtable-icon-btn__icon,
-.dtable-icon-btn.size-sm .dtable-icon-btn__icon {
-  font-size: 14px !important;
-}
-
-.dtable-icon-btn.size-xs {
-  min-width: 20px !important;
-  min-height: 20px !important;
-}
-
-.dtable-icon-btn.size-xs .dtable-icon-btn__icon {
-  font-size: 12px !important;
-}
-
-.dtable-icon-btn:hover:not(:disabled) {
-  background-color: rgba(0, 0, 0, 0.04) !important;
-}
-
-.dtable-icon-btn:active:not(:disabled) {
-  background-color: rgba(0, 0, 0, 0.08) !important;
-}
-
-.dtable-icon-btn.outline,
-.dtable-icon-btn.outlined {
-  background-color: #FFFFFF !important;
-  border: 1px solid rgba(0, 40, 100, 0.12) !important;
-  color: #666666 !important;
-}
-
-.dtable-icon-btn.outline:hover:not(:disabled),
-.dtable-icon-btn.outlined:hover:not(:disabled) {
-  background-color: rgba(0, 0, 0, 0.04) !important;
-  border-color: rgba(0, 40, 100, 0.12) !important;
-}
-
-.dtable-icon-btn.outline:active:not(:disabled),
-.dtable-icon-btn.outlined:active:not(:disabled) {
-  background-color: rgba(0, 0, 0, 0.08) !important;
-  border-color: rgba(0, 40, 100, 0.12) !important;
-}
-
-.dtable-icon-btn.no-background,
-.dtable-icon-btn.no-display-bac {
-  background-color: transparent !important;
-}
-
-.dtable-icon-btn.no-background:hover:not(:disabled),
-.dtable-icon-btn.no-display-bac:hover:not(:disabled) {
-  background-color: transparent !important;
-}
-
-.dtable-icon-btn.no-background:active:not(:disabled),
-.dtable-icon-btn.no-display-bac:active:not(:disabled) {
-  background-color: transparent !important;
-}
-
-.dtable-icon-btn:disabled,
-.dtable-icon-btn.disabled {
-  opacity: 0.65 !important;
-  cursor: not-allowed !important;
-}
-
-.dtable-icon-btn__icon {
-  display: inline-block;
-  line-height: 1;
-  margin: 0;
-  font-weight: normal;
-}
-
-.dtable-icon-btn.btn-primary,
-.dtable-icon-btn.color-primary {
-  color: #FF8000 !important;
-}
-
-.dtable-icon-btn.btn-primary:hover:not(:disabled),
-.dtable-icon-btn.color-primary:hover:not(:disabled) {
-  color: #ED7109 !important;
-  background-color: rgba(255, 128, 0, 0.1) !important;
-}
-
-.dtable-icon-btn.btn-secondary,
-.dtable-icon-btn.color-secondary {
-  color: #212529 !important;
-}
-
-.dtable-icon-btn.btn-danger,
-.dtable-icon-btn.color-danger {
-  color: #dc3545 !important;
-}
-
-.dtable-icon-btn.btn-danger:hover:not(:disabled),
-.dtable-icon-btn.color-danger:hover:not(:disabled) {
-  color: #c82333 !important;
-  background-color: rgba(220, 53, 69, 0.1) !important;
-}