rsuite 5.47.0 → 5.48.1

package/cjs/TagPicker/index.d.ts

@@ -11,7 +11,8 @@ export interface TagPickerProps extends InputPickerProps, Partial<TagOnlyProps>
     renderMenuItemCheckbox?: (checkboxProps: CheckboxProps) => React.ReactNode;
 }
 /**
- * Multi-select by tag and support new options
+ * `TagPicker` component enables multi-selection by tags and supports new options.
+ *
  * @see https://rsuitejs.com/components/tag-picker/
  */
 declare const TagPicker: PickerComponent<TagPickerProps>;

package/cjs/TagPicker/index.js

@@ -11,7 +11,8 @@ var _react = _interopRequireWildcard(require("react"));
 var _InputPicker = _interopRequireDefault(require("../InputPicker/InputPicker"));
 var _InputPickerContext = _interopRequireDefault(require("../InputPicker/InputPickerContext"));
 /**
- * Multi-select by tag and support new options
+ * `TagPicker` component enables multi-selection by tags and supports new options.
+ *
  * @see https://rsuitejs.com/components/tag-picker/
  */
 var TagPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {

package/cjs/Timeline/Timeline.d.ts

@@ -21,5 +21,10 @@ interface TimelineComponent extends RsRefForwardingComponent<'div', TimelineProp
     ACTIVE_FIRST: (index: number, totalItemsCount: number) => boolean;
     ACTIVE_LAST: (index: number, totalItemsCount: number) => boolean;
 }
+/**
+ * The `Timeline` component is used to display a list of items in chronological order.
+ *
+ * @see https://rsuitejs.com/components/timeline
+ */
 declare const Timeline: TimelineComponent;
 export default Timeline;

package/cjs/Timeline/Timeline.js

@@ -11,6 +11,11 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _some = _interopRequireDefault(require("lodash/some"));
 var _TimelineItem = _interopRequireDefault(require("./TimelineItem"));
 var _utils = require("../utils");
+/**
+ * The `Timeline` component is used to display a list of items in chronological order.
+ *
+ * @see https://rsuitejs.com/components/timeline
+ */
 var Timeline = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var children = props.children,
     _props$as = props.as,

package/cjs/Timeline/TimelineItem.d.ts

@@ -29,5 +29,10 @@ export interface TimelineItemProps extends WithAsProps {
      */
     INTERNAL_active?: boolean;
 }
+/**
+ * The `Timeline.Item` component is used to set the layout of the child element in the `Timeline` component.
+ *
+ * @see https://rsuitejs.com/compo◊nents/timeline
+ */
 declare const TimelineItem: RsRefForwardingComponent<'div', TimelineItemProps>;
 export default TimelineItem;

package/cjs/Timeline/TimelineItem.js

@@ -9,6 +9,11 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _utils = require("../utils");
+/**
+ * The `Timeline.Item` component is used to set the layout of the child element in the `Timeline` component.
+ *
+ * @see https://rsuitejs.com/compo◊nents/timeline
+ */
 var TimelineItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'li' : _props$as,

package/cjs/Toggle/Toggle.d.ts

@@ -25,5 +25,10 @@ export interface ToggleProps extends WithAsProps {
     /** Callback function when state changes */
     onChange?: (checked: boolean, event: React.ChangeEvent<HTMLInputElement>) => void;
 }
+/**
+ * The `Toggle` component is used to activate or deactivate an element.
+ *
+ * @see https://rsuitejs.com/components/toggle
+ */
 declare const Toggle: RsRefForwardingComponent<'label', ToggleProps>;
 export default Toggle;

package/cjs/Toggle/Toggle.js

@@ -12,6 +12,11 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _utils = require("../utils");
 var _Plaintext = _interopRequireDefault(require("../Plaintext"));
 var _Loader = _interopRequireDefault(require("../Loader"));
+/**
+ * The `Toggle` component is used to activate or deactivate an element.
+ *
+ * @see https://rsuitejs.com/components/toggle
+ */
 var Toggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'span' : _props$as,

package/cjs/Tooltip/Tooltip.d.ts

