rsuite 5.74.2 → 5.76.0

package/cjs/toaster/ToastContainer.js

@@ -7,6 +7,7 @@ exports.toastPlacements = exports.default = void 0;
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
+var _reactDom = require("react-dom");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _kebabCase = _interopRequireDefault(require("lodash/kebabCase"));
 var _Transition = _interopRequireDefault(require("../Animation/Transition"));
@@ -33,7 +34,8 @@ var useMessages = function useMessages() {
     var _ref = options || {},
       duration = _ref.duration,
       _ref$mouseReset = _ref.mouseReset,
-      mouseReset = _ref$mouseReset === void 0 ? true : _ref$mouseReset;
+      mouseReset = _ref$mouseReset === void 0 ? true : _ref$mouseReset,
+      container = _ref.container;
     var key = (0, _utils.guid)();
     setMessages(function (prevMessages) {
       return [].concat(prevMessages, [{
@@ -41,7 +43,8 @@ var useMessages = function useMessages() {
         visible: true,
         node: message,
         duration: duration,
-        mouseReset: mouseReset
+        mouseReset: mouseReset,
+        container: container
       }]);
     });
     return key;
@@ -115,15 +118,9 @@ var ToastContainer = /*#__PURE__*/_react.default.forwardRef(function (props, ref
   var elements = messages.map(function (item) {
     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, {
+      node = item.node,
+      container = item.container;
+    var toastWithTransition = /*#__PURE__*/_react.default.createElement(_Transition.default, {
       in: item.visible,
       exitedClassName: rootPrefix('toast-fade-exited'),
       exitingClassName: rootPrefix('toast-fade-exiting'),
@@ -142,12 +139,20 @@ var ToastContainer = /*#__PURE__*/_react.default.forwardRef(function (props, ref
         }),
         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,
+        mouseReset: mouseReset,
+        duration: duration
+      },
+      key: item.key
+    }, container ? /*#__PURE__*/(0, _reactDom.createPortal)(toastWithTransition, typeof container === 'function' ? container() : container) : toastWithTransition);
   });
   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);
+      callback === null || callback === void 0 || callback(selfRef);
     },
     className: classes
   }), elements);
