rsuite 6.0.0-canary-2025032014 → 6.0.0-canary-20250416

package/esm/internals/Picker/hooks/index.d.ts

@@ -3,4 +3,3 @@ export { default as useCombobox } from './useCombobox';
 export { default as useFocusItemValue } from './useFocusItemValue';
 export { default as useToggleKeyDownEvent } from './useToggleKeyDownEvent';
 export { default as useSearch } from './useSearch';
-export { default as usePickerClassName } from './usePickerClassName';

package/esm/internals/Picker/hooks/index.js

@@ -3,5 +3,4 @@ export { default as usePickerRef } from "./usePickerRef.js";
 export { default as useCombobox } from "./useCombobox.js";
 export { default as useFocusItemValue } from "./useFocusItemValue.js";
 export { default as useToggleKeyDownEvent } from "./useToggleKeyDownEvent.js";
-export { default as useSearch } from "./useSearch.js";
-export { default as usePickerClassName } from "./usePickerClassName.js";
+export { default as useSearch } from "./useSearch.js";

package/esm/internals/Picker/hooks/useCombobox.d.ts

@@ -3,6 +3,7 @@ declare function useCombobox(): {
     popupType: "dialog" | "menu" | "grid" | "listbox" | "tree" | undefined;
     multiple: boolean | undefined;
     placement: import("../../types").Placement | undefined;
+    breakpoint: string | undefined;
     labelId: string | undefined;
 };
 export default useCombobox;

package/esm/internals/Picker/hooks/useCombobox.js

@@ -7,13 +7,15 @@ function useCombobox() {
     hasLabel,
     popupType,
     multiple,
-    placement
+    placement,
+    breakpoint
   } = useContext(ComboboxContext);
   return {
     id,
     popupType,
     multiple,
     placement,
+    breakpoint,
     labelId: hasLabel ? `${id}-label` : undefined
   };
 }

package/esm/internals/Picker/index.d.ts

@@ -1,3 +1,4 @@
+export * from './PickerToggleTrigger';
 export { default as Listbox } from './Listbox';
 export { default as ListItem } from './ListItem';
 export { default as ListItemGroup } from './ListItemGroup';
@@ -6,9 +7,7 @@ export { default as PickerPopup } from './PickerPopup';
 export { default as PickerToggle } from './PickerToggle';
 export { default as PickerLabel } from './PickerLabel';
 export { default as PickerIndicator } from './PickerIndicator';
-export { default as PickerToggleTrigger } from './PickerToggleTrigger';
 export { default as SelectedElement } from './SelectedElement';
-export { pickTriggerPropKeys, omitTriggerPropKeys } from './PickerToggleTrigger';
 export * from './hooks';
 export * from './utils';
 export type { OverlayTriggerHandle, PositionChildProps } from '../Overlay/types';

package/esm/internals/Picker/index.js

@@ -1,5 +1,6 @@
 'use client';
 // export components
+export * from "./PickerToggleTrigger.js";
 export { default as Listbox } from "./Listbox.js";
 export { default as ListItem } from "./ListItem.js";
 export { default as ListItemGroup } from "./ListItemGroup.js";
@@ -8,11 +9,9 @@ export { default as PickerPopup } from "./PickerPopup.js";
 export { default as PickerToggle } from "./PickerToggle.js";
 export { default as PickerLabel } from "./PickerLabel.js";
 export { default as PickerIndicator } from "./PickerIndicator.js";
-export { default as PickerToggleTrigger } from "./PickerToggleTrigger.js";
 export { default as SelectedElement } from "./SelectedElement.js";
 
 // export hooks and utils
-export { pickTriggerPropKeys, omitTriggerPropKeys } from "./PickerToggleTrigger.js";
 export * from "./hooks/index.js";
 export * from "./utils.js";
 