@@ -10,5 +10,10 @@ export interface TooltipProps extends WithAsProps {
     /** Whether show the arrow indicator */
     arrow?: boolean;
 }
+/**
+ * The `Tooltip` component is used to describe a element.
+ *
+ * @see https://rsuitejs.com/components/tooltip
+ */
 declare const Tooltip: RsRefForwardingComponent<'div', TooltipProps>;
 export default Tooltip;

package/cjs/Tooltip/Tooltip.js

@@ -9,6 +9,11 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _utils = require("../utils");
+/**
+ * The `Tooltip` component is used to describe a element.
+ *
+ * @see https://rsuitejs.com/components/tooltip
+ */
 var Tooltip = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,

package/cjs/Tree/Tree.d.ts

@@ -93,5 +93,10 @@ export interface TreeProps<ValueType = string | number> extends TreeBaseProps<Va
     /** Default selected Value  */
     defaultValue?: ValueType;
 }
+/**
+ * The `Tree` component is used to display hierarchical data.
+ *
+ * @see https://rsuitejs.com/components/tree
+ */
 declare const Tree: RsRefForwardingComponent<'div', TreeProps>;
 export default Tree;

package/cjs/Tree/Tree.js

@@ -19,6 +19,11 @@ exports.TREE_NODE_DROP_POSITION = TREE_NODE_DROP_POSITION;
   TREE_NODE_DROP_POSITION[TREE_NODE_DROP_POSITION["DRAG_OVER_TOP"] = 1] = "DRAG_OVER_TOP";
   TREE_NODE_DROP_POSITION[TREE_NODE_DROP_POSITION["DRAG_OVER_BOTTOM"] = 2] = "DRAG_OVER_BOTTOM";
 })(TREE_NODE_DROP_POSITION || (exports.TREE_NODE_DROP_POSITION = TREE_NODE_DROP_POSITION = {}));
+/**
+ * The `Tree` component is used to display hierarchical data.
+ *
+ * @see https://rsuitejs.com/components/tree
+ */
 var Tree = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var contextValue = (0, _react.useMemo)(function () {
     return {

package/cjs/TreePicker/TreePicker.d.ts

@@ -23,5 +23,10 @@ export interface TreePickerProps<T = number | string> extends TreeBaseProps<T, I
     /** Called when scrolling */
     onScroll?: (event: React.SyntheticEvent) => void;
 }
+/**
+ * The `TreePicker` component is used for selecting single options which are organized in a tree structure.
+ *
+ * @see https://rsuitejs.com/components/tree-picker/
+ */
 declare const TreePicker: PickerComponent<TreePickerProps>;
 export default TreePicker;

package/cjs/TreePicker/TreePicker.js

@@ -24,6 +24,12 @@ var emptyArray = [];
 var itemSize = function itemSize() {
   return 36;
 };
+
+/**
+ * The `TreePicker` component is used for selecting single options which are organized in a tree structure.
+ *
+ * @see https://rsuitejs.com/components/tree-picker/
+ */
 var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,

package/cjs/Uploader/Uploader.d.ts

@@ -105,5 +105,10 @@ export interface FileProgressType {
     status?: FileStatusType;
     progress?: number;
 }
+/**
+ * The `Uploader` component is used to upload files.
+ *
+ * @see https://rsuitejs.com/components/uploader
+ */
 declare const Uploader: React.ForwardRefExoticComponent<UploaderProps & React.RefAttributes<unknown>>;
 export default Uploader;

package/cjs/Uploader/Uploader.js

@@ -88,6 +88,12 @@ var useFileList = function useFileList(defaultFileList) {
   }, []);
   return [fileListRef, dispatchCallback];
 };
+
+/**
+ * The `Uploader` component is used to upload files.
+ *
+ * @see https://rsuitejs.com/components/uploader
+ */
 var Uploader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,

package/cjs/Whisper/Whisper.d.ts

@@ -3,5 +3,11 @@ import { OverlayTriggerHandle } from '../Overlay/OverlayTrigger';
 import { OverlayTriggerProps } from '../Overlay/OverlayTrigger';
 export declare type WhisperProps = OverlayTriggerProps;
 export declare type WhisperInstance = OverlayTriggerHandle;
