rsuite 5.11.0 → 5.13.1

package/cjs/Sidenav/SidenavItem.js

@@ -31,7 +31,16 @@ var _omit = _interopRequireDefault(require("lodash/omit"));
 
 var _Sidenav = require("./Sidenav");
 
+/**
+ * @private
+ */
 var SidenavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);
+
+  if (!sidenav) {
+    throw new Error('<SidenavItem> component is not supposed to be used standalone. Use <Nav.Item> inside <Sidenav> instead.');
+  }
+
   var _props$as = props.as,
       Component = _props$as === void 0 ? _SafeAnchor.default : _props$as,
       activeProp = props.active,
@@ -48,15 +57,10 @@ var SidenavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       divider = props.divider,
       panel = props.panel,
       rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "active", "children", "className", "disabled", "classPrefix", "icon", "eventKey", "style", "onClick", "onSelect", "divider", "panel"]);
-  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);
-
-  if (!sidenav) {
-    throw new Error('<SidenavItem> component is not supposed to be used standalone. Use <Nav.Item> inside <Sidenav> instead.');
-  }
 
-  var _useContext = (0, _react.useContext)(_NavContext.default),
-      activeKey = _useContext.activeKey,
-      onSelectFromNav = _useContext.onSelect;
+  var _ref = (0, _react.useContext)(_NavContext.default),
+      activeKey = _ref.activeKey,
+      onSelectFromNav = _ref.onSelect;
 
   var _useClassNames = (0, _utils.useClassNames)(classPrefix),
       merge = _useClassNames.merge,
@@ -76,10 +80,10 @@ var SidenavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       selected: selected,
       disabled: disabled,
       onActivate: handleClick
-    }, function (_ref, menuitemRef) {
-      var selected = _ref.selected,
-          active = _ref.active,
-          menuitem = (0, _objectWithoutPropertiesLoose2.default)(_ref, ["selected", "active"]);
+    }, function (_ref2, menuitemRef) {
+      var selected = _ref2.selected,
+          active = _ref2.active,
+          menuitem = (0, _objectWithoutPropertiesLoose2.default)(_ref2, ["selected", "active"]);
       var classes = merge(className, withClassPrefix({
         focus: active,
         active: selected,
@@ -93,7 +97,9 @@ var SidenavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
             disabled: Component === _SafeAnchor.default ? disabled : undefined,
             className: classes,
             "data-event-key": eventKey
-          }, (0, _omit.default)(rest, ['divider', 'panel']), triggerProps, menuitem), icon, _children, /*#__PURE__*/_react.default.createElement(_Ripple.default, null));
+          }, (0, _omit.default)(rest, ['divider', 'panel']), triggerProps, menuitem), icon && /*#__PURE__*/_react.default.cloneElement(icon, {
+            className: prefix('icon')
+          }), _children, /*#__PURE__*/_react.default.createElement(_Ripple.default, null));
         },
         message: _children,
         placement: 'right'
@@ -129,7 +135,9 @@ var SidenavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     style: style,
     "aria-selected": selected || undefined,
     "data-event-key": eventKey
-  }, rest), icon, _children, /*#__PURE__*/_react.default.createElement(_Ripple.default, null));
+  }, rest), icon && /*#__PURE__*/_react.default.cloneElement(icon, {
+    className: prefix('icon')
+  }), _children, /*#__PURE__*/_react.default.createElement(_Ripple.default, null));
 });
 
 SidenavItem.displayName = 'Sidenav.Item';

package/cjs/Sidenav/SidenavToggle.d.ts

