rsuite 5.60.2 → 5.62.0

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

@@ -0,0 +1,27 @@
+export * from './BrowserDetection';
+export * from './htmlPropsUtils';
+export { stringifyReactNode, reactToString } from './stringifyReactNode';
+export { getSafeRegExpString } from './getSafeRegExpString';
+export { getDOMNode } from './getDOMNode';
+export { guid } from './guid';
+export { prefix, defaultClassPrefix, getClassNamePrefix } from './prefix';
+export { createChainedFunction } from './createChainedFunction';
+export { isOneOf } from './isOneOf';
+export { ReactChildren } from './ReactChildren';
+export { tplTransform } from './tplTransform';
+export { placementPolyfill } from './placementPolyfill';
+export { mergeRefs } from './mergeRefs';
+export { shallowEqual, shallowEqualArray } from './shallowEqual';
+export { composeFunctions } from './composeFunctions';
+export { scrollTopAnimation } from './scrollTopAnimation';
+export { render } from './render';
+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 type { ComponentProps } from './createComponent';
+export { attachParent } from './attachParent';
+export { isFocusEntering, isFocusLeaving } from './events';
+export { isFocusableElement } from './dom';

package/esm/internals/utils/index.js

@@ -0,0 +1,27 @@
+'use client';
+export * from "./BrowserDetection";
+export * from "./htmlPropsUtils";
+export { stringifyReactNode, reactToString } from "./stringifyReactNode";
+export { getSafeRegExpString } from "./getSafeRegExpString";
+export { getDOMNode } from "./getDOMNode";
+export { guid } from "./guid";
+export { prefix, defaultClassPrefix, getClassNamePrefix } from "./prefix";
+export { createChainedFunction } from "./createChainedFunction";
+export { isOneOf } from "./isOneOf";
+export { ReactChildren } from "./ReactChildren";
+export { tplTransform } from "./tplTransform";
+export { placementPolyfill } from "./placementPolyfill";
+export { mergeRefs } from "./mergeRefs";
+export { shallowEqual, shallowEqualArray } from "./shallowEqual";
+export { composeFunctions } from "./composeFunctions";
+export { scrollTopAnimation } from "./scrollTopAnimation";
+export { render } from "./render";
+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";

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

@@ -0,0 +1,2 @@
+export declare function isOneOf(one: string, ofTarget: string | string[]): boolean;
+export default isOneOf;

package/esm/{utils → internals/utils}/isOneOf.js

@@ -1,7 +1,8 @@
 'use client';
-export default function isOneOf(one, ofTarget) {
+export function isOneOf(one, ofTarget) {
   if (Array.isArray(ofTarget)) {
     return ofTarget.indexOf(one) >= 0;
   }
   return one === ofTarget;
-}
+}
+export default isOneOf;

package/esm/{utils → internals/utils}/mergeRefs.d.ts

@@ -1,5 +1,8 @@
 import React from 'react';
 declare type CallbackRef<T> = (ref: T | null) => void;
 declare type Ref<T> = React.MutableRefObject<T> | CallbackRef<T>;
-export default function mergeRefs<T>(refA?: Ref<T | null> | null, refB?: Ref<T | null> | null): React.RefCallback<T>;
-export {};
+/**
+ * Merges two React refs into a single ref callback.
+ */
+export declare function mergeRefs<T>(refA?: Ref<T | null> | null, refB?: Ref<T | null> | null): React.RefCallback<T>;
+export default mergeRefs;

package/{cjs → esm/internals}/utils/mergeRefs.js

@@ -1,18 +1,19 @@
 'use client';
-"use strict";
-
-exports.__esModule = true;
-exports.default = mergeRefs;
 var toFnRef = function toFnRef(ref) {
   return !ref || typeof ref === 'function' ? ref : function (value) {
     ref.current = value;
   };
 };
-function mergeRefs(refA, refB) {
+
+/**
+ * Merges two React refs into a single ref callback.
+ */
+export function mergeRefs(refA, refB) {
   var a = toFnRef(refA);
   var b = toFnRef(refB);
   return function (value) {
     if (typeof a === 'function') a(value);
     if (typeof b === 'function') b(value);
   };
-}
+}
+export default mergeRefs;

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

