rsuite 6.0.0-canary-20250416 → 6.0.0-canary-20250507

package/esm/Container/Container.js

@@ -3,8 +3,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import React, { useState, useMemo } from 'react';
 import Box from "../internals/Box/index.js";
 import { forwardRef } from "../internals/utils/index.js";
-import { useStyles } from "../internals/hooks/index.js";
-import { useCustom } from "../CustomProvider/index.js";
+import { useStyles, useCustom } from "../internals/hooks/index.js";
 export const ContainerContext = /*#__PURE__*/React.createContext({});
 /**
  * The Container component is used to wrap content in a themed container with a max-width.

package/esm/CustomProvider/CustomProvider.d.ts

@@ -1,275 +1,5 @@
 import React from 'react';
-import { Locale } from '../locales';
-import { ToastContainerInstance } from '../toaster/ToastContainer';
-import type { FormatDateOptions } from '../internals/utils/date/types';
-import type { ReactSuiteComponents } from './types';
-export interface CustomValue<T = Locale> {
-    /**
-     * The prefix of the component CSS class
-     */
-    classPrefix?: string;
-    /**
-     * The locale object that contains the language and formatting rules for the date.
-     */
-    locale: T;
-    /**
-     * Right-to-left text direction.
-     */
-    rtl: boolean;
-    /**
-     * Return the formatted date string in the given format. The result may vary by locale.
-     *
-     * Example:
-     *
-     *  import { format } from 'date-fns/format';
-     *  import { eo } from 'date-fns/locale/eo'
-     *
-     *  function formatDate(date, formatStr) {
-     *    return format(date, formatStr, { locale: eo });
-     *  }
-     *
-     */
-    formatDate: (date: Date | number, format: string, options?: FormatDateOptions) => string;
-    /**
-     * Return the date parsed from string using the given format string.
-     *
-     * Example:
-     *
-     *  import { parse } from 'date-fns/parse';
-     *  import { eo } from 'date-fns/locale/eo'
-     *
-     *  function parseDate(date, formatStr) {
-     *    return parse(date, formatStr, new Date(), { locale: eo });
-     *  }
-     *
-     */
-    parseDate: (dateString: string, formatString: string, referenceDate?: Date | number, options?: FormatDateOptions) => Date;
-    /**
-     * A Map of toast containers
-     */
-    toasters?: React.MutableRefObject<Map<string, ToastContainerInstance>>;
-    /**
-     * If true, the ripple effect is disabled.
-     * Affected components include: Button, Nav.Item, Pagination.
-     */
-    disableRipple?: boolean;
-}
-export interface CustomProviderProps<T = Locale> extends Partial<CustomValue<T>> {
-    /**
-     * Supported themes
-     */
-    theme?: 'light' | 'dark' | 'high-contrast';
-    /**
-     * The prefix of the icon CSS class
-     */
-    iconClassPrefix?: string;
-    /**
-     * Primary content
-     */
-    children?: React.ReactNode;
-    /**
-     * Sets a container for toast rendering
-     */
-    toastContainer?: HTMLElement | (() => HTMLElement | null) | null;
-    csp?: {
-        /**
-         * Content Security Policy nonce
-         * https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce
-         */
-        nonce?: string;
-    };
-    /**
-     * Disable inline styles
-     * @default false
-     */
-    disableInlineStyles?: boolean;
-    /**
-     * components allows setting default props for specific components globally.
-     * It accepts an object where each key represents a component name (e.g., 'Button', 'Input'),
-     * and the corresponding value is an object containing the `defaultProps` object.
-     * The `defaultProps` object defines the default props for that component.
-     * These props will be automatically applied to the component unless overridden by specific props
-     * passed in an individual component instance.
-     *
-     * @example
-     * ```js
-     * components={{
-     *   Button: { defaultProps: { appearance: 'primary', size: 'lg' } },
-     *   Input: { defaultProps: { placeholder: 'Enter text', size: 'lg' } }
-     * }}
-     * ```
-     */
-    components?: Partial<ReactSuiteComponents>;
-}
-export declare const CustomContext: React.Context<CustomProviderProps<{
-    code?: string | undefined;
-    common?: {
-        loading: string;
-        emptyMessage: string;
-        remove: string;
-        clear: string;
-    } | undefined;
-    Plaintext?: {
-        unfilled: string;
-        notSelected: string;
-        notUploaded: string;
-    } | undefined;
-    Pagination?: {
-        more: string;
-        prev: string;
-        next: string;
-        first: string;
-        last: string;
-        limit: string;
-        total: string;
-        /**
-         * Return the date parsed from string using the given format string.
-         *
-         * Example:
-         *
-         *  import { parse } from 'date-fns/parse';
-         *  import { eo } from 'date-fns/locale/eo'
-         *
-         *  function parseDate(date, formatStr) {
-         *    return parse(date, formatStr, new Date(), { locale: eo });
-         *  }
-         *
-         */
-        skip: string;
-    } | undefined;
-    DateTimeFormats?: {
-        sunday: string;
-        monday: string;
-        tuesday: string;
-        wednesday: string;
-        thursday: string;
-        friday: string;
-        saturday: string;
-        ok: string;
-        today: string;
-        yesterday: string;
-        now: string;
-        hours: string;
-        minutes: string;
-        seconds: string;
-        formattedMonthPattern: string;
-        formattedDayPattern: string;
-        shortDateFormat: string;
-        shortTimeFormat: string;
-        dateLocale: any;
-    } | undefined;
-    Calendar?: {
-        sunday: string;
-        monday: string;
-        tuesday: string;
-        wednesday: string;
-        thursday: string;
-        friday: string;
-        saturday: string;
-        ok: string;
-        today: string;
-        yesterday: string;
-        now: string;
-        hours: string;
-        minutes: string;
-        seconds: string;
-        formattedMonthPattern: string;
-        formattedDayPattern: string;
-        shortDateFormat: string;
-        shortTimeFormat: string;
-        dateLocale: any;
-    } | undefined;
-    DatePicker?: {
-        sunday: string;
-        monday: string;
-        tuesday: string;
-        wednesday: string;
-        thursday: string;
-        friday: string;
-        saturday: string;
-        ok: string;
-        today: string;
-        yesterday: string;
-        now: string;
-        hours: string;
-        minutes: string;
-        seconds: string;
-        formattedMonthPattern: string;
-        formattedDayPattern: string;
-        shortDateFormat: string;
-        shortTimeFormat: string;
-        dateLocale: any;
-    } | undefined;
-    DateRangePicker?: {
-        last7Days: string;
-        sunday: string;
-        monday: string;
-        tuesday: string;
-        wednesday: string;
-        thursday: string;
-        friday: string;
-        saturday: string;
-        ok: string;
-        today: string;
-        yesterday: string;
-        now: string;
-        hours: string;
-        minutes: string;
-        seconds: string;
-        formattedMonthPattern: string;
-        formattedDayPattern: string;
-        shortDateFormat: string;
-        shortTimeFormat: string;
-        dateLocale: any;
-    } | undefined;
-    Combobox?: {
-        noResultsText: string;
-        placeholder: string;
-        searchPlaceholder: string;
-        checkAll: string;
-    } | undefined;
-    InputPicker?: {
-        /**
-         * Right-to-left text direction.
-         */
-        newItem: string;
-        createOption: string;
-        noResultsText: string;
-        placeholder: string;
-        searchPlaceholder: string;
-        checkAll: string;
-    } | undefined;
-    TagPicker?: {
-        /**
-         * Right-to-left text direction.
-         */
-        newItem: string;
-        createOption: string;
-        noResultsText: string;
-        placeholder: string;
-        searchPlaceholder: string;
-        checkAll: string;
-    } | undefined;
-    Uploader?: {
-        inited: string;
-        progress: string;
-        error: string;
-        complete: string;
-        emptyFile: string;
-        upload: string;
-        removeFile: string;
-    } | undefined;
-    CloseButton?: {
-        closeLabel: string;
-    } | undefined;
-    Breadcrumb?: {
-        expandText: string;
-    } | undefined;
-    Toggle?: {
-        on: string;
-        off: string;
-    } | undefined;
-}>>;
+import { CustomProviderProps } from '../internals/Provider/CustomContext';
 /**
  * CustomProvider is used to provide global configuration, such as language, theme, etc.
  *

package/esm/CustomProvider/CustomProvider.js

@@ -4,8 +4,8 @@ import IconProvider from '@rsuite/icons/IconProvider';
 import { usePortal, useIsomorphicLayoutEffect } from "../internals/hooks/index.js";
 import { getClassNamePrefix, prefix } from "../internals/utils/index.js";
 import { addClass, removeClass, canUseDOM } from "../DOMHelper/index.js";
+import { CustomContext } from "../internals/Provider/CustomContext.js";
 import ToastContainer, { toastPlacements, defaultToasterContainer } from "../toaster/ToastContainer.js";
-export const CustomContext = /*#__PURE__*/React.createContext({});
 const themes = ['light', 'dark', 'high-contrast'];
 
 /**

package/esm/CustomProvider/index.d.ts

@@ -1,9 +1,4 @@
 import CustomProvider from './CustomProvider';
-export type { CustomProviderProps } from './CustomProvider';
-export type { ReactSuiteComponents } from './types';
-export { useCustom } from './useCustom';
-export { FormattedDate } from './FormattedDate';
-export { FormattedNumber } from './FormattedNumber';
-export { CustomContext } from './CustomProvider';
+export type { CustomProviderProps } from '../internals/Provider/CustomContext';
 export { CustomProvider };
 export default CustomProvider;

package/esm/CustomProvider/index.js

@@ -3,12 +3,6 @@ import CustomProvider from "./CustomProvider.js";
 
 // export types
 
-// export hooks
-export { useCustom } from "./useCustom.js";
-
 // export components
-export { FormattedDate } from "./FormattedDate.js";
-export { FormattedNumber } from "./FormattedNumber.js";
-export { CustomContext } from "./CustomProvider.js";
 export { CustomProvider };
 export default CustomProvider;

package/esm/DateInput/DateInput.js

@@ -7,11 +7,10 @@ import useKeyboardInputEvent from "./hooks/useKeyboardInputEvent.js";
 import useIsFocused from "./hooks/useIsFocused.js";
 import useFieldCursor from "./hooks/useFieldCursor.js";
 import useSelectedState from "./hooks/useSelectedState.js";
-import { useControlled, useEventCallback } from "../internals/hooks/index.js";
+import { useControlled, useEventCallback, useCustom } from "../internals/hooks/index.js";
 import { forwardRef, mergeRefs } from "../internals/utils/index.js";
 import { isValid } from "../internals/utils/date/index.js";
 import { getInputSelectedState, validateDateTime, useInputSelection } from "./utils.js";
-import { useCustom } from "../CustomProvider/index.js";
 /**
  * The DateInput component lets users select a date with the keyboard.
  * @version 5.58.0

package/esm/DateInput/hooks/useDateInputState.js

@@ -2,7 +2,7 @@
 import startCase from 'lodash/startCase';
 import { useCallback, useEffect } from 'react';
 import { addDays, addMonths, addYears, addHours, addMinutes, addSeconds, isLastDayOfMonth, lastDayOfMonth, isValid } from "../../internals/utils/date/index.js";
-import { useCustom } from "../../CustomProvider/index.js";
+import { useCustom } from "../../internals/hooks/index.js";
 import { useDateField, patternMap } from "../DateField.js";
 export function useDateInputState(_ref) {
   let {

package/esm/DatePicker/DatePicker.js

@@ -18,13 +18,12 @@ import Box from "../internals/Box/index.js";
 import { useCalendarDate } from "../Calendar/hooks/index.js";
 import { isEveryDateInMonth } from "../Calendar/utils/index.js";
 import { forwardRef, mergeRefs, partitionHTMLProps, createChainedFunction } from "../internals/utils/index.js";
-import { useStyles, useControlled, useUniqueId, useEventCallback } from "../internals/hooks/index.js";
+import { useStyles, useCustom, useControlled, useUniqueId, useEventCallback } from "../internals/hooks/index.js";
 import { isValid, copyTime, disableTime, DateMode, useDateMode, calendarOnlyProps } from "../internals/utils/date/index.js";
 import { PickerPopup, PickerLabel, PickerIndicator, PickerToggleTrigger, triggerPropKeys, usePickerRef, onMenuKeyDown } from "../internals/Picker/index.js";
 import { OverlayCloseCause } from "../internals/Overlay/OverlayTrigger.js";
 import { splitRanges, getRestProps } from "./utils.js";
 import { startOfToday } from "../internals/utils/date/index.js";
-import { useCustom } from "../CustomProvider/index.js";
 /**
  * A date picker allows users to select a date from a calendar.
  *
@@ -50,7 +49,7 @@ const DatePicker = forwardRef((props, ref) => {
     format,
     id: idProp,
     isoWeek,
-    weekStart = 0,
+    weekStart,
     limitEndYear = 1000,
     limitStartYear,
     locale,

package/esm/DatePicker/hooks/useFocus.js

@@ -2,8 +2,7 @@
 import delay from 'lodash/delay';
 import { addMonths } from 'date-fns/addMonths';
 import { addDays } from 'date-fns/addDays';
-import { useEventCallback } from "../../internals/hooks/index.js";
-import { useCustom } from "../../CustomProvider/index.js";
+import { useEventCallback, useCustom } from "../../internals/hooks/index.js";
 import { getAriaLabel } from "../../Calendar/utils/index.js";
 import { onMenuKeyDown } from "../../internals/Picker/utils.js";
 function useFocus(props) {

package/esm/DateRangeInput/DateRangeInput.js

@@ -3,10 +3,9 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import React, { useState, useRef, useMemo } from 'react';
 import Input from "../Input/index.js";
 import { isValid } from "../internals/utils/date/index.js";
-import { useStyles, useControlled, useEventCallback } from "../internals/hooks/index.js";
+import { useStyles, useCustom, useControlled, useEventCallback } from "../internals/hooks/index.js";
 import { mergeRefs } from "../internals/utils/index.js";
 import { validateDateTime, useDateInputState, useInputSelection, useKeyboardInputEvent, useIsFocused, useSelectedState, useFieldCursor } from "../DateInput/index.js";
-import { useCustom } from "../CustomProvider/index.js";
 import { getInputSelectedState, DateType, getDateType, isSwitchDateType } from "./utils.js";
 /**
  * The DateRangeInput component lets users select a date with the keyboard.

package/esm/DateRangePicker/DateRangePicker.js

@@ -20,8 +20,7 @@ import * as StaticMethods from "./disabledDateUtils.js";
 import { DateRangePickerProvider } from "./DateRangePickerProvider.js";
 import { getSafeCalendarDate, getMonthHoverRange, getWeekHoverRange, isSameRange } from "./utils.js";
 import { DATERANGE_DISABLED_TARGET as TARGET } from "../internals/constants/index.js";
-import { useStyles, useControlled, useUniqueId, useEventCallback } from "../internals/hooks/index.js";
-import { useCustom } from "../CustomProvider/index.js";
+import { useStyles, useCustom, useControlled, useUniqueId, useEventCallback } from "../internals/hooks/index.js";
 import { splitRanges } from "../DatePicker/utils.js";
 import { PickerPopup, PickerToggleTrigger, PickerIndicator, PickerLabel, triggerPropKeys, usePickerRef, onMenuKeyDown } from "../internals/Picker/index.js";
 import { forwardRef, createChainedFunction, mergeRefs, partitionHTMLProps, getStringLength } from "../internals/utils/index.js";
@@ -59,7 +58,7 @@ const DateRangePicker = forwardRef((props, ref) => {
     hoverRange,
     id: idProp,
     isoWeek = false,
-    weekStart = 0,
+    weekStart,
     limitEndYear = 1000,
     limitStartYear,
     locale,

package/esm/DateRangePicker/Header.js

@@ -2,7 +2,7 @@
 import React from 'react';
 import { useStyles } from "../internals/hooks/index.js";
 import { compareAsc } from "../internals/utils/date/index.js";
-import { FormattedDate } from "../CustomProvider/index.js";
+import { FormattedDate } from "../internals/intl/FormattedDate.js";
 import Button from "../Button/index.js";
 function Header(props) {
   const {

package/esm/DateRangePicker/utils.d.ts

@@ -9,6 +9,6 @@ export declare const isSameRange: (source: DateRange | null, dest: DateRange | n
 export declare const getMonthHoverRange: (date: Date) => DateRange;
 export declare const getWeekHoverRange: (date: Date, options: {
     isoWeek: boolean;
-    weekStart: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    weekStart?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
     locale?: Locale;
 }) => DateRange;

package/esm/DateRangePicker/utils.js

@@ -46,7 +46,7 @@ export const getMonthHoverRange = date => [startOfMonth(date), endOfMonth(date)]
 export const getWeekHoverRange = (date, options) => {
   const {
     isoWeek,
-    weekStart,
+    weekStart = 0,
     locale
   } = options;
   if (isoWeek) {

package/esm/Divider/Divider.js

@@ -3,8 +3,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import React from 'react';
 import StyledBox from "../internals/StyledBox/index.js";
 import { forwardRef, getSizeStyle, mergeStyles } from "../internals/utils/index.js";
-import { useStyles } from "../internals/hooks/index.js";
-import { useCustom } from "../CustomProvider/index.js";
+import { useStyles, useCustom } from "../internals/hooks/index.js";
 /**
  * The Divider component is used to separate content.
  * @see https://rsuitejs.com/components/divider

package/esm/Drawer/Drawer.js

@@ -8,9 +8,8 @@ import DrawerHeader from "./DrawerHeader.js";
 import DrawerActions from "./DrawerActions.js";
 import DrawerFooter from "./DrawerFooter.js";
 import DrawerTitle from "./DrawerTitle.js";
-import { useStyles } from "../internals/hooks/index.js";
+import { useStyles, useCustom } from "../internals/hooks/index.js";
 import { forwardRef, deprecateComponent } from "../internals/utils/index.js";
-import { useCustom } from "../CustomProvider/index.js";
 const Subcomponents = {
   Body: DrawerBody,
   Header: DrawerHeader,

package/esm/Dropdown/Dropdown.js

@@ -11,10 +11,9 @@ import Menu from "../internals/Menu/Menu.js";
 import DropdownToggle from "./DropdownToggle.js";
 import NavContext from "../Nav/NavContext.js";
 import Nav from "../Nav/index.js";
-import { useStyles } from "../internals/hooks/index.js";
+import { useStyles, useCustom } from "../internals/hooks/index.js";
 import { forwardRef, mergeRefs, kebabPlace, warnOnce } from "../internals/utils/index.js";
 import { initialState, reducer } from "./DropdownState.js";
-import { useCustom } from "../CustomProvider/index.js";
 const Subcomponents = {
   Item: DropdownItem,
   Menu: DropdownMenu,

package/esm/Dropdown/DropdownMenu.js

@@ -10,8 +10,7 @@ import PageNextIcon from '@rsuite/icons/PageNext';
 import DropdownContext from "./DropdownContext.js";
 import Nav from "../Nav/index.js";
 import NavContext from "../Nav/NavContext.js";
-import { useStyles } from "../internals/hooks/index.js";
-import { useCustom } from "../CustomProvider/index.js";
+import { useStyles, useCustom } from "../internals/hooks/index.js";
 import { mergeRefs, warnOnce } from "../internals/utils/index.js";
 /**
  * The `<Dropdown.Menu>` API

package/esm/FlexboxGrid/FlexboxGrid.js

@@ -3,8 +3,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import React from 'react';
 import FlexboxGridItem from "./FlexboxGridItem.js";
 import { forwardRef } from "../internals/utils/index.js";
-import { useStyles } from "../internals/hooks/index.js";
-import { useCustom } from "../CustomProvider/index.js";
+import { useStyles, useCustom } from "../internals/hooks/index.js";
 const Subcomponents = {
   Item: FlexboxGridItem
 };

package/esm/Form/Form.js

@@ -14,9 +14,8 @@ import useFormValue from "./hooks/useFormValue.js";
 import useFormRef from "./hooks/useFormRef.js";
 import { forwardRef } from "../internals/utils/index.js";
 import { SchemaModel } from 'schema-typed';
-import { useEventCallback } from "../internals/hooks/index.js";
+import { useEventCallback, useCustom } from "../internals/hooks/index.js";
 import { FormValueProvider, FormProvider } from "./FormContext.js";
-import { useCustom } from "../CustomProvider/index.js";
 const defaultSchema = SchemaModel({});
 const Subcomponents = {
   Stack: FormStack,

package/esm/Form/FormContext.d.ts

@@ -11,7 +11,7 @@ interface TrulyFormContextValue<T = RecordAny, M = any, E = {
     removeFieldError: (name: string) => void;
     removeFieldRule: (name: string) => void;
     pushFieldRule: (name: string, fieldRule: FieldRuleType) => void;
-    onFieldChange: (name: string, value: any, event: React.SyntheticEvent) => void;
+    onFieldChange: (name: string, value: any, event?: React.SyntheticEvent) => void;
     checkFieldForNextValue: (name: string, nextValue: Record<string, unknown>, callback?: (checkResult: Record<string, unknown>) => void) => boolean;
     checkFieldAsyncForNextValue: (name: string, nextValue: Record<string, unknown>) => Promise<Record<string, unknown>>;
 }

package/esm/Form/hooks/useFormValidate.js

@@ -3,7 +3,7 @@ import { useRef, useCallback } from 'react';
 import omit from 'lodash/omit';
 import set from 'lodash/set';
 import { useControlled, useEventCallback } from "../../internals/hooks/index.js";
-import { nameToPath } from "../../FormControl/utils.js";
+import { nameToPath } from "../../useFormControl/utils/nameToPath.js";
 export default function useFormValidate(_formError, props) {
   const {
     formValue,