@@ -1,7 +1,11 @@
 import React from 'react';
 import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
 export interface SidenavToggleProps extends WithAsProps {
-    /** Expand then nav */
+    /**
+     * Expand then nav
+     *
+     * @deprecated Use <Sidenav expanded> instead.
+     */
     expanded?: boolean;
     /** Callback function for menu state switching */
     onToggle?: (expanded: boolean, event: React.MouseEvent) => void;

package/cjs/Sidenav/SidenavToggle.js

@@ -1,5 +1,7 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 exports.__esModule = true;
@@ -9,7 +11,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -21,24 +23,37 @@ var _AngleLeft = _interopRequireDefault(require("@rsuite/icons/legacy/AngleLeft"
 
 var _AngleRight = _interopRequireDefault(require("@rsuite/icons/legacy/AngleRight"));
 
+var _deprecatePropType = _interopRequireDefault(require("../utils/deprecatePropType"));
+
+var _Sidenav = require("./Sidenav");
+
 var SidenavToggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);
+
+  if (!sidenav) {
+    throw new Error('<Sidenav.Toggle> must be rendered within a <Sidenav>');
+  }
+
   var _props$as = props.as,
       Component = _props$as === void 0 ? 'div' : _props$as,
-      expanded = props.expanded,
+      DEPRECATED_expanded = props.expanded,
       className = props.className,
       _props$classPrefix = props.classPrefix,
       classPrefix = _props$classPrefix === void 0 ? 'sidenav-toggle' : _props$classPrefix,
       onToggle = props.onToggle,
-      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "expanded", "className", "classPrefix", "onToggle"]);
+      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "expanded", "className", "classPrefix", "onToggle"]); // if `expanded` prop is provided, it takes priority
+
+  var expanded = DEPRECATED_expanded !== null && DEPRECATED_expanded !== void 0 ? DEPRECATED_expanded : sidenav.expanded;
 
   var _useClassNames = (0, _utils.useClassNames)(classPrefix),
       merge = _useClassNames.merge,
-      withClassPrefix = _useClassNames.withClassPrefix;
+      withClassPrefix = _useClassNames.withClassPrefix,
+      prefix = _useClassNames.prefix;
 
   var classes = merge(className, withClassPrefix({
     collapsed: !expanded
   }));
-  var Icon = expanded ? _AngleRight.default : _AngleLeft.default;
+  var Icon = expanded ? _AngleLeft.default : _AngleRight.default;
 
   var handleToggle = function handleToggle(event) {
     onToggle === null || onToggle === void 0 ? void 0 : onToggle(!expanded, event);
@@ -48,17 +63,18 @@ var SidenavToggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     ref: ref,
     className: classes
   }), /*#__PURE__*/_react.default.createElement(_IconButton.default, {
-    appearance: "default",
     icon: /*#__PURE__*/_react.default.createElement(Icon, null),
-    onClick: handleToggle
+    className: prefix('button'),
+    onClick: handleToggle,
+    "aria-label": expanded ? 'Collapse' : 'Expand'
   }));
 });
 
-SidenavToggle.displayName = 'SidenavToggle';
+SidenavToggle.displayName = 'Sidenav.Toggle';
 SidenavToggle.propTypes = {
   classPrefix: _propTypes.default.string,
   className: _propTypes.default.string,
-  expanded: _propTypes.default.bool,
+  expanded: (0, _deprecatePropType.default)(_propTypes.default.bool, 'Use <Sidenav expanded> instead.'),
   onToggle: _propTypes.default.func
 };
 var _default = SidenavToggle;

package/cjs/Whisper/Whisper.d.ts

@@ -1,9 +1,7 @@
 import React from 'react';
+import { OverlayTriggerInstance } from '../Overlay/OverlayTrigger';
 import { OverlayTriggerProps } from '../Overlay/OverlayTrigger';
 export declare type WhisperProps = OverlayTriggerProps;
-export interface WhisperInstance extends React.Component<WhisperProps> {
-    open: (delay?: number) => void;
-    close: (delay?: number) => void;
-}
-declare const Whisper: React.ForwardRefExoticComponent<OverlayTriggerProps & React.RefAttributes<unknown>>;
+export declare type WhisperInstance = OverlayTriggerInstance;
+declare const Whisper: React.ForwardRefExoticComponent<OverlayTriggerProps & React.RefAttributes<OverlayTriggerInstance>>;
 export default Whisper;

package/cjs/Whisper/test/Whisper.test.d.ts

@@ -0,0 +1 @@
+export {};

