rsuite 5.4.1 → 5.4.2

package/cjs/Overlay/Modal.js

@@ -94,7 +94,6 @@ var Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       open = props.open,
       _props$autoFocus = props.autoFocus,
       autoFocus = _props$autoFocus === void 0 ? true : _props$autoFocus,
-      onBackdropClick = props.onBackdropClick,
       onEsc = props.onEsc,
       onExit = props.onExit,
       onExiting = props.onExiting,
@@ -104,7 +103,7 @@ var Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       onEntered = props.onEntered,
       onClose = props.onClose,
       onOpen = props.onOpen,
-      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "children", "transition", "dialogTransitionTimeout", "style", "className", "container", "animationProps", "containerClassName", "keyboard", "enforceFocus", "backdrop", "backdropTransitionTimeout", "backdropStyle", "backdropClassName", "open", "autoFocus", "onBackdropClick", "onEsc", "onExit", "onExiting", "onExited", "onEnter", "onEntering", "onEntered", "onClose", "onOpen"]);
+      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "children", "transition", "dialogTransitionTimeout", "style", "className", "container", "animationProps", "containerClassName", "keyboard", "enforceFocus", "backdrop", "backdropTransitionTimeout", "backdropStyle", "backdropClassName", "open", "autoFocus", "onEsc", "onExit", "onExiting", "onExited", "onEnter", "onEntering", "onEntered", "onClose", "onOpen"]);
 
   var _useState = (0, _react.useState)(!open),
       exited = _useState[0],
@@ -161,17 +160,6 @@ var Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
 
     handleFocusDialog();
   });
-  var handleBackdropClick = (0, _utils2.useEventCallback)(function (event) {
-    if (event.target !== event.currentTarget) {
-      return;
-    }
-
-    onBackdropClick === null || onBackdropClick === void 0 ? void 0 : onBackdropClick(event);
-
-    if (backdrop === true) {
-      onClose === null || onClose === void 0 ? void 0 : onClose(event);
-    }
-  });
   var documentKeyDownListener = (0, _react.useRef)();
   var documentFocusListener = (0, _react.useRef)();
   var handleOpen = (0, _utils2.useEventCallback)(function () {
@@ -237,11 +225,6 @@ var Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   }
 
   var renderBackdrop = function renderBackdrop() {
-    var backdropPorps = {
-      style: backdropStyle,
-      onClick: handleBackdropClick
-    };
-
     if (Transition) {
       return /*#__PURE__*/_react.default.createElement(_Fade.default, {
         transitionAppear: true,
@@ -252,18 +235,19 @@ var Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
             rest = (0, _objectWithoutPropertiesLoose2.default)(fadeProps, ["className"]);
         return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
           "aria-hidden": true
-        }, rest, backdropPorps, {
+        }, rest, {
+          style: backdropStyle,
           ref: (0, _utils2.mergeRefs)(modal.setBackdropRef, ref),
           className: (0, _classnames.default)(backdropClassName, className)
         }));
       });
     }
 
-    return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
-      "aria-hidden": true
-    }, backdropPorps, {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      "aria-hidden": true,
+      style: backdropStyle,
       className: backdropClassName
-    }));
+    });
   };
 
   var dialogElement = Transition ? /*#__PURE__*/_react.default.createElement(Transition, (0, _extends2.default)({}, animationProps, {
@@ -280,12 +264,12 @@ var Modal = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   }), children) : children;
   return /*#__PURE__*/_react.default.createElement(_OverlayContext.default.Provider, {
     value: contextValue
-  }, /*#__PURE__*/_react.default.createElement(Portal, null, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
+  }, /*#__PURE__*/_react.default.createElement(Portal, null, backdrop && renderBackdrop(), /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
     ref: (0, _utils2.mergeRefs)(modal.setDialogRef, ref),
     style: style,
     className: className,
     tabIndex: -1
-  }), backdrop && renderBackdrop(), dialogElement)));
+  }), dialogElement)));
 });
 
 var modalPropTypes = {
@@ -312,8 +296,7 @@ Modal.propTypes = (0, _extends2.default)({}, _utils.animationPropTypes, modalPro
   dialogTransitionTimeout: _propTypes.default.number,
   backdropTransitionTimeout: _propTypes.default.number,
   transition: _propTypes.default.any,
-  onEsc: _propTypes.default.func,
-  onBackdropClick: _propTypes.default.func
+  onEsc: _propTypes.default.func
 });
 var _default = Modal;
 exports.default = _default;

package/cjs/utils/index.d.ts

@@ -40,3 +40,4 @@ export { default as useUpdatedRef } from './useUpdatedRef';
 export { default as useWillUnmount } from './useWillUnmount';
 export { default as useUpdateEffect } from './useUpdateEffect';
 export { default as useIsMounted } from './useIsMounted';
+export { default as useMount } from './useMount';

package/cjs/utils/index.js

@@ -41,13 +41,14 @@ var _exportNames = {
   useWillUnmount: true,
   useUpdateEffect: true,
   useIsMounted: true,
+  useMount: true,
   defaultClassPrefix: true,
   getClassNamePrefix: true,
   globalKey: true,
   DateUtils: true,
   TypeChecker: true
 };
