rsuite 5.2.0 → 5.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (80) hide show
  1. package/Button/styles/index.less +6 -0
  2. package/CHANGELOG.md +42 -0
  3. package/PanelGroup/styles/index.less +12 -12
  4. package/README.md +3 -44
  5. package/Sidenav/styles/index.less +4 -0
  6. package/Table/styles/index.less +0 -4
  7. package/cjs/Carousel/Carousel.d.ts +1 -1
  8. package/cjs/CheckTreePicker/CheckTreePicker.js +6 -3
  9. package/cjs/CheckTreePicker/utils.d.ts +1 -1
  10. package/cjs/CheckTreePicker/utils.js +7 -6
  11. package/cjs/CheckboxGroup/CheckboxGroup.js +2 -2
  12. package/cjs/DateRangePicker/Calendar.d.ts +2 -1
  13. package/cjs/DateRangePicker/Calendar.js +26 -5
  14. package/cjs/DateRangePicker/DateRangePicker.d.ts +2 -0
  15. package/cjs/DateRangePicker/DateRangePicker.js +25 -3
  16. package/cjs/Dropdown/DropdownItem.js +16 -19
  17. package/cjs/Dropdown/useRenderDropdownItem.d.ts +2 -0
  18. package/cjs/Dropdown/useRenderDropdownItem.js +26 -0
  19. package/cjs/InputPicker/InputPicker.js +1 -1
  20. package/cjs/MaskedInput/MaskedInput.d.ts +5 -42
  21. package/cjs/MaskedInput/MaskedInput.js +9 -63
  22. package/cjs/MaskedInput/TextMask.d.ts +43 -0
  23. package/cjs/MaskedInput/TextMask.js +80 -0
  24. package/cjs/Menu/Menu.js +46 -34
  25. package/cjs/Menu/MenuItem.js +16 -12
  26. package/cjs/Modal/utils.js +9 -10
  27. package/cjs/Overlay/Position.js +7 -4
  28. package/cjs/Picker/PickerToggle.js +7 -5
  29. package/cjs/Picker/VirtualizedList.d.ts +29 -2
  30. package/cjs/Picker/utils.d.ts +6 -14
  31. package/cjs/Picker/utils.js +54 -33
  32. package/cjs/RadioGroup/RadioGroup.js +2 -2
  33. package/cjs/Rate/Rate.js +3 -1
  34. package/cjs/Sidenav/SidenavDropdownItem.js +17 -10
  35. package/cjs/TreePicker/TreePicker.js +6 -3
  36. package/cjs/utils/useElementResize.d.ts +1 -1
  37. package/cjs/utils/useElementResize.js +11 -6
  38. package/dist/rsuite-rtl.css +48 -6
  39. package/dist/rsuite-rtl.min.css +1 -1
  40. package/dist/rsuite-rtl.min.css.map +1 -1
  41. package/dist/rsuite.css +48 -6
  42. package/dist/rsuite.js +349 -359
  43. package/dist/rsuite.js.map +1 -1
  44. package/dist/rsuite.min.css +1 -1
  45. package/dist/rsuite.min.css.map +1 -1
  46. package/dist/rsuite.min.js +1 -1
  47. package/dist/rsuite.min.js.LICENSE.txt +9 -0
  48. package/dist/rsuite.min.js.map +1 -1
  49. package/esm/Carousel/Carousel.d.ts +1 -1
  50. package/esm/CheckTreePicker/CheckTreePicker.js +6 -3
  51. package/esm/CheckTreePicker/utils.d.ts +1 -1
  52. package/esm/CheckTreePicker/utils.js +7 -6
  53. package/esm/CheckboxGroup/CheckboxGroup.js +2 -2
  54. package/esm/DateRangePicker/Calendar.d.ts +2 -1
  55. package/esm/DateRangePicker/Calendar.js +27 -5
  56. package/esm/DateRangePicker/DateRangePicker.d.ts +2 -0
  57. package/esm/DateRangePicker/DateRangePicker.js +23 -3
  58. package/esm/Dropdown/DropdownItem.js +15 -19
  59. package/esm/Dropdown/useRenderDropdownItem.d.ts +2 -0
  60. package/esm/Dropdown/useRenderDropdownItem.js +18 -0
  61. package/esm/InputPicker/InputPicker.js +1 -1
  62. package/esm/MaskedInput/MaskedInput.d.ts +5 -42
  63. package/esm/MaskedInput/MaskedInput.js +9 -63
  64. package/esm/MaskedInput/TextMask.d.ts +43 -0
  65. package/esm/MaskedInput/TextMask.js +67 -0
  66. package/esm/Menu/Menu.js +46 -36
  67. package/esm/Menu/MenuItem.js +16 -12
  68. package/esm/Modal/utils.js +8 -7
  69. package/esm/Overlay/Position.js +6 -3
  70. package/esm/Picker/PickerToggle.js +7 -5
  71. package/esm/Picker/VirtualizedList.d.ts +29 -2
  72. package/esm/Picker/utils.d.ts +6 -14
  73. package/esm/Picker/utils.js +54 -33
  74. package/esm/RadioGroup/RadioGroup.js +2 -2
  75. package/esm/Rate/Rate.js +2 -1
  76. package/esm/Sidenav/SidenavDropdownItem.js +16 -10
  77. package/esm/TreePicker/TreePicker.js +6 -3
  78. package/esm/utils/useElementResize.d.ts +1 -1
  79. package/esm/utils/useElementResize.js +12 -5
  80. package/package.json +3 -3