package/cjs/Whisper/test/Whisper.test.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Whisper = _interopRequireDefault(require("../Whisper"));
+
+var _whisperRef$current, _whisperRef$current2, _whisperRef$current3, _whisperRef$current4, _whisperRef$current5;
+
+var whisperRef = /*#__PURE__*/_react.default.createRef();
+
+/*#__PURE__*/
+_react.default.createElement(_Whisper.default, {
+  ref: whisperRef,
+  speaker: /*#__PURE__*/_react.default.createElement("div", null)
+}, /*#__PURE__*/_react.default.createElement("div", null));
+
+(_whisperRef$current = whisperRef.current) === null || _whisperRef$current === void 0 ? void 0 : _whisperRef$current.open();
+(_whisperRef$current2 = whisperRef.current) === null || _whisperRef$current2 === void 0 ? void 0 : _whisperRef$current2.open(300);
+(_whisperRef$current3 = whisperRef.current) === null || _whisperRef$current3 === void 0 ? void 0 : _whisperRef$current3.close();
+(_whisperRef$current4 = whisperRef.current) === null || _whisperRef$current4 === void 0 ? void 0 : _whisperRef$current4.close(300);
+(_whisperRef$current5 = whisperRef.current) === null || _whisperRef$current5 === void 0 ? void 0 : _whisperRef$current5.updatePosition();

package/cjs/index.d.ts

@@ -7,7 +7,7 @@ export type { ButtonToolbarProps } from './ButtonToolbar';
 export { default as ButtonGroup } from './ButtonGroup';
 export type { ButtonGroupProps } from './ButtonGroup';
 export { default as Whisper } from './Whisper';
-export type { WhisperProps } from './Whisper';
+export type { WhisperProps, WhisperInstance } from './Whisper';
 export { default as Tooltip } from './Tooltip';
 export type { TooltipProps } from './Tooltip';
 export { default as Popover } from './Popover';

package/cjs/utils/deprecateComponent.js

