rsuite 5.64.2 → 5.65.1

package/cjs/toaster/ToastContainer.js

@@ -30,13 +30,19 @@ var useMessages = function useMessages() {
     return key;
   }, [messages]);
   var push = (0, _react.useCallback)(function (message, options) {
+    var _ref = options || {},
+      duration = _ref.duration,
+      _ref$mouseReset = _ref.mouseReset,
+      mouseReset = _ref$mouseReset === void 0 ? true : _ref$mouseReset;
     var key = (0, _utils.guid)();
     setMessages(function (prevMessages) {
-      return [].concat(prevMessages, [(0, _extends2.default)({
+      return [].concat(prevMessages, [{
         key: key,
         visible: true,
-        node: message
-      }, options)]);
+        node: message,
+        duration: duration,
+        mouseReset: mouseReset
+      }]);
     });
     return key;
   }, []);
@@ -107,8 +113,17 @@ var ToastContainer = /*#__PURE__*/_react.default.forwardRef(function (props, ref
     };
   });
   var elements = messages.map(function (item) {
-    return /*#__PURE__*/_react.default.createElement(_Transition.default, {
-      key: item.key,
+    var mouseReset = item.mouseReset,
+      duration = item.duration,
+      node = item.node;
+    return /*#__PURE__*/_react.default.createElement(_ToastContext.default.Provider, {
+      value: {
+        usedToaster: true,
+        mouseReset: mouseReset,
+        duration: duration
+      },
+      key: item.key
+    }, /*#__PURE__*/_react.default.createElement(_Transition.default, {
       in: item.visible,
       exitedClassName: rootPrefix('toast-fade-exited'),
       exitingClassName: rootPrefix('toast-fade-exiting'),
@@ -116,31 +131,26 @@ var ToastContainer = /*#__PURE__*/_react.default.forwardRef(function (props, ref
       enteredClassName: rootPrefix('toast-fade-entered'),
       timeout: 300
     }, function (transitionProps, ref) {
-      var _item$node, _item$node$props, _item$node2, _item$node2$props;
+      var _node$props, _node$props2;
       var transitionClassName = transitionProps.className,
         rest = (0, _objectWithoutPropertiesLoose2.default)(transitionProps, _excluded2);
-      return /*#__PURE__*/_react.default.cloneElement(item.node, (0, _extends2.default)({}, rest, {
+      return /*#__PURE__*/_react.default.cloneElement(node, (0, _extends2.default)({}, rest, {
         ref: ref,
-        duration: item.duration,
-        // Remove the message after the specified time.
-        onClose: (0, _utils.createChainedFunction)((_item$node = item.node) === null || _item$node === void 0 ? void 0 : (_item$node$props = _item$node.props) === null || _item$node$props === void 0 ? void 0 : _item$node$props.onClose, function () {
+        duration: duration,
+        onClose: (0, _utils.createChainedFunction)((_node$props = node.props) === null || _node$props === void 0 ? void 0 : _node$props.onClose, function () {
           return remove(item.key);
         }),
-        className: merge(rootPrefix('toast'), (_item$node2 = item.node) === null || _item$node2 === void 0 ? void 0 : (_item$node2$props = _item$node2.props) === null || _item$node2$props === void 0 ? void 0 : _item$node2$props.className, transitionClassName)
+        className: merge(rootPrefix('toast'), (_node$props2 = node.props) === null || _node$props2 === void 0 ? void 0 : _node$props2.className, transitionClassName)
       }));
-    });
+    }));
   });
-  return /*#__PURE__*/_react.default.createElement(_ToastContext.default.Provider, {
-    value: {
-      usedToaster: true
-    }
-  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
+  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
     ref: function ref(selfRef) {
       rootRef.current = selfRef;
       callback === null || callback === void 0 ? void 0 : callback(selfRef);
     },
     className: classes
-  }), elements));
+  }), elements);
 });
 ToastContainer.getInstance = function (props) {
   var container = props.container,

package/cjs/toaster/ToastContext.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
 export interface ToastContextProps {
     usedToaster?: boolean;
+    duration?: number;
+    mouseReset?: boolean;
 }
 declare const ToastContext: React.Context<ToastContextProps>;
 export default ToastContext;

package/cjs/toaster/hooks/useDelayedClosure.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+interface UseDelayedClosureProps {
+    /**
+     * Callback function to be called when the closure is triggered.
+     */
+    onClose?: (event?: React.MouseEvent<HTMLButtonElement>) => void;
+    /**
+     * The duration (in milliseconds) after which the closure should be triggered.
+     */
+    duration: number;
+    /**
+     * Optional reference to the target element.
+     */
+    targetRef?: React.RefObject<HTMLElement>;
+    /**
+     * Reset the hide timer if the mouse moves over the target element.
+     */
+    mouseReset?: boolean;
+}
+/**
+ * A hook that delays the closure of the message box.
+ */
+declare function useDelayedClosure(props: UseDelayedClosureProps): {
+    clear: () => void;
+    reset: () => void;
+};
+export default useDelayedClosure;

package/cjs/toaster/hooks/useDelayedClosure.js

@@ -0,0 +1,47 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _react = require("react");
+var _on = _interopRequireDefault(require("dom-lib/on"));
+var _hooks = require("../../internals/hooks");
+var _ToastContext = _interopRequireDefault(require("../ToastContext"));
+/**
+ * A hook that delays the closure of the message box.
+ */
+function useDelayedClosure(props) {
+  var onClose = props.onClose,
+    durationProp = props.duration,
+    targetRef = props.targetRef;
+  var _useContext = (0, _react.useContext)(_ToastContext.default),
+    usedToaster = _useContext.usedToaster,
+    _useContext$duration = _useContext.duration,
+    duration = _useContext$duration === void 0 ? durationProp : _useContext$duration,
+    mouseReset = _useContext.mouseReset;
+  var mouseEnterRef = (0, _react.useRef)();
+  var mouseLeaveRef = (0, _react.useRef)();
+  var _useTimeout = (0, _hooks.useTimeout)(onClose, duration, usedToaster && duration > 0),
+    clear = _useTimeout.clear,
+    reset = _useTimeout.reset;
+  (0, _hooks.useMount)(function () {
+    if (targetRef !== null && targetRef !== void 0 && targetRef.current && mouseReset) {
+      if (mouseEnterRef.current || mouseLeaveRef.current) {
+        return;
+      }
+      mouseEnterRef.current = (0, _on.default)(targetRef.current, 'mouseenter', clear);
+      mouseLeaveRef.current = (0, _on.default)(targetRef.current, 'mouseleave', reset);
+      return function () {
+        var _mouseEnterRef$curren, _mouseLeaveRef$curren;
+        (_mouseEnterRef$curren = mouseEnterRef.current) === null || _mouseEnterRef$curren === void 0 ? void 0 : _mouseEnterRef$curren.off();
+        (_mouseLeaveRef$curren = mouseLeaveRef.current) === null || _mouseLeaveRef$curren === void 0 ? void 0 : _mouseLeaveRef$curren.off();
+      };
+    }
+  });
+  return {
+    clear: clear,
+    reset: reset
+  };
+}
+var _default = exports.default = useDelayedClosure;

package/dist/rsuite-no-reset-rtl.css

@@ -340,6 +340,7 @@
   --rs-list-placeholder-border: var(--rs-primary-500);
   --rs-timeline-indicator-bg: var(--rs-gray-300);
   --rs-timeline-indicator-active-bg: var(--rs-primary-500);
+  --rs-table-border-color: var(--rs-border-secondary);
   --rs-table-shadow: rgba(9, 9, 9, 0.08);
   --rs-table-sort: var(--rs-primary-500);
   --rs-table-resize: var(--rs-primary-500);
@@ -355,6 +356,8 @@
   --rs-picker-value: var(--rs-primary-700);
   --rs-picker-count-bg: var(--rs-primary-500);
   --rs-picker-count-text: #fff;
+  --rs-picker-state-error: var(--rs-state-error);
+  --rs-picker-state-error-outline: var(--rs-state-error-outline);
   --rs-calendar-today-bg: var(--rs-primary-500);
   --rs-calendar-today-text: #fff;
   --rs-calendar-range-bg: rgb(from var(--rs-primary-100) r g b / 50%);
@@ -713,6 +716,7 @@
   --rs-list-placeholder-border: var(--rs-primary-500);
   --rs-timeline-indicator-bg: var(--rs-gray-500);
   --rs-timeline-indicator-active-bg: var(--rs-primary-500);
+  --rs-table-border-color: var(--rs-border-secondary);
   --rs-table-shadow: rgba(9, 9, 9, 0.99);
   --rs-table-sort: var(--rs-primary-500);
   --rs-table-resize: var(--rs-primary-500);
@@ -1089,6 +1093,7 @@
   --rs-list-placeholder-border: var(--rs-primary-500);
   --rs-timeline-indicator-bg: var(--rs-gray-500);
   --rs-timeline-indicator-active-bg: var(--rs-primary-500);
+  --rs-table-border-color: var(--rs-border-secondary);
   --rs-table-shadow: rgba(9, 9, 9, 0.99);
   --rs-table-sort: var(--rs-primary-500);
   --rs-table-resize: var(--rs-primary-500);
@@ -4742,13 +4747,15 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
 }
 .rs-divider-vertical {
   display: inline-block;
-  height: 1em;
+  min-height: 1em;
+  height: 100%;
   width: 1px;
   vertical-align: middle;
   margin: 0 12px;
 }
 .rs-divider-horizontal {
   height: 1px;
+  width: 100%;
   margin: 24px 0;
 }
 .rs-divider-horizontal.rs-divider-with-text {
@@ -11997,6 +12004,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   -ms-flex-preferred-size: auto;
       flex-basis: auto;
   padding-right: 0;
+  padding-bottom: 12px;
   width: auto;
 }
 .rs-progress-line.rs-progress-line-vertical .rs-progress-line-bg {
@@ -13709,7 +13717,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   width: 100%;
   z-index: 4;
   border-top: 1px solid #f2f2f5;
-  border-top: 1px solid var(--rs-border-secondary);
+  border-top: 1px solid var(--rs-table-border-color);
   padding: 10px;
   background-color: #fff;
   background-color: var(--rs-bg-card);
@@ -13855,7 +13863,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   background-color: #fff;
   background-color: var(--rs-bg-card);
   border-bottom: 1px solid #f2f2f5;
-  border-bottom: 1px solid var(--rs-border-secondary);
+  border-bottom: 1px solid var(--rs-table-border-color);
 }
 .rs-table-cell.first {
   border-right-width: 0;
@@ -13894,7 +13902,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
 }
 .rs-table-cell-rowspan {
   border-bottom: 1px solid #f2f2f5 !important;
-  border-bottom: 1px solid var(--rs-border-secondary) !important;
+  border-bottom: 1px solid var(--rs-table-border-color) !important;
 }
 .rs-table-cell-full-text:hover {
   z-index: 1 !important;
@@ -14002,11 +14010,11 @@ textarea.rs-inline-edit-sm .rs-plaintext {
 }
 .rs-table-bordered {
   border: 1px solid #f2f2f5;
-  border: 1px solid var(--rs-border-secondary);
+  border: 1px solid var(--rs-table-border-color);
 }
 .rs-table-cell-bordered .rs-table-cell {
   border-left: 1px solid #f2f2f5;
-  border-left: 1px solid var(--rs-border-secondary);
+  border-left: 1px solid var(--rs-table-border-color);
 }
 .rs-table-column-group {
   position: absolute;
@@ -14017,7 +14025,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
 }
 .rs-table-column-group-header {
   border-bottom: 1px solid #f2f2f5;
-  border-bottom: 1px solid var(--rs-border-secondary);
+  border-bottom: 1px solid var(--rs-table-border-color);
   position: absolute;
   width: 100%;
 }
@@ -14028,7 +14036,11 @@ textarea.rs-inline-edit-sm .rs-plaintext {
 .rs-table-column-group-cell {
   position: absolute;
   border-left: 1px solid #f2f2f5;
-  border-left: 1px solid var(--rs-border-secondary);
+  border-left: 1px solid var(--rs-table-border-color);
+}
+.rs-table-row:not(.rs-table-row-rowspan) {
+  border-bottom: 1px solid #f2f2f5;
+  border-bottom: 1px solid var(--rs-table-border-color);
 }
 .rs-table-cell-expand-wrapper {
   margin-left: 10px;
@@ -15422,6 +15434,9 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   opacity: 0.3;
   cursor: not-allowed;
 }
+.rs-uploader-file-item-disabled:hover {
+  background-color: transparent !important;
+}
 .rs-uploader-picture .rs-uploader-file-item-disabled .rs-uploader-file-item-status {
   cursor: not-allowed;
 }
@@ -16670,13 +16685,19 @@ kbd.rs-text {
       -ms-flex-align: center;
           align-items: center;
 }
-.rs-picker-error > .rs-input-group {
-  border-color: #f44336 !important;
-  border-color: var(--rs-state-error) !important;
+.rs-picker-error > .rs-picker-input-group {
+  border-color: #f44336;
+  border-color: var(--rs-picker-state-error);
 }
-.rs-picker-error > .rs-input-group:focus-within {
-  outline: 3px solid rgb(from #f44336 r g b / 25%) !important;
-  outline: var(--rs-state-error-outline) !important;
+.rs-picker-error > .rs-picker-input-group:hover {
+  border-color: #f44336;
+  border-color: var(--rs-picker-state-error);
+}
+.rs-picker-error > .rs-picker-input-group:focus-within {
+  border-color: #f44336;
+  border-color: var(--rs-picker-state-error);
+  outline: 3px solid rgb(from #f44336 r g b / 25%);
+  outline: var(--rs-picker-state-error-outline);
 }
 .rs-picker-toggle {
   display: -webkit-inline-box;