@@ -1,80 +1,26 @@
1
1
  "use strict";
2
2
 
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
-
5
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
6
4
 
7
5
  exports.__esModule = true;
8
6
  exports.default = void 0;
9
7
 
10
- var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
11
-
12
8
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
9
 
14
- var _react = _interopRequireWildcard(require("react"));
15
-
16
- var _omit = _interopRequireDefault(require("lodash/omit"));
10
+ var _react = _interopRequireDefault(require("react"));
17
11
 
18
- var _propTypes = _interopRequireDefault(require("prop-types"));
12
+ var _TextMask = _interopRequireDefault(require("./TextMask"));
19
13
 
20
- var _createTextMaskInputElement = _interopRequireDefault(require("./createTextMaskInputElement"));
21
-
22
- var _utils = require("../utils");
23
-
24
- var defaultRender = function defaultRender(ref, props) {
25
- return /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({
26
- ref: ref
27
- }, props));
28
- };
14
+ var _Input = _interopRequireDefault(require("../Input"));
29
15
 
30
16
  var MaskedInput = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
31
- var mask = props.mask,
32
- _props$guide = props.guide,
33
- guide = _props$guide === void 0 ? true : _props$guide,
34
- placeholderChar = props.placeholderChar,
35
- value = props.value,
36
- showMask = props.showMask,
37
- pipe = props.pipe,
38
- _props$render = props.render,
39
- render = _props$render === void 0 ? defaultRender : _props$render,
40
- onChange = props.onChange,
41
- rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["mask", "guide", "placeholderChar", "value", "showMask", "pipe", "render", "onChange"]);
42
- var inputRef = (0, _react.useRef)(null);
43
- var textMaskInputElement = (0, _react.useRef)();
44
- var initTextMask = (0, _react.useCallback)(function () {
45
- var _textMaskInputElement;
46
-
47
- textMaskInputElement.current = (0, _createTextMaskInputElement.default)((0, _extends2.default)({
48
- inputElement: inputRef.current
49
- }, props));
50
- (_textMaskInputElement = textMaskInputElement.current) === null || _textMaskInputElement === void 0 ? void 0 : _textMaskInputElement.update(value);
51
- }, [props, value]);
52
- var handleChange = (0, _react.useCallback)(function (event) {
53
- var _textMaskInputElement2;
54
-
55
- (_textMaskInputElement2 = textMaskInputElement.current) === null || _textMaskInputElement2 === void 0 ? void 0 : _textMaskInputElement2.update();
56
- onChange === null || onChange === void 0 ? void 0 : onChange(event);
57
- }, [onChange]);
58
- (0, _react.useEffect)(function () {
59
- initTextMask();
60
- }, [guide, placeholderChar, showMask, pipe, mask, value, initTextMask]);
61
- return render((0, _utils.mergeRefs)(inputRef, ref), (0, _extends2.default)({
62
- onChange: handleChange,
63
- defaultValue: value
64
- }, (0, _omit.default)(rest, ['keepCharPositions'])));
17
+ var _props$as = props.as,
18
+ inputAs = _props$as === void 0 ? _TextMask.default : _props$as;
19
+ return /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({}, props, {
20
+ as: inputAs,
21
+ ref: ref
22
+ }));
65
23
  });