@@ -1,7 +1,5 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 exports.__esModule = true;
@@ -9,7 +7,9 @@ exports.default = deprecateComponent;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
+
+var _warnOnce = _interopRequireDefault(require("./warnOnce"));
 
 /**
  * HOC for display a deprecation message from a deprecated component
@@ -21,9 +21,7 @@ function deprecateComponent(Component, message) {
   var componentDisplayName = (_Component$displayNam = Component.displayName) !== null && _Component$displayNam !== void 0 ? _Component$displayNam : Component.name;
 
   var Deprecated = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-    (0, _react.useEffect)(function () {
-      console.warn(message);
-    }, []);
+    (0, _warnOnce.default)(message);
     return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
       ref: ref
     }, props));

package/cjs/utils/deprecatePropType.d.ts

@@ -1,6 +1,2 @@
 import * as PropTypes from 'prop-types';
-declare function deprecatePropType<T extends PropTypes.Validator<any>>(propType: T, explanation?: string): typeof propType;
-declare namespace deprecatePropType {
-    var _resetWarned: () => void;
-}
-export default deprecatePropType;
+export default function deprecatePropType<T extends PropTypes.Validator<any>>(propType: T, explanation?: string): typeof propType;

package/cjs/utils/deprecatePropType.js

@@ -1,20 +1,19 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 exports.__esModule = true;
 exports.default = deprecatePropType;
-// Ref: https://github.com/thefrontside/deprecated-prop-type/blob/master/deprecated.js
-var warned = {};
 
+var _warnOnce = _interopRequireDefault(require("./warnOnce"));
+
+// Ref: https://github.com/thefrontside/deprecated-prop-type/blob/master/deprecated.js
 function deprecatePropType(propType, explanation) {
   return function validate(props, propName, componentName) {
     // Note ...rest here
     if (props[propName] != null) {
       var message = "\"" + propName + "\" property of \"" + componentName + "\" has been deprecated.\n" + explanation;
-
-      if (!warned[message]) {
-        console.warn(message);
-        warned[message] = true;
-      }
+      (0, _warnOnce.default)(message);
     }
 
     for (var _len = arguments.length, rest = new Array(_len > 3 ? _len - 3 : 0), _key = 3; _key < _len; _key++) {
@@ -23,10 +22,4 @@ function deprecatePropType(propType, explanation) {
 
     return propType.apply(void 0, [props, propName, componentName].concat(rest)); // and here
   };
-}
-
-function _resetWarned() {
-  warned = {};
-}
-
-deprecatePropType._resetWarned = _resetWarned;
+}

package/cjs/utils/treeUtils.js

@@ -776,11 +776,7 @@ function useFlattenTreeData(_ref8) {
   var forceUpdate = (0, _react.useCallback)(function () {
     dispatch(Object.create(null));
   }, [dispatch]);
-
-  var _useRef = (0, _react.useRef)({}),
-      _useRef$current = _useRef.current,
-      flattenNodes = _useRef$current === void 0 ? {} : _useRef$current;
-
+  var flattenNodes = (0, _react.useRef)({});
   var flattenTreeData = (0, _react.useCallback)(function (treeData, ref, parent, layer) {
     if (layer === void 0) {
       layer = 1;
@@ -795,20 +791,20 @@ function useFlattenTreeData(_ref8) {
 
       var refKey = ref + "-" + index;
       node.refKey = refKey;
-      flattenNodes[refKey] = (0, _extends3.default)((_extends2 = {
+      flattenNodes.current[refKey] = (0, _extends3.default)((_extends2 = {
         layer: layer
       }, _extends2[labelKey] = node[labelKey], _extends2[valueKey] = node[valueKey], _extends2.uncheckable = uncheckableItemValues.some(function (value) {
         return (0, _utils2.shallowEqual)(node[valueKey], value);
       }), _extends2), node);
 
       if (parent) {
-        flattenNodes[refKey].parent = (0, _omit2.default)(parent, 'parent', 'children');
+        flattenNodes.current[refKey].parent = (0, _omit2.default)(parent, 'parent', 'children');
       }
 
       flattenTreeData(node[childrenKey], refKey, node, layer + 1);
     });
-    callback === null || callback === void 0 ? void 0 : callback(flattenNodes);
-  }, [childrenKey, valueKey, labelKey, callback, uncheckableItemValues, flattenNodes]);
+    callback === null || callback === void 0 ? void 0 : callback(flattenNodes.current);
+  }, [childrenKey, valueKey, labelKey, callback, uncheckableItemValues]);
   var serializeListOnlyParent = (0, _react.useCallback)(function (nodes, key) {
     var list = [];
     Object.keys(nodes).forEach(function (refKey) {
@@ -909,12 +905,14 @@ function useFlattenTreeData(_ref8) {
   };
 
   (0, _react.useEffect)(function () {
+    // when data is changed, should clear the flattenNodes, avoid duplicate keys
+    flattenNodes.current = {};
     flattenTreeData(data, '0');
   }, [data]); // eslint-disable-line react-hooks/exhaustive-deps
 
   return {
     forceUpdate: forceUpdate,
-    flattenNodes: flattenNodes,
+    flattenNodes: flattenNodes.current,
     flattenTreeData: flattenTreeData,
     serializeListOnlyParent: serializeListOnlyParent,
     unSerializeList: unSerializeList,

package/cjs/utils/useInternalId.d.ts

@@ -1,4 +1,4 @@
 /**
  * Used for generating unique ID for DOM elements
  */
-export default function useInternalId(prefix?: string): string;
+export default function useInternalId(namespace?: string): string;

package/cjs/utils/useInternalId.js

@@ -12,11 +12,11 @@ var _uniqueId = _interopRequireDefault(require("lodash/uniqueId"));
 /**
  * Used for generating unique ID for DOM elements
  */
-function useInternalId(prefix) {
+function useInternalId(namespace) {
   var idRef = (0, _react.useRef)();
 
   if (!idRef.current) {
-    idRef.current = (0, _uniqueId.default)("internal://" + prefix);
+    idRef.current = (0, _uniqueId.default)("internal://" + namespace);
   }
 
   (0, _react.useDebugValue)(idRef.current);

package/cjs/utils/warnOnce.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Logs a warning message
+ * but dont warn a same message twice
+ */
+declare function warnOnce(message: string): void;
+declare namespace warnOnce {
+    var _resetWarned: () => void;
+}
+export default warnOnce;

package/cjs/utils/warnOnce.js

@@ -0,0 +1,22 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = warnOnce;
+var warned = {};
+/**
+ * Logs a warning message
+ * but dont warn a same message twice
+ */
+
+function warnOnce(message) {
+  if (!warned[message]) {
+    console.warn(message);
+    warned[message] = true;
+  }
+}
+
+warnOnce._resetWarned = function () {
+  for (var _message in warned) {
+    delete warned[_message];
+  }
+};