rsuite 5.62.1 → 5.63.0-alpha.2

package/cjs/Form/Form.js

@@ -193,7 +193,6 @@ Form.ControlLabel = _FormControlLabel.default;
 Form.ErrorMessage = _FormErrorMessage.default;
 Form.Group = _FormGroup.default;
 Form.HelpText = _FormHelpText.default;
-Form.Control = _FormControl.default;
 Form.displayName = 'Form';
 Form.propTypes = {
   className: _propTypes.default.string,

package/cjs/Table/Table.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
-import { Column, TableProps, RowDataType, TableInstance, CellProps as TableCellProps, RowKeyType } from 'rsuite-table';
+import { TableProps, RowDataType, TableInstance, CellProps as TableCellProps, RowKeyType } from 'rsuite-table';
+import TableColumn from './TableColumn';
 export interface CellProps<Row extends RowDataType> extends Omit<TableCellProps<Row>, 'rowData' | 'dataKey'> {
     /** Data binding key, but also a sort of key */
     dataKey?: string | keyof Row;
@@ -19,7 +20,7 @@ declare const Table: (<Row extends RowDataType<any>, Key extends RowKeyType>(pro
     /**
      * The `Table.Column` component  is used to define a column in a table.
      */
-    Column: typeof Column;
+    Column: typeof TableColumn;
     /**
      * The `Table.HeaderCell` component  is used to define a header cell in a table.
      */

package/cjs/Table/Table.js

@@ -9,6 +9,10 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var _react = _interopRequireDefault(require("react"));
 var _rsuiteTable = require("rsuite-table");
 var _hooks = require("../internals/hooks");
+var _TableCell = _interopRequireDefault(require("./TableCell"));
+var _TableHeaderCell = _interopRequireDefault(require("./TableHeaderCell"));
+var _TableColumn = _interopRequireDefault(require("./TableColumn"));
+var _TableColumnGroup = _interopRequireDefault(require("./TableColumnGroup"));
 var _excluded = ["locale", "loadAnimation"];
 var CustomTable = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var localeProp = props.locale,
@@ -35,18 +39,18 @@ var Table = Object.assign(CustomTable, {
   /**
    * The `Table.Cell` component  is used to display data in a table cell.
    */
-  Cell: _rsuiteTable.Cell,
+  Cell: _TableCell.default,
   /**
    * The `Table.Column` component  is used to define a column in a table.
    */
-  Column: _rsuiteTable.Column,
+  Column: _TableColumn.default,
   /**
    * The `Table.HeaderCell` component  is used to define a header cell in a table.
    */
-  HeaderCell: _rsuiteTable.HeaderCell,
+  HeaderCell: _TableHeaderCell.default,
   /**
    * The `Table.ColumnGroup` component  is used to define a column group in a table.
    */
-  ColumnGroup: _rsuiteTable.ColumnGroup
+  ColumnGroup: _TableColumnGroup.default
 });
 var _default = exports.default = Table;

package/cjs/Table/TableCell.d.ts

@@ -0,0 +1,2 @@
+import { Cell } from 'rsuite-table';
+export default Cell;

package/cjs/Table/TableCell.js

@@ -0,0 +1,7 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _rsuiteTable = require("rsuite-table");
+var _default = exports.default = _rsuiteTable.Cell;

package/cjs/Table/TableColumn.d.ts

@@ -0,0 +1,2 @@
+import { Column } from 'rsuite-table';
+export default Column;

package/cjs/Table/TableColumn.js

@@ -0,0 +1,7 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _rsuiteTable = require("rsuite-table");
+var _default = exports.default = _rsuiteTable.Column;

package/cjs/Table/TableColumnGroup.d.ts

@@ -0,0 +1,2 @@
+import { ColumnGroup } from 'rsuite-table';
+export default ColumnGroup;

package/cjs/Table/TableColumnGroup.js

@@ -0,0 +1,7 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _rsuiteTable = require("rsuite-table");
+var _default = exports.default = _rsuiteTable.ColumnGroup;

package/cjs/Table/TableHeaderCell.d.ts

@@ -0,0 +1,2 @@
+import { HeaderCell } from 'rsuite-table';
+export default HeaderCell;

package/cjs/Table/TableHeaderCell.js

@@ -0,0 +1,7 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _rsuiteTable = require("rsuite-table");
+var _default = exports.default = _rsuiteTable.HeaderCell;

package/cjs/Toggle/Toggle.d.ts

@@ -1,28 +1,54 @@
 import React from 'react';
 import { WithAsProps, TypeAttributes, RsRefForwardingComponent } from '../internals/types';
 import { ToggleLocale } from '../locales';
-export interface ToggleProps extends WithAsProps {
-    /** Whether to disabled toggle */
+export interface ToggleProps extends WithAsProps, Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'onChange'> {
+    /**
+     * The color of the toggle.
+     */
+    color?: TypeAttributes.Color;
+    /**
+     * Whether to disabled toggle
+     */
     disabled?: boolean;
-    /** Render the control as plain text */
+    /**
+     * Render the control as plain text
+     */
     plaintext?: boolean;
-    /** Make the control readonly */
+    /**
+     * Make the control readonly
+     */
     readOnly?: boolean;
-    /** Whether the checked state is being updated */
+    /**
+     * Whether the checked state is being updated
+     */
     loading?: boolean;
-    /** Checked（Controlled) */
+    /**
+     * Whether the toggle is checked （Controlled)
+     */
     checked?: boolean;
-    /** Default checked */
+    /**
+     * Whether the toggle is checked (Uncontrolled)
+     */
     defaultChecked?: boolean;
-    /** Checked display content */
+    /**
+     * Checked display content
+     */
     checkedChildren?: React.ReactNode;
-    /** Unselected display content */
+    /**
+     * Unchecked display content
+     */
     unCheckedChildren?: React.ReactNode;
-    /** Toggle size */
+    /**
+     * The size of the toggle
+     */
     size?: Omit<TypeAttributes.Size, 'xs'>;
-    /** Custom locale */
+    /**
+     * Custom locale
+     */
     locale?: ToggleLocale;
-    /** Callback function when state changes */
+    /**
+     * Called when the state of the toggle changes
+     */
     onChange?: (checked: boolean, event: React.ChangeEvent<HTMLInputElement>) => void;
 }
 /**

package/cjs/Toggle/Toggle.js

@@ -13,7 +13,7 @@ var _utils = require("../internals/utils");
 var _propTypes2 = require("../internals/propTypes");
 var _Plaintext = _interopRequireDefault(require("../internals/Plaintext"));
 var _Loader = _interopRequireDefault(require("../Loader"));
-var _excluded = ["as", "disabled", "readOnly", "loading", "plaintext", "className", "checkedChildren", "unCheckedChildren", "classPrefix", "checked", "defaultChecked", "size", "locale", "onChange"];
+var _excluded = ["as", "disabled", "readOnly", "loading", "plaintext", "children", "className", "color", "checkedChildren", "unCheckedChildren", "classPrefix", "checked", "defaultChecked", "size", "locale", "onChange"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
@@ -29,7 +29,9 @@ var Toggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     _props$loading = props.loading,
     loading = _props$loading === void 0 ? false : _props$loading,
     plaintext = props.plaintext,
+    children = props.children,
     className = props.className,
+    color = props.color,
     checkedChildren = props.checkedChildren,
     unCheckedChildren = props.unCheckedChildren,
     _props$classPrefix = props.classPrefix,
@@ -50,24 +52,27 @@ var Toggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     merge = _useClassNames.merge,
     withClassPrefix = _useClassNames.withClassPrefix,
     prefix = _useClassNames.prefix;
-  var classes = merge(className, withClassPrefix(size, {
+  var classes = merge(className, withClassPrefix(size, color, {
     checked: checked,
     disabled: disabled,
     loading: loading
   }));
   var inner = checked ? checkedChildren : unCheckedChildren;
   var label = checked ? locale.on : locale.off;
+  var labelId = (0, _hooks.useUniqueId)('rs-label');
+  var innerId = inner ? labelId + '-inner' : undefined;
+  var labelledby = children ? labelId : innerId;
   var _partitionHTMLProps = (0, _utils.partitionHTMLProps)(rest),
     htmlInputProps = _partitionHTMLProps[0],
     restProps = _partitionHTMLProps[1];
-  var handleInputChange = (0, _react.useCallback)(function (e) {
+  var handleInputChange = (0, _hooks.useEventCallback)(function (e) {
     if (disabled || readOnly || loading) {
       return;
     }
     var checked = e.target.checked;
     setChecked(checked);
     onChange === null || onChange === void 0 ? void 0 : onChange(checked, e);
-  }, [disabled, readOnly, loading, setChecked, onChange]);
+  });
   if (plaintext) {
     return /*#__PURE__*/_react.default.createElement(_Plaintext.default, null, inner || label);
   }
@@ -86,15 +91,20 @@ var Toggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     role: "switch",
     "aria-checked": checked,
     "aria-disabled": disabled,
-    "aria-label": typeof inner === 'string' ? inner : label,
+    "aria-labelledby": labelledby,
+    "aria-label": labelledby ? undefined : label,
     "aria-busy": loading || undefined
   })), /*#__PURE__*/_react.default.createElement(Component, {
     className: prefix('presentation')
   }, /*#__PURE__*/_react.default.createElement("span", {
-    className: prefix('inner')
+    className: prefix('inner'),
+    id: innerId
   }, inner), loading && /*#__PURE__*/_react.default.createElement(_Loader.default, {
     className: prefix('loader')
-  })));
+  })), children && /*#__PURE__*/_react.default.createElement("span", {
+    className: prefix('label'),
+    id: labelId
+  }, children));
 });
 Toggle.displayName = 'Toggle';
 Toggle.propTypes = {
@@ -108,6 +118,7 @@ Toggle.propTypes = {
   loading: _propTypes.default.bool,
   classPrefix: _propTypes.default.string,
   className: _propTypes.default.string,
+  children: _propTypes.default.node,
   onChange: _propTypes.default.func,
   as: _propTypes.default.elementType,
   size: (0, _propTypes2.oneOf)(['sm', 'md', 'lg']),

package/cjs/index.d.ts

@@ -180,6 +180,7 @@ 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 './internals/Picker';
 export { default as useMediaQuery } from './useMediaQuery';
+export { default as useBreakpointValue } from './useBreakpointValue';
 export { default as VisuallyHidden } from './VisuallyHidden';
 export type { VisuallyHiddenProps } from './VisuallyHidden';
 export { default as Tabs } from './Tabs';

package/cjs/index.js

@@ -3,7 +3,7 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
-exports.useToaster = exports.useMediaQuery = exports.useFormClassNames = exports.toaster = exports.Whisper = exports.VisuallyHidden = exports.Uploader = exports.TreePicker = exports.Tree = exports.Tooltip = exports.Toggle = exports.Timeline = exports.Text = exports.TagPicker = exports.TagInput = exports.TagGroup = exports.Tag = exports.Tabs = exports.Table = exports.Steps = exports.Stack = exports.Slider = exports.Sidenav = exports.Sidebar = exports.SelectPicker = exports.Schema = exports.SafeAnchor = exports.Row = exports.Rate = exports.RangeSlider = exports.RadioTileGroup = exports.RadioTile = exports.RadioGroup = exports.Radio = exports.Progress = exports.Popover = exports.Placeholder = exports.PanelGroup = exports.Panel = exports.Pagination = exports.Notification = exports.Navbar = exports.Nav = exports.MultiCascader = exports.MultiCascadeTree = exports.Modal = exports.Message = exports.MaskedInput = exports.Loader = exports.List = exports.InputPicker = exports.InputNumber = exports.InputGroup = exports.Input = exports.InlineEdit = exports.IconButton = exports.Highlight = exports.HeadingGroup = exports.Heading = exports.Header = exports.Grid = exports.Form = exports.Footer = exports.FlexboxGrid = exports.Dropdown = exports.Drawer = exports.Divider = exports.DateRangePicker = exports.DateRangeInput = exports.DatePicker = exports.DateInput = exports.DOMHelper = exports.CustomProvider = exports.Content = exports.Container = exports.Col = exports.CheckboxGroup = exports.Checkbox = exports.CheckTreePicker = exports.CheckTree = exports.CheckPicker = exports.Cascader = exports.CascadeTree = exports.Carousel = exports.Calendar = exports.ButtonToolbar = exports.ButtonGroup = exports.Button = exports.Breadcrumb = exports.Badge = exports.AvatarGroup = exports.Avatar = exports.AutoComplete = exports.Animation = exports.Affix = exports.Accordion = void 0;
+exports.useToaster = exports.useMediaQuery = exports.useFormClassNames = exports.useBreakpointValue = exports.toaster = exports.Whisper = exports.VisuallyHidden = exports.Uploader = exports.TreePicker = exports.Tree = exports.Tooltip = exports.Toggle = exports.Timeline = exports.Text = exports.TagPicker = exports.TagInput = exports.TagGroup = exports.Tag = exports.Tabs = exports.Table = exports.Steps = exports.Stack = exports.Slider = exports.Sidenav = exports.Sidebar = exports.SelectPicker = exports.Schema = exports.SafeAnchor = exports.Row = exports.Rate = exports.RangeSlider = exports.RadioTileGroup = exports.RadioTile = exports.RadioGroup = exports.Radio = exports.Progress = exports.Popover = exports.Placeholder = exports.PanelGroup = exports.Panel = exports.Pagination = exports.Notification = exports.Navbar = exports.Nav = exports.MultiCascader = exports.MultiCascadeTree = exports.Modal = exports.Message = exports.MaskedInput = exports.Loader = exports.List = exports.InputPicker = exports.InputNumber = exports.InputGroup = exports.Input = exports.InlineEdit = exports.IconButton = exports.Highlight = exports.HeadingGroup = exports.Heading = exports.Header = exports.Grid = exports.Form = exports.Footer = exports.FlexboxGrid = exports.Dropdown = exports.Drawer = exports.Divider = exports.DateRangePicker = exports.DateRangeInput = exports.DatePicker = exports.DateInput = exports.DOMHelper = exports.CustomProvider = exports.Content = exports.Container = exports.Col = exports.CheckboxGroup = exports.Checkbox = exports.CheckTreePicker = exports.CheckTree = exports.CheckPicker = exports.Cascader = exports.CascadeTree = exports.Carousel = exports.Calendar = exports.ButtonToolbar = exports.ButtonGroup = exports.Button = exports.Breadcrumb = exports.Badge = exports.AvatarGroup = exports.Avatar = exports.AutoComplete = exports.Animation = exports.Affix = exports.Accordion = void 0;
 var _Text = _interopRequireDefault(require("./Text"));
 exports.Text = _Text.default;
 var _Heading = _interopRequireDefault(require("./Heading"));
@@ -189,6 +189,8 @@ var _CustomProvider = _interopRequireDefault(require("./CustomProvider"));
 exports.CustomProvider = _CustomProvider.default;
 var _useMediaQuery = _interopRequireDefault(require("./useMediaQuery"));
 exports.useMediaQuery = _useMediaQuery.default;
+var _useBreakpointValue = _interopRequireDefault(require("./useBreakpointValue"));
+exports.useBreakpointValue = _useBreakpointValue.default;
 var _VisuallyHidden = _interopRequireDefault(require("./VisuallyHidden"));
 exports.VisuallyHidden = _VisuallyHidden.default;
 var _Tabs = _interopRequireDefault(require("./Tabs"));

package/cjs/useBreakpointValue/index.d.ts

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

package/cjs/useBreakpointValue/index.js

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

package/cjs/useBreakpointValue/useBreakpointValue.d.ts

@@ -0,0 +1,22 @@
+import { Query } from '../useMediaQuery';
+interface UseBreakpointValueOptions<T = any> {
+    /**
+     * The default value to return if no screen size matches.
+     */
+    defaultValue: T;
+}
+/**
+ * A React Hook that returns different values based on different screen sizes in responsive design.
+ * @version 5.63.0
+ * @unstable Please note that this API is not stable and may change in the future.
+ * @see https://rsuitejs.com/components/use-breakpoint-value
+ *
+ * @example
+ * ```ts
+ * const fontSize = useBreakpointValue({ sm: "14px", lg: "24px" }, { defaultValue: "16px" });
+ * const direction = useBreakpointValue({ sm: 'row' }, { defaultValue:'column' });
+ * ```
+ *
+ */
+export declare function useBreakpointValue<T = any>(breakpoints: Record<Query, T>, options?: UseBreakpointValueOptions<T>): T | undefined;
+export default useBreakpointValue;

package/cjs/useBreakpointValue/useBreakpointValue.js

@@ -0,0 +1,31 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+exports.useBreakpointValue = useBreakpointValue;
+var _useMediaQuery = _interopRequireDefault(require("../useMediaQuery"));
+/**
+ * A React Hook that returns different values based on different screen sizes in responsive design.
+ * @version 5.63.0
+ * @unstable Please note that this API is not stable and may change in the future.
+ * @see https://rsuitejs.com/components/use-breakpoint-value
+ *
+ * @example
+ * ```ts
+ * const fontSize = useBreakpointValue({ sm: "14px", lg: "24px" }, { defaultValue: "16px" });
+ * const direction = useBreakpointValue({ sm: 'row' }, { defaultValue:'column' });
+ * ```
+ *
+ */
+function useBreakpointValue(breakpoints, options) {
+  var _ref = options || {},
+    defaultValue = _ref.defaultValue;
+  var keys = Object.keys(breakpoints);
+  var values = Object.values(breakpoints);
+  var matches = (0, _useMediaQuery.default)(keys);
+  var index = matches.indexOf(true);
+  return index !== -1 ? values[index] : defaultValue;
+}
+var _default = exports.default = useBreakpointValue;

package/cjs/useMediaQuery/index.d.ts

@@ -1,2 +1,3 @@
 import useMediaQuery from './useMediaQuery';
+export type { Query } from './useMediaQuery';
 export default useMediaQuery;

package/cjs/useMediaQuery/useMediaQuery.d.ts

@@ -6,18 +6,21 @@ export declare const mediaQuerySizeMap: {
     xl: string;
     xxl: string;
 };
+/**
+ * The type of the query parameter.
+ */
+export type Query = string | keyof typeof mediaQuerySizeMap;
 /**
  * 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[];
+export declare function useMediaQueryOld(query: Query | Query[]): boolean[];
 /**
  * React hook that tracks state of a CSS media query
  * @version 5.48.0
+ * @unstable Please note that this API is not stable and may change in the future.
  * @see https://rsuitejs.com/components/use-media-query
  */
-export declare function useMediaQuery(query: string | keyof typeof mediaQuerySizeMap | (string | keyof typeof mediaQuerySizeMap)[]): boolean[];
+export declare function useMediaQuery(query: Query | Query[]): boolean[];
 declare const _default: typeof useMediaQuery;
 export default _default;

package/cjs/useMediaQuery/useMediaQuery.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports.mediaQuerySizeMap = exports.default = void 0;
 exports.useMediaQuery = useMediaQuery;
-exports.useMediaQueryLegacy = useMediaQueryLegacy;
+exports.useMediaQueryOld = useMediaQueryOld;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
 var _canUseDOM = _interopRequireDefault(require("dom-lib/canUseDOM"));
@@ -20,6 +20,11 @@ var mediaQuerySizeMap = exports.mediaQuerySizeMap = {
   xl: '(min-width: 1200px)',
   xxl: '(min-width: 1400px)'
 };
+
+/**
+ * The type of the query parameter.
+ */
+
 var matchMedia = function matchMedia(query) {
   if (_canUseDOM.default) {
     return window.matchMedia(query);
@@ -32,11 +37,9 @@ var matchMedia = function matchMedia(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) {
+function useMediaQueryOld(query) {
   var queries = Array.isArray(query) ? query : [query];
   var mediaQueries = queries.map(function (query) {
     return mediaQuerySizeMap[query] || query;
@@ -78,6 +81,7 @@ function useMediaQueryLegacy(query) {
 /**
  * React hook that tracks state of a CSS media query
  * @version 5.48.0
+ * @unstable Please note that this API is not stable and may change in the future.
  * @see https://rsuitejs.com/components/use-media-query
  */
 function useMediaQuery(query) {
@@ -98,7 +102,10 @@ function useMediaQuery(query) {
         return item.media === event.media;
       });
       if (index !== -1) {
-        mediaQueryArray.current[index] = event.matches;
+        // The store snapshot returned by getSnapshot must be immutable. So we need to create a new array.
+        var nextMediaQueryArray = mediaQueryArray.current.slice();
+        nextMediaQueryArray[index] = event.matches;
+        mediaQueryArray.current = nextMediaQueryArray;
       }
       callback();
     };
@@ -111,12 +118,12 @@ function useMediaQuery(query) {
       });
     };
   }, [mediaQueries]);
-  var getSnapshot = function getSnapshot() {
+  var getSnapshot = (0, _react.useCallback)(function () {
     return mediaQueryArray.current;
-  };
-  var getServerSnapshot = function getServerSnapshot() {
-    throw Error('useMediaQuery is a client-only hook');
-  };
+  }, []);
+  var getServerSnapshot = (0, _react.useCallback)(function () {
+    return mediaQueryArray.current;
+  }, []);
   return (_React$useSyncExterna = _react.default['useSyncExternalStore']) === null || _React$useSyncExterna === void 0 ? void 0 : _React$useSyncExterna.call(_react.default, subscribe, getSnapshot, getServerSnapshot);
 }
-var _default = exports.default = typeof _react.default['useSyncExternalStore'] === 'function' ? useMediaQuery : useMediaQueryLegacy;
+var _default = exports.default = typeof _react.default['useSyncExternalStore'] === 'function' ? useMediaQuery : useMediaQueryOld;