chore: merge feature into next

.dumi/theme/common/Color/Palette.tsx

@@ -73,10 +73,10 @@ const Palette: React.FC<PaletteProps> = (props) => {
         key={i}
         ref={(node) => {
           if (node) {
-            colorNodesRef.current[`${name}-${i}`] = node;
+            colorNodesRef.current[`${name}-${i + 1}`] = node;
           }
         }}
-        className={`main-color-item palette-${name}-${i}`}
+        className={`main-color-item palette-${name}-${i + 1}`}
         style={{
           color: (name === 'yellow' ? i > 6 : i > 5) ? firstColor : lastColor,
           fontWeight: i === 6 ? 'bold' : 'normal',

.github/workflows/preview-build.yml

@@ -30,7 +30,7 @@ jobs:
       - name: run e2e test
         run: ut test:site
       - name: upload site artifact
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
         with:
           name: site
           path: _site/
@@ -42,7 +42,7 @@ jobs:
 
       - name: Upload PR number
         if: ${{ always() }}
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
         with:
           name: pr
           path: ./pr-id.txt

.github/workflows/site-deploy.yml

@@ -45,7 +45,7 @@ jobs:
           fi
 
       - name: upload site artifact
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
         with:
           name: real-site
           path: _site/
@@ -63,7 +63,7 @@ jobs:
       - uses: utooland/setup-utoo@v1
 
       - name: download site artifact
-        uses: actions/download-artifact@v5
+        uses: actions/download-artifact@v6
         with:
           name: real-site
           path: _site
@@ -105,7 +105,7 @@ jobs:
     needs: build-site
     steps:
       - name: download site artifact
-        uses: actions/download-artifact@v5
+        uses: actions/download-artifact@v6
         with:
           name: real-site
           path: _site

.github/workflows/test-v6.yml

@@ -76,7 +76,7 @@ jobs:
           mkdir persist-coverage
           mv coverage/coverage-final.json persist-coverage/react-test-${{matrix.module}}-${{strategy.job-index}}.json
 
-      - uses: actions/upload-artifact@v4
+      - uses: actions/upload-artifact@v5
         name: upload coverages
         with:
           name: coverage-artifacts-${{ matrix.module }}-${{ strategy.job-index }}
@@ -121,7 +121,7 @@ jobs:
     steps:
       - uses: actions/checkout@v5
       - uses: utooland/setup-utoo@v1
-      - uses: actions/download-artifact@v5
+      - uses: actions/download-artifact@v6
         with:
           pattern: coverage-artifacts-*
           merge-multiple: true

.github/workflows/test.yml

@@ -79,7 +79,7 @@ jobs:
           mkdir persist-coverage
           mv coverage/coverage-final.json persist-coverage/react-test-${{matrix.module}}-${{strategy.job-index}}.json
 
-      - uses: actions/upload-artifact@v4
+      - uses: actions/upload-artifact@v5
         name: upload coverages
         with:
           name: coverage-artifacts-${{ matrix.module }}-${{ strategy.job-index }}
@@ -126,7 +126,7 @@ jobs:
       - uses: utooland/setup-utoo@v1
       - run: ut
 
-      - uses: actions/download-artifact@v5
+      - uses: actions/download-artifact@v6
         with:
           pattern: coverage-artifacts-*
           merge-multiple: true
@@ -182,7 +182,7 @@ jobs:
         run: ut test:dekko
 
       # Artifact build files
-      - uses: actions/upload-artifact@v4
+      - uses: actions/upload-artifact@v5
         if: github.event_name == 'push' && github.ref == 'refs/heads/master'
         with:
           name: build artifacts

.github/workflows/visual-regression-diff-build.yml

@@ -37,7 +37,7 @@ jobs:
         env:
           NODE_OPTIONS: --max_old_space_size=4096
 
-      - uses: actions/upload-artifact@v4
+      - uses: actions/upload-artifact@v5
         name: artifact snapshot
         with:
           name: snapshot-artifacts-${{ strategy.job-index }}
@@ -54,7 +54,7 @@ jobs:
       - uses: utooland/setup-utoo@v1
       - run: ut
 
-      - uses: actions/download-artifact@v5
+      - uses: actions/download-artifact@v6
         with:
           pattern: snapshot-artifacts-*
           merge-multiple: true
@@ -71,7 +71,7 @@ jobs:
 
       # Upload report in `visualRegressionReport`
       - name: upload report artifact
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
         if: ${{ always() }}
         with:
           name: visual-regression-report
@@ -85,7 +85,7 @@ jobs:
 
       - name: Upload persist key
         if: ${{ always() }}
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
         with:
           name: visual-regression-diff-ref
           path: ./visual-regression-pr-id.txt

.github/workflows/visual-regression-persist-start.yml

@@ -31,7 +31,7 @@ jobs:
 
       # Upload `imageSnapshots` on master
       - name: upload report artifact
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
         with:
           name: image-snapshots
           path: imageSnapshots.tar.gz
@@ -43,7 +43,7 @@ jobs:
 
       - name: Upload persist key
         if: ${{ always() }}
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
         with:
           name: visual-regression-ref
           path: ./visual-regression-ref.txt

components/_util/__tests__/hooks.test.tsx

@@ -2,10 +2,8 @@ import React, { useEffect } from 'react';
 import { CloseOutlined } from '@ant-design/icons';
 import { render, renderHook } from '@testing-library/react';
 
-import useClosable, { computeClosable } from '../hooks/useClosable';
-import type { ClosableType } from '../hooks/useClosable';
-import useOrientation from '../hooks/useOrientation';
-import type { Orientation } from '../hooks/useOrientation';
+import { computeClosable, useClosable, useOrientation } from '../hooks';
+import type { ClosableType, Orientation } from '../hooks';
 
 describe('hooks test', () => {
   const useClosableParams: {

components/_util/__tests__/useMergeSemantic.test.tsx

@@ -1,6 +1,6 @@
 import { renderHook } from '@testing-library/react';
 
-import useMergeSemantic, { mergeClassNames } from '../hooks/useMergeSemantic';
+import useMergeSemantic, { mergeClassNames } from '../hooks';
 
 const mockSchema = {
   _default: 'root',

components/_util/__tests__/useSyncState.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import { fireEvent, render } from '../../../tests/utils';
-import useSyncState from '../hooks/useSyncState';
+import { useSyncState } from '../hooks';
 
 describe('Table', () => {
   it('useSyncState', () => {

components/_util/hooks/index.ts

@@ -0,0 +1,10 @@
+export * from './useClosable';
+export * from './useForceUpdate';
+export * from './useMergedMask';
+export * from './useMergeSemantic';
+export * from './useMultipleSelect';
+export * from './useOrientation';
+export * from './usePatchElement';
+export * from './useProxyImperativeHandle';
+export * from './useSyncState';
+export * from './useZIndex';

components/_util/hooks/useClosable.tsx

@@ -15,15 +15,15 @@ export type ContextClosable<T extends BaseContextClosable = any> = Partial<
   Pick<T, 'closable' | 'closeIcon'>
 >;
 
-export function pickClosable<T extends BaseContextClosable>(
+export const pickClosable = <T extends BaseContextClosable>(
   context?: ContextClosable<T>,
-): ContextClosable<T> | undefined {
+): ContextClosable<T> | undefined => {
   if (!context) {
     return undefined;
   }
   const { closable, closeIcon } = context;
   return { closable, closeIcon };
-}
+};
 
 /** Collection contains the all the props related with closable. e.g. `closable`, `closeIcon` */
 interface ClosableCollection {
@@ -46,10 +46,10 @@ type DataAttributes = {
   [key: `data-${string}`]: string;
 };
 
-function computeClosableConfig(
+const computeClosableConfig = (
   closable?: ClosableType,
   closeIcon?: ReactNode,
-): ClosableType | boolean | null {
+): ClosableType | boolean | null => {
   if (!closable && (closable === false || closeIcon === false || closeIcon === null)) {
     return false;
   }
@@ -69,27 +69,35 @@ function computeClosableConfig(
     };
   }
   return closableConfig;
-}
+};
 
-function mergeClosableConfigs(
+const mergeClosableConfigs = (
   propConfig: ReturnType<typeof computeClosableConfig>,
   contextConfig: ReturnType<typeof computeClosableConfig>,
   fallbackConfig: ClosableCollection & { closeIconRender?: (icon: ReactNode) => ReactNode },
-) {
-  if (propConfig === false) return false;
-  if (propConfig) return extendsObject(fallbackConfig, contextConfig, propConfig);
+) => {
+  if (propConfig === false) {
+    return false;
+  }
+  if (propConfig) {
+    return extendsObject(fallbackConfig, contextConfig, propConfig);
+  }
 
-  if (contextConfig === false) return false;
-  if (contextConfig) return extendsObject(fallbackConfig, contextConfig);
+  if (contextConfig === false) {
+    return false;
+  }
+  if (contextConfig) {
+    return extendsObject(fallbackConfig, contextConfig);
+  }
 
   return fallbackConfig.closable ? fallbackConfig : false;
-}
+};
 
-function computeCloseIcon(
+const computeCloseIcon = (
   mergedConfig: ClosableCollection,
   fallbackCloseCollection: FallbackCloseCollection,
   closeLabel: string,
-): [ReactNode, React.AriaAttributes & DataAttributes] {
+): [ReactNode, React.AriaAttributes & DataAttributes] => {
   const { closeIconRender } = fallbackCloseCollection;
   const { closeIcon, ...restConfig } = mergedConfig;
 
@@ -115,9 +123,9 @@ function computeCloseIcon(
   }
 
   return [finalCloseIcon, ariaOrDataProps];
-}
+};
 
-export function computeClosable(
+export const computeClosable = (
   propCloseCollection?: ClosableCollection,
   contextCloseCollection?: ClosableCollection | null,
   fallbackCloseCollection: FallbackCloseCollection = EmptyFallbackCloseCollection,
@@ -127,7 +135,7 @@ export function computeClosable(
   closeIcon: React.ReactNode,
   closeBtnIsDisabled: boolean,
   ariaOrDataProps: React.AriaAttributes & DataAttributes,
-] {
+] => {
   const propConfig = computeClosableConfig(
     propCloseCollection?.closable,
     propCloseCollection?.closeIcon,
@@ -151,13 +159,13 @@ export function computeClosable(
 
   const [closeIcon, ariaProps] = computeCloseIcon(mergedConfig, mergedFallback, closeLabel);
   return [true, closeIcon, closeBtnIsDisabled, ariaProps];
-}
+};
 
-function useClosable(
+export const useClosable = (
   propCloseCollection?: ClosableCollection,
   contextCloseCollection?: ClosableCollection | null,
   fallbackCloseCollection: FallbackCloseCollection = EmptyFallbackCloseCollection,
-) {
+) => {
   const [contextLocale] = useLocale('global', defaultLocale.global);
   return React.useMemo(() => {
     return computeClosable(
@@ -170,6 +178,4 @@ function useClosable(
       contextLocale.close,
     );
   }, [propCloseCollection, contextCloseCollection, fallbackCloseCollection, contextLocale.close]);
-}
-
-export default useClosable;
+};

components/_util/hooks/useForceUpdate.ts

@@ -1,6 +1,5 @@
-import * as React from 'react';
+import React from 'react';
 
-export default function useForceUpdate() {
-  const [, forceUpdate] = React.useReducer((x) => x + 1, 0);
-  return forceUpdate;
-}
+export const useForceUpdate = () => {
+  return React.useReducer((ori) => ori + 1, 0);
+};

components/_util/hooks/useMergeSemantic.ts

@@ -115,7 +115,7 @@ type ObjectOnly<T> = T extends (...args: any) => any ? never : T;
  * @desc Merge classNames and styles from multiple sources. When `schema` is provided, it **must** provide the nest object structure.
  * @descZH 合并来自多个来源的 classNames 和 styles，当提供了 `schema` 时，必须提供嵌套的对象结构。
  */
-const useMergeSemantic = <
+export const useMergeSemantic = <
   ClassNamesType extends AnyObject,
   StylesType extends AnyObject,
   Props extends AnyObject,
@@ -150,5 +150,3 @@ const useMergeSemantic = <
     ] as const;
   }, [mergedClassNames, mergedStyles, schema]);
 };
-
-export default useMergeSemantic;

components/_util/hooks/useMergedMask.ts

@@ -19,24 +19,19 @@ const normalizeMaskConfig = (mask?: MaskType): MaskConfig => {
   return {};
 };
 
-function useMergedMask(
+export const useMergedMask = (
   mask?: MaskType,
   contextMask?: MaskType,
   prefixCls?: string,
-): [boolean, { [key: string]: string | undefined }] {
+): [boolean, { [key: string]: string | undefined }] => {
   return useMemo(() => {
     const maskConfig = normalizeMaskConfig(mask);
     const contextMaskConfig = normalizeMaskConfig(contextMask);
 
-    const mergedConfig: MaskConfig = {
-      ...contextMaskConfig,
-      ...maskConfig,
-    };
+    const mergedConfig: MaskConfig = { ...contextMaskConfig, ...maskConfig };
 
     const className = mergedConfig.blur !== false ? `${prefixCls}-mask-blur` : undefined;
 
     return [mergedConfig.enabled !== false, { mask: className }];
   }, [mask, contextMask, prefixCls]);
-}
-
-export default useMergedMask;
+};

components/_util/hooks/useMultipleSelect.ts

@@ -6,7 +6,7 @@ export type PrevSelectedIndex = null | number;
  * @title multipleSelect hooks
  * @description multipleSelect by hold down shift key
  */
-export default function useMultipleSelect<T, K>(getKey: (item: T) => K) {
+export const useMultipleSelect = <T, K>(getKey: (item: T) => K) => {
   const [prevSelectedIndex, setPrevSelectedIndex] = useState<PrevSelectedIndex>(null);
 
   const multipleSelect = useCallback(
@@ -44,4 +44,4 @@ export default function useMultipleSelect<T, K>(getKey: (item: T) => K) {
   };
 
   return [multipleSelect, updatePrevSelectedIndex] as const;
-}
+};

components/_util/hooks/useOrientation.ts

@@ -6,11 +6,11 @@ const isValidOrientation = (orientation?: Orientation) => {
   return orientation === 'horizontal' || orientation === 'vertical';
 };
 
-export default function useOrientation(
+export const useOrientation = (
   orientation?: Orientation,
   vertical?: boolean,
   legacyDirection?: Orientation,
-): [Orientation, boolean] {
+): [Orientation, boolean] => {
   return useMemo(() => {
     const validOrientation = isValidOrientation(orientation);
     let mergedOrientation: Orientation;
@@ -25,4 +25,4 @@ export default function useOrientation(
 
     return [mergedOrientation, mergedOrientation === 'vertical'];
   }, [legacyDirection, orientation, vertical]);
-}
+};

components/_util/hooks/usePatchElement.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 
-export default function usePatchElement(): [
+export const usePatchElement = (): [
   React.ReactElement[],
   (element: React.ReactElement) => () => void,
-] {
+] => {
   const [elements, setElements] = React.useState<React.ReactElement[]>([]);
 
   const patchElement = React.useCallback((element: React.ReactElement) => {
@@ -18,4 +18,4 @@ export default function usePatchElement(): [
   }, []);
 
   return [elements, patchElement];
-}
+};

components/_util/hooks/useProxyImperativeHandle.ts

@@ -4,10 +4,10 @@
 import { useImperativeHandle } from 'react';
 import type { Ref } from 'react';
 
-function fillProxy(
+const fillProxy = (
   element: HTMLElement & { _antProxy?: Record<string, any> },
   handler: Record<string, any>,
-) {
+) => {
   element._antProxy = element._antProxy || {};
 
   Object.keys(handler).forEach((key) => {
@@ -20,12 +20,15 @@ function fillProxy(
   });
 
   return element;
-}
+};
 
-export default function useProxyImperativeHandle<
+export const useProxyImperativeHandle = <
   NativeELementType extends HTMLElement,
   ReturnRefType extends { nativeElement: NativeELementType },
->(ref: Ref<any> | undefined, init: () => ReturnRefType) {
+>(
+  ref: Ref<any> | undefined,
+  init: () => ReturnRefType,
+) => {
   return useImperativeHandle(ref, () => {
     const refObj = init();
     const { nativeElement } = refObj;
@@ -45,4 +48,4 @@ export default function useProxyImperativeHandle<
     // Fallback of IE
     return fillProxy(nativeElement, refObj);
   });
-}
+};

components/_util/hooks/useSyncState.ts

@@ -1,19 +1,17 @@
 import * as React from 'react';
 
-import useForceUpdate from './useForceUpdate';
+import { useForceUpdate } from './useForceUpdate';
 
 type UseSyncStateProps<T> = readonly [() => T, (newValue: T) => void];
 
-export default function useSyncState<T>(initialValue: T): UseSyncStateProps<T> {
+export const useSyncState = <T>(initialValue: T): UseSyncStateProps<T> => {
   const ref = React.useRef<T>(initialValue);
-  const forceUpdate = useForceUpdate();
-
+  const [, forceUpdate] = useForceUpdate();
   return [
     () => ref.current,
     (newValue: T) => {
       ref.current = newValue;
-      // re-render
       forceUpdate();
     },
   ] as const;
-}
+};

components/_util/hooks/useZIndex.ts

@@ -50,9 +50,9 @@ export const consumerBaseZIndexOffset: Record<ZIndexConsumer, number> = {
   ImagePreview: 1,
 };
 
-function isContainerType(type: ZIndexContainer | ZIndexConsumer): type is ZIndexContainer {
+const isContainerType = (type: ZIndexContainer | ZIndexConsumer): type is ZIndexContainer => {
   return type in containerBaseZIndexOffset;
-}
+};
 
 type ReturnResult = [zIndex: number | undefined, contextZIndex: number];
 

components/alert/Alert.tsx

@@ -10,9 +10,8 @@ import pickAttrs from '@rc-component/util/lib/pickAttrs';
 import { composeRef } from '@rc-component/util/lib/ref';
 import { clsx } from 'clsx';
 
-import type { ClosableType } from '../_util/hooks/useClosable';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import type { ClosableType, SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
+import { useMergeSemantic } from '../_util/hooks';
 import { replaceElement } from '../_util/reactNode';
 import { devUseWarning } from '../_util/warning';
 import { useComponentConfig } from '../config-provider/context';
@@ -287,7 +286,7 @@ const Alert = React.forwardRef<AlertRef, AlertProps>((props, ref) => {
       return contextClosable.closeIcon;
     }
     return contextCloseIcon;
-  }, [closeIcon, closable, closeText, contextCloseIcon]);
+  }, [closeIcon, closable, contextClosable, closeText, contextCloseIcon]);
 
   const mergedAriaProps = React.useMemo<React.AriaAttributes>(() => {
     const merged = closable ?? contextClosable;

components/anchor/Anchor.tsx

@@ -4,13 +4,13 @@ import { clsx } from 'clsx';
 import scrollIntoView from 'scroll-into-view-if-needed';
 
 import getScroll from '../_util/getScroll';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
 import type {
   SemanticClassNames,
   SemanticClassNamesType,
   SemanticStyles,
   SemanticStylesType,
-} from '../_util/hooks/useMergeSemantic';
+} from '../_util/hooks';
+import { useMergeSemantic } from '../_util/hooks';
 import scrollTo from '../_util/scrollTo';
 import { devUseWarning } from '../_util/warning';
 import Affix from '../affix';
@@ -264,7 +264,7 @@ const Anchor: React.FC<AnchorProps> = (props) => {
     );
 
     setCurrentActiveLink(currentActiveLink);
-  }, [dependencyListItem, targetOffset, offsetTop]);
+  }, [links, targetOffset, offsetTop, bounds]);
 
   const handleScrollTo = React.useCallback<(link: string) => void>(
     (link) => {

components/auto-complete/AutoComplete.tsx

@@ -3,13 +3,13 @@ import type { BaseSelectRef } from '@rc-component/select';
 import { omit, toArray } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
 import type {
   SemanticClassNames,
   SemanticClassNamesType,
   SemanticStyles,
   SemanticStylesType,
-} from '../_util/hooks/useMergeSemantic';
+} from '../_util/hooks';
+import { useMergeSemantic } from '../_util/hooks';
 import type { InputStatus } from '../_util/statusUtils';
 import { devUseWarning } from '../_util/warning';
 import type { ConfigConsumerProps } from '../config-provider';

components/badge/Ribbon.tsx

@@ -3,8 +3,8 @@ import { clsx } from 'clsx';
 
 import type { PresetColorType } from '../_util/colors';
 import { isPresetColor } from '../_util/colors';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import type { LiteralUnion } from '../_util/type';
 import { useComponentConfig } from '../config-provider/context';
 import useStyle from './style/ribbon';

components/badge/index.tsx

@@ -5,8 +5,8 @@ import { clsx } from 'clsx';
 
 import type { PresetStatusColorType } from '../_util/colors';
 import { isPresetColor } from '../_util/colors';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { cloneElement } from '../_util/reactNode';
 import type { LiteralUnion } from '../_util/type';
 import { useComponentConfig } from '../config-provider/context';

components/breadcrumb/Breadcrumb.tsx

@@ -3,8 +3,8 @@ import { toArray } from '@rc-component/util';
 import pickAttrs from '@rc-component/util/lib/pickAttrs';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { cloneElement } from '../_util/reactNode';
 import type { AnyObject } from '../_util/type';
 import { devUseWarning } from '../_util/warning';

components/breadcrumb/BreadcrumbContext.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 
 export type SemanticName = 'root' | 'item' | 'separator';
 

components/button/button.tsx

@@ -3,8 +3,8 @@ import { omit, toArray, useComposeRef } from '@rc-component/util';
 import useLayoutEffect from '@rc-component/util/lib/hooks/useLayoutEffect';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import isValidNode from '../_util/isValidNode';
 import { devUseWarning } from '../_util/warning';
 import Wave from '../_util/wave';
@@ -172,7 +172,7 @@ const InternalCompoundedButton = React.forwardRef<
     }
 
     return ['default', 'outlined'];
-  }, [type, color, variant, danger, button?.variant, button?.color]);
+  }, [color, variant, type, danger, button?.color, button?.variant, mergedType]);
 
   const [mergedColor, mergedVariant] = useMemo<ColorVariantPairType>(() => {
     if (ghost && parsedVariant === 'solid') {

components/calendar/generateCalendar.tsx

@@ -6,8 +6,8 @@ import type { CellRenderInfo } from '@rc-component/picker/lib/interface';
 import { useControlledState } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import type { AnyObject } from '../_util/type';
 import { devUseWarning } from '../_util/warning';
 import { useComponentConfig } from '../config-provider/context';

components/card/Card.tsx

@@ -3,8 +3,8 @@ import type { Tab, TabBarExtraContent } from '@rc-component/tabs/lib/interface';
 import { omit, toArray } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import { useComponentConfig } from '../config-provider/context';
 import useSize from '../config-provider/hooks/useSize';

components/card/Meta.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { useComponentConfig } from '../config-provider/context';
 
 export type SemanticName = 'root' | 'section' | 'avatar' | 'title' | 'description';

components/cascader/index.tsx

@@ -11,14 +11,13 @@ import type { Placement } from '@rc-component/select/lib/BaseSelect';
 import { omit } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic, useZIndex } from '../_util/hooks';
 import type {
   SemanticClassNames,
   SemanticClassNamesType,
   SemanticStyles,
   SemanticStylesType,
-} from '../_util/hooks/useMergeSemantic';
-import { useZIndex } from '../_util/hooks/useZIndex';
+} from '../_util/hooks';
 import type { SelectCommonPlacement } from '../_util/motion';
 import { getTransitionName } from '../_util/motion';
 import genPurePanel from '../_util/PurePanel';

components/checkbox/Checkbox.tsx

@@ -4,8 +4,8 @@ import RcCheckbox from '@rc-component/checkbox';
 import { composeRef } from '@rc-component/util/lib/ref';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import Wave from '../_util/wave';
 import { TARGET_CLS } from '../_util/wave/interface';

components/collapse/Collapse.tsx

@@ -6,13 +6,13 @@ import type { CSSMotionProps } from '@rc-component/motion';
 import { omit, toArray } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
 import type {
   SemanticClassNames,
   SemanticClassNamesType,
   SemanticStyles,
   SemanticStylesType,
-} from '../_util/hooks/useMergeSemantic';
+} from '../_util/hooks';
 import initCollapseMotion from '../_util/motion';
 import { cloneElement } from '../_util/reactNode';
 import { devUseWarning } from '../_util/warning';

components/color-picker/ColorPicker.tsx

@@ -3,7 +3,7 @@ import { useControlledState } from '@rc-component/util';
 import { clsx } from 'clsx';
 
 import ContextIsolator from '../_util/ContextIsolator';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
 import genPurePanel from '../_util/PurePanel';
 import { getStatusClassNames } from '../_util/statusUtils';
 import { devUseWarning } from '../_util/warning';

components/color-picker/components/PanelPicker/index.tsx

@@ -4,6 +4,7 @@ import RcColorPicker from '@rc-component/color-picker';
 import type { Color } from '@rc-component/color-picker';
 import useLayoutEffect from '@rc-component/util/lib/hooks/useLayoutEffect';
 
+import { useForceUpdate } from '../../../_util/hooks';
 import Segmented from '../../../segmented';
 import { AggregationColor } from '../../color';
 import { PanelPickerContext } from '../../context';
@@ -70,7 +71,7 @@ const PanelPicker: FC = () => {
     if (!isSingle) {
       setLockedColor(colors[activeIndex]?.color);
     }
-  }, [gradientDragging, activeIndex]);
+  }, [isSingle, colors, gradientDragging, activeIndex]);
 
   const activeColor = React.useMemo(() => {
     if (isSingle) {
@@ -83,11 +84,12 @@ const PanelPicker: FC = () => {
     }
 
     return colors[activeIndex]?.color;
-  }, [value, activeIndex, isSingle, lockedColor, gradientDragging]);
+  }, [colors, value, activeIndex, isSingle, lockedColor, gradientDragging]);
 
   // ========================= Picker Color =========================
   const [pickerColor, setPickerColor] = React.useState<AggregationColor | null>(activeColor);
-  const [forceSync, setForceSync] = React.useState(0);
+
+  const [forceSync, setForceSync] = useForceUpdate();
 
   const mergedPickerColor = pickerColor?.equals(activeColor) ? activeColor : pickerColor;
 
@@ -148,7 +150,7 @@ const PanelPicker: FC = () => {
     // Back of origin color in case in controlled
     // This will set after `onChangeComplete` to avoid `setState` trigger rerender
     // which will make `fillColor` get wrong `color.cleared` state
-    setForceSync((ori) => ori + 1);
+    setForceSync();
   };
 
   const onInputChange = (colorValue: AggregationColor) => {

components/color-picker/interface.ts

@@ -9,7 +9,7 @@ import type {
   SemanticClassNamesType,
   SemanticStyles,
   SemanticStylesType,
-} from '../_util/hooks/useMergeSemantic';
+} from '../_util/hooks';
 import type { SizeType } from '../config-provider/SizeContext';
 import type { PopoverProps } from '../popover';
 import type { TooltipPlacement } from '../tooltip';

components/config-provider/__tests__/style.test.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import Masonry from 'antd/es/masonry';
 
 import ConfigProvider from '..';
-import type { SemanticClassNames, SemanticStyles } from '../../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../../_util/hooks';
 import { fireEvent, render } from '../../../tests/utils';
 import Alert from '../../alert';
 import Anchor from '../../anchor';

components/config-provider/context.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import type { MaskType } from '../_util/hooks/useMergedMask';
+import type { MaskType } from '../_util/hooks';
 import type { AnyObject } from '../_util/type';
 import type { WarningContextProps } from '../_util/warning';
 import type { ShowWaveEffect } from '../_util/wave/interface';

components/date-picker/generatePicker/generateRangePicker.tsx

@@ -7,7 +7,7 @@ import type { GenerateConfig } from '@rc-component/picker/lib/generate/index';
 import { clsx } from 'clsx';
 
 import ContextIsolator from '../../_util/ContextIsolator';
-import { useZIndex } from '../../_util/hooks/useZIndex';
+import { useZIndex } from '../../_util/hooks';
 import { getMergedStatus, getStatusClassNames } from '../../_util/statusUtils';
 import type { AnyObject } from '../../_util/type';
 import { devUseWarning } from '../../_util/warning';

components/date-picker/generatePicker/generateSinglePicker.tsx

@@ -7,7 +7,7 @@ import type { PickerMode } from '@rc-component/picker/lib/interface';
 import { clsx } from 'clsx';
 
 import ContextIsolator from '../../_util/ContextIsolator';
-import { useZIndex } from '../../_util/hooks/useZIndex';
+import { useZIndex } from '../../_util/hooks';
 import { getMergedStatus, getStatusClassNames } from '../../_util/statusUtils';
 import type { AnyObject } from '../../_util/type';
 import { devUseWarning } from '../../_util/warning';

components/date-picker/generatePicker/interface.ts

@@ -14,7 +14,7 @@ import type {
   SemanticClassNamesType,
   SemanticStyles,
   SemanticStylesType,
-} from '../../_util/hooks/useMergeSemantic';
+} from '../../_util/hooks';
 import type { InputStatus } from '../../_util/statusUtils';
 import type { AnyObject } from '../../_util/type';
 import type { Variant } from '../../config-provider';

components/date-picker/hooks/useMergedPickerSemantic.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../../_util/hooks';
 import type { AnyObject } from '../../_util/type';
 import { useComponentConfig } from '../../config-provider/context';
 import type { RequiredSemanticPicker } from '../generatePicker/interface';

components/descriptions/Cell.tsx

@@ -3,8 +3,8 @@ import type { JSX } from 'react';
 import { clsx } from 'clsx';
 
 import type { DescriptionsClassNamesType, DescriptionsStylesType } from '.';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import DescriptionsContext from './DescriptionsContext';
 import type { SemanticName } from './DescriptionsContext';
 

components/descriptions/DescriptionsContext.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 
 export type SemanticName = 'label' | 'content';
 

components/descriptions/Item.ts

@@ -1,6 +1,6 @@
 import type * as React from 'react';
 
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import type { Breakpoint } from '../_util/responsiveObserver';
 
 type SemanticName = 'label' | 'content';

components/descriptions/index.tsx

@@ -2,8 +2,8 @@
 import * as React from 'react';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import type { Breakpoint } from '../_util/responsiveObserver';
 import { matchScreen } from '../_util/responsiveObserver';
 import { devUseWarning } from '../_util/warning';

components/divider/__tests__/index.test.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { ConfigProvider } from 'antd';
 
 import Divider from '..';
-import type { Orientation } from '../../_util/hooks/useOrientation';
+import type { Orientation } from '../../_util/hooks';
 import mountTest from '../../../tests/shared/mountTest';
 import { render } from '../../../tests/utils';
 import type { TitlePlacement } from '../index';

components/divider/index.tsx

@@ -1,10 +1,8 @@
 import * as React from 'react';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
-import useOrientation from '../_util/hooks/useOrientation';
-import type { Orientation } from '../_util/hooks/useOrientation';
+import { useMergeSemantic, useOrientation } from '../_util/hooks';
+import type { Orientation, SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import { useComponentConfig } from '../config-provider/context';
 import useSize from '../config-provider/hooks/useSize';

components/drawer/DrawerPanel.tsx

@@ -3,10 +3,8 @@ import type { DrawerProps as RCDrawerProps } from '@rc-component/drawer';
 import { clsx } from 'clsx';
 
 import type { DrawerProps } from '.';
-import useClosable, { pickClosable } from '../_util/hooks/useClosable';
-import type { ClosableType } from '../_util/hooks/useClosable';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
+import { pickClosable, useClosable, useMergeSemantic } from '../_util/hooks';
+import type { ClosableType, SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { useComponentConfig } from '../config-provider/context';
 import Skeleton from '../skeleton';
 

components/drawer/__tests__/Drawer.test.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 
 import type { DrawerProps } from '..';
 import Drawer from '..';
-import type { MaskType } from '../../_util/hooks/useMergedMask';
+import type { MaskType } from '../../_util/hooks';
 import { resetWarned } from '../../_util/warning';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';

components/drawer/index.tsx

@@ -7,10 +7,8 @@ import { composeRef } from '@rc-component/util/lib/ref';
 import { clsx } from 'clsx';
 
 import ContextIsolator from '../_util/ContextIsolator';
-import type { MaskType } from '../_util/hooks/useMergedMask';
-import useMergedMask from '../_util/hooks/useMergedMask';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import { useZIndex } from '../_util/hooks/useZIndex';
+import { useMergedMask, useMergeSemantic, useZIndex } from '../_util/hooks';
+import type { MaskType } from '../_util/hooks';
 import { getTransitionName } from '../_util/motion';
 import { devUseWarning } from '../_util/warning';
 import zIndexContext from '../_util/zindexContext';

components/dropdown/dropdown.tsx

@@ -7,9 +7,8 @@ import type { AlignType } from '@rc-component/trigger';
 import { omit, useControlledState, useEvent } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
-import { useZIndex } from '../_util/hooks/useZIndex';
+import { useMergeSemantic, useZIndex } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import isPrimitive from '../_util/isPrimitive';
 import type { AdjustOverflow } from '../_util/placements';
 import getPlacements from '../_util/placements';

components/empty/index.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import { useComponentConfig } from '../config-provider/context';
 import { useLocale } from '../locale';

components/flex/index.tsx

@@ -3,7 +3,7 @@ import { omit } from '@rc-component/util';
 import { clsx } from 'clsx';
 
 import { isPresetSize } from '../_util/gapSize';
-import useOrientation from '../_util/hooks/useOrientation';
+import { useOrientation } from '../_util/hooks';
 import { ConfigContext } from '../config-provider';
 import type { ConfigConsumerProps } from '../config-provider';
 import type { FlexProps } from './interface';

components/flex/interface.ts

@@ -1,6 +1,6 @@
 import type React from 'react';
 
-import type { Orientation } from '../_util/hooks/useOrientation';
+import type { Orientation } from '../_util/hooks';
 import type { AnyObject, CustomComponent } from '../_util/type';
 import type { SizeType } from '../config-provider/SizeContext';
 

components/float-button/FloatButton.tsx

@@ -4,9 +4,8 @@ import { omit } from '@rc-component/util';
 import { clsx } from 'clsx';
 
 import convertToTooltipProps from '../_util/convertToTooltipProps';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
-import { useZIndex } from '../_util/hooks/useZIndex';
+import { useMergeSemantic, useZIndex } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import Badge from '../badge';
 import type { BadgeProps } from '../badge';

components/float-button/FloatButtonGroup.tsx

@@ -5,9 +5,8 @@ import CSSMotion from '@rc-component/motion';
 import { useControlledState, useEvent } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
-import { useZIndex } from '../_util/hooks/useZIndex';
+import { useMergeSemantic, useZIndex } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import { useComponentConfig } from '../config-provider/context';
 import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';

components/float-button/__tests__/semantic.test.tsx

@@ -3,7 +3,7 @@ import type { GetProp } from 'antd/es/_util/type';
 
 import FloatButton from '..';
 import type { FloatButtonGroupProps, FloatButtonProps } from '..';
-import type { SemanticClassNames } from '../../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames } from '../../_util/hooks';
 import { render } from '../../../tests/utils';
 import type { FloatButtonSemanticName } from '../FloatButton';
 

components/form/Form.tsx

@@ -8,8 +8,8 @@ import type {
 } from '@rc-component/form/lib/interface';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import type { Variant } from '../config-provider';
 import { useComponentConfig } from '../config-provider/context';
 import DisabledContext, { DisabledContextProvider } from '../config-provider/DisabledContext';

components/form/context.tsx

@@ -5,7 +5,7 @@ import type { FormProviderProps as RcFormProviderProps } from '@rc-component/for
 import type { Meta } from '@rc-component/form/lib/interface';
 import { omit } from '@rc-component/util';
 
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import type { Variant } from '../config-provider';
 import type { ColProps } from '../grid/col';
 import type { FormInstance, FormLayout, FormSemanticName, RequiredMark } from './Form';

components/grid/hooks/useBreakpoint.tsx

@@ -1,7 +1,7 @@
 import { useRef } from 'react';
 import useLayoutEffect from '@rc-component/util/lib/hooks/useLayoutEffect';
 
-import useForceUpdate from '../../_util/hooks/useForceUpdate';
+import { useForceUpdate } from '../../_util/hooks';
 import type { ScreenMap } from '../../_util/responsiveObserver';
 import useResponsiveObserver from '../../_util/responsiveObserver';
 
@@ -13,7 +13,7 @@ function useBreakpoint(
   defaultScreens: ScreenMap | null = {} as ScreenMap,
 ): ScreenMap | null {
   const screensRef = useRef<ScreenMap | null>(defaultScreens);
-  const forceUpdate = useForceUpdate();
+  const [, forceUpdate] = useForceUpdate();
   const responsiveObserver = useResponsiveObserver();
 
   useLayoutEffect(() => {

components/image/PreviewGroup.tsx

@@ -11,8 +11,8 @@ import RcImage from '@rc-component/image';
 import { clsx } from 'clsx';
 
 import type { DeprecatedPreviewConfig, ImageClassNamesType, ImageStylesType } from '.';
-import type { MaskType } from '../_util/hooks/useMergedMask';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { MaskType } from '../_util/hooks';
 import type { GetProps } from '../_util/type';
 import { useComponentConfig } from '../config-provider/context';
 import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';
@@ -103,6 +103,7 @@ const InternalPreviewGroup: React.FC<PreviewGroupProps> = ({
     getContextPopupContainer,
     icons,
   );
+
   const { mask: mergedMask, blurClassName } = mergedPreview ?? {};
 
   // =========== Merged Props for Semantic ===========

components/image/__tests__/index.test.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { Modal } from 'antd';
 
 import Image from '..';
-import type { MaskType } from '../../_util/hooks/useMergedMask';
+import type { MaskType } from '../../_util/hooks';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
 import { fireEvent, render } from '../../../tests/utils';

components/image/hooks/useMergedPreviewConfig.ts

@@ -2,13 +2,12 @@ import React from 'react';
 import { clsx } from 'clsx';
 
 import type { PreviewConfig } from '..';
-import useMergedMask from '../../_util/hooks/useMergedMask';
-import type { MaskType } from '../../_util/hooks/useMergedMask';
-import { useZIndex } from '../../_util/hooks/useZIndex';
+import { useMergedMask, useZIndex } from '../../_util/hooks';
+import type { MaskType } from '../../_util/hooks';
 import { getTransitionName } from '../../_util/motion';
 import type { GroupPreviewConfig } from '../PreviewGroup';
 
-export default function useMergedPreviewConfig<T extends PreviewConfig | GroupPreviewConfig>(
+const useMergedPreviewConfig = <T extends PreviewConfig | GroupPreviewConfig>(
   previewConfig: T,
   contextPreviewConfig: T,
   prefixCls: string,
@@ -16,9 +15,7 @@ export default function useMergedPreviewConfig<T extends PreviewConfig | GroupPr
   getContextPopupContainer: PreviewConfig['getContainer'],
   icons: PreviewConfig['icons'],
   defaultCover?: React.ReactNode,
-): T & {
-  blurClassName?: string;
-} {
+): T & { blurClassName?: string } => {
   const [zIndex] = useZIndex('ImagePreview', previewConfig?.zIndex);
   const [mergedPreviewMask, blurClassName] = useMergedMask(
     previewConfig?.mask as MaskType,
@@ -62,4 +59,6 @@ export default function useMergedPreviewConfig<T extends PreviewConfig | GroupPr
     mergedPreviewMask,
     blurClassName,
   ]);
-}
+};
+
+export default useMergedPreviewConfig;

components/image/hooks/usePreviewConfig.ts

@@ -1,7 +1,7 @@
 import { isValidElement, useMemo } from 'react';
 
 import type { PreviewConfig } from '..';
-import type { MaskType } from '../../_util/hooks/useMergedMask';
+import type { MaskType } from '../../_util/hooks';
 import { devUseWarning } from '../../_util/warning';
 import type { GroupPreviewConfig } from '../PreviewGroup';
 

components/image/index.tsx

@@ -3,14 +3,14 @@ import RcImage from '@rc-component/image';
 import type { ImageProps as RcImageProps } from '@rc-component/image';
 import { clsx } from 'clsx';
 
-import type { MaskType } from '../_util/hooks/useMergedMask';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
 import type {
+  MaskType,
   SemanticClassNames,
   SemanticClassNamesType,
   SemanticStyles,
   SemanticStylesType,
-} from '../_util/hooks/useMergeSemantic';
+} from '../_util/hooks';
+import { useMergeSemantic } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import { useComponentConfig } from '../config-provider/context';
 import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';

components/input-number/index.tsx

@@ -6,8 +6,8 @@ import RcInputNumber from '@rc-component/input-number';
 import { clsx } from 'clsx';
 
 import ContextIsolator from '../_util/ContextIsolator';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import type { InputStatus } from '../_util/statusUtils';
 import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
 import { devUseWarning } from '../_util/warning';

components/input/Input.tsx

@@ -8,8 +8,8 @@ import { clsx } from 'clsx';
 
 import ContextIsolator from '../_util/ContextIsolator';
 import getAllowClear from '../_util/getAllowClear';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import type { InputStatus } from '../_util/statusUtils';
 import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
 import { devUseWarning } from '../_util/warning';

components/input/OTP/index.tsx

@@ -3,11 +3,8 @@ import { useEvent } from '@rc-component/util';
 import pickAttrs from '@rc-component/util/lib/pickAttrs';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../../_util/hooks/useMergeSemantic';
-import type {
-  SemanticClassNamesType,
-  SemanticStylesType,
-} from '../../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../../_util/hooks';
 import { getMergedStatus } from '../../_util/statusUtils';
 import type { InputStatus } from '../../_util/statusUtils';
 import { devUseWarning } from '../../_util/warning';

components/input/Search.tsx

@@ -3,13 +3,13 @@ import SearchOutlined from '@ant-design/icons/SearchOutlined';
 import { composeRef } from '@rc-component/util/lib/ref';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
 import type {
   SemanticClassNames,
   SemanticClassNamesType,
   SemanticStyles,
   SemanticStylesType,
-} from '../_util/hooks/useMergeSemantic';
+} from '../_util/hooks';
 import { cloneElement } from '../_util/reactNode';
 import Button from '../button';
 import type { ButtonSemanticName } from '../button/button';

components/input/TextArea.tsx

@@ -8,8 +8,8 @@ import RcTextArea from '@rc-component/textarea';
 import { clsx } from 'clsx';
 
 import getAllowClear from '../_util/getAllowClear';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import type { InputStatus } from '../_util/statusUtils';
 import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
 import { devUseWarning } from '../_util/warning';

components/list/Item.tsx

@@ -3,7 +3,7 @@ import React, { useContext } from 'react';
 import { toArray } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import { cloneElement } from '../_util/reactNode';
 import { ConfigContext } from '../config-provider';
 import { Col } from '../grid';

components/masonry/Masonry.tsx

@@ -7,8 +7,8 @@ import isEqual from '@rc-component/util/lib/isEqual';
 import { composeRef } from '@rc-component/util/lib/ref';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { responsiveArray } from '../_util/responsiveObserver';
 import type { Breakpoint } from '../_util/responsiveObserver';
 import { useComponentConfig } from '../config-provider/context';

components/mentions/index.tsx

@@ -9,8 +9,8 @@ import { composeRef } from '@rc-component/util/lib/ref';
 import { clsx } from 'clsx';
 
 import getAllowClear from '../_util/getAllowClear';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import genPurePanel from '../_util/PurePanel';
 import type { InputStatus } from '../_util/statusUtils';
 import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';

components/menu/MenuContext.tsx

@@ -1,6 +1,6 @@
 import { createContext } from 'react';
 
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import type { DirectionType } from '../config-provider';
 import type { SemanticName, SubMenuSemanticName } from './menu';
 

components/menu/SubMenu.tsx

@@ -3,7 +3,7 @@ import { SubMenu as RcSubMenu, useFullPath } from '@rc-component/menu';
 import { omit } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import { useZIndex } from '../_util/hooks/useZIndex';
+import { useZIndex } from '../_util/hooks';
 import { cloneElement } from '../_util/reactNode';
 import type { SubMenuType } from './interface';
 import type { MenuContextProps } from './MenuContext';

components/menu/menu.tsx

@@ -6,8 +6,8 @@ import RcMenu from '@rc-component/menu';
 import { omit, useEvent } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import initCollapseMotion from '../_util/motion';
 import { cloneElement } from '../_util/reactNode';
 import type { GetProp } from '../_util/type';

components/message/PurePanel.tsx

@@ -8,8 +8,8 @@ import { Notice } from '@rc-component/notification';
 import type { NoticeProps } from '@rc-component/notification/lib/Notice';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import { cloneElement } from '../_util/reactNode';
 import { useComponentConfig } from '../config-provider/context';
 import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';

components/message/interface.ts

@@ -1,6 +1,6 @@
 import type * as React from 'react';
 
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 
 export type NoticeType = 'info' | 'success' | 'error' | 'warning' | 'loading';
 

components/message/style/index.ts

@@ -2,7 +2,7 @@ import type { CSSProperties } from 'react';
 import type { CSSObject } from '@ant-design/cssinjs';
 import { Keyframes } from '@ant-design/cssinjs';
 
-import { CONTAINER_MAX_OFFSET } from '../../_util/hooks/useZIndex';
+import { CONTAINER_MAX_OFFSET } from '../../_util/hooks';
 import { resetComponent } from '../../style';
 import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';
 import { genStyleHooks, mergeToken } from '../../theme/internal';

components/message/useMessage.tsx

@@ -13,8 +13,8 @@ import useMergeSemantic, {
   mergeClassNames,
   mergeStyles,
   resolveStyleOrClass,
-} from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+} from '../_util/hooks';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import { ConfigContext } from '../config-provider';
 import { useComponentConfig } from '../config-provider/context';

components/modal/ConfirmDialog.tsx

@@ -5,7 +5,7 @@ import ExclamationCircleFilled from '@ant-design/icons/ExclamationCircleFilled';
 import InfoCircleFilled from '@ant-design/icons/InfoCircleFilled';
 import { clsx } from 'clsx';
 
-import { CONTAINER_MAX_OFFSET } from '../_util/hooks/useZIndex';
+import { CONTAINER_MAX_OFFSET } from '../_util/hooks';
 import { getTransitionName } from '../_util/motion';
 import { devUseWarning } from '../_util/warning';
 import type { ThemeConfig } from '../config-provider';

components/modal/Modal.tsx

@@ -5,10 +5,13 @@ import { composeRef } from '@rc-component/util/lib/ref';
 import { clsx } from 'clsx';
 
 import ContextIsolator from '../_util/ContextIsolator';
-import useClosable, { pickClosable } from '../_util/hooks/useClosable';
-import useMergedMask from '../_util/hooks/useMergedMask';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import { useZIndex } from '../_util/hooks/useZIndex';
+import {
+  pickClosable,
+  useClosable,
+  useMergedMask,
+  useMergeSemantic,
+  useZIndex,
+} from '../_util/hooks';
 import { getTransitionName } from '../_util/motion';
 import type { Breakpoint } from '../_util/responsiveObserver';
 import { canUseDocElement } from '../_util/styleChecker';

components/modal/__tests__/Modal.test.tsx

@@ -2,7 +2,7 @@ import React, { useEffect } from 'react';
 
 import type { ModalProps } from '..';
 import Modal from '..';
-import type { MaskType } from '../../_util/hooks/useMergedMask';
+import type { MaskType } from '../../_util/hooks';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
 import { act, createEvent, fireEvent, render, waitFakeTimer } from '../../../tests/utils';

components/modal/interface.ts

@@ -1,9 +1,12 @@
 import type React from 'react';
 import type { DialogProps } from '@rc-component/dialog';
 
-import type { ClosableType } from '../_util/hooks/useClosable';
-import type { MaskType } from '../_util/hooks/useMergedMask';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import type {
+  ClosableType,
+  MaskType,
+  SemanticClassNamesType,
+  SemanticStylesType,
+} from '../_util/hooks';
 import type { Breakpoint } from '../_util/responsiveObserver';
 import type { ButtonProps, LegacyButtonType } from '../button/button';
 import type { DirectionType } from '../config-provider';

components/modal/useModal/index.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import usePatchElement from '../../_util/hooks/usePatchElement';
+import { usePatchElement } from '../../_util/hooks';
 import type { ModalFunc, ModalStaticFunctions } from '../confirm';
 import { withConfirm, withError, withInfo, withSuccess, withWarn } from '../confirm';
 import destroyFns from '../destroyFns';

components/notification/PurePanel.tsx

@@ -9,14 +9,13 @@ import { Notice } from '@rc-component/notification';
 import type { NoticeProps } from '@rc-component/notification/lib/Notice';
 import { clsx } from 'clsx';
 
-import useClosable, { pickClosable } from '../_util/hooks/useClosable';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
+import { pickClosable, useClosable, useMergeSemantic } from '../_util/hooks';
 import type {
   SemanticClassNames,
   SemanticClassNamesType,
   SemanticStyles,
   SemanticStylesType,
-} from '../_util/hooks/useMergeSemantic';
+} from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import { ConfigContext } from '../config-provider';
 import { useComponentConfig } from '../config-provider/context';

components/notification/interface.ts

@@ -1,7 +1,6 @@
 import type * as React from 'react';
 
-import type { ClosableType } from '../_util/hooks/useClosable';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import type { ClosableType, SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 
 interface DivProps extends React.HTMLProps<HTMLDivElement> {
   'data-testid'?: string;

components/notification/style/index.ts

@@ -1,7 +1,7 @@
 import type { CSSObject } from '@ant-design/cssinjs';
 import { Keyframes, unit } from '@ant-design/cssinjs';
 
-import { CONTAINER_MAX_OFFSET } from '../../_util/hooks/useZIndex';
+import { CONTAINER_MAX_OFFSET } from '../../_util/hooks';
 import { genFocusStyle, resetComponent } from '../../style';
 import type { AliasToken, FullToken, GenerateStyle, GenStyleFn } from '../../theme/internal';
 import { genStyleHooks, mergeToken } from '../../theme/internal';

components/notification/useNotification.tsx

@@ -10,13 +10,15 @@ import type {
 } from '@rc-component/notification';
 import { clsx } from 'clsx';
 
-import { computeClosable, pickClosable } from '../_util/hooks/useClosable';
-import useMergeSemantic, {
+import {
+  computeClosable,
   mergeClassNames,
   mergeStyles,
+  pickClosable,
   resolveStyleOrClass,
-} from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+  useMergeSemantic,
+} from '../_util/hooks';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import { ConfigContext } from '../config-provider';
 import { useComponentConfig } from '../config-provider/context';

components/pagination/Pagination.tsx

@@ -11,8 +11,8 @@ import RcPagination from '@rc-component/pagination';
 import enUS from '@rc-component/pagination/lib/locale/en_US';
 import { clsx } from 'clsx';
 
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import { useComponentConfig } from '../config-provider/context';
 import useSize from '../config-provider/hooks/useSize';

components/popconfirm/PurePanel.tsx

@@ -5,7 +5,7 @@ import { clsx } from 'clsx';
 import type { PopconfirmProps } from '.';
 import ActionButton from '../_util/ActionButton';
 import { getRenderPropValue } from '../_util/getRenderPropValue';
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import Button from '../button';
 import { convertLegacyProps } from '../button/buttonHelpers';
 import { ConfigContext } from '../config-provider';

components/popconfirm/index.tsx

@@ -4,8 +4,8 @@ import { omit, useControlledState } from '@rc-component/util';
 import { clsx } from 'clsx';
 
 import type { RenderFunction } from '../_util/getRenderPropValue';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
+import { useMergeSemantic } from '../_util/hooks';
 import type { ButtonProps, LegacyButtonType } from '../button/button';
 import { useComponentConfig } from '../config-provider/context';
 import type { PopoverProps, PopoverSemanticName } from '../popover';

components/popover/PurePanel.tsx

@@ -9,8 +9,8 @@ import type {
   PopoverStylesType,
 } from '.';
 import { getRenderPropValue } from '../_util/getRenderPropValue';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import { useMergeSemantic } from '../_util/hooks';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import { ConfigContext } from '../config-provider';
 import useStyle from './style';
 

components/popover/index.tsx

@@ -6,8 +6,8 @@ import { clsx } from 'clsx';
 
 import type { RenderFunction } from '../_util/getRenderPropValue';
 import { getRenderPropValue } from '../_util/getRenderPropValue';
-import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks/useMergeSemantic';
-import useMergeSemantic from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNamesType, SemanticStylesType } from '../_util/hooks';
+import { useMergeSemantic } from '../_util/hooks';
 import { getTransitionName } from '../_util/motion';
 import { cloneElement } from '../_util/reactNode';
 import { useComponentConfig } from '../config-provider/context';

components/progress/Circle.tsx

@@ -4,7 +4,7 @@ import { Circle as RCCircle } from '@rc-component/progress';
 import { omit } from '@rc-component/util';
 import { clsx } from 'clsx';
 
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import { useComponentConfig } from '../config-provider/context';
 import Tooltip from '../tooltip';
 import type { GapPosition, ProgressGradient, ProgressProps, SemanticName } from './progress';

components/progress/Line.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { presetPrimaryColors } from '@ant-design/colors';
 import { clsx } from 'clsx';
 
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import { devUseWarning } from '../_util/warning';
 import type { DirectionType } from '../config-provider';
 import type {

components/progress/Steps.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { clsx } from 'clsx';
 
-import type { SemanticClassNames, SemanticStyles } from '../_util/hooks/useMergeSemantic';
+import type { SemanticClassNames, SemanticStyles } from '../_util/hooks';
 import type { ProgressProps, SemanticName } from './progress';
 import { getSize } from './utils';