rsuite 5.73.1 → 5.74.0

package/esm/Accordion/Accordion.js

@@ -3,15 +3,18 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import React from 'react';
 import PanelGroup from "../PanelGroup/index.js";
 import AccordionPanel from "./AccordionPanel.js";
+import { useCustom } from "../CustomProvider/index.js";
 /**
  * The `Accordion` component is used to display content that can be collapsed.
  * @see https://rsuitejs.com/components/accordion
  */
 var Accordion = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var _useCustom = useCustom('Accordion', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
   return /*#__PURE__*/React.createElement(PanelGroup, _extends({
     accordion: true,
     ref: ref
-  }, props));
+  }, propsWithDefaults));
 });
 Accordion.Panel = AccordionPanel;
 Accordion.displayName = 'Accordion';

package/esm/Affix/Affix.js

@@ -8,6 +8,7 @@ import debounce from 'lodash/debounce';
 import getOffset from 'dom-lib/getOffset';
 import { useClassNames, useElementResize, useEventListener, useMount } from "../internals/hooks/index.js";
 import { mergeRefs } from "../internals/utils/index.js";
+import { useCustom } from "../CustomProvider/index.js";
 /**
  * Get the layout size and offset of the mount element
  */
@@ -104,18 +105,20 @@ function useFixed(offset, containerOffset, props) {
  */
 var Affix = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _merge;
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'div' : _props$as,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'affix' : _props$classPrefix,
-    className = props.className,
-    children = props.children,
-    container = props.container,
-    _props$top = props.top,
-    top = _props$top === void 0 ? 0 : _props$top,
-    onChange = props.onChange,
-    onOffsetChange = props.onOffsetChange,
-    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  var _useCustom = useCustom('Affix', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'div' : _propsWithDefaults$as,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'affix' : _propsWithDefaults$cl,
+    className = propsWithDefaults.className,
+    children = propsWithDefaults.children,
+    container = propsWithDefaults.container,
+    _propsWithDefaults$to = propsWithDefaults.top,
+    top = _propsWithDefaults$to === void 0 ? 0 : _propsWithDefaults$to,
+    onChange = propsWithDefaults.onChange,
+    onOffsetChange = propsWithDefaults.onOffsetChange,
+    rest = _objectWithoutPropertiesLoose(propsWithDefaults, _excluded);
   var mountRef = useRef(null);
   var offset = useOffset(mountRef, onOffsetChange);
   var containerOffset = useContainerOffset(container);

package/esm/Animation/Bounce.js

@@ -5,6 +5,7 @@ var _excluded = ["timeout"];
 import React from 'react';
 import Transition from "./Transition.js";
 import { useClassNames } from "../internals/hooks/index.js";
+import { useCustom } from "../CustomProvider/index.js";
 /**
  * Bounce animation component
  * @see https://rsuitejs.com/components/animation/#bounce
@@ -15,7 +16,9 @@ var Bounce = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     props = _objectWithoutPropertiesLoose(_ref, _excluded);
   var _useClassNames = useClassNames('anim'),
     prefix = _useClassNames.prefix;
-  return /*#__PURE__*/React.createElement(Transition, _extends({}, props, {
+  var _useCustom = useCustom('Bounce', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  return /*#__PURE__*/React.createElement(Transition, _extends({}, propsWithDefaults, {
     ref: ref,
     animation: true,
     timeout: timeout,

package/esm/Animation/Collapse.js

@@ -11,6 +11,7 @@ import capitalize from 'lodash/capitalize';
 import Transition, { transitionPropTypes } from "./Transition.js";
 import { useClassNames } from "../internals/hooks/index.js";
 import { createChainedFunction } from "../internals/utils/index.js";
+import { useCustom } from "../CustomProvider/index.js";
 export var DIMENSION = /*#__PURE__*/function (DIMENSION) {
   DIMENSION["HEIGHT"] = "height";
   DIMENSION["WIDTH"] = "width";
@@ -39,23 +40,25 @@ function getScrollDimensionValue(elem, dimension) {
  * @see https://rsuitejs.com/components/animation/#collapse
  */
 var Collapse = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var className = props.className,
-    _props$timeout = props.timeout,
-    timeout = _props$timeout === void 0 ? 300 : _props$timeout,
-    _props$dimension = props.dimension,
-    dimensionProp = _props$dimension === void 0 ? DIMENSION.HEIGHT : _props$dimension,
-    exitedClassName = props.exitedClassName,
-    exitingClassName = props.exitingClassName,
-    enteredClassName = props.enteredClassName,
-    enteringClassName = props.enteringClassName,
-    _props$getDimensionVa = props.getDimensionValue,
-    getDimensionValue = _props$getDimensionVa === void 0 ? defaultGetDimensionValue : _props$getDimensionVa,
-    onEnter = props.onEnter,
-    onEntering = props.onEntering,
-    onEntered = props.onEntered,
-    onExit = props.onExit,
-    onExiting = props.onExiting,
-    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  var _useCustom = useCustom('Collapse', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var className = propsWithDefaults.className,
+    _propsWithDefaults$ti = propsWithDefaults.timeout,
+    timeout = _propsWithDefaults$ti === void 0 ? 300 : _propsWithDefaults$ti,
+    _propsWithDefaults$di = propsWithDefaults.dimension,
+    dimensionProp = _propsWithDefaults$di === void 0 ? DIMENSION.HEIGHT : _propsWithDefaults$di,
+    exitedClassName = propsWithDefaults.exitedClassName,
+    exitingClassName = propsWithDefaults.exitingClassName,
+    enteredClassName = propsWithDefaults.enteredClassName,
+    enteringClassName = propsWithDefaults.enteringClassName,
+    _propsWithDefaults$ge = propsWithDefaults.getDimensionValue,
+    getDimensionValue = _propsWithDefaults$ge === void 0 ? defaultGetDimensionValue : _propsWithDefaults$ge,
+    onEnter = propsWithDefaults.onEnter,
+    onEntering = propsWithDefaults.onEntering,
+    onEntered = propsWithDefaults.onEntered,
+    onExit = propsWithDefaults.onExit,
+    onExiting = propsWithDefaults.onExiting,
+    rest = _objectWithoutPropertiesLoose(propsWithDefaults, _excluded);
   var _useClassNames = useClassNames('anim'),
     prefix = _useClassNames.prefix,
     merge = _useClassNames.merge;

package/esm/Animation/Fade.js

@@ -5,6 +5,7 @@ var _excluded = ["timeout", "className"];
 import React from 'react';
 import Transition from "./Transition.js";
 import { useClassNames } from "../internals/hooks/index.js";
+import { useCustom } from "../CustomProvider/index.js";
 /**
  * Fade animation component
  * @see https://rsuitejs.com/components/animation/#fade
@@ -17,7 +18,9 @@ var Fade = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _useClassNames = useClassNames('anim'),
     prefix = _useClassNames.prefix,
     merge = _useClassNames.merge;
-  return /*#__PURE__*/React.createElement(Transition, _extends({}, props, {
+  var _useCustom = useCustom('Fade', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  return /*#__PURE__*/React.createElement(Transition, _extends({}, propsWithDefaults, {
     ref: ref,
     timeout: timeout,
     className: merge(className, prefix('fade')),

package/esm/Animation/Slide.js

@@ -5,6 +5,7 @@ var _excluded = ["timeout", "placement"];
 import React from 'react';
 import Transition from "./Transition.js";
 import { useClassNames } from "../internals/hooks/index.js";
+import { useCustom } from "../CustomProvider/index.js";
 /**
  * Slide animation component
  * @see https://rsuitejs.com/components/animation/#slide
@@ -15,11 +16,13 @@ var Slide = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     _ref$placement = _ref.placement,
     placement = _ref$placement === void 0 ? 'right' : _ref$placement,
     props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var _useCustom = useCustom('Slide', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
   var _useClassNames = useClassNames('anim'),
     prefix = _useClassNames.prefix;
   var enterClassName = prefix('slide-in', placement);
   var exitClassName = prefix('slide-out', placement);
-  return /*#__PURE__*/React.createElement(Transition, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(Transition, _extends({}, propsWithDefaults, {
     ref: ref,
     animation: true,
     timeout: timeout,

package/esm/AutoComplete/AutoComplete.d.ts

@@ -1,8 +1,7 @@
 import React from 'react';
 import { PickerComponent } from '../internals/Picker';
 import { WithAsProps, FormControlPickerProps, TypeAttributes, ItemDataType } from '../internals/types';
-export type ValueType = string;
-export interface AutoCompleteProps<T = ValueType> extends WithAsProps, FormControlPickerProps<T, any, ItemDataType | string> {
+export interface AutoCompleteProps<T = string> extends WithAsProps, FormControlPickerProps<T, any, ItemDataType | string> {
     /** Additional classes for menu */
     menuClassName?: string;
     /** The placement of component */

package/esm/AutoComplete/AutoComplete.js

@@ -14,6 +14,7 @@ import { PLACEMENT } from "../internals/constants/index.js";
 import Plaintext from "../internals/Plaintext/index.js";
 import { oneOf } from "../internals/propTypes/index.js";
 import { transformData, shouldDisplay } from "./utils.js";
+import { useCustom } from "../CustomProvider/index.js";
 import Combobox from "./Combobox.js";
 /**
  * Autocomplete function of input field.
@@ -23,41 +24,43 @@ import Combobox from "./Combobox.js";
  * TODO: role=combobox and aria-autocomplete on input element
  */
 var AutoComplete = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'div' : _props$as,
-    disabled = props.disabled,
-    className = props.className,
-    _props$placement = props.placement,
-    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,
-    _props$selectOnEnter = props.selectOnEnter,
-    selectOnEnter = _props$selectOnEnter === void 0 ? true : _props$selectOnEnter,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'auto-complete' : _props$classPrefix,
-    _props$defaultValue = props.defaultValue,
-    defaultValue = _props$defaultValue === void 0 ? '' : _props$defaultValue,
-    _props$menuAutoWidth = props.menuAutoWidth,
-    menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,
-    data = props.data,
-    valueProp = props.value,
-    open = props.open,
-    style = props.style,
-    size = props.size,
-    menuClassName = props.menuClassName,
-    id = props.id,
-    readOnly = props.readOnly,
-    plaintext = props.plaintext,
-    renderMenu = props.renderMenu,
-    renderMenuItem = props.renderMenuItem,
-    onSelect = props.onSelect,
-    filterBy = props.filterBy,
-    onKeyDown = props.onKeyDown,
-    onChange = props.onChange,
-    onClose = props.onClose,
-    onOpen = props.onOpen,
-    onFocus = props.onFocus,
-    onBlur = props.onBlur,
-    onMenuFocus = props.onMenuFocus,
-    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  var _useCustom = useCustom('AutoComplete', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'div' : _propsWithDefaults$as,
+    disabled = propsWithDefaults.disabled,
+    className = propsWithDefaults.className,
+    _propsWithDefaults$pl = propsWithDefaults.placement,
+    placement = _propsWithDefaults$pl === void 0 ? 'bottomStart' : _propsWithDefaults$pl,
+    _propsWithDefaults$se = propsWithDefaults.selectOnEnter,
+    selectOnEnter = _propsWithDefaults$se === void 0 ? true : _propsWithDefaults$se,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'auto-complete' : _propsWithDefaults$cl,
+    _propsWithDefaults$de = propsWithDefaults.defaultValue,
+    defaultValue = _propsWithDefaults$de === void 0 ? '' : _propsWithDefaults$de,
+    _propsWithDefaults$me = propsWithDefaults.menuAutoWidth,
+    menuAutoWidth = _propsWithDefaults$me === void 0 ? true : _propsWithDefaults$me,
+    data = propsWithDefaults.data,
+    valueProp = propsWithDefaults.value,
+    open = propsWithDefaults.open,
+    style = propsWithDefaults.style,
+    size = propsWithDefaults.size,
+    menuClassName = propsWithDefaults.menuClassName,
+    id = propsWithDefaults.id,
+    readOnly = propsWithDefaults.readOnly,
+    plaintext = propsWithDefaults.plaintext,
+    renderMenu = propsWithDefaults.renderMenu,
+    renderMenuItem = propsWithDefaults.renderMenuItem,
+    onSelect = propsWithDefaults.onSelect,
+    filterBy = propsWithDefaults.filterBy,
+    onKeyDown = propsWithDefaults.onKeyDown,
+    onChange = propsWithDefaults.onChange,
+    onClose = propsWithDefaults.onClose,
+    onOpen = propsWithDefaults.onOpen,
+    onFocus = propsWithDefaults.onFocus,
+    onBlur = propsWithDefaults.onBlur,
+    onMenuFocus = propsWithDefaults.onMenuFocus,
+    rest = _objectWithoutPropertiesLoose(propsWithDefaults, _excluded);
   var datalist = transformData(data);
   var _useControlled = useControlled(valueProp, defaultValue),
     value = _useControlled[0],

package/esm/Avatar/Avatar.js

@@ -6,10 +6,11 @@ var _templateObject, _templateObject2;
 var _excluded = ["as", "bordered", "alt", "className", "children", "circle", "color", "classPrefix", "size", "src", "srcSet", "sizes", "style", "imgProps", "onError"];
 import React, { useContext, useMemo } from 'react';
 import PropTypes from 'prop-types';
-import { useClassNames, useCustom } from "../internals/hooks/index.js";
+import { useClassNames } from "../internals/hooks/index.js";
 import { isIE } from "../internals/utils/index.js";
 import { AvatarGroupContext } from "../AvatarGroup/AvatarGroup.js";
 import { oneOf } from "../internals/propTypes/index.js";
+import { useCustom } from "../CustomProvider/index.js";
 import AvatarIcon from "./AvatarIcon.js";
 import useImage from "./useImage.js";
 /**
@@ -21,25 +22,28 @@ var Avatar = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _useContext = useContext(AvatarGroupContext),
     groupSize = _useContext.size,
     spacing = _useContext.spacing;
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'div' : _props$as,
-    bordered = props.bordered,
-    alt = props.alt,
-    className = props.className,
-    children = props.children,
-    circle = props.circle,
-    color = props.color,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'avatar' : _props$classPrefix,
-    _props$size = props.size,
-    size = _props$size === void 0 ? groupSize : _props$size,
-    src = props.src,
-    srcSet = props.srcSet,
-    sizes = props.sizes,
-    style = props.style,
-    imgProps = props.imgProps,
-    onError = props.onError,
-    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  var _useCustom = useCustom('Avatar', props),
+    rtl = _useCustom.rtl,
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'div' : _propsWithDefaults$as,
+    bordered = propsWithDefaults.bordered,
+    alt = propsWithDefaults.alt,
+    className = propsWithDefaults.className,
+    children = propsWithDefaults.children,
+    circle = propsWithDefaults.circle,
+    color = propsWithDefaults.color,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'avatar' : _propsWithDefaults$cl,
+    _propsWithDefaults$si = propsWithDefaults.size,
+    size = _propsWithDefaults$si === void 0 ? groupSize : _propsWithDefaults$si,
+    src = propsWithDefaults.src,
+    srcSet = propsWithDefaults.srcSet,
+    sizes = propsWithDefaults.sizes,
+    style = propsWithDefaults.style,
+    imgProps = propsWithDefaults.imgProps,
+    onError = propsWithDefaults.onError,
+    rest = _objectWithoutPropertiesLoose(propsWithDefaults, _excluded);
   var _useClassNames = useClassNames(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     prefix = _useClassNames.prefix,
@@ -58,8 +62,6 @@ var Avatar = /*#__PURE__*/React.forwardRef(function (props, ref) {
       onError: onError
     })),
     loaded = _useImage.loaded;
-  var _useCustom = useCustom('Avatar'),
-    rtl = _useCustom.rtl;
   var altComponent = useMemo(function () {
     if (alt) {
       return /*#__PURE__*/React.createElement("span", {

package/esm/AvatarGroup/AvatarGroup.js

@@ -7,6 +7,7 @@ import PropTypes from 'prop-types';
 import { useClassNames } from "../internals/hooks/index.js";
 import { isIE } from "../internals/utils/index.js";
 import { oneOf } from "../internals/propTypes/index.js";
+import { useCustom } from "../CustomProvider/index.js";
 export var AvatarGroupContext = /*#__PURE__*/React.createContext({});
 
 /**
@@ -14,17 +15,19 @@ export var AvatarGroupContext = /*#__PURE__*/React.createContext({});
  * @see https://rsuitejs.com/components/avatar
  */
 var AvatarGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'div' : _props$as,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'avatar-group' : _props$classPrefix,
-    spacing = props.spacing,
-    className = props.className,
-    children = props.children,
-    stack = props.stack,
-    size = props.size,
-    style = props.style,
-    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  var _useCustom = useCustom('AvatarGroup', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'div' : _propsWithDefaults$as,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'avatar-group' : _propsWithDefaults$cl,
+    spacing = propsWithDefaults.spacing,
+    className = propsWithDefaults.className,
+    children = propsWithDefaults.children,
+    stack = propsWithDefaults.stack,
+    size = propsWithDefaults.size,
+    style = propsWithDefaults.style,
+    rest = _objectWithoutPropertiesLoose(propsWithDefaults, _excluded);
   var _useClassNames = useClassNames(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     merge = _useClassNames.merge;

package/esm/Badge/Badge.js

@@ -6,22 +6,25 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames } from "../internals/hooks/index.js";
 import { oneOf } from "../internals/propTypes/index.js";
+import { useCustom } from "../CustomProvider/index.js";
 /**
  * The Badge component is usually used to mark or highlight the status or quantity of an object.
  * @see https://rsuitejs.com/components/badge
  */
 var Badge = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'div' : _props$as,
-    contentText = props.content,
-    color = props.color,
-    className = props.className,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'badge' : _props$classPrefix,
-    children = props.children,
-    _props$maxCount = props.maxCount,
-    maxCount = _props$maxCount === void 0 ? 99 : _props$maxCount,
-    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  var _useCustom = useCustom('Badge', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'div' : _propsWithDefaults$as,
+    contentText = propsWithDefaults.content,
+    color = propsWithDefaults.color,
+    className = propsWithDefaults.className,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'badge' : _propsWithDefaults$cl,
+    children = propsWithDefaults.children,
+    _propsWithDefaults$ma = propsWithDefaults.maxCount,
+    maxCount = _propsWithDefaults$ma === void 0 ? 99 : _propsWithDefaults$ma,
+    rest = _objectWithoutPropertiesLoose(propsWithDefaults, _excluded);
   var _useClassNames = useClassNames(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     prefix = _useClassNames.prefix,

package/esm/Breadcrumb/Breadcrumb.js

@@ -4,9 +4,10 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 var _excluded = ["as", "className", "classPrefix", "children", "ellipsis", "maxItems", "separator", "locale", "onExpand"];
 import React, { useState, useMemo } from 'react';
 import PropTypes from 'prop-types';
-import { useClassNames, useCustom, useEventCallback } from "../internals/hooks/index.js";
+import { useClassNames, useEventCallback } from "../internals/hooks/index.js";
 import { ReactChildren, createComponent } from "../internals/utils/index.js";
 import BreadcrumbItem from "./BreadcrumbItem.js";
+import { useCustom } from "../CustomProvider/index.js";
 var Separator = createComponent({
   name: 'BreadcrumbSeparator',
   componentAs: 'span',
@@ -18,29 +19,29 @@ var Separator = createComponent({
  * @see https://rsuitejs.com/components/breadcrumb
  */
 var Breadcrumb = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'nav' : _props$as,
-    className = props.className,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'breadcrumb' : _props$classPrefix,
-    children = props.children,
-    _props$ellipsis = props.ellipsis,
-    ellipsis = _props$ellipsis === void 0 ? '...' : _props$ellipsis,
-    _props$maxItems = props.maxItems,
-    maxItems = _props$maxItems === void 0 ? 5 : _props$maxItems,
-    _props$separator = props.separator,
-    separator = _props$separator === void 0 ? '/' : _props$separator,
-    overrideLocale = props.locale,
-    onExpand = props.onExpand,
-    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  var _useCustom = useCustom('Breadcrumb', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'nav' : _propsWithDefaults$as,
+    className = propsWithDefaults.className,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'breadcrumb' : _propsWithDefaults$cl,
+    children = propsWithDefaults.children,
+    _propsWithDefaults$el = propsWithDefaults.ellipsis,
+    ellipsis = _propsWithDefaults$el === void 0 ? '...' : _propsWithDefaults$el,
+    _propsWithDefaults$ma = propsWithDefaults.maxItems,
+    maxItems = _propsWithDefaults$ma === void 0 ? 5 : _propsWithDefaults$ma,
+    _propsWithDefaults$se = propsWithDefaults.separator,
+    separator = _propsWithDefaults$se === void 0 ? '/' : _propsWithDefaults$se,
+    locale = propsWithDefaults.locale,
+    onExpand = propsWithDefaults.onExpand,
+    rest = _objectWithoutPropertiesLoose(propsWithDefaults, _excluded);
   var _useClassNames = useClassNames(classPrefix),
     merge = _useClassNames.merge,
     withClassPrefix = _useClassNames.withClassPrefix;
   var _useState = useState(true),
     showEllipsis = _useState[0],
     setShowEllipsis = _useState[1];
-  var _useCustom = useCustom('Breadcrumb', overrideLocale),
-    locale = _useCustom.locale;
   var handleClickEllipsis = useEventCallback(function (event) {
     setShowEllipsis(false);
     onExpand === null || onExpand === void 0 ? void 0 : onExpand(event);
@@ -57,8 +58,8 @@ var Breadcrumb = /*#__PURE__*/React.forwardRef(function (props, ref) {
       return [].concat(items.slice(0, 1), [[/*#__PURE__*/React.createElement(BreadcrumbItem, {
         role: "button",
         key: "ellipsis",
-        title: locale.expandText,
-        "aria-label": locale.expandText,
+        title: locale === null || locale === void 0 ? void 0 : locale.expandText,
+        "aria-label": locale === null || locale === void 0 ? void 0 : locale.expandText,
         separator: /*#__PURE__*/React.createElement(Separator, null, separator),
         onClick: handleClickEllipsis
       }, /*#__PURE__*/React.createElement("span", {
@@ -66,7 +67,7 @@ var Breadcrumb = /*#__PURE__*/React.forwardRef(function (props, ref) {
       }, ellipsis))]], items.slice(items.length - 1, items.length));
     }
     return items;
-  }, [children, ellipsis, handleClickEllipsis, locale.expandText, maxItems, separator, showEllipsis]);
+  }, [children, ellipsis, handleClickEllipsis, locale === null || locale === void 0 ? void 0 : locale.expandText, maxItems, separator, showEllipsis]);
   var classes = merge(className, withClassPrefix());
   return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
     ref: ref,

package/esm/Button/Button.js

@@ -7,35 +7,38 @@ var _excluded = ["as", "active", "appearance", "block", "className", "children",
 import React, { useContext, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import Ripple from "../internals/Ripple/index.js";
+import SafeAnchor from "../SafeAnchor/index.js";
 import { oneOf } from "../internals/propTypes/index.js";
 import { ButtonGroupContext } from "../ButtonGroup/index.js";
-import SafeAnchor from "../SafeAnchor/index.js";
 import { isOneOf } from "../internals/utils/index.js";
 import { useClassNames } from "../internals/hooks/index.js";
+import { useCustom } from "../CustomProvider/index.js";
 /**
  * The Button component is used to trigger a custom action.
  * @see https://rsuitejs.com/components/button
  */
 var Button = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var as = props.as,
-    active = props.active,
-    _props$appearance = props.appearance,
-    appearance = _props$appearance === void 0 ? 'default' : _props$appearance,
-    block = props.block,
-    className = props.className,
-    children = props.children,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'btn' : _props$classPrefix,
-    color = props.color,
-    disabled = props.disabled,
-    loading = props.loading,
-    _props$ripple = props.ripple,
-    ripple = _props$ripple === void 0 ? true : _props$ripple,
-    sizeProp = props.size,
-    startIcon = props.startIcon,
-    endIcon = props.endIcon,
-    typeProp = props.type,
-    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  var _useCustom = useCustom('Button', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var as = propsWithDefaults.as,
+    active = propsWithDefaults.active,
+    _propsWithDefaults$ap = propsWithDefaults.appearance,
+    appearance = _propsWithDefaults$ap === void 0 ? 'default' : _propsWithDefaults$ap,
+    block = propsWithDefaults.block,
+    className = propsWithDefaults.className,
+    children = propsWithDefaults.children,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'btn' : _propsWithDefaults$cl,
+    color = propsWithDefaults.color,
+    disabled = propsWithDefaults.disabled,
+    loading = propsWithDefaults.loading,
+    _propsWithDefaults$ri = propsWithDefaults.ripple,
+    ripple = _propsWithDefaults$ri === void 0 ? true : _propsWithDefaults$ri,
+    sizeProp = propsWithDefaults.size,
+    startIcon = propsWithDefaults.startIcon,
+    endIcon = propsWithDefaults.endIcon,
+    typeProp = propsWithDefaults.type,
+    rest = _objectWithoutPropertiesLoose(propsWithDefaults, _excluded);
   var buttonGroup = useContext(ButtonGroupContext);
   var size = sizeProp !== null && sizeProp !== void 0 ? sizeProp : buttonGroup === null || buttonGroup === void 0 ? void 0 : buttonGroup.size;
   var _useClassNames = useClassNames(classPrefix),

package/esm/ButtonGroup/ButtonGroup.js

@@ -6,25 +6,28 @@ import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { oneOf } from "../internals/propTypes/index.js";
 import { useClassNames } from "../internals/hooks/index.js";
+import { useCustom } from "../CustomProvider/index.js";
 import ButtonGroupContext from "./ButtonGroupContext.js";
 /**
  * The ButtonGroup component is used to group a series of buttons together in a single line or column.
  * @see https://rsuitejs.com/components/button/#button-group
  */
 var ButtonGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'div' : _props$as,
-    _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'btn-group' : _props$classPrefix,
-    _props$role = props.role,
-    role = _props$role === void 0 ? 'group' : _props$role,
-    className = props.className,
-    children = props.children,
-    block = props.block,
-    vertical = props.vertical,
-    justified = props.justified,
-    size = props.size,
-    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  var _useCustom = useCustom('ButtonGroup', props),
+    propsWithDefaults = _useCustom.propsWithDefaults;
+  var _propsWithDefaults$as = propsWithDefaults.as,
+    Component = _propsWithDefaults$as === void 0 ? 'div' : _propsWithDefaults$as,
+    _propsWithDefaults$cl = propsWithDefaults.classPrefix,
+    classPrefix = _propsWithDefaults$cl === void 0 ? 'btn-group' : _propsWithDefaults$cl,
+    _propsWithDefaults$ro = propsWithDefaults.role,
+    role = _propsWithDefaults$ro === void 0 ? 'group' : _propsWithDefaults$ro,
+    className = propsWithDefaults.className,
+    children = propsWithDefaults.children,
+    block = propsWithDefaults.block,
+    vertical = propsWithDefaults.vertical,
+    justified = propsWithDefaults.justified,
+    size = propsWithDefaults.size,
+    rest = _objectWithoutPropertiesLoose(propsWithDefaults, _excluded);
   var _useClassNames = useClassNames(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     merge = _useClassNames.merge;