dtable-ui-component 6.0.122-beta.1 → 6.0.123-imk.4

package/lib/AsyncUserSelect/index.css

@@ -12,6 +12,11 @@
 .dtable-ui-user-select-popover .popover {
   width: 385px;
   max-width: 385px;
+  background: #fff;
+	border: 1px solid #eee;
+	border-radius: 4px;
+	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.1);
+  margin-top: -4px;
 }
 
 .dtable-ui-user-select-container {

package/lib/DTableColorPicker/ColorPickerPortal/index.js

@@ -72,7 +72,7 @@ function ColorPickerPortal(_ref) {
   }, [target, scrollContainerId, throttleDelay, updatePosition]);
   if (!target) return null;
   return /*#__PURE__*/_reactDom.default.createPortal(/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: "dtable-color-picker-portal",
+    className: "dtable-color-picker-portal dtable-popover-container",
     style: {
       position: 'fixed',
       zIndex: '1049',
@@ -82,7 +82,8 @@ function ColorPickerPortal(_ref) {
       height: '370px',
       visibility: position.visibility,
       opacity: isPositioned ? 1 : 0,
-      transition: 'opacity 0.15s ease-in-out'
+      transition: 'opacity 0.15s ease-in-out',
+      marginTop: '8px'
     },
     ref: containerRef,
     children: children

package/lib/DTableColorPicker/index.css

@@ -2,12 +2,11 @@
   width: 240px;
   height: 370px;
   background-color: #fff;
-  border-radius: 3px;
   z-index: 100;
   padding: 0.75rem;
   line-height: 16px;
   position: absolute;
-  box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px, rgba(0, 0, 0, 0.3) 0px 4px 4px;
+  margin-top: 8px;  
 }
 
 .dtable-color-picker .chrome-picker {

package/lib/DTableColorPicker/index.js

@@ -368,7 +368,7 @@ const DTableColorPicker = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       style: popoverStyle,
       ref: colorPickerRef,
-      className: "dtable-color-picker",
+      className: "dtable-color-picker dtable-popover-container",
       children: [renderDefaultContainer(), renderCustomContainer(), renderUsedContainer()]
     })
   });

package/lib/DTableCommonAddTool/index.css

@@ -4,11 +4,9 @@
   height: 40px;
   font-size: 14px;
   font-weight: 500;
-  border-top: 1px solid #dedede;
+  border-top: 1px solid #eee;
   background: #fff;
   padding: 0 1rem;
-  border-bottom-left-radius: 3px;
-  border-bottom-right-radius: 3px;
   position: relative;
 }
 

package/lib/DTableCustomFooter/index.css

@@ -4,9 +4,7 @@
   align-items: center;
   justify-content: flex-end;
   padding: 0.75rem;
-  border-top: 1px solid rgba(0, 40, 100, 0.12);
-  border-bottom-right-radius: 2px;
-  border-bottom-left-radius: 2px;
+  border-top: 1px solid #eee !important;
 }
 
 .dtable-custom-footer>* {

package/lib/DTableFiltersPopover/index.css

@@ -29,8 +29,6 @@
   font-weight: 500;
   background: #fff;
   color: #666;
-  border-bottom-left-radius: 3px;
-  border-bottom-right-radius: 3px;
   position: relative;
 }
 

package/lib/DTablePopover/index.js

@@ -70,11 +70,12 @@ class DTablePopover extends _react.default.Component {
       fade: false,
       hideArrow: hideArrow,
       innerClassName: innerClassName,
-      className: popoverClassName,
+      className: "dtable-popove ".concat(popoverClassName),
       modifiers: modifiers,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         ref: ref => this.dtablePopoverRef = ref,
         onClick: this.onPopoverInsideClick,
+        className: "dtable-popover-container",
         children: this.props.children
       })
     });

package/lib/DTableSwitch/index.css

@@ -32,7 +32,6 @@
   transform: scale(.8);
   display: inline-block;
   line-height: 24px;
-  margin-right: 8px;
 }
 
 .dtable-switch.sm .custom-switch .dtable-font.dtable-icon-use-help {

package/lib/ImagePreviewerLightbox/index.js

@@ -127,7 +127,7 @@ function ImagePreviewerLightbox(props) {
     downloadImageTip: (0, _lang.getLocale)('Download_image'),
     preLineMetadaTip: (0, _lang.getLocale)('Pre_Line'),
     nextLineMetadaTip: (0, _lang.getLocale)('Next_Line'),
-    closeMetadataTip: (0, _lang.getLocale)('Close')
+    closeTip: (0, _lang.getLocale)('Close')
   });
 }
 var _default = exports.default = ImagePreviewerLightbox;

package/lib/NotificationPopover/index.css

@@ -8,8 +8,6 @@
   width: 320px;
   right: -10px;
   top: -1px;
-  border-radius: 3px;
-  box-shadow: 0 0 5px #ccc;
 }
 
 .notification-container .notification-header {
@@ -17,7 +15,7 @@
   align-items: center;
   justify-content: center;
   height: 50px;
-  border-bottom: 1px solid #ededed;
+  border-bottom: 1px solid #eee;
   font-size: 16px;
   font-weight: 600;
   position: relative;
@@ -166,9 +164,6 @@
   justify-content: center;
   background: #f9f9f9;
   cursor: pointer;
-  border-bottom-right-radius: 3px;
-  border-bottom-left-radius: 3px;
-  border-top: 1px solid #ededed;
 }
 
 .notification-body .notification-footer:hover {

package/lib/NotificationPopover/index.js

@@ -56,7 +56,7 @@ class NotificationPopover extends _react.default.Component {
       hideArrow: true,
       placement: "bottom",
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: "notification-container",
+        className: "notification-container dtable-popover-container",
         ref: ref => this.notificationContainerRef = ref,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: "notification-header",
@@ -88,7 +88,7 @@ class NotificationPopover extends _react.default.Component {
               children: this.props.children
             })
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-            className: "notification-footer",
+            className: "notification-footer dtable-popover-footer",
             onClick: this.onNotificationDialogToggle,
             children: footerText
           })]

package/lib/SelectOptionGroup/index.css

@@ -7,11 +7,13 @@
   min-width: 100%;
   max-width: 15rem;
   padding: 0.5rem 0;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.1) !important;
   background: #fff;
-  border: 1px solid rgba(0, 40, 100, 0.12);
-  border-radius: 3px;
+  border: 1px solid #eee !important;
+  border-radius: 4px !important;
   z-index: 10001;
+	width: 100%;
+  margin-top: 4px !important;
 }
 
 .option-group .option-group-search {

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "dtable-ui-component",
-  "version": "6.0.122-beta.1",
+  "version": "6.0.123imk.4",
   "main": "./lib/index.js",
   "dependencies": {
-    "@seafile/react-image-lightbox": "5.0.9-beta.1",
+    "@seafile/react-image-lightbox": "5.0.9",
     "@seafile/seafile-calendar": "^1.0.10",
     "@seafile/seafile-editor": "^3.0.34",
     "classnames": "~2.5.*",