@@ -161,7 +166,7 @@ ToastContainer.getInstance = function (props) {
     var renderCallback = function renderCallback() {
       resolve([containerRef, unmount]);
     };
-    var _render = (0, _utils.render)( /*#__PURE__*/_react.default.createElement(ToastContainer, (0, _extends2.default)({}, rest, {
+    var _render = (0, _utils.render)(/*#__PURE__*/_react.default.createElement(ToastContainer, (0, _extends2.default)({}, rest, {
         ref: containerRef,
         callback: renderCallback
       })), containerElement),

package/cjs/toaster/hooks/useDelayedClosure.js

@@ -34,8 +34,8 @@ function useDelayedClosure(props) {
       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();
+        (_mouseEnterRef$curren = mouseEnterRef.current) === null || _mouseEnterRef$curren === void 0 || _mouseEnterRef$curren.off();
+        (_mouseLeaveRef$curren = mouseLeaveRef.current) === null || _mouseLeaveRef$curren === void 0 || _mouseLeaveRef$curren.off();
       };
     }
   });

package/cjs/toaster/toaster.js

@@ -25,7 +25,7 @@ function createContainer(_x, _x2) {
  * @param containerId
  */
 function _createContainer() {
-  _createContainer = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(containerId, props) {
+  _createContainer = (0, _asyncToGenerator2.default)(/*#__PURE__*/_regenerator.default.mark(function _callee(containerId, props) {
     var _yield$ToastContainer, container;
     return _regenerator.default.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
@@ -51,10 +51,10 @@ function getContainer(containerId) {
   }
   return containers.get(containerId || defaultContainerId);
 }
-var toaster = function toaster(message) {
-  return toaster.push(message);
+var _toaster = function toaster(message) {
+  return _toaster.push(message);
 };
-toaster.push = function (message, options) {
+_toaster.push = function (message, options) {
   if (options === void 0) {
     options = {};
   }
@@ -70,16 +70,16 @@ toaster.push = function (message, options) {
     return (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.push(message, restOptions);
   });
 };
-toaster.remove = function (key) {
+_toaster.remove = function (key) {
   containers.forEach(function (c) {
     var _c$current;
     return (_c$current = c.current) === null || _c$current === void 0 ? void 0 : _c$current.remove(key);
   });
 };
-toaster.clear = function () {
+_toaster.clear = function () {
   containers.forEach(function (c) {
     var _c$current2;
     return (_c$current2 = c.current) === null || _c$current2 === void 0 ? void 0 : _c$current2.clear();
   });
 };
-var _default = exports.default = toaster;
+var _default = exports.default = _toaster;

package/cjs/useToaster/useToaster.js

@@ -32,7 +32,7 @@ var useToaster = function useToaster() {
        */
       push: function push(message, options) {
         var _toasters$current;
-        var customToaster = toasters === null || toasters === void 0 ? void 0 : (_toasters$current = toasters.current) === null || _toasters$current === void 0 ? void 0 : _toasters$current.get((options === null || options === void 0 ? void 0 : options.placement) || 'topCenter');
+        var customToaster = toasters === null || toasters === void 0 || (_toasters$current = toasters.current) === null || _toasters$current === void 0 ? void 0 : _toasters$current.get((options === null || options === void 0 ? void 0 : options.placement) || 'topCenter');
         return customToaster ? customToaster.push(message, options) : _toaster.default.push(message, options);
       },
       /**

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

@@ -337,6 +337,7 @@
   --rs-badge-text: var(--rs-gray-0);
   --rs-close-button-hover-color: var(--rs-color-red);
   --rs-tag-bg: var(--rs-gray-50);
+  --rs-card-bg: var(--rs-gray-0);
   --rs-carousel-bg: var(--rs-gray-600);
   --rs-carousel-indicator: rgb(from var(--rs-gray-0) r g b / 40%);
   --rs-carousel-indicator-hover: var(--rs-gray-0);
@@ -376,6 +377,7 @@
   --rs-popover-shadow: 0 1px 8px rgba(0, 0, 0, 0.12);
   --rs-tree-indent-line-color: rgba(0, 0, 0, 0.1);
   --rs-scroll-view-shadow-color: rgba(9, 9, 9, 0.2);
+  --rs-stat-body-bg: var(--rs-gray-0);
 }
 @supports not (color: rgb(from white r g b)) {
   :root,
@@ -721,6 +723,7 @@
   --rs-badge-text: var(--rs-gray-0);
   --rs-close-button-hover-color: var(--rs-color-red);
   --rs-tag-bg: var(--rs-gray-600);
+  --rs-card-bg: var(--rs-gray-900);
   --rs-carousel-bg: var(--rs-gray-600);
   --rs-carousel-indicator: rgb(from var(--rs-gray-0) r g b / 40%);
   --rs-carousel-indicator-hover: var(--rs-gray-0);
@@ -758,6 +761,7 @@
   --rs-popover-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
   --rs-tree-indent-line-color: rgba(255, 255, 255, 0.1);
   --rs-scroll-view-shadow-color: rgba(0, 0, 0, 0.99);
+  --rs-stat-body-bg: var(--rs-gray-900);
 }
 @supports not (color: rgb(from white r g b)) {
   .rs-theme-dark {
@@ -1104,6 +1108,7 @@
   --rs-badge-text: var(--rs-gray-0);
   --rs-close-button-hover-color: var(--rs-color-red);
   --rs-tag-bg: var(--rs-gray-600);
+  --rs-card-bg: var(--rs-gray-900);
   --rs-carousel-bg: var(--rs-gray-600);
   --rs-carousel-indicator: rgb(from var(--rs-gray-0) r g b / 40%);
   --rs-carousel-indicator-hover: var(--rs-gray-0);
@@ -1145,6 +1150,7 @@
   --rs-popover-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
   --rs-tree-indent-line-color: rgba(255, 255, 255, 0.1);
   --rs-scroll-view-shadow-color: rgba(0, 0, 0, 0.99);
+  --rs-stat-body-bg: var(--rs-gray-900);
 }
 @supports not (color: rgb(from white r g b)) {
   .rs-theme-high-contrast {
@@ -3609,6 +3615,77 @@ tbody.rs-anim-collapse.rs-anim-in {
             transform: translateY(0);
   }
 }
+.rs-card {
+  --rs-card-width: 100%;
+  --rs-card-padding: 16px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  border-radius: 6px;
+  overflow: hidden;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  position: relative;
+  width: var(--rs-card-width);
+}
+.rs-card-bordered {
+  border: 1px solid #e5e5ea;
+  border: 1px solid var(--rs-border-primary);
+  background-color: #fff;
+  background-color: var(--rs-card-bg);
+}
+.rs-card-shaded {
+  -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.12), 0 0 10px rgba(0, 0, 0, 0.06);
+  -webkit-box-shadow: var(--rs-panel-shadow);
+          box-shadow: 0 4px 4px rgba(0, 0, 0, 0.12), 0 0 10px rgba(0, 0, 0, 0.06);
+          box-shadow: var(--rs-panel-shadow);
+}
+.rs-card-shaded-hover:hover {
+  -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.12), 0 0 10px rgba(0, 0, 0, 0.06);
+  -webkit-box-shadow: var(--rs-panel-shadow);
+          box-shadow: 0 4px 4px rgba(0, 0, 0, 0.12), 0 0 10px rgba(0, 0, 0, 0.06);
+          box-shadow: var(--rs-panel-shadow);
+  cursor: pointer;
+}
+.rs-card-sm {
+  --rs-card-padding: 8px;
+}
+.rs-card-md {
+  --rs-card-padding: 16px;
+}
+.rs-card-lg {
+  --rs-card-padding: 24px;
+}
+.rs-card-row {
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: row;
+          flex-direction: row;
+}
+.rs-card-header {
+  padding: var(--rs-card-padding) var(--rs-card-padding) 0 var(--rs-card-padding);
+}
+.rs-card-body {
+  padding: var(--rs-card-padding);
+}
+.rs-card-footer {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  gap: 8px;
+  padding: 0 var(--rs-card-padding) var(--rs-card-padding) var(--rs-card-padding);
+}
+.rs-card-group {
+  --rs-columns: 4;
+  --rs-spacing: 20px;
+  display: grid;
+  grid-template-columns: repeat(var(--rs-columns), 1fr);
+  grid-gap: var(--rs-spacing);
+}
 .rs-carousel {
   position: relative;
   height: 400px;
@@ -8177,6 +8254,40 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
 .rs-btn-icon-circle {
   border-radius: 50% !important;
 }
+.rs-image {
+  --rs-object-fit: cover;
+  --rs-object-position: initial;
+  -o-object-fit: var(--rs-object-fit);
+     object-fit: var(--rs-object-fit);
+  -o-object-position: var(--rs-object-position);
+     object-position: var(--rs-object-position);
+  max-width: 100%;
+}
+.rs-image-rounded {
+  border-radius: 6px;
+}
+.rs-image-circle {
+  border-radius: 50%;
+}
+.rs-image-bordered {
+  border: 1px solid #e5e5ea;
+  border: 1px solid var(--rs-border-primary);
+}
+.rs-image-zoomed {
+  -webkit-transition: -webkit-transform 0.3s ease-in-out;
+  transition: -webkit-transform 0.3s ease-in-out;
+  transition: transform 0.3s ease-in-out;
+  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
+  cursor: pointer;
+}
+.rs-image-zoomed:hover {
+  -webkit-transform: matrix(1.25, 0, 0, 1.25, 0, 0);
+          transform: matrix(1.25, 0, 0, 1.25, 0, 0);
+}
+.rs-image-wrapper {
+  position: relative;
+  overflow: hidden;
+}
 .rs-input {
   display: block;
   width: 100%;
@@ -9155,19 +9266,13 @@ textarea.rs-inline-edit-sm .rs-plaintext {
 }
 .rs-list {
   position: relative;
-  -webkit-box-shadow: 0 1px 0 #e5e5ea, 0 -1px 0 #e5e5ea;
-  -webkit-box-shadow: 0 1px 0 var(--rs-list-border), 0 -1px 0 var(--rs-list-border);
-          box-shadow: 0 1px 0 #e5e5ea, 0 -1px 0 #e5e5ea;
-          box-shadow: 0 1px 0 var(--rs-list-border), 0 -1px 0 var(--rs-list-border);
   overflow-x: hidden;
   overflow-y: auto;
 }
 .rs-list-bordered {
   border-radius: 6px;
-  -webkit-box-shadow: 0 0 0 1px #e5e5ea;
-  -webkit-box-shadow: 0 0 0 1px var(--rs-list-border);
-          box-shadow: 0 0 0 1px #e5e5ea;
-          box-shadow: 0 0 0 1px var(--rs-list-border);
+  border: 1px solid #e5e5ea;
+  border: 1px solid var(--rs-list-border);
 }
 .rs-list-hover .rs-list-item:hover {
   background-color: #f2faff;
@@ -9201,14 +9306,14 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   padding-top: 8px;
   padding-bottom: 8px;
 }
+.rs-list-item-xs {
+  padding-top: 2px;
+  padding-bottom: 2px;
+}
 /* stylelint-disable-next-line */
 .rs-list-item {
   background-color: #fff;
   background-color: var(--rs-list-bg);
-  -webkit-box-shadow: 0 -1px 0 #e5e5ea, 0 1px 0 #e5e5ea;
-  -webkit-box-shadow: 0 -1px 0 var(--rs-list-border), 0 1px 0 var(--rs-list-border);
-          box-shadow: 0 -1px 0 #e5e5ea, 0 1px 0 #e5e5ea;
-          box-shadow: 0 -1px 0 var(--rs-list-border), 0 1px 0 var(--rs-list-border);
 }
 .rs-list-item-helper {
   position: absolute;
@@ -9246,6 +9351,10 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   border: 1px #3498ff dashed;
   border: 1px var(--rs-list-placeholder-border) dashed;
 }
+.rs-list-divider .rs-list-item + .rs-list-item {
+  border-top: 1px solid #e5e5ea;
+  border-top: 1px solid var(--rs-list-border);
+}
 .rs-loader {
   display: inline-block;
 }
@@ -13607,6 +13716,135 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   bottom: unset;
   top: -8px;
 }
+.rs-stat {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  gap: 10px;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+.rs-stat-icon {
+  width: 50px;
+  height: 50px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  border-radius: 6px;
+}
+.rs-stat-body {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  gap: 8px;
+  width: 100%;
+  margin: 0;
+}
+.rs-stat-bordered {
+  border: 1px solid #e5e5ea;
+  border: 1px solid var(--rs-border-primary);
+  background-color: #fff;
+  background-color: var(--rs-stat-body-bg);
+  border-radius: 6px;
+  padding: 16px;
+}
+.rs-stat-label {
+  font-weight: 100;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  color: #717273;
+  color: var(--rs-text-secondary);
+  gap: 6px;
+}
+.rs-stat-label-uppercase {
+  text-transform: uppercase;
+}
+.rs-stat-value {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  gap: 4px;
+  -webkit-box-align: baseline;
+      -ms-flex-align: baseline;
+          align-items: baseline;
+  font-size: 24px;
+  font-weight: 600;
+  line-height: 1;
+  margin: 0;
+}
+.rs-stat-value-unit {
+  font-size: 12px;
+  font-weight: 400;
+}
+.rs-stat-trend {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  gap: 2px;
+  border-radius: 4px;
+  font-weight: 600;
+  font-size: 12px;
+  line-height: 1;
+}
+.rs-stat-trend-up {
+  color: #007d0c;
+  color: var(--rs-green-900);
+}
+.rs-stat-trend-down {
+  color: #8f1300;
+  color: var(--rs-red-900);
+}
+.rs-stat-trend-default {
+  padding: 2px 6px;
+}
+.rs-stat-trend-default.rs-stat-trend-up {
+  background-color: #c8f0c7;
+  background-color: var(--rs-green-100);
+}
+.rs-stat-trend-default.rs-stat-trend-down {
+  background-color: #fccfcf;
+  background-color: var(--rs-red-100);
+}
+.rs-stat-trend-subtle.rs-stat-trend-up {
+  color: #37ab3c;
+  color: var(--rs-green-600);
+}
+.rs-stat-trend-subtle.rs-stat-trend-down {
+  color: #eb3626;
+  color: var(--rs-red-600);
+}
+.rs-stat-help-text {
+  color: #717273;
+  color: var(--rs-text-secondary);
+}
+.rs-stat .rs-progress-line {
+  padding: 0;
+}
+.rs-stat-group {
+  --rs-columns: 4;
+  --rs-spacing: 6px;
+  display: grid;
+  grid-template-columns: repeat(var(--rs-columns), 1fr);
+  grid-gap: var(--rs-spacing);
+}
 .rs-steps {
   min-height: 30px;
 }
@@ -16408,29 +16646,6 @@ textarea.rs-inline-edit-sm .rs-plaintext {
           box-shadow: 0 4px 4px rgba(0, 0, 0, 0.12), 0 0 10px rgba(0, 0, 0, 0.06);
           box-shadow: var(--rs-shadow-overlay);
 }
-.rs-toast-container .rs-toast-fade-entered,
-.rs-toast-container .rs-toast-fade-exiting {
-  -webkit-animation-fill-mode: forwards;
-          animation-fill-mode: forwards;
-}
-.rs-toast-container .rs-toast-fade-entered {
-  -webkit-animation-duration: 0.4s;
-          animation-duration: 0.4s;
-  -webkit-animation-timing-function: cubic-bezier(0.99, 0.44, 0.44, 1.35);
-          animation-timing-function: cubic-bezier(0.99, 0.44, 0.44, 1.35);
-}
-.rs-toast-container .rs-toast-fade-exited,
-.rs-toast-container .rs-toast-fade-entering {
-  opacity: 0;
-}
-.rs-toast-container .rs-toast-fade-exited {
-  -webkit-transform-origin: 100% 0;
-          transform-origin: 100% 0;
-  -webkit-transform: scaleY(0.8);
-          transform: scaleY(0.8);
-  max-height: 0;
-  overflow: hidden;
-}
 .rs-toast-container-top-center,
 .rs-toast-container-bottom-center {
   -webkit-box-align: center;
@@ -16478,7 +16693,30 @@ textarea.rs-inline-edit-sm .rs-plaintext {
 .rs-toast-container-bottom-end {
   bottom: 24px;
 }
-.rs-toast-container .rs-toast-fade-exiting {
+.rs-toast-fade-entered,
+.rs-toast-fade-exiting {
+  -webkit-animation-fill-mode: forwards;
+          animation-fill-mode: forwards;
+}
+.rs-toast-fade-entered {
+  -webkit-animation-duration: 0.4s;
+          animation-duration: 0.4s;
+  -webkit-animation-timing-function: cubic-bezier(0.99, 0.44, 0.44, 1.35);
+          animation-timing-function: cubic-bezier(0.99, 0.44, 0.44, 1.35);
+}
+.rs-toast-fade-exited,
+.rs-toast-fade-entering {
+  opacity: 0;
+}
+.rs-toast-fade-exited {
+  -webkit-transform-origin: 100% 0;
+          transform-origin: 100% 0;
+  -webkit-transform: scaleY(0.8);
+          transform: scaleY(0.8);
+  max-height: 0;
+  overflow: hidden;
+}
+.rs-toast-fade-exiting {
   -webkit-animation-duration: 0.3s;
           animation-duration: 0.3s;
   -webkit-animation-timing-function: cubic-bezier(0.64, 0.65, 0.57, 1.13);