package/{cjs → esm/internals}/SafeAnchor/SafeAnchor.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BoxProps } from '../internals/Box';
+import { BoxProps } from '../Box';
 export interface SafeAnchorProps extends BoxProps, React.HTMLAttributes<HTMLElement> {
     /** Link specified url */
     href?: string;
@@ -10,5 +10,5 @@ export interface SafeAnchorProps extends BoxProps, React.HTMLAttributes<HTMLElem
  * A SafeAnchor is a wrapper around the `<a>` HTML element.
  * @private
  */
-declare const SafeAnchor: import("../internals/types").InternalRefForwardingComponent<"a", SafeAnchorProps, never> & Record<string, never>;
+declare const SafeAnchor: import("../types").InternalRefForwardingComponent<"a", SafeAnchorProps, never> & Record<string, never>;
 export default SafeAnchor;

package/esm/{SafeAnchor → internals/SafeAnchor}/SafeAnchor.js

@@ -1,9 +1,9 @@
 'use client';
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React, { useCallback } from 'react';
-import Box from "../internals/Box/index.js";
-import { useCustom } from "../CustomProvider/index.js";
-import { forwardRef } from "../internals/utils/index.js";
+import Box from "../Box/index.js";
+import { useCustom } from "../../CustomProvider/index.js";
+import { forwardRef } from "../utils/index.js";
 function isTrivialHref(href) {
   return !href || href.trim() === '#';
 }

package/esm/internals/Tree/TreeView.js

@@ -5,7 +5,7 @@ import useCombobox from "../Picker/hooks/useCombobox.js";
 import ScrollView from "../ScrollView/index.js";
 import Box from "../Box/index.js";
 import { useTreeContextProps } from "./TreeProvider.js";
-import { forwardRef } from "../utils/index.js";
+import { forwardRef, mergeStyles, getCssValue } from "../utils/index.js";
 const ScrollShadowView = forwardRef((props, ref) => {
   return /*#__PURE__*/React.createElement(ScrollView, _extends({
     scrollShadow: true,
@@ -36,10 +36,9 @@ const TreeView = forwardRef((props, ref) => {
   const treeAs = scrollShadow && !virtualized ? ScrollShadowView : as;
 
   // If the tree is virtualized, the height is not needed.
-  const viewStyles = {
-    height: virtualized ? undefined : height,
-    ...style
-  };
+  const viewStyles = mergeStyles(style, {
+    '--rs-tree-view-height': virtualized ? undefined : getCssValue(height)
+  });
   return /*#__PURE__*/React.createElement(Box, _extends({
     as: treeAs,
     role: "tree",

package/esm/internals/hooks/useRootClose.js

@@ -3,7 +3,7 @@ import { useEffect, useCallback } from 'react';
 import contains from 'dom-lib/contains';
 import ownerDocument from 'dom-lib/ownerDocument';
 import on from 'dom-lib/on';
-import getDOMNode from "../utils/getDOMNode.js";
+import { getDOMNode } from "../utils/index.js";
 import { KEY_VALUES } from "../constants/index.js";
 function isLeftClickEvent(event) {
   return (event === null || event === void 0 ? void 0 : event.button) === 0;

package/esm/internals/index.d.ts

@@ -0,0 +1,4 @@
+export { default as Box } from './Box';
+export { default as Plaintext } from './Plaintext';
+export { default as InputBase } from './InputBase';
+export { default as SafeAnchor } from './SafeAnchor';

package/esm/internals/index.js

@@ -1 +1,6 @@
 'use client';
+// Export internal components
+export { default as Box } from "./Box/index.js";
+export { default as Plaintext } from "./Plaintext/index.js";
+export { default as InputBase } from "./InputBase/index.js";
+export { default as SafeAnchor } from "./SafeAnchor/index.js";

package/esm/internals/types/html.d.ts

@@ -12,6 +12,8 @@ export type HTMLPropsWithoutSelect<T extends HTMLElement = HTMLElement, P extend
 export type HTMLPropsWithoutChange<T extends HTMLElement = HTMLElement, P extends Record<string, any> = React.HTMLAttributes<T>> = PropsWithoutChange<P>;
 /** Input props with 'onChange' and 'size' attributes removed. */
 export type SanitizedInputProps = PropsWithout<React.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'size'>;
+/** Textarea props with 'onChange' attribute removed. */
+export type SanitizedTextareaProps = PropsWithout<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange'>;
 /** HTML props excluding 'title', 'onToggle', and 'onSelect' attributes. */
 export type SanitizedHTMListProps<T extends HTMLElement = HTMLElement, P extends Record<string, any> = React.HTMLAttributes<T>> = PropsWithout<P, 'title' | 'onToggle' | 'onSelect'>;
 export type WithoutChildren<T> = Omit<T, 'children'>;

package/esm/internals/utils/{dom.d.ts → html/dom.d.ts}

@@ -1 +1,2 @@
 export declare function isFocusableElement(element: Element): boolean;
+export declare function isDisableableElement(element: any): boolean;

package/esm/internals/utils/{dom.js → html/dom.js}

@@ -10,4 +10,11 @@ selector => `${selector}:not([tabindex='-1']):not([style*='display: none'])` : s
 export function isFocusableElement(element) {
   if (element === document.body) return false;
   return element.matches(focusableSelector);
+}
+const disableableElements = ['button', 'fieldset', 'optgroup', 'option', 'select', 'textarea', 'input'];
+export function isDisableableElement(element) {
+  if (typeof element === 'string') {
+    return disableableElements.includes(element);
+  }
+  return false;
 }

package/esm/internals/utils/html/index.d.ts

@@ -0,0 +1,4 @@
+export * from './htmlPropsUtils';
+export * from './events';
+export * from './dom';
+export * from './safeSetSelection';

package/esm/internals/utils/html/index.js

@@ -0,0 +1,5 @@
+'use client';
+export * from "./htmlPropsUtils.js";
+export * from "./events.js";
+export * from "./dom.js";
+export * from "./safeSetSelection.js";

package/esm/internals/utils/{safeSetSelection.js → html/safeSetSelection.js}

@@ -1,5 +1,5 @@
 'use client';
-import { isAndroid } from "./BrowserDetection.js";
+import { isAndroid } from "../BrowserDetection.js";
 const strNone = 'none';
 
 /**

package/esm/internals/utils/index.d.ts

@@ -1,29 +1,17 @@
 export * from './BrowserDetection';
-export * from './htmlPropsUtils';
+export * from './html';
 export * from './colours';
 export * from './sizes';
 export * from './style-sheet';
 export * from './placement';
-export { stringifyReactNode, reactToString } from './stringifyReactNode';
-export { getSafeRegExpString } from './getSafeRegExpString';
-export { getDOMNode } from './getDOMNode';
+export * from './string';
+export * from './react';
 export { guid } from './guid';
 export { createChainedFunction } from './createChainedFunction';
 export { isOneOf } from './isOneOf';
-export { ReactChildren } from './ReactChildren';
-export { tplTransform } from './tplTransform';
-export { mergeRefs } from './mergeRefs';
 export { shallowEqual, shallowEqualArray } from './shallowEqual';
 export { composeFunctions } from './composeFunctions';
-export { safeSetSelection } from './safeSetSelection';
-export { getStringLength } from './getStringLength';
 export { getDataGroupBy } from './getDataGroupBy';
-export { deprecateComponent } from './deprecateComponent';
 export { warnOnce } from './warnOnce';
-export { createComponent } from './createComponent';
 export { attachParent } from './attachParent';
-export { isFocusEntering, isFocusLeaving } from './events';
-export { isFocusableElement } from './dom';
-export { forwardRef } from './forwardRef';
 export { isPresetSize } from './sizes';
-export type { ComponentProps } from './createComponent';

package/esm/internals/utils/index.js

@@ -1,29 +1,18 @@
 'use client';
 export * from "./BrowserDetection.js";
-export * from "./htmlPropsUtils.js";
+export * from "./html/index.js";
 export * from "./colours.js";
 export * from "./sizes.js";
 export * from "./style-sheet/index.js";
 export * from "./placement.js";
-export { stringifyReactNode, reactToString } from "./stringifyReactNode.js";
-export { getSafeRegExpString } from "./getSafeRegExpString.js";
-export { getDOMNode } from "./getDOMNode.js";
+export * from "./string/index.js";
+export * from "./react/index.js";
 export { guid } from "./guid.js";
 export { createChainedFunction } from "./createChainedFunction.js";
 export { isOneOf } from "./isOneOf.js";
-export { ReactChildren } from "./ReactChildren.js";
-export { tplTransform } from "./tplTransform.js";
-export { mergeRefs } from "./mergeRefs.js";
 export { shallowEqual, shallowEqualArray } from "./shallowEqual.js";
 export { composeFunctions } from "./composeFunctions.js";
-export { safeSetSelection } from "./safeSetSelection.js";
-export { getStringLength } from "./getStringLength.js";
 export { getDataGroupBy } from "./getDataGroupBy.js";
-export { deprecateComponent } from "./deprecateComponent.js";
 export { warnOnce } from "./warnOnce.js";
-export { createComponent } from "./createComponent.js";
 export { attachParent } from "./attachParent.js";
-export { isFocusEntering, isFocusLeaving } from "./events.js";
-export { isFocusableElement } from "./dom.js";
-export { forwardRef } from "./forwardRef.js";
 export { isPresetSize } from "./sizes.js";

package/esm/internals/utils/{ReactChildren.d.ts → react/ReactChildren.d.ts}

@@ -1,10 +1,4 @@
 import React from 'react';
-/**
- * Checks if the given children is a React fragment.
- * @param children - The children to check.
- * @returns True if the children is a React fragment, false otherwise.
- */
-export declare function isFragment(children: React.ReactNode): boolean;
 /**
  * Finds the first child that satisfies the given condition.
  * @param children - The children to search.
@@ -53,7 +47,7 @@ declare function some(children: React.ReactNode, func: any, context?: any): bool
 /**
  * Utility functions for working with React children.
  */
-export declare const ReactChildren: {
+export declare const rch: {
     /**
      * Maps over the children and clones each child element with the provided props.
      */
@@ -79,4 +73,4 @@ export declare const ReactChildren: {
      */
     find: typeof find;
 };
-export default ReactChildren;
+export default rch;

package/esm/internals/utils/{ReactChildren.js → react/ReactChildren.js}

@@ -1,24 +1,6 @@
 'use client';
 import React from 'react';
-/**
- * Returns the type of the given object.
- * @param object - The object to check.
- * @returns The type of the object.
- */
-function typeOf(object) {
-  if (typeof object === 'object' && object !== null) {
-    return object.type || object.$$typeof;
-  }
-}
-
-/**
- * Checks if the given children is a React fragment.
- * @param children - The children to check.
- * @returns True if the children is a React fragment, false otherwise.
- */
-export function isFragment(children) {
-  return React.Children.count(children) === 1 && typeOf(children) === Symbol.for('react.fragment');
-}
+import { isFragment } from "./ReactIs.js";
 
 /**
  * Flattens the given children into an array.
@@ -143,7 +125,7 @@ function some(children, func, context) {
 /**
  * Utility functions for working with React children.
  */
-export const ReactChildren = {
+export const rch = {
   /**
    * Maps over the children and clones each child element with the provided props.
    */
@@ -169,4 +151,4 @@ export const ReactChildren = {
    */
   find
 };
-export default ReactChildren;
+export default rch;

package/esm/internals/utils/react/ReactIs.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+/**
+ * Checks if the given children is a React fragment.
+ * @param children - The children to check.
+ * @returns True if the children is a React fragment, false otherwise.
+ */
+export declare function isFragment(children: React.ReactNode): boolean;

package/esm/internals/utils/react/ReactIs.js

@@ -0,0 +1,22 @@
+'use client';
+import React from 'react';
+
+/**
+ * Returns the type of the given object.
+ * @param object - The object to check.
+ * @returns The type of the object.
+ */
+function typeOf(object) {
+  if (typeof object === 'object' && object !== null) {
+    return object.type || object.$$typeof;
+  }
+}
+
+/**
+ * Checks if the given children is a React fragment.
+ * @param children - The children to check.
+ * @returns True if the children is a React fragment, false otherwise.
+ */
+export function isFragment(children) {
+  return React.Children.count(children) === 1 && typeOf(children) === Symbol.for('react.fragment');
+}

package/{cjs/internals/utils → esm/internals/utils/react}/createComponent.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import Box, { BoxProps } from '../Box/Box';
+import Box, { BoxProps } from '../../Box/Box';
 export type ComponentProps = BoxProps & React.HTMLAttributes<HTMLDivElement>;
 interface Props<T extends React.ElementType> extends React.HTMLAttributes<HTMLDivElement> {
     name: string;
@@ -10,5 +10,5 @@ interface Props<T extends React.ElementType> extends React.HTMLAttributes<HTMLDi
  * Create a component with `classPrefix` and `as` attributes.
  * By default, the component is based on Box component and inherits all Box props.
  */
-export declare function createComponent<T extends React.ElementType = typeof Box, P = ComponentProps>({ name, componentAs, componentClassPrefix, ...defaultProps }: Props<T> & Partial<P>): import("../types").InternalRefForwardingComponent<T, Partial<P>, never> & Record<string, never>;
+export declare function createComponent<T extends React.ElementType = typeof Box, P = ComponentProps>({ name, componentAs, componentClassPrefix, ...defaultProps }: Props<T> & Partial<P>): import("../../types").InternalRefForwardingComponent<T, Partial<P>, never> & Record<string, never>;
 export default createComponent;

package/esm/internals/utils/{createComponent.js → react/createComponent.js}

@@ -2,10 +2,10 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from 'react';
 import kebabCase from 'lodash/kebabCase';
-import Box from "../Box/Box.js";
-import { useStyles } from "../hooks/index.js";
+import Box from "../../Box/Box.js";
+import { useStyles } from "../../hooks/index.js";
 import { forwardRef } from "./forwardRef.js";
-import { useCustom } from "../../CustomProvider/index.js";
+import { useCustom } from "../../../CustomProvider/index.js";
 /**
  * Create a component with `classPrefix` and `as` attributes.
  * By default, the component is based on Box component and inherits all Box props.

package/esm/internals/utils/{deprecateComponent.js → react/deprecateComponent.js}

@@ -1,7 +1,7 @@
 'use client';
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from 'react';
-import warnOnce from "./warnOnce.js";
+import warnOnce from "../warnOnce.js";
 
 /**
  * HOC for display a deprecation message from a deprecated component

package/esm/internals/utils/{forwardRef.d.ts → react/forwardRef.d.ts}

@@ -1,5 +1,5 @@
 import { ElementType, PropsWithoutRef, ForwardRefRenderFunction } from 'react';
-import type { InternalRefForwardingComponent } from '../types';
+import type { InternalRefForwardingComponent } from '../../types';
 /**
  * A utility function to wrap components with `React.forwardRef`.
  * It extends the type signature for better integration with custom components.

package/esm/internals/utils/react/index.d.ts

@@ -0,0 +1,7 @@
+export * from './getDOMNode';
+export * from './ReactChildren';
+export * from './deprecateComponent';
+export * from './createComponent';
+export * from './forwardRef';
+export * from './mergeRefs';
+export * from './ReactIs';

package/esm/internals/utils/react/index.js

@@ -0,0 +1,8 @@
+'use client';
+export * from "./getDOMNode.js";
+export * from "./ReactChildren.js";
+export * from "./deprecateComponent.js";
+export * from "./createComponent.js";
+export * from "./forwardRef.js";
+export * from "./mergeRefs.js";
+export * from "./ReactIs.js";

package/esm/internals/utils/{getStringLength.d.ts → string/getStringLength.d.ts}

@@ -1,2 +1 @@
 export declare function getStringLength(str: string): number;
-export default getStringLength;

package/esm/internals/utils/{getStringLength.js → string/getStringLength.js}

@@ -9,5 +9,4 @@ export function getStringLength(str) {
     }
   });
   return length;
-}
-export default getStringLength;
+}

package/esm/internals/utils/string/index.d.ts

@@ -0,0 +1,4 @@
+export * from './getSafeRegExpString';
+export * from './getStringLength';
+export * from './stringifyReactNode';
+export * from './tplTransform';

package/esm/internals/utils/string/index.js

@@ -0,0 +1,5 @@
+'use client';
+export * from "./getSafeRegExpString.js";
+export * from "./getStringLength.js";
+export * from "./stringifyReactNode.js";
+export * from "./tplTransform.js";

package/esm/locales/en_GB.js

@@ -85,7 +85,7 @@ export default {
     expandText: 'Show path'
   },
   Toggle: {
-    on: 'Open',
-    off: 'Close'
+    on: 'ON',
+    off: 'OFF'
   }
 };

package/esm/locales/en_US.js

@@ -81,7 +81,7 @@ export default {
     expandText: 'Show path'
   },
   Toggle: {
-    on: 'Open',
-    off: 'Close'
+    on: 'ON',
+    off: 'OFF'
   }
 };

package/esm/locales/pl_PL.js

@@ -1,5 +1,5 @@
 'use client';
-import pl from 'date-fns/locale/pl';
+import { pl } from 'date-fns/locale/pl';
 const DateTimeFormats = {
   sunday: 'Ndz',
   monday: 'Pon',

package/esm/useBreakpointValue/useBreakpointValue.d.ts

@@ -3,11 +3,15 @@ interface UseBreakpointValueOptions<T = any> {
     /**
      * The default value to return if no screen size matches.
      */
-    defaultValue: T;
+    defaultValue?: T;
+    /**
+     * Whether to enable the media query, defaults to true
+     */
+    enabled?: boolean;
 }
 /**
  * A React Hook that returns different values based on different screen sizes in responsive design.
- * @version 5.63.0
+ * @version 5.64.0
  * @unstable Please note that this API is not stable and may change in the future.
  * @see https://rsuitejs.com/components/use-breakpoint-value
  *

package/esm/useBreakpointValue/useBreakpointValue.js

@@ -2,7 +2,7 @@
 import useMediaQuery from "../useMediaQuery/index.js";
 /**
  * A React Hook that returns different values based on different screen sizes in responsive design.
- * @version 5.63.0
+ * @version 5.64.0
  * @unstable Please note that this API is not stable and may change in the future.
  * @see https://rsuitejs.com/components/use-breakpoint-value
  *
@@ -15,12 +15,17 @@ import useMediaQuery from "../useMediaQuery/index.js";
  */
 export function useBreakpointValue(breakpoints, options) {
   const {
-    defaultValue
+    defaultValue,
+    enabled = true
   } = options || {};
   const keys = Object.keys(breakpoints);
   const values = Object.values(breakpoints);
-  const matches = useMediaQuery(keys);
-  const index = matches.indexOf(true);
+  const matches = useMediaQuery(keys, enabled);
+
+  // Use lastIndexOf instead of indexOf to return the value of the last matching breakpoint
+  // Due to how media queries work, multiple breakpoints may match simultaneously on larger screens
+  // Using lastIndexOf ensures we return the value for the largest matching breakpoint
+  const index = matches.lastIndexOf(true);
   return index !== -1 ? values[index] : defaultValue;
 }
 export default useBreakpointValue;

package/esm/useMediaQuery/breakpoints.d.ts

@@ -0,0 +1,24 @@
+import type { BreakpointMap, BreakpointSystem } from './types';
+/**
+ * Create breakpoint system
+ *
+ * This function takes a breakpoint map and returns an enhanced breakpoint system
+ * that provides various media queries for responsive design.
+ *
+ * @example
+ * ```ts
+ * const breakpoints = createBreakpoints({
+ *   xs: '0px',
+ *   sm: '576px',
+ *   md: '768px',
+ *   lg: '992px',
+ *   xl: '1200px'
+ * });
+ *
+ * // Using breakpoints
+ * breakpoints.up('md'); // '(min-width: 768px)'
+ * breakpoints.down('lg'); // '(max-width: 991.99px)'
+ * breakpoints.between('sm', 'lg'); // '(min-width: 576px) and (max-width: 991.99px)'
+ * ```
+ */
+export declare function createBreakpoints(breakpoints: BreakpointMap): BreakpointSystem;