66
24
 
67
- MaskedInput.displayName = 'MaskedInput';
68
- MaskedInput.propTypes = {
69
- render: _propTypes.default.func,
70
- onChange: _propTypes.default.func,
71
- mask: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.func, _propTypes.default.bool]).isRequired,
72
- guide: _propTypes.default.bool,
73
- value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
74
- pipe: _propTypes.default.func,
75
- placeholderChar: _propTypes.default.string,
76
- keepCharPositions: _propTypes.default.bool,
77
- showMask: _propTypes.default.bool
78
- };
79
25
  var _default = MaskedInput;
80
26
  exports.default = _default;
@@ -0,0 +1,43 @@
1
+ import React from 'react';
2
+ import { MaskType, MaskFunctionType, ConfigType } from './types';
3
+ /**
4
+ * https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#guide
5
+ */
6
+ interface TextMaskBaseProps {
7
+ /**
8
+ * `guide` is a boolean that tells the component whether to be in guide or no guide mode.
9
+ */
10
+ guide?: boolean;
11
+ /**
12
+ * `mask` is an array or a function that defines how the user input is going to be masked.
13
+ */
14
+ mask?: MaskType | MaskFunctionType | boolean;
15
+ /**
16
+ * `showMask` is a boolean that tells the Text Mask component to display the mask as a placeholder
17
+ * in place of the regular placeholder when the input element value is empty.
18
+ */
19
+ showMask?: boolean;
20
+ /** The placeholder character represents the fillable spot in the mask. The default placeholder character is underscore, _. */
21
+ placeholderChar?: string;
22
+ /** `keepCharPositions` changes the general behavior of the Text Mask component. */
23
+ keepCharPositions?: boolean;
24
+ /** You can provide a `pipe` function that will give you the opportunity to modify the conformed value before it is displayed on the screen. */
25
+ pipe?: (conformedValue: string, config: ConfigType) => string;
26
+ }
27
+ export declare type TextMaskProps = TextMaskBaseProps & React.HTMLAttributes<HTMLInputElement> & {
28
+ /** Custom rendering DOM */
29
+ render?: (ref: React.Ref<HTMLInputElement>, props: React.HTMLAttributes<HTMLInputElement>) => any;
30
+ onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
31
+ value?: string | number;
32
+ readOnly?: boolean;
33
+ disabled?: boolean;
34
+ };
35
+ declare const TextMask: React.ForwardRefExoticComponent<TextMaskBaseProps & React.HTMLAttributes<HTMLInputElement> & {
36
+ /** Custom rendering DOM */
37
+ render?: (ref: React.Ref<HTMLInputElement>, props: React.HTMLAttributes<HTMLInputElement>) => any;
38
+ onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
39
+ value?: string | number;
40
+ readOnly?: boolean;
41
+ disabled?: boolean;
42
+ } & React.RefAttributes<HTMLInputElement>>;
43
+ export default TextMask;
@@ -0,0 +1,80 @@
1
+ "use strict";
2
+
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
+
5
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
6
+
7
+ exports.__esModule = true;
8
+ exports.default = void 0;
9
+
10
+ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
11
+
12
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
+
14
+ var _react = _interopRequireWildcard(require("react"));
15
+
16
+ var _omit = _interopRequireDefault(require("lodash/omit"));
17
+
18
+ var _propTypes = _interopRequireDefault(require("prop-types"));
19
+
20
+ var _createTextMaskInputElement = _interopRequireDefault(require("./createTextMaskInputElement"));
21
+
22
+ var _utils = require("../utils");
23
+
24
+ var defaultRender = function defaultRender(ref, props) {
25
+ return /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({
26
+ ref: ref
27
+ }, props));
28
+ };
29
+
30
+ var TextMask = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
31
+ var mask = props.mask,
32
+ _props$guide = props.guide,
33
+ guide = _props$guide === void 0 ? true : _props$guide,
34
+ placeholderChar = props.placeholderChar,
35
+ value = props.value,
36
+ showMask = props.showMask,
37
+ pipe = props.pipe,
38
+ _props$render = props.render,
39
+ render = _props$render === void 0 ? defaultRender : _props$render,
40
+ onChange = props.onChange,
41
+ rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["mask", "guide", "placeholderChar", "value", "showMask", "pipe", "render", "onChange"]);
42
+ var inputRef = (0, _react.useRef)(null);
43
+ var textMaskInputElement = (0, _react.useRef)();
44
+ var initTextMask = (0, _react.useCallback)(function () {
45
+ var _textMaskInputElement;
46
+
47
+ textMaskInputElement.current = (0, _createTextMaskInputElement.default)((0, _extends2.default)({
48
+ inputElement: inputRef.current
49
+ }, props));
50
+ (_textMaskInputElement = textMaskInputElement.current) === null || _textMaskInputElement === void 0 ? void 0 : _textMaskInputElement.update(value);
51
+ }, [props, value]);
52
+ var handleChange = (0, _react.useCallback)(function (event) {
53
+ var _textMaskInputElement2;
54
+
55
+ (_textMaskInputElement2 = textMaskInputElement.current) === null || _textMaskInputElement2 === void 0 ? void 0 : _textMaskInputElement2.update();
56
+ onChange === null || onChange === void 0 ? void 0 : onChange(event);
57
+ }, [onChange]);
58
+ (0, _react.useEffect)(function () {
59
+ initTextMask();
60
+ }, [guide, placeholderChar, showMask, pipe, mask, value, initTextMask]);
61
+ return render((0, _utils.mergeRefs)(inputRef, ref), (0, _extends2.default)({
62
+ onChange: handleChange,
63
+ defaultValue: value
64
+ }, (0, _omit.default)(rest, ['keepCharPositions'])));
65
+ });
66
+
67
+ TextMask.displayName = 'TextMask';
68
+ TextMask.propTypes = {
69
+ render: _propTypes.default.func,
70
+ onChange: _propTypes.default.func,
71
+ mask: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.func, _propTypes.default.bool]).isRequired,
72
+ guide: _propTypes.default.bool,
73
+ value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
74
+ pipe: _propTypes.default.func,
75
+ placeholderChar: _propTypes.default.string,
76
+ keepCharPositions: _propTypes.default.bool,
77
+ showMask: _propTypes.default.bool
78
+ };
79
+ var _default = TextMask;
80
+ exports.default = _default;
package/cjs/Menu/Menu.js CHANGED
@@ -21,7 +21,7 @@ var _useUniqueId = _interopRequireDefault(require("../utils/useUniqueId"));
21
21
 