+/**
+ * The `Whisper` component is used to display a floating element.
+ * It is usually used with the `Tooltip` and `Popover` components.
+ *
+ * @see https://rsuitejs.com/components/whisper
+ */
 declare const Whisper: React.ForwardRefExoticComponent<OverlayTriggerProps & React.RefAttributes<OverlayTriggerHandle>>;
 export default Whisper;

package/cjs/Whisper/Whisper.js

@@ -12,6 +12,12 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _OverlayTrigger = _interopRequireDefault(require("../Overlay/OverlayTrigger"));
 var _utils = require("../utils");
 var _CustomProvider = require("../CustomProvider");
+/**
+ * The `Whisper` component is used to display a floating element.
+ * It is usually used with the `Tooltip` and `Popover` components.
+ *
+ * @see https://rsuitejs.com/components/whisper
+ */
 var Whisper = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var onOpen = props.onOpen,
     onClose = props.onClose,

package/cjs/Windowing/AutoSizer.d.ts

@@ -21,5 +21,10 @@ export interface AutoSizerProps {
     /** Callback to be invoked on-resize */
     onResize?: ((size: Size) => void) | undefined;
 }
+/**
+ * High-order component that automatically adjusts the width and height of a single child.
+ *
+ * @private
+ */
 declare const AutoSizer: React.ForwardRefExoticComponent<AutoSizerProps & React.RefAttributes<HTMLDivElement>>;
 export default AutoSizer;

package/cjs/Windowing/AutoSizer.js

@@ -10,6 +10,11 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var _react = _interopRequireWildcard(require("react"));
 var _getStyle = _interopRequireDefault(require("dom-lib/getStyle"));
 var _utils = require("../utils");
+/**
+ * High-order component that automatically adjusts the width and height of a single child.
+ *
+ * @private
+ */
 var AutoSizer = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var children = props.children,
     className = props.className,

package/cjs/Windowing/List.d.ts