@@ -0,0 +1,10 @@
+/**
+ * Replaces the placement string with its polyfilled counterpart based on the given RTL (Right-to-Left) value.
+ * @example
+ * ```
+ * placementPolyfill('bottomLeft');
+ * // 'bottomStart'
+ * ```
+ */
+export declare function placementPolyfill<T = string>(placement: T, rtl?: boolean): T;
+export default placementPolyfill;

package/esm/{utils → internals/utils}/placementPolyfill.js

@@ -1,10 +1,13 @@
 'use client';
 /**
+ * Replaces the placement string with its polyfilled counterpart based on the given RTL (Right-to-Left) value.
+ * @example
+ * ```
  * placementPolyfill('bottomLeft');
- * output 'bottomStart'
+ * // 'bottomStart'
+ * ```
  */
-
-function placementPolyfill(placement, rtl) {
+export function placementPolyfill(placement, rtl) {
   if (rtl === void 0) {
     rtl = false;
   }

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

@@ -0,0 +1,7 @@
+import React from 'react';
+/**
+ * Renders a React element into a container element.
+ *
+ */
+export declare function render(element: React.ReactElement<any>, container: HTMLElement): any;
+export default render;

package/esm/{utils → internals/utils}/render.js

@@ -3,7 +3,12 @@ import React from 'react';
 import * as ReactDOM from 'react-dom';
 var majorVersion = parseInt(React.version);
 var SuperposedReactDOM = ReactDOM;
-function render(element, container) {
+
+/**
+ * Renders a React element into a container element.
+ *
+ */
+export function render(element, container) {
   var mountElement = document.createElement('div');
   mountElement.className = 'rs-mount-element';
   var containerElement = container || document.body;

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

@@ -0,0 +1,5 @@
+/**
+ * Sets the selection range of an HTMLInputElement safely.
+ */
+export declare function safeSetSelection(element: HTMLInputElement, selectionStart: number, selectionEnd: number): void;
+export default safeSetSelection;

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

@@ -1,8 +1,12 @@
 'use client';
-import { isAndroid } from './BrowserDetection';
+import { isAndroid } from "./BrowserDetection";
 var defer = typeof requestAnimationFrame !== 'undefined' ? requestAnimationFrame : setTimeout;
 var strNone = 'none';
-function safeSetSelection(element, selectionStart, selectionEnd) {
+
+/**
+ * Sets the selection range of an HTMLInputElement safely.
+ */
+export function safeSetSelection(element, selectionStart, selectionEnd) {
   if (document.activeElement === element) {
     if (isAndroid()) {
       defer(function () {

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

@@ -0,0 +1,5 @@
+/**
+ * Animates the scrolling of an element to a specified position.
+ */
+export declare function scrollTopAnimation(target: Element, nextTop: number, animation?: boolean, callback?: (top: number) => void): void;
+export default scrollTopAnimation;

package/esm/{utils → internals/utils}/scrollTopAnimation.js

@@ -1,7 +1,11 @@
 'use client';
 import scrollTop from 'dom-lib/scrollTop';
 import requestAnimationFramePolyfill from 'dom-lib/requestAnimationFramePolyfill';
-export default function scrollTopAnimation(target, nextTop, animation, callback) {
+
+/**
+ * Animates the scrolling of an element to a specified position.
+ */
+export function scrollTopAnimation(target, nextTop, animation, callback) {
   if (animation === void 0) {
     animation = true;
   }
@@ -19,4 +23,5 @@ export default function scrollTopAnimation(target, nextTop, animation, callback)
   } else {
     scrollTop(target, nextTop);
   }
-}
+}
+export default scrollTopAnimation;

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

@@ -9,5 +9,9 @@
  * when any key has values which are not strictly equal between the arguments.
  * Returns true when the values of all keys are strictly equal.
  */
-declare function shallowEqual(objA: any, objB: any): boolean;
+export declare function shallowEqual(objA: any, objB: any): boolean;
+/**
+ * Performs a shallow equality check between two arrays.
+ */
+export declare function shallowEqualArray(a: any[], b: any[]): boolean;
 export default shallowEqual;

package/esm/{utils → internals/utils}/shallowEqual.js

@@ -29,7 +29,7 @@ function is(x, y) {
  * when any key has values which are not strictly equal between the arguments.
  * Returns true when the values of all keys are strictly equal.
  */
-function shallowEqual(objA, objB) {
+export function shallowEqual(objA, objB) {
   if (is(objA, objB)) {
     return true;
   }
@@ -50,4 +50,21 @@ function shallowEqual(objA, objB) {
   }
   return true;
 }
+/**
+ * Performs a shallow equality check between two arrays.
+ */
+export function shallowEqualArray(a, b) {
+  if (a === b) {
+    return true;
+  }
+  if (a.length !== b.length) {
+    return false;
+  }
+  for (var i = 0; i < a.length; i += 1) {
+    if (!shallowEqual(a[i], b[i])) {
+      return false;
+    }
+  }
+  return true;
+}
 export default shallowEqual;

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

@@ -0,0 +1,14 @@
+import React from 'react';
+/**
+ * Converts a React element to a string representation.
+ * @param element - The React element to convert.
+ * @returns An array of strings representing the React element.
+ */
+export declare function reactToString(element: React.ReactElement): string[];
+/**
+ * Converts a React node to a string representation.
+ * @param node - The React node to convert.
+ * @returns A string representation of the React node.
+ */
+export declare function stringifyReactNode(node: React.ReactNode): string;
+export default stringifyReactNode;

package/esm/internals/utils/stringifyReactNode.js

@@ -0,0 +1,38 @@
+'use client';
+import React from 'react';
+
+/**
+ * Converts a React element to a string representation.
+ * @param element - The React element to convert.
+ * @returns An array of strings representing the React element.
+ */
+export function reactToString(element) {
+  var nodes = [];
+  var recursion = function recursion(elmt) {
+    React.Children.forEach(elmt.props.children, function (child) {
+      if ( /*#__PURE__*/React.isValidElement(child)) {
+        recursion(child);
+      } else if (typeof child === 'string') {
+        nodes.push(child);
+      }
+    });
+  };
+  recursion(element);
+  return nodes;
+}
+
+/**
+ * Converts a React node to a string representation.
+ * @param node - The React node to convert.
+ * @returns A string representation of the React node.
+ */
+export function stringifyReactNode(node) {
+  if (typeof node === 'string') {
+    return node;
+  } else if ( /*#__PURE__*/React.isValidElement(node)) {
+    var nodes = reactToString(node);
+    return nodes.join('');
+  }
+  return '';
+}
+export default stringifyReactNode;

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

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+/**
+ * Transforms a pattern string by replacing placeholders with corresponding data values.
+ *
+ * @example
+ * tplTransform('Show {0} data', <i>100</i>);
+ * // output: Show <span><i>100</i></span> data
+ */
+export declare function tplTransform(pattern: string, ...data: any[]): (JSX.Element | null)[];
+export default tplTransform;

package/esm/{utils → internals/utils}/tplTransform.js

@@ -7,11 +7,13 @@ var toJSX = function toJSX(node, key) {
 };
 
 /**
+ * Transforms a pattern string by replacing placeholders with corresponding data values.
+ *
+ * @example
  * tplTransform('Show {0} data', <i>100</i>);
- * output:
- * Show <span><i>100</i></span> data
+ * // output: Show <span><i>100</i></span> data
  */
-export default (function (pattern) {
+export function tplTransform(pattern) {
   for (var _len = arguments.length, data = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
     data[_key - 1] = arguments[_key];
   }
@@ -20,4 +22,5 @@ export default (function (pattern) {
   }).filter(function (item) {
     return item !== '';
   });
-});
+}
+export default tplTransform;

package/esm/{utils → internals/utils}/warnOnce.d.ts

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

package/esm/{utils → internals/utils}/warnOnce.js

@@ -5,7 +5,7 @@ var warned = {};
  * Logs a warning message
  * but dont warn a same message twice
  */
-export default function warnOnce(message) {
+export function warnOnce(message) {
   if (!warned[message]) {
     console.warn(message);
     warned[message] = true;
@@ -15,4 +15,5 @@ warnOnce._resetWarned = function () {
   for (var _message in warned) {
     delete warned[_message];
   }
-};
+};
+export default warnOnce;

package/esm/locales/en_GB.js

@@ -1,3 +1,3 @@
 'use client';
-import defaultObject from './default';
+import defaultObject from "./default";
 export default defaultObject;

package/esm/locales/index.js

@@ -1,25 +1,25 @@
 'use client';
-export { default as arEG } from './ar_EG';
-export { default as daDK } from './da_DK';
-export { default as deDE } from './de_DE';
-export { default as enGB } from './en_GB';
-export { default as enUS } from './en_US';
-export { default as esAR } from './es_AR';
-export { default as esES } from './es_ES';
-export { default as fiFI } from './fi_FI';
-export { default as huHU } from './hu_HU';
-export { default as itIT } from './it_IT';
-export { default as kkKZ } from './kk_KZ';
-export { default as koKR } from './ko_KR';
-export { default as nlNL } from './nl_NL';
-export { default as ptBR } from './pt_BR';
-export { default as ruRU } from './ru_RU';
-export { default as svSE } from './sv_SE';
-export { default as trTR } from './tr_TR';
-export { default as zhCN } from './zh_CN';
-export { default as zhTW } from './zh_TW';
-export { default as faIR } from './fa_IR';
-export { default as frFR } from './fr_FR';
-export { default as jaJP } from './ja_JP';
-export { default as neNP } from './ne_NP';
-export { default as csCZ } from './cs_CZ';
+export { default as arEG } from "./ar_EG";
+export { default as daDK } from "./da_DK";
+export { default as deDE } from "./de_DE";
+export { default as enGB } from "./en_GB";
+export { default as enUS } from "./en_US";
+export { default as esAR } from "./es_AR";
+export { default as esES } from "./es_ES";
+export { default as fiFI } from "./fi_FI";
+export { default as huHU } from "./hu_HU";
+export { default as itIT } from "./it_IT";
+export { default as kkKZ } from "./kk_KZ";
+export { default as koKR } from "./ko_KR";
+export { default as nlNL } from "./nl_NL";
+export { default as ptBR } from "./pt_BR";
+export { default as ruRU } from "./ru_RU";
+export { default as svSE } from "./sv_SE";
+export { default as trTR } from "./tr_TR";
+export { default as zhCN } from "./zh_CN";
+export { default as zhTW } from "./zh_TW";
+export { default as faIR } from "./fa_IR";
+export { default as frFR } from "./fr_FR";
+export { default as jaJP } from "./ja_JP";
+export { default as neNP } from "./ne_NP";
+export { default as csCZ } from "./cs_CZ";

package/esm/toaster/ToastContainer.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
+import { WithAsProps, RsRefForwardingComponent } from '@/internals/types';
 export declare type PlacementType = 'topCenter' | 'bottomCenter' | 'topStart' | 'topEnd' | 'bottomStart' | 'bottomEnd';
 export declare const toastPlacements: PlacementType[];
 export interface ToastContainerProps extends WithAsProps {

package/esm/toaster/ToastContainer.js

@@ -4,9 +4,10 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import React, { useState, useImperativeHandle, useRef, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import kebabCase from 'lodash/kebabCase';
-import Transition from '../Animation/Transition';
-import { useClassNames, guid, createChainedFunction, render } from '../utils';
-import ToastContext from './ToastContext';
+import Transition from "../Animation/Transition";
+import { useClassNames } from "../internals/hooks";
+import { guid, createChainedFunction, render } from "../internals/utils";
+import ToastContext from "./ToastContext";
 export var toastPlacements = ['topCenter', 'bottomCenter', 'topStart', 'topEnd', 'bottomStart', 'bottomEnd'];
 var useMessages = function useMessages() {
   var _useState = useState([]),

package/esm/toaster/index.js

@@ -1,3 +1,3 @@
 'use client';
-import toaster from './toaster';
+import toaster from "./toaster";
 export default toaster;

package/esm/toaster/toaster.js

@@ -2,7 +2,7 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
-import ToastContainer from './ToastContainer';
+import ToastContainer from "./ToastContainer";
 var defaultContainerId = 'default';
 var containers = new Map();
 

package/esm/useMediaQuery/index.js

@@ -1,3 +1,3 @@
 'use client';
-import useMediaQuery from './useMediaQuery';
+import useMediaQuery from "./useMediaQuery";
 export default useMediaQuery;

package/esm/useToaster/index.js

@@ -1,3 +1,3 @@
 'use client';
-import useToaster from './useToaster';
+import useToaster from "./useToaster";
 export default useToaster;

package/esm/useToaster/useToaster.js

@@ -1,8 +1,7 @@
 'use client';
 import { useMemo } from 'react';
-import toaster from '../toaster';
-import { useCustom } from '../utils';
-
+import toaster from "../toaster";
+import { useCustom } from "../internals/hooks";
 /**
  * Toaster display brief, temporary notifications of actions, errors, or other events in an application.
  * It is often used with the Message and Notification components.

package/internals/Picker/styles/index.less

@@ -8,6 +8,7 @@
 @import '../../../Loader/styles/index.less';
 @import '../../../Input/styles/index.less';
 @import '../../../InputGroup/styles/index.less';
+@import '../../../Highlight/styles/index.less';
 @import './mixin.less';
 
 //
@@ -35,7 +36,17 @@
   }
 
   &-disabled {
-    opacity: @btn-disabled-opacity;
+    cursor: not-allowed;
+
+    .rs-picker-toggle-value,
+    .rs-picker-toggle-indicator,
+    .rs-picker-tag-list .rs-tag {
+      color: var(--rs-text-disabled) !important;
+    }
+
+    .rs-picker-value-count{
+      opacity: 0.5;
+    }
   }
 
   &-toggle &-toggle-placeholder {
@@ -326,6 +337,10 @@
     padding: (@picker-menu-padding - @border-radius) @picker-menu-padding
       (@picker-menu-padding - @border-radius);
   }
+
+  .rs-highlight .rs-highlight-mark {
+    padding: 0;
+  }
 }
 
 // Make sure styles the same with <Input>
@@ -340,6 +355,10 @@
   &.rs-picker-disabled .rs-btn {
     background-color: var(--rs-input-disabled-bg) !important;
   }
+
+  &.rs-picker-disabled .rs-input-group {
+    pointer-events: none;
+  }
 }
 
 // Check Item
@@ -402,3 +421,10 @@
     }
   }
 }
+
+.rs-picker-menu-group {
+  background-color: var(--rs-listbox-option-group-bg);
+  position: sticky;
+  top: -1px;
+  z-index: 1;
+}

package/internals/ScrollView/styles/index.less

@@ -0,0 +1,73 @@
+.rs-scroll-view {
+  &&-shadow {
+    overflow: auto;
+    padding: 0px;
+
+    &::before,
+    &::after {
+      content: '';
+      position: sticky;
+      width: 100%;
+      height: 2px;
+      visibility: hidden;
+      display: block;
+      z-index: 1;
+    }
+
+    &::before {
+      top: -2px;
+      box-shadow: 3px 0 5px var(--rs-scroll-view-shadow-color);
+    }
+
+    &::after {
+      bottom: -2px;
+      box-shadow: -3px 0 5px var(--rs-scroll-view-shadow-color);
+    }
+
+    &.rs-scroll-view-thumb-middle {
+      &::before,
+      &::after {
+        visibility: visible;
+      }
+    }
+
+    &.rs-scroll-view-thumb-top {
+      &::after {
+        visibility: visible;
+      }
+    }
+
+    &.rs-scroll-view-thumb-bottom {
+      &::before {
+        visibility: visible;
+      }
+    }
+  }
+
+  // https://css-tricks.com/custom-scrollbars-in-webkit/
+  &&-custom-scrollbar {
+    --rs-scrollbar-bg: transparent;
+    --rs-scrollbar-thumb-bg: rgba(87, 87, 87, 0.6);
+    --rs-scrollbar-thumb-hover-bg: var(--rs-gray-800);
+
+    scrollbar-width: auto;
+    scrollbar-color: var(--rs-scrollbar-thumb-bg) var(--rs-scrollbar-bg);
+
+    &::-webkit-scrollbar {
+      width: 12px;
+    }
+    &::-webkit-scrollbar-track {
+      background: var(--rs-scrollbar-bg);
+      border-radius: 10px;
+    }
+    &::-webkit-scrollbar-thumb {
+      background-color: var(--rs-scrollbar-thumb-bg);
+      border-radius: 6px;
+      border: 3px solid var(--rs-scrollbar-bg);
+
+      &:hover {
+        background-color: var(--rs-scrollbar-thumb-hover-bg);
+      }
+    }
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rsuite",
-  "version": "5.60.2",
+  "version": "5.62.0",
   "description": "A suite of react components",
   "main": "cjs/index.js",
   "module": "esm/index.js",