fix: rc-util import logic (#812)

Author: aojunhao123

.gitignore

@@ -40,4 +40,5 @@ pnpm-lock.yaml
 .env.local
 .dumi
 
-bun.lockb
+bun.lockb
+bun.lock

jest.config.js

@@ -8,13 +8,14 @@ const compileModules = [
   'tween-one',
   '@babel',
   '@ant-design',
+  '@rc-component/resize-observer',
 ];
 
 const ignoreList = [];
 
 // cnpm use `_` as prefix
-['', '_'].forEach((prefix) => {
-  compileModules.forEach((module) => {
+['', '_'].forEach(prefix => {
+  compileModules.forEach(module => {
     ignoreList.push(`${prefix}${module}`);
   });
 });

src/TabNavList/OperationNode.tsx

@@ -1,7 +1,7 @@
 import classNames from 'classnames';
 import Dropdown from '@rc-component/dropdown';
 import Menu, { MenuItem } from '@rc-component/menu';
-import KeyCode from 'rc-util/lib/KeyCode';
+import KeyCode from '@rc-component/util/lib/KeyCode';
 import * as React from 'react';
 import { useEffect, useState } from 'react';
 import type { EditableConfig, Tab, TabsLocale, MoreProps } from '../interface';

src/TabNavList/index.tsx

@@ -1,8 +1,7 @@
-/* eslint-disable react-hooks/exhaustive-deps */
 import classNames from 'classnames';
-import ResizeObserver from 'rc-resize-observer';
-import useEvent from 'rc-util/lib/hooks/useEvent';
-import { useComposeRef } from 'rc-util/lib/ref';
+import ResizeObserver from '@rc-component/resize-observer';
+import useEvent from '@rc-component/util/lib/hooks/useEvent';
+import { useComposeRef } from '@rc-component/util/lib/ref';
 import * as React from 'react';
 import { useEffect, useRef, useState } from 'react';
 import TabContext from '../TabContext';

src/Tabs.tsx

@@ -1,7 +1,7 @@
 // Accessibility https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Tab_Role
 import classNames from 'classnames';
-import useMergedState from 'rc-util/lib/hooks/useMergedState';
-import isMobile from 'rc-util/lib/isMobile';
+import useMergedState from '@rc-component/util/lib/hooks/useMergedState';
+import isMobile from '@rc-component/util/lib/isMobile';
 import * as React from 'react';
 import { useEffect, useState } from 'react';
 import TabContext from './TabContext';

src/hooks/useAnimateConfig.ts

@@ -1,4 +1,4 @@
-import warning from 'rc-util/lib/warning';
+import warning from '@rc-component/util/lib/warning';
 import type { TabsProps } from '..';
 import type { AnimatedConfig } from '../interface';
 

src/hooks/useIndicator.ts

@@ -1,4 +1,4 @@
-import raf from 'rc-util/lib/raf';
+import raf from '@rc-component/util/lib/raf';
 import React, { useEffect, useRef, useState } from 'react';
 import type { TabOffset } from '../interface';
 

src/hooks/useUpdate.ts

@@ -1,4 +1,4 @@
-import { useLayoutUpdateEffect } from 'rc-util/lib/hooks/useLayoutEffect';
+import { useLayoutUpdateEffect } from '@rc-component/util/lib/hooks/useLayoutEffect';
 import { useRef, useState } from 'react';
 
 /**

tests/common/util.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-invalid-this */
 import { act } from '@testing-library/react';
-import { _rs as onEsResize } from 'rc-resize-observer/es/utils/observerUtil';
-import { _rs as onLibResize } from 'rc-resize-observer/lib/utils/observerUtil';
+import { _rs as onEsResize } from '@rc-component/resize-observer/es/utils/observerUtil';
+import { _rs as onLibResize } from '@rc-component/resize-observer/lib/utils/observerUtil';
 import React from 'react';
 import Tabs from '../../src';
 import type { TabsProps } from '../../src/Tabs';
@@ -67,18 +67,6 @@ export function getOffsetSizeFunc(info: HackInfo = {}) {
       return this.querySelector('.rc-tabs-nav-add') ? more + add : more;
     }
 
-    // if (this.className.includes('rc-tabs-nav-list')) {
-    //   return info.list || 5 * 20 + 10;
-    // }
-    // if (this.className.includes('rc-tabs-nav-add')) {
-    //   return info.add || 10;
-    // }
-    // if (this.className.includes('rc-tabs-nav-operations')) {
-    //   return info.operation || 10;
-    // }
-    // if (this.className.includes('rc-tabs-nav-more')) {
-    //   return info.more || 10;
-    // }
     if (this.className.includes('rc-tabs-dropdown')) {
       return dropdown;
     }
@@ -158,10 +146,6 @@ export function getTabs(props: TabsProps = null) {
   );
 }
 
-// export function triggerResize(wrapper: ReactWrapper) {
-//   (wrapper.find('.rc-tabs-nav').find('ResizeObserver').first().props() as any).onResize();
-// }
-
 export const triggerResize = (container: Element) => {
   const target = container.querySelector('.rc-tabs-nav');
 

tests/index.test.tsx

@@ -1,6 +1,6 @@
 import '@testing-library/dom';
 import { act, fireEvent, render, screen } from '@testing-library/react';
-import { spyElementPrototypes } from 'rc-util/lib/test/domHook';
+import { spyElementPrototypes } from '@rc-component/util/lib/test/domHook';
 import React from 'react';
 import Tabs from '../src';
 import type { TabsProps } from '../src/Tabs';

tests/mobile.test.tsx

@@ -1,12 +1,12 @@
 import { render } from '@testing-library/react';
-import { spyElementPrototypes } from 'rc-util/lib/test/domHook';
+import { spyElementPrototypes } from '@rc-component/util/lib/test/domHook';
 import React from 'react';
 import { act } from 'react-dom/test-utils';
 import type { TabsProps } from '../src';
 import Tabs from '../src';
 import { btnOffsetPosition, getOffsetSizeFunc, getTransformX } from './common/util';
 
-jest.mock('rc-util/lib/isMobile', () => () => true);
+jest.mock('@rc-component/util/lib/isMobile', () => () => true);
 
 describe('Tabs.Mobile', () => {
   const tabCount = 100;

tests/operation-overflow.test.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-invalid-this */
 import { render } from '@testing-library/react';
-import { spyElementPrototypes } from 'rc-util/lib/test/domHook';
+import { spyElementPrototypes } from '@rc-component/util/lib/test/domHook';
 import { act } from 'react-dom/test-utils';
 import { getOffsetSizeFunc, getTabs, triggerResize } from './common/util';
 

tests/overflow.test.tsx

@@ -1,6 +1,6 @@
 import { act, fireEvent, render } from '@testing-library/react';
-import KeyCode from 'rc-util/lib/KeyCode';
-import { spyElementPrototypes } from 'rc-util/lib/test/domHook';
+import KeyCode from '@rc-component/util/lib/KeyCode';
+import { spyElementPrototypes } from '@rc-component/util/lib/test/domHook';
 import React from 'react';
 import type { TabsProps } from '../src';
 import Tabs from '../src';

tests/rtl.test.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { spyElementPrototypes } from 'rc-util/lib/test/domHook';
+import { spyElementPrototypes } from '@rc-component/util/lib/test/domHook';
 import { act } from 'react-dom/test-utils';
 import { getOffsetSizeFunc, getTabs, getTransformX, triggerResize } from './common/util';