@@ -5,7 +5,7 @@ export interface ListProps<T = any> extends WithAsProps {
      * @deprecated use itemSize instead
      * Either a fixed row height (number) or a function that returns the height of a row given its index: ({ index: number }): number
      */
-    rowHeight?: number | (({ index: number }: {
+    rowHeight?: number | (({ index }: {
         index: any;
     }) => number);
     /**
@@ -41,5 +41,10 @@ export interface ListHandle extends Partial<VariableSizeList> {
      */
     scrollToRow?: (index: number) => void;
 }
+/**
+ * This component renders a virtualized list of elements with either fixed or dynamic heights.
+ *
+ * @private
+ */
 declare const List: RsRefForwardingComponent<'div', ListProps>;
 export default List;

package/cjs/Windowing/List.js

@@ -10,6 +10,11 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var _react = _interopRequireWildcard(require("react"));
 var _reactWindow = require("react-window");
 var _utils = require("../utils");
+/**
+ * This component renders a virtualized list of elements with either fixed or dynamic heights.
+ *
+ * @private
+ */
 var List = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var rowHeight = props.rowHeight,
     _props$as = props.as,

package/cjs/index.d.ts

@@ -90,6 +90,8 @@ export { default as Cascader } from './Cascader';
 export type { CascaderProps } from './Cascader';
 export { default as MultiCascader } from './MultiCascader';
 export type { MultiCascaderProps } from './MultiCascader';
+export { default as DateInput } from './DateInput';
+export type { DateInputProps } from './DateInput';
 export { default as DatePicker } from './DatePicker';
 export type { DatePickerProps } from './DatePicker';
 export { default as DateRangePicker } from './DateRangePicker';
@@ -160,3 +162,4 @@ export { default as CustomProvider } from './CustomProvider';
 export type { CustomProviderProps } from './CustomProvider';
 export type { Locale, CalendarLocale, PlaintextLocale, PaginationLocale, TableLocale, DatePickerLocale, DateRangePickerLocale, PickerLocale, InputPickerLocale, UploaderLocale, BreadcrumbLocale, ToggleLocale } from './locales';
 export type { PickerHandle } from './Picker';
+export { default as useMediaQuery } from './useMediaQuery';

package/cjs/index.js

@@ -4,7 +4,7 @@
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
-exports.useFormClassNames = exports.useToaster = exports.CustomProvider = exports.Affix = exports.DOMHelper = exports.Animation = exports.Schema = exports.Stack = exports.Divider = exports.Footer = exports.Sidebar = exports.Header = exports.Content = exports.Container = exports.FlexboxGrid = exports.Col = exports.Row = exports.Grid = exports.Carousel = exports.Calendar = exports.List = exports.TagGroup = exports.Tag = exports.Timeline = exports.Progress = exports.Table = exports.PanelGroup = exports.Panel = exports.CheckTree = exports.Tree = exports.Rate = exports.RangeSlider = exports.Slider = exports.Uploader = exports.AutoComplete = exports.DateRangePicker = exports.DatePicker = exports.MultiCascader = exports.Cascader = exports.CheckTreePicker = exports.TreePicker = exports.TagInput = exports.TagPicker = exports.InputPicker = exports.CheckPicker = exports.SelectPicker = exports.RadioTileGroup = exports.RadioTile = exports.RadioGroup = exports.Radio = exports.CheckboxGroup = exports.Checkbox = exports.InputGroup = exports.InputNumber = exports.MaskedInput = exports.Input = exports.Form = exports.Toggle = exports.Steps = exports.Pagination = exports.Breadcrumb = exports.Sidenav = exports.Navbar = exports.Nav = exports.Dropdown = exports.toaster = exports.AvatarGroup = exports.Avatar = exports.Badge = exports.Placeholder = exports.SafeAnchor = exports.Loader = exports.Drawer = exports.Message = exports.Notification = exports.Modal = exports.Popover = exports.Tooltip = exports.Whisper = exports.ButtonGroup = exports.ButtonToolbar = exports.IconButton = exports.Button = void 0;
+exports.useFormClassNames = exports.useToaster = exports.useMediaQuery = exports.CustomProvider = exports.Affix = exports.DOMHelper = exports.Animation = exports.Schema = exports.Stack = exports.Divider = exports.Footer = exports.Sidebar = exports.Header = exports.Content = exports.Container = exports.FlexboxGrid = exports.Col = exports.Row = exports.Grid = exports.Carousel = exports.Calendar = exports.List = exports.TagGroup = exports.Tag = exports.Timeline = exports.Progress = exports.Table = exports.PanelGroup = exports.Panel = exports.CheckTree = exports.Tree = exports.Rate = exports.RangeSlider = exports.Slider = exports.Uploader = exports.AutoComplete = exports.DateRangePicker = exports.DatePicker = exports.DateInput = exports.MultiCascader = exports.Cascader = exports.CheckTreePicker = exports.TreePicker = exports.TagInput = exports.TagPicker = exports.InputPicker = exports.CheckPicker = exports.SelectPicker = exports.RadioTileGroup = exports.RadioTile = exports.RadioGroup = exports.Radio = exports.CheckboxGroup = exports.Checkbox = exports.InputGroup = exports.InputNumber = exports.MaskedInput = exports.Input = exports.Form = exports.Toggle = exports.Steps = exports.Pagination = exports.Breadcrumb = exports.Sidenav = exports.Navbar = exports.Nav = exports.Dropdown = exports.toaster = exports.AvatarGroup = exports.Avatar = exports.Badge = exports.Placeholder = exports.SafeAnchor = exports.Loader = exports.Drawer = exports.Message = exports.Notification = exports.Modal = exports.Popover = exports.Tooltip = exports.Whisper = exports.ButtonGroup = exports.ButtonToolbar = exports.IconButton = exports.Button = void 0;
 var _Button = _interopRequireDefault(require("./Button"));
 exports.Button = _Button.default;
 var _IconButton = _interopRequireDefault(require("./IconButton"));
@@ -99,6 +99,8 @@ var _Cascader = _interopRequireDefault(require("./Cascader"));
 exports.Cascader = _Cascader.default;
 var _MultiCascader = _interopRequireDefault(require("./MultiCascader"));
 exports.MultiCascader = _MultiCascader.default;
+var _DateInput = _interopRequireDefault(require("./DateInput"));
+exports.DateInput = _DateInput.default;
 var _DatePicker = _interopRequireDefault(require("./DatePicker"));
 exports.DatePicker = _DatePicker.default;
 var _DateRangePicker = _interopRequireDefault(require("./DateRangePicker"));
@@ -168,4 +170,6 @@ exports.DOMHelper = _DOMHelper.default;
 var _Affix = _interopRequireDefault(require("./Affix"));
 exports.Affix = _Affix.default;
 var _CustomProvider = _interopRequireDefault(require("./CustomProvider"));
-exports.CustomProvider = _CustomProvider.default;
+exports.CustomProvider = _CustomProvider.default;
+var _useMediaQuery = _interopRequireDefault(require("./useMediaQuery"));
+exports.useMediaQuery = _useMediaQuery.default;

package/cjs/toaster/toaster.d.ts

@@ -2,19 +2,21 @@ import React from 'react';
 import { ToastContainerProps } from './ToastContainer';
 export interface Toaster {
     /**
-     * Add a message to the container.
-     * When the container does not exist, create a new container. Use `placement` as the ID of the container
-     * @param message
-     * @param options
+     * Push a toast message.
+     * @param message The message to be displayed.
+     *                eg: `<Message type="success" description="Success" />` or `<Notification type="success" closable>Success</Notification>`
+     * @param options The options of the toast message. (optional)
+     *                eg: `{ placement: 'topCenter', duration: 5000 }`
+     * @returns The key of the toast message.
      */
     push(message: React.ReactNode, options?: ToastContainerProps): string | undefined | Promise<string | undefined>;
     /**
-     * Remove a message by key
-     * @param key
+     * Remove a toast message.
+     * @param key  The key of the toast message.
      */
     remove(key: string): void;
     /**
-     * Clear all messages
+     * Clear all toast messages.
      */
     clear(): void;
 }

package/cjs/toaster/useToaster.d.ts

@@ -1,12 +1,30 @@
 import React from 'react';
 import { ToastContainerProps } from './ToastContainer';
 /**
- * Hook to use the toaster
+ * The 'useToaster' hook is a wrapper for the 'toaster' module.
  * @returns toaster { push, remove, clear }
+ *
+ * @see https://rsuitejs.com/components/message/
+ * @see https://rsuitejs.com/components/notification/
  */
 declare const useToaster: () => {
+    /**
+     * Push a toast message.
+     * @param message The message to be displayed.
+     *                eg: `<Message type="success" description="Success" />` or `<Notification type="success" closable>Success</Notification>`
+     * @param options The options of the toast message. (optional)
+     *                eg: `{ placement: 'topCenter', duration: 5000 }`
+     * @returns The key of the toast message.
+     */
     push: (message: React.ReactNode, options?: ToastContainerProps) => string | Promise<string | undefined> | undefined;
+    /**
+     * Remove a toast message.
+     * @param key  The key of the toast message.
+     */
     remove: (key: string) => void;
+    /**
+     * Clear all toast messages.
+     */
     clear: () => void;
 };
 export default useToaster;

package/cjs/toaster/useToaster.js

@@ -8,25 +8,43 @@ var _react = require("react");
 var _toaster = _interopRequireDefault(require("./toaster"));
 var _utils = require("../utils");
 /**
- * Hook to use the toaster
+ * The 'useToaster' hook is a wrapper for the 'toaster' module.
  * @returns toaster { push, remove, clear }
+ *
+ * @see https://rsuitejs.com/components/message/
+ * @see https://rsuitejs.com/components/notification/
  */
 var useToaster = function useToaster() {
   var _useCustom = (0, _utils.useCustom)(),
     toasters = _useCustom.toasters;
   return (0, _react.useMemo)(function () {
     return {
+      /**
+       * Push a toast message.
+       * @param message The message to be displayed.
+       *                eg: `<Message type="success" description="Success" />` or `<Notification type="success" closable>Success</Notification>`
+       * @param options The options of the toast message. (optional)
+       *                eg: `{ placement: 'topCenter', duration: 5000 }`
+       * @returns The key of the toast message.
+       */
       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');
         return customToaster ? customToaster.push(message, options) : _toaster.default.push(message, options);
       },
+      /**
+       * Remove a toast message.
+       * @param key  The key of the toast message.
+       */
       remove: function remove(key) {
         toasters ? Array.from(toasters.current).forEach(function (_ref) {
           var c = _ref[1];
           return c === null || c === void 0 ? void 0 : c.remove(key);
         }) : _toaster.default.remove(key);
       },
+      /**
+       * Clear all toast messages.
+       */
       clear: function clear() {
         toasters ? Array.from(toasters.current).forEach(function (_ref2) {
           var c = _ref2[1];

package/cjs/useMediaQuery/index.d.ts

@@ -0,0 +1,2 @@
+import useMediaQuery from './useMediaQuery';
+export default useMediaQuery;

package/cjs/useMediaQuery/index.js

@@ -0,0 +1,9 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _useMediaQuery = _interopRequireDefault(require("./useMediaQuery"));
+var _default = _useMediaQuery.default;
+exports.default = _default;

package/cjs/useMediaQuery/useMediaQuery.d.ts

@@ -0,0 +1,23 @@
+export declare const mediaQuerySizeMap: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+    xxl: string;
+};
+/**
+ * React hook that tracks state of a CSS media query.
+ * @deprecated Use useMediaQuery instead.
+ *
+ * @see https://rsuitejs.com/components/use-media-query
+ */
+export declare function useMediaQueryLegacy(query: string | keyof typeof mediaQuerySizeMap | (string | keyof typeof mediaQuerySizeMap)[]): boolean[];
+/**
+ * React hook that tracks state of a CSS media query
+ * @version 5.48.0
+ * @see https://rsuitejs.com/components/use-media-query
+ */
+export declare function useMediaQuery(query: string | keyof typeof mediaQuerySizeMap | (string | keyof typeof mediaQuerySizeMap)[]): boolean[];
+declare const _default: typeof useMediaQuery;
+export default _default;

package/cjs/useMediaQuery/useMediaQuery.js

@@ -0,0 +1,123 @@
+'use client';
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.useMediaQueryLegacy = useMediaQueryLegacy;
+exports.useMediaQuery = useMediaQuery;
+exports.default = exports.mediaQuerySizeMap = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireWildcard(require("react"));
+var _canUseDOM = _interopRequireDefault(require("dom-lib/canUseDOM"));
+var _pick = _interopRequireDefault(require("lodash/pick"));
+var mediaQuerySizeMap = {
+  xs: '(max-width: 575px)',
+  sm: '(min-width: 576px)',
+  md: '(min-width: 768px)',
+  lg: '(min-width: 992px)',
+  xl: '(min-width: 1200px)',
+  xxl: '(min-width: 1400px)'
+};
+exports.mediaQuerySizeMap = mediaQuerySizeMap;
+var matchMedia = function matchMedia(query) {
+  if (_canUseDOM.default) {
+    return window.matchMedia(query);
+  }
+  return {
+    matches: false,
+    media: query
+  };
+};
+
+/**
+ * React hook that tracks state of a CSS media query.
+ * @deprecated Use useMediaQuery instead.
+ *
+ * @see https://rsuitejs.com/components/use-media-query
+ */
+function useMediaQueryLegacy(query) {
+  var queries = Array.isArray(query) ? query : [query];
+  var mediaQueries = queries.map(function (query) {
+    return mediaQuerySizeMap[query] || query;
+  });
+  var _useState = (0, _react.useState)(function () {
+      return mediaQueries.map(function (query) {
+        return (0, _pick.default)(matchMedia(query), ['matches', 'media']);
+      });
+    }),
+    mediaQueryArray = _useState[0],
+    setMediaQueryArray = _useState[1];
+  function handleChange(event) {
+    setMediaQueryArray(function (prevMediaQueryArray) {
+      return prevMediaQueryArray.map(function (item) {
+        return item.media === event.media ? (0, _extends2.default)({}, item, {
+          matches: event.matches
+        }) : item;
+      });
+    });
+  }
+  (0, _react.useEffect)(function () {
+    var mediaQueryList = mediaQueries.map(function (query) {
+      return matchMedia(query);
+    });
+    mediaQueryList.forEach(function (query) {
+      query.addEventListener('change', handleChange);
+    });
+    return function () {
+      mediaQueryList.forEach(function (query) {
+        query.removeEventListener('change', handleChange);
+      });
+    };
+  }, [mediaQueries]);
+  return mediaQueryArray.map(function (query) {
+    return query.matches;
+  });
+}
+
+/**
+ * React hook that tracks state of a CSS media query
+ * @version 5.48.0
+ * @see https://rsuitejs.com/components/use-media-query
+ */
+function useMediaQuery(query) {
+  var _React$useSyncExterna;
+  var queries = Array.isArray(query) ? query : [query];
+  var mediaQueries = queries.map(function (query) {
+    return mediaQuerySizeMap[query] || query;
+  });
+  var mediaQueryArray = (0, _react.useRef)(mediaQueries.map(function (query) {
+    return matchMedia(query).matches;
+  }));
+  var subscribe = (0, _react.useCallback)(function (callback) {
+    var list = mediaQueries.map(function (query) {
+      return matchMedia(query);
+    });
+    var handleChange = function handleChange(event) {
+      var index = list.findIndex(function (item) {
+        return item.media === event.media;
+      });
+      if (index !== -1) {
+        mediaQueryArray.current[index] = event.matches;
+      }
+      callback();
+    };
+    list.forEach(function (query) {
+      query.addEventListener('change', handleChange);
+    });
+    return function () {
+      list.forEach(function (query) {
+        query.removeEventListener('change', handleChange);
+      });
+    };
+  }, [mediaQueries]);
+  var getSnapshot = function getSnapshot() {
+    return mediaQueryArray.current;
+  };
+  var getServerSnapshot = function getServerSnapshot() {
+    throw Error('useMediaQuery is a client-only hook');
+  };
+  return (_React$useSyncExterna = _react.default['useSyncExternalStore']) === null || _React$useSyncExterna === void 0 ? void 0 : _React$useSyncExterna.call(_react.default, subscribe, getSnapshot, getServerSnapshot);
+}
+var _default = typeof _react.default['useSyncExternalStore'] === 'function' ? useMediaQuery : useMediaQueryLegacy;
+exports.default = _default;

package/cjs/utils/BrowserDetection.d.ts

@@ -2,6 +2,7 @@ export declare const isIE: () => boolean;
 export declare const isIE10: () => boolean;
 export declare const isIE11: () => boolean;
 export declare const isEdge: () => boolean;
+export declare const isAndroid: () => boolean;
 export declare const getChromeVersion: () => number | false;
 export declare const getSafariVersion: () => number | false;
 /**

package/cjs/utils/BrowserDetection.js

@@ -3,7 +3,7 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
-exports.isSupportFlexGap = exports.getSafariVersion = exports.getChromeVersion = exports.isEdge = exports.isIE11 = exports.isIE10 = exports.isIE = void 0;
+exports.isSupportFlexGap = exports.getSafariVersion = exports.getChromeVersion = exports.isAndroid = exports.isEdge = exports.isIE11 = exports.isIE10 = exports.isIE = void 0;
 var _canUseDOM = _interopRequireDefault(require("dom-lib/canUseDOM"));
 // from http://stackoverflow.com/questions/9847580/how-to-detect-safari-chrome-ie-firefox-and-opera-browser
 
@@ -26,6 +26,10 @@ var isEdge = function isEdge() {
   return _canUseDOM.default && !isIE() && 'styleMedia' in window;
 };
 exports.isEdge = isEdge;
+var isAndroid = function isAndroid() {
+  return _canUseDOM.default && /Android/i.test(navigator.userAgent);
+};
+exports.isAndroid = isAndroid;
 var getChromeVersion = function getChromeVersion() {
   if (_canUseDOM.default) {
     var match = window.navigator.userAgent.match(/Chrom(e|ium)\/([\d\.]+)\./);