22
22
  var _useMenu = _interopRequireDefault(require("./useMenu"));
23
23
 
24
- var _useFocus = _interopRequireDefault(require("../utils/useFocus"));
24
+ var _useFocus2 = _interopRequireDefault(require("../utils/useFocus"));
25
25
 
26
26
  var _useClickOutside = _interopRequireDefault(require("../utils/useClickOutside"));
27
27
 
@@ -60,7 +60,10 @@ function Menu(props) {
60
60
  rtl = _useCustom.rtl;
61
61
 
62
62
  var activeItem = (_items$activeItemInde = items[activeItemIndex]) === null || _items$activeItemInde === void 0 ? void 0 : _items$activeItemInde.element;
63
- var menuFocus = (0, _useFocus.default)(menuElementRef);
63
+
64
+ var _useFocus = (0, _useFocus2.default)(menuElementRef),
65
+ grabFocus = _useFocus.grab;
66
+
64
67
  var openMenu = (0, _react.useCallback)(function (event) {
65
68
  dispatch({
66
69
  type: _MenuContext.MenuActionTypes.OpenMenu
@@ -74,8 +77,8 @@ function Menu(props) {
74
77
  }
75
78
 
76
79
  onToggleMenu === null || onToggleMenu === void 0 ? void 0 : onToggleMenu(true, event);
77
- menuFocus.grab();
78
- }, [dispatch, onToggleMenu, menuFocus]);
80
+ grabFocus();
81
+ }, [dispatch, onToggleMenu, grabFocus]);
79
82
  var closeMenu = (0, _react.useCallback)(function (event, returnFocusToButton) {
80
83
  if (returnFocusToButton === void 0) {
81
84
  returnFocusToButton = true;
@@ -170,39 +173,48 @@ function Menu(props) {
170
173
  if (disabled) return;
171
174
  openMenu(event);
172
175
  }, [open, disabled, openMenu]);
173
- var buttonEventHandlers = {
174
- onKeyDown: handleButtonKeydown
175
- };
176
- /**
177
- * Bind event of trigger,
178
- * not used in in the expanded state of '<Sidenav>'
179
- */
180
-
181
- if (openMenuOn !== null && openMenuOn !== void 0 && openMenuOn.includes('click')) {
182
- buttonEventHandlers.onClick = handleButtonClick;
183
- }
176
+ var buttonEventHandlers = (0, _react.useMemo)(function () {
177
+ var buttonEventHandlers = {
178
+ onKeyDown: handleButtonKeydown
179
+ };
180
+ /**
181
+ * Bind event of trigger,
182
+ * not used in in the expanded state of '<Sidenav>'
183
+ */
184
+
185
+ if (openMenuOn !== null && openMenuOn !== void 0 && openMenuOn.includes('click')) {
186
+ buttonEventHandlers.onClick = handleButtonClick;
187
+ }
184
188
 
185
- if (openMenuOn !== null && openMenuOn !== void 0 && openMenuOn.includes('contextmenu')) {
186
- buttonEventHandlers.onContextMenu = handleButtonContextMenu;
187
- }
189
+ if (openMenuOn !== null && openMenuOn !== void 0 && openMenuOn.includes('contextmenu')) {
190
+ buttonEventHandlers.onContextMenu = handleButtonContextMenu;
191
+ }
188
192
 
193
+ return buttonEventHandlers;
194
+ }, [openMenuOn, handleButtonKeydown, handleButtonClick, handleButtonContextMenu]);
189
195
  var buttonId = (0, _useUniqueId.default)('menubutton-');
190
- var menuId = (0, _useUniqueId.default)('menu-'); // Ref: https://www.w3.org/TR/wai-aria-practices-1.2/#wai-aria-roles-states-and-properties-14
191
-
192
- var buttonAriaAttributes = {
193
- role: 'button',
194
- 'aria-haspopup': 'menu',
195
- 'aria-expanded': open || undefined,
196
- // it's recommend to remove aria-expanded when menu is hidden
197
- 'aria-controls': menuId
198
- };
199
- var buttonProps = (0, _extends2.default)({
200
- id: buttonId
201
- }, buttonAriaAttributes, buttonEventHandlers, {
202
- // render props
203
- open: open
204
- });
205
- var customMenuButton = renderMenuButton === null || renderMenuButton === void 0 ? void 0 : renderMenuButton(buttonProps, buttonElementRef);
196
+ var menuId = (0, _useUniqueId.default)('menu-');
197
+ var buttonAriaAttributes = (0, _react.useMemo)(function () {
198
+ // Ref: https://www.w3.org/TR/wai-aria-practices-1.2/#wai-aria-roles-states-and-properties-14
199
+ return {
200
+ role: 'button',
201
+ 'aria-haspopup': 'menu',
202
+ 'aria-expanded': open || undefined,
203
+ // it's recommend to remove aria-expanded when menu is hidden
204
+ 'aria-controls': menuId
205
+ };
206
+ }, [open, menuId]);
207
+ var buttonProps = (0, _react.useMemo)(function () {
208
+ return (0, _extends2.default)({
209
+ id: buttonId
210
+ }, buttonAriaAttributes, buttonEventHandlers, {
211
+ // render props
212
+ open: open
213
+ });
214
+ }, [buttonId, buttonAriaAttributes, buttonEventHandlers, open]);
215
+ var customMenuButton = (0, _react.useMemo)(function () {
216
+ return renderMenuButton === null || renderMenuButton === void 0 ? void 0 : renderMenuButton(buttonProps, buttonElementRef);
217
+ }, [renderMenuButton, buttonProps, buttonElementRef]);
206
218
  var buttonElement = customMenuButton !== null && customMenuButton !== void 0 ? customMenuButton : /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
207
219
  ref: buttonElementRef
208
220
  }, buttonProps), menuButtonText);