-exports.TypeChecker = exports.DateUtils = exports.globalKey = exports.getClassNamePrefix = exports.defaultClassPrefix = exports.useIsMounted = exports.useUpdateEffect = exports.useWillUnmount = exports.useUpdatedRef = exports.useEventCallback = exports.stringToObject = exports.getSafeRegExpString = exports.useRootClose = exports.useControlled = exports.useTimeout = exports.createComponent = exports.usePortal = exports.useCustom = exports.useElementResize = exports.useEventListener = exports.useClassNames = exports.appendTooltip = exports.scrollTopAnimation = exports.reactToString = exports.composeFunctions = exports.shallowEqualArray = exports.shallowEqual = exports.mergeRefs = exports.getDOMNode = exports.placementPolyfill = exports.clone = exports.getDataGroupBy = exports.previewFile = exports.ajaxUpload = exports.tplTransform = exports.ReactChildren = exports.isOneOf = exports.createChainedFunction = exports.prefix = exports.guid = void 0;
+exports.TypeChecker = exports.DateUtils = exports.globalKey = exports.getClassNamePrefix = exports.defaultClassPrefix = exports.useMount = exports.useIsMounted = exports.useUpdateEffect = exports.useWillUnmount = exports.useUpdatedRef = exports.useEventCallback = exports.stringToObject = exports.getSafeRegExpString = exports.useRootClose = exports.useControlled = exports.useTimeout = exports.createComponent = exports.usePortal = exports.useCustom = exports.useElementResize = exports.useEventListener = exports.useClassNames = exports.appendTooltip = exports.scrollTopAnimation = exports.reactToString = exports.composeFunctions = exports.shallowEqualArray = exports.shallowEqual = exports.mergeRefs = exports.getDOMNode = exports.placementPolyfill = exports.clone = exports.getDataGroupBy = exports.previewFile = exports.ajaxUpload = exports.tplTransform = exports.ReactChildren = exports.isOneOf = exports.createChainedFunction = exports.prefix = exports.guid = void 0;
 
 var _BrowserDetection = require("./BrowserDetection");
 
@@ -234,4 +235,8 @@ exports.useUpdateEffect = _useUpdateEffect.default;
 
 var _useIsMounted = _interopRequireDefault(require("./useIsMounted"));
 
-exports.useIsMounted = _useIsMounted.default;
+exports.useIsMounted = _useIsMounted.default;
+
+var _useMount = _interopRequireDefault(require("./useMount"));
+
+exports.useMount = _useMount.default;

package/cjs/utils/useMount.d.ts

@@ -0,0 +1,2 @@
+declare const useMount: (callback: () => void) => void;
+export default useMount;

package/cjs/utils/useMount.js

@@ -0,0 +1,19 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _react = require("react");
+
+var useMount = function useMount(callback) {
+  var mountRef = (0, _react.useRef)(callback);
+  mountRef.current = callback;
+  (0, _react.useEffect)(function () {
+    var _mountRef$current;
+
+    (_mountRef$current = mountRef.current) === null || _mountRef$current === void 0 ? void 0 : _mountRef$current.call(mountRef);
+  }, []);
+};
+
+var _default = useMount;
+exports.default = _default;

package/dist/rsuite-rtl.css

@@ -8665,6 +8665,24 @@ textarea.rs-picker-search-input {
 .rs-theme-high-contrast .rs-message-error {
   border: 1px solid var(--rs-message-error-border);
 }
+.rs-modal-backdrop {
+  position: fixed;
+  top: 0;
+  right: 0;
+  width: 100vw;
+  height: 100vh;
+  z-index: 1049;
+  background-color: rgba(39, 44, 54, 0.3);
+  background-color: var(--rs-bg-backdrop);
+}
+.rs-modal-backdrop.rs-anim-fade {
+  opacity: 0;
+  -webkit-transition: opacity 0.3s ease-in;
+  transition: opacity 0.3s ease-in;
+}
+.rs-modal-backdrop.rs-anim-in {
+  opacity: 1;
+}
 .rs-modal-open {
   overflow: hidden;
 }
@@ -8673,9 +8691,9 @@ textarea.rs-picker-search-input {
   overflow: auto;
   z-index: 1050;
   top: 0;
-  bottom: 0;
-  left: 0;
   right: 0;
+  width: 100%;
+  height: 100%;
 }
 .rs-modal {
   display: none;
@@ -8719,23 +8737,6 @@ textarea.rs-picker-search-input {
           box-shadow: var(--rs-modal-shadow);
   padding: 20px;
 }
-.rs-modal-backdrop {
-  position: fixed;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-  background-color: rgba(39, 44, 54, 0.3);
-  background-color: var(--rs-bg-backdrop);
-}
-.rs-modal-backdrop.rs-anim-fade {
-  opacity: 0;
-  -webkit-transition: opacity 0.3s ease-in;
-  transition: opacity 0.3s ease-in;
-}
-.rs-modal-backdrop.rs-anim-in {
-  opacity: 1;
-}
 .rs-modal-header {
   padding-left: 20px;
 }
@@ -9179,6 +9180,9 @@ textarea.rs-picker-search-input {
 .rs-navbar-nav > .rs-dropdown .rs-dropdown-toggle {
   margin: 0 !important;
 }
+.rs-theme-high-contrast .rs-navbar-item.rs-navbar-item-active {
+  text-decoration: underline;
+}
 .rs-navbar-nav > .rs-dropdown .rs-dropdown-toggle {
   padding-left: 36px;
 }
@@ -9193,8 +9197,16 @@ textarea.rs-picker-search-input {
   top: 18px;
   left: 16px;
 }
-.rs-theme-high-contrast .rs-navbar-item.rs-navbar-item-active {
+.rs-navbar .rs-dropdown-item:hover {
+  background-color: rgba(204, 233, 255, 0.5);
+  background-color: var(--rs-menuitem-active-bg);
+  color: #1675e0;
+  color: var(--rs-menuitem-active-text);
+}
+.rs-theme-high-contrast .rs-navbar .rs-dropdown-item:hover {
   text-decoration: underline;
+  -webkit-box-shadow: inset 0 0 0 2px #fff;
+          box-shadow: inset 0 0 0 2px #fff;
 }
 .rs-navbar-default {
   background-color: #f7f7fa;