@@ -44,20 +44,24 @@ function MenuItem(props) {
44
44
  }, [disabled, onActivate]); // Gain/release focus on mousedown in `menubar`
45
45
 
46
46
  var handleMouseDown = (0, _react.useCallback)(function () {
47
- dispatch({
48
- type: _MenuContext.MenuActionTypes.MoveFocus,
49
- to: _MenuContext.MoveFocusTo.Specific,
50
- id: menuitemRef.current.id
51
- });
52
- }, [dispatch]); // Gain/release focus on mouseenter/mouseleave in `menu`
47
+ if (!hasFocus) {
48
+ dispatch({
49
+ type: _MenuContext.MenuActionTypes.MoveFocus,
50
+ to: _MenuContext.MoveFocusTo.Specific,
51
+ id: menuitemRef.current.id
52
+ });
53
+ }
54
+ }, [hasFocus, dispatch]); // Gain/release focus on mouseenter/mouseleave in `menu`
53
55
 
54
56
  var handleMouseMove = (0, _react.useCallback)(function () {
55
- dispatch({
56
- type: _MenuContext.MenuActionTypes.MoveFocus,
57
- to: _MenuContext.MoveFocusTo.Specific,
58
- id: menuitemRef.current.id
59
- });
60
- }, [dispatch]);
57
+ if (!hasFocus) {
58
+ dispatch({
59
+ type: _MenuContext.MenuActionTypes.MoveFocus,
60
+ to: _MenuContext.MoveFocusTo.Specific,
61
+ id: menuitemRef.current.id
62
+ });
63
+ }
64
+ }, [hasFocus, dispatch]);
61
65
  var handleMouseLeave = (0, _react.useCallback)(function () {
62
66
  dispatch({
63
67
  type: _MenuContext.MenuActionTypes.MoveFocus,
@@ -2,19 +2,17 @@
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
4
 
5
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
6
-
7
5
  exports.__esModule = true;
8
6
  exports.useBodyStyles = void 0;
9
7
 
10
8
  var _react = require("react");
11
9
 
12
- var _elementResizeEvent = _interopRequireWildcard(require("element-resize-event"));
13
-
14
10
  var _getHeight = _interopRequireDefault(require("dom-lib/getHeight"));
15
11
 
16
12
  var _on = _interopRequireDefault(require("dom-lib/on"));
17
13
 
14
+ var _resizeObserver = require("@juggle/resize-observer");
15
+
18
16
  var useBodyStyles = function useBodyStyles(ref, options) {
19
17
  var _useState = (0, _react.useState)({}),
20
18
  bodyStyles = _useState[0],
@@ -25,6 +23,7 @@ var useBodyStyles = function useBodyStyles(ref, options) {
25
23
  prefix = options.prefix;
26
24
  var windowResizeListener = (0, _react.useRef)();
27
25
  var contentElement = (0, _react.useRef)();
26
+ var contentElementResizeObserver = (0, _react.useRef)();
28
27
  var updateBodyStyles = (0, _react.useCallback)(function (_event, entering) {
29
28
  var dialog = ref.current;
30
29
  var scrollHeight = dialog ? dialog.scrollHeight : 0;
@@ -53,13 +52,10 @@ var useBodyStyles = function useBodyStyles(ref, options) {
53
52
  setBodyStyles(styles);
54
53
  }, [prefix, ref]);
55
54
  var onDestroyEvents = (0, _react.useCallback)(function () {
56
- var _windowResizeListener, _windowResizeListener2;
55
+ var _windowResizeListener, _windowResizeListener2, _contentElementResize;
57
56
 
58
57
  (_windowResizeListener = windowResizeListener.current) === null || _windowResizeListener === void 0 ? void 0 : (_windowResizeListener2 = _windowResizeListener.off) === null || _windowResizeListener2 === void 0 ? void 0 : _windowResizeListener2.call(_windowResizeListener);
59
-
60
- if (contentElement.current) {
61
- (0, _elementResizeEvent.unbind)(contentElement.current);
62
- }
58
+ (_contentElementResize = contentElementResizeObserver.current) === null || _contentElementResize === void 0 ? void 0 : _contentElementResize.disconnect();
63
59
  }, []);
64
60
  var onChangeBodyStyles = (0, _react.useCallback)(function (entering) {
65
61
  if (overflow && !drawer) {
@@ -68,7 +64,10 @@ var useBodyStyles = function useBodyStyles(ref, options) {
68
64
  updateBodyStyles(null, entering);
69
65
  contentElement.current = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.querySelector("." + prefix('content'));
70
66
  windowResizeListener.current = (0, _on.default)(window, 'resize', updateBodyStyles);
71
- (0, _elementResizeEvent.default)(contentElement.current, updateBodyStyles);
67
+ contentElementResizeObserver.current = new _resizeObserver.ResizeObserver(function () {
68
+ return updateBodyStyles();
69
+ });
70
+ contentElementResizeObserver.current.observe(contentElement.current);
72
71
  }
73
72
  }, [drawer, overflow, prefix, ref, updateBodyStyles]);
74
73
  (0, _react.useEffect)(function () {
@@ -9,8 +9,6 @@ exports.default = void 0;
9
9
 
10
10
  var _react = _interopRequireWildcard(require("react"));
11
11
 
12
- var _elementResizeEvent = _interopRequireDefault(require("element-resize-event"));
13
-
14
12
  var _propTypes = _interopRequireDefault(require("prop-types"));
15
13
 
16
14
  var _classnames = _interopRequireDefault(require("classnames"));
@@ -27,6 +25,8 @@ var _addClass = _interopRequireDefault(require("dom-lib/addClass"));
27
25
 
28
26
  var _addStyle = _interopRequireDefault(require("dom-lib/addStyle"));
29
27
 
28
+ var _resizeObserver = require("@juggle/resize-observer");
29
+
30
30
  var _isElement = _interopRequireDefault(require("../DOMHelper/isElement"));
31
31
 
32
32
  var _positionUtils = _interopRequireDefault(require("./positionUtils"));
@@ -43,6 +43,7 @@ var usePosition = function usePosition(props, ref) {
43
43
  triggerTarget = props.triggerTarget;
44
44
  var containerRef = (0, _react.useRef)();
45
45
  var lastTargetRef = (0, _react.useRef)();
46
+ var overlayResizeObserver = (0, _react.useRef)();
46
47
  var defaultPosition = {
47
48
  positionLeft: 0,
48
49
  positionTop: 0,
@@ -129,17 +130,19 @@ var usePosition = function usePosition(props, ref) {
129
130
 
130
131
  if (overlay) {
131
132
  // Update the position when the size of the overlay changes
132
- (0, _elementResizeEvent.default)(overlay, function () {
133
+ overlayResizeObserver.current = new _resizeObserver.ResizeObserver(function () {
133
134
  return updatePosition(true, true);
134
135
  });
136
+ overlayResizeObserver.current.observe(overlay);
135
137
  }
136
138
 
137
139
  return function () {
138
- var _containerScrollListe;
140
+ var _containerScrollListe, _overlayResizeObserve;
139
141
 
140
142
  lastTargetRef.current = null;
141
143
  (_containerScrollListe = containerScrollListener) === null || _containerScrollListe === void 0 ? void 0 : _containerScrollListe.off();
142
144
  resizeListener === null || resizeListener === void 0 ? void 0 : resizeListener.off();
145
+ (_overlayResizeObserve = overlayResizeObserver.current) === null || _overlayResizeObserve === void 0 ? void 0 : _overlayResizeObserve.disconnect();
143
146
  };
144
147
  }, [preventOverflow, ref, updatePosition]);
145
148
  (0, _utils.useUpdateEffect)(function () {
@@ -29,7 +29,7 @@ var _Plaintext = _interopRequireDefault(require("../Plaintext"));
29
29
 
30
30
  var _useToggleCaret = _interopRequireDefault(require("../utils/useToggleCaret"));
31
31
 
32
- var _MaskedInput = _interopRequireDefault(require("../MaskedInput"));
32
+ var _TextMask = _interopRequireDefault(require("../MaskedInput/TextMask"));
33
33
 
34
34
  var _deprecatePropType = _interopRequireDefault(require("../utils/deprecatePropType"));
35
35
 
@@ -104,15 +104,17 @@ var PickerToggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
104
104
  onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);
105
105
 
106
106
  if (input) {
107
- inputRef.current.focus();
107
+ var _inputRef$current;
108
+
109
+ (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
108
110
  }
109
111
  }, [input, onFocus]);
110
112
  var handleBlur = (0, _react.useCallback)(function (event) {
111
113
  if (document.activeElement !== inputRef.current) {
112
- var _inputRef$current;
114
+ var _inputRef$current2;
113
115
 
114
116
  setActive(false);
115
- (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.blur();
117
+ (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.blur();
116
118
  }
117
119
 
118
120
  onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
@@ -167,7 +169,7 @@ var PickerToggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
167
169
  onFocus: !disabled ? handleFocus : null // The debounce is set to 200 to solve the flicker caused by the switch between input and div.
168
170
  ,
169
171
  onBlur: !disabled ? (0, _debounce.default)(handleBlur, 200) : null
170
- }), /*#__PURE__*/_react.default.createElement(_MaskedInput.default, {
172
+ }), /*#__PURE__*/_react.default.createElement(_TextMask.default, {
171
173
  mask: inputMask,
172
174
  value: Array.isArray(inputValue) ? inputValue.toString() : inputValue,
173
175
  onBlur: handleInputBlur,
@@ -1,9 +1,36 @@
1
1
  import React from 'react';
2
2
  import { ListProps, ListRowProps } from 'react-virtualized/dist/commonjs/List';
3
3
  import { AutoSizerProps } from 'react-virtualized/dist/commonjs/AutoSizer';
4
+ import type { Alignment } from 'react-virtualized';
4
5
  export interface ListInstance {
5
- child: Element;
6
- scrollToRow?: (index: number) => void;
6
+ /**
7
+ * Forcefully re-render the inner Grid component.
8
+ */
9
+ forceUpdateGrid(): void;
10
+ /**
11
+ * Gets offset for a given row and alignment.
12
+ */
13
+ getOffsetForRow(params: {
14
+ alignment?: Alignment;
15
+ index?: number;
16
+ }): number;
17
+ /**
18
+ * Pre-measure all rows in a List.
19
+ */
20
+ measureAllRows(): void;
21
+ /**
22
+ * Recompute row heights and offsets after the specified index (defaults to 0).
23
+ */
24
+ recomputeRowHeights(index?: number): void;
25
+ /**
26
+ * Scroll to the specified offset. Useful for animating position changes.
27
+ */
28
+ scrollToPosition(scrollTop?: number): void;
29
+ /**
30
+ * Ensure row is visible. This method can be used to safely scroll back to a cell
31
+ * that a user has scrolled away from even if it was previously scrolled to.
32
+ */
33
+ scrollToRow(index?: number): void;
7
34
  }
8
35
  export type { ListProps, AutoSizerProps, ListRowProps };
9
36
  export declare const List: React.ComponentType<ListProps>;
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  import { OverlayTriggerInstance } from './PickerToggleTrigger';
3
3
  import { TypeAttributes, ItemDataType } from '../@types/common';
4
+ import { ListInstance } from './VirtualizedList';
4
5
  interface NodeKeys {
5
6
  valueKey: string;
6
7
  childrenKey: string;
@@ -103,25 +104,16 @@ export declare function useSearch(props: SearchProps): {
103
104
  checkShouldDisplay: (item: ItemDataType, keyword?: string) => boolean;
104
105
  handleSearch: (searchKeyword: string, event: React.SyntheticEvent) => void;
105
106
  };
106
- interface Refs {
107
+ interface PickerDependentParameters {
107
108
  triggerRef?: React.RefObject<OverlayTriggerInstance>;
108
- rootRef?: React.RefObject<HTMLElement>;
109
+ rootRef?: React.RefObject<any>;
109
110
  overlayRef?: React.RefObject<HTMLElement>;
110
111
  targetRef?: React.RefObject<HTMLElement>;
112
+ listRef?: React.RefObject<ListInstance>;
113
+ inline?: boolean;
111
114
  }
112
115
  /**
113
116
  * A hook of the exposed method of Picker
114
- *
115
- * {
116
- * root: Element;
117
- * overlay: Element;
118
- * target?: Element;
119
- * updatePosition:() => void;
120
- * open:() => void;
121
- * close:() => void;
122
- * }
123
- * @param ref
124
- * @param params
125
117
  */
126
- export declare function usePublicMethods(ref: any, { triggerRef, overlayRef, targetRef, rootRef }: Refs, disabled?: boolean): void;
118
+ export declare function usePublicMethods(ref: any, parmas: PickerDependentParameters): void;
127
119
  export {};