refactor: migrate to @rc-component namespace and update dependencies

docs/examples/base.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 import React, { useState } from 'react';
-import Drawer from 'rc-drawer';
+import Drawer from '@rc-component/drawer';
 import motionProps from './motion';
 
 const Demo = () => {

docs/examples/bodyProps.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 import React, { useState } from 'react';
-import Drawer from 'rc-drawer';
+import Drawer from '@rc-component/drawer';
 import motionProps from './motion';
 
 const Demo = () => {

docs/examples/change-remove.tsx

@@ -6,7 +6,7 @@ import {
 import { Menu } from 'antd';
 import * as React from 'react';
 
-import Drawer from 'rc-drawer';
+import Drawer from '@rc-component/drawer';
 
 import '../../assets/index.less';
 import './assets/index.less';

docs/examples/change.tsx

@@ -6,7 +6,7 @@ import {
 import { Menu } from 'antd';
 import * as React from 'react';
 
-import Drawer from 'rc-drawer';
+import Drawer from '@rc-component/drawer';
 
 import 'antd/lib/menu/style';
 import 'antd/lib/style';

docs/examples/forceRender.tsx

@@ -1,7 +1,7 @@
 import { Button } from 'antd';
 import * as React from 'react';
 
-import Drawer from 'rc-drawer';
+import Drawer from '@rc-component/drawer';
 
 import 'antd/lib/button/style';
 import 'antd/lib/menu/style';

docs/examples/getContainer-false.tsx

@@ -6,7 +6,7 @@ import {
 import { Menu } from 'antd';
 import * as React from 'react';
 
-import Drawer from 'rc-drawer';
+import Drawer from '@rc-component/drawer';
 
 import 'antd/lib/menu/style';
 import 'antd/lib/style';

docs/examples/getContainer.tsx

@@ -6,7 +6,7 @@ import {
 import { Menu } from 'antd';
 import * as React from 'react';
 
-import Drawer from 'rc-drawer';
+import Drawer from '@rc-component/drawer';
 
 import 'antd/lib/menu/style';
 import 'antd/lib/style';

docs/examples/motion.ts

@@ -1,4 +1,4 @@
-import type { DrawerProps } from 'rc-drawer';
+import type { DrawerProps } from '@rc-component/drawer';
 import './assets/motion.less';
 
 export const maskMotion: DrawerProps['maskMotion'] = {

docs/examples/multiple.tsx

@@ -2,7 +2,7 @@
 import { Button } from 'antd';
 import * as React from 'react';
 
-import Drawer from 'rc-drawer';
+import Drawer from '@rc-component/drawer';
 
 import 'antd/lib/button/style';
 import 'antd/lib/style';

docs/examples/no-mask.tsx

@@ -6,7 +6,7 @@ import {
 import { Menu } from 'antd';
 import * as React from 'react';
 
-import Drawer from 'rc-drawer';
+import Drawer from '@rc-component/drawer';
 
 import 'antd/lib/menu/style';
 import 'antd/lib/style';

docs/examples/placement.tsx

@@ -6,7 +6,7 @@ import {
 import { Menu, Select } from 'antd';
 import * as React from 'react';
 
-import Drawer from 'rc-drawer';
+import Drawer from '@rc-component/drawer';
 
 import 'antd/lib/button/style';
 import 'antd/lib/menu/style';

package.json

@@ -1,6 +1,6 @@
 {
-  "name": "rc-drawer",
-  "version": "8.0.0",
+  "name": "@rc-component/drawer",
+  "version": "1.0.0",
   "description": "drawer component for react",
   "keywords": [
     "react",
@@ -36,29 +36,29 @@
     "compile": "father build && lessc assets/index.less assets/index.css",
     "lint": "eslint src/ --ext .tsx,.ts",
     "now-build": "npm run build",
-    "prepublishOnly": "npm run compile && np --no-cleanup --yolo --no-publish",
+    "prepublishOnly": "npm run compile && rc-np",
     "start": "dumi dev",
     "test": "rc-test",
     "prettier": "prettier --write .",
     "prepare": "husky"
   },
   "dependencies": {
-    "@babel/runtime": "^7.23.9",
-    "@rc-component/portal": "^1.1.1",
-    "classnames": "^2.2.6",
-    "rc-motion": "^2.6.1",
-    "rc-util": "^5.38.1"
+    "@rc-component/motion": "^1.1.4",
+    "@rc-component/portal": "^2.0.0",
+    "@rc-component/util": "^1.2.1",
+    "classnames": "^2.2.6"
   },
   "devDependencies": {
     "@ant-design/icons": "^5.3.0",
     "@rc-component/father-plugin": "^1.0.0",
+    "@rc-component/np": "^1.0.0",
     "@testing-library/jest-dom": "^6.2.0",
     "@testing-library/react": "^14.0.0",
     "@types/classnames": "^2.2.9",
     "@types/jest": "^29.5.11",
     "@types/raf": "^3.4.0",
-    "@types/react": "^18.0.0",
-    "@types/react-dom": "^18.0.0",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
     "@types/warning": "^3.0.0",
     "antd": "^5.12.7",
     "dumi": "^2.2.0",
@@ -70,18 +70,17 @@
     "husky": "^9.0.10",
     "less": "^4.2.0",
     "lint-staged": "^15.2.2",
-    "np": "^9.2.0",
     "prettier": "^3.0.0",
     "rc-test": "^7.0.9",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
     "stylelint": "^16.2.1",
     "stylelint-config-standard-less": "^3.0.1",
     "typescript": "^5.3.3"
   },
   "peerDependencies": {
-    "react": ">=16.9.0",
-    "react-dom": ">=16.9.0"
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
   },
   "lint-staged": {
     "*.{js,jsx,ts,tsx}": "eslint --fix",

src/Drawer.tsx

@@ -1,6 +1,6 @@
 import type { PortalProps } from '@rc-component/portal';
 import Portal from '@rc-component/portal';
-import useLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
+import useLayoutEffect from '@rc-component/util/lib/hooks/useLayoutEffect';
 import * as React from 'react';
 import { RefContext } from './context';
 import type {
@@ -70,9 +70,9 @@ const Drawer: React.FC<DrawerProps> = props => {
   const mergedOpen = mounted ? open : false;
 
   // ============================ Focus =============================
-  const popupRef = React.useRef<HTMLDivElement>();
+  const popupRef = React.useRef<HTMLDivElement>(null);
 
-  const lastActiveRef = React.useRef<HTMLElement>();
+  const lastActiveRef = React.useRef<HTMLElement>(null);
   useLayoutEffect(() => {
     if (mergedOpen) {
       lastActiveRef.current = document.activeElement as HTMLElement;

src/DrawerPanel.tsx

@@ -1,8 +1,8 @@
 import classNames from 'classnames';
 import * as React from 'react';
 import { RefContext } from './context';
-import pickAttrs from 'rc-util/lib/pickAttrs';
-import { useComposeRef } from 'rc-util/lib/ref';
+import pickAttrs from '@rc-component/util/lib/pickAttrs';
+import { useComposeRef } from '@rc-component/util/lib/ref';
 
 export interface DrawerPanelRef {
   focus: VoidFunction;

src/DrawerPopup.tsx

@@ -1,8 +1,8 @@
 import classNames from 'classnames';
-import type { CSSMotionProps } from 'rc-motion';
-import CSSMotion from 'rc-motion';
-import KeyCode from 'rc-util/lib/KeyCode';
-import pickAttrs from 'rc-util/lib/pickAttrs';
+import type { CSSMotionProps } from '@rc-component/motion';
+import CSSMotion from '@rc-component/motion';
+import KeyCode from '@rc-component/util/lib/KeyCode';
+import pickAttrs from '@rc-component/util/lib/pickAttrs';
 import * as React from 'react';
 import type { DrawerContextProps } from './context';
 import DrawerContext from './context';
@@ -126,9 +126,9 @@ function DrawerPopup(props: DrawerPopupProps, ref: React.Ref<HTMLDivElement>) {
   } = props;
 
   // ================================ Refs ================================
-  const panelRef = React.useRef<HTMLDivElement>();
-  const sentinelStartRef = React.useRef<HTMLDivElement>();
-  const sentinelEndRef = React.useRef<HTMLDivElement>();
+  const panelRef = React.useRef<HTMLDivElement>(null);
+  const sentinelStartRef = React.useRef<HTMLDivElement>(null);
+  const sentinelEndRef = React.useRef<HTMLDivElement>(null);
 
   React.useImperativeHandle(ref, () => panelRef.current);
 

src/util.ts

@@ -1,5 +1,5 @@
-import warning from 'rc-util/lib/warning';
-import canUseDom from 'rc-util/lib/Dom/canUseDom';
+import warning from '@rc-component/util/lib/warning';
+import canUseDom from '@rc-component/util/lib/Dom/canUseDom';
 import type { DrawerProps } from './Drawer';
 
 export function parseWidthHeight(value?: number | string) {

tests/index.spec.tsx

@@ -1,6 +1,6 @@
 import { cleanup, fireEvent, render, act } from '@testing-library/react';
-import KeyCode from 'rc-util/lib/KeyCode';
-import { resetWarned } from 'rc-util/lib/warning';
+import KeyCode from '@rc-component/util/lib/KeyCode';
+import { resetWarned } from '@rc-component/util/lib/warning';
 import React from 'react';
 import type { DrawerProps } from '../src';
 import Drawer from '../src';

tests/motion.spec.tsx

@@ -2,8 +2,10 @@ import { render, fireEvent } from '@testing-library/react';
 import React from 'react';
 import Drawer from '../src';
 
-jest.mock('rc-motion', () => {
-  const { genCSSMotion } = jest.requireActual('rc-motion/lib/CSSMotion');
+jest.mock('@rc-component/motion', () => {
+  const { genCSSMotion } = jest.requireActual(
+    '@rc-component/motion/lib/CSSMotion',
+  );
   const CSSMotion = genCSSMotion(true);
   return CSSMotion;
 });

tests/ssr.spec.tsx

@@ -2,12 +2,12 @@ import { render } from '@testing-library/react';
 import { renderToString } from 'react-dom/server';
 import React from 'react';
 import Drawer from '../src';
-// import canUseDom from 'rc-util/lib/Dom/canUseDom'
+// import canUseDom from '@rc-component/util/lib/Dom/canUseDom'
 
 global.canUseDom = true;
 
-jest.mock('rc-util/lib/Dom/canUseDom', () => {
-  // const canUseDom = jest.requireActual('rc-util/lib/Dom/canUseDom');
+jest.mock('@rc-component/util/lib/Dom/canUseDom', () => {
+  // const canUseDom = jest.requireActual('@rc-component/util/lib/Dom/canUseDom');
   return () => global.canUseDom;
 });
 

tsconfig.json

@@ -10,7 +10,7 @@
     "paths": {
       "@/*": ["src/*"],
       "@@/*": ["src/.umi/*"],
-      "rc-drawer": ["src/index.ts"]
+      "@rc-component/drawer": ["src/index.ts"]
     }
   },
   "include": [".dumi/**/*", ".dumirc.ts", "**/*.ts", "**/*.tsx"]

typings/custom.d.ts

@@ -1,14 +1,14 @@
-declare module 'rc-util/lib/KeyCode' {
+declare module '@rc-component/util/lib/KeyCode' {
   const Ret: { ESC: any; TAB: any };
   export default Ret;
 }
 
-declare module 'rc-util/lib/getScrollBarSize' {
+declare module '@rc-component/util/lib/getScrollBarSize' {
   const Ret: (b: boolean) => number;
   export default Ret;
 }
 
-declare module 'rc-util/lib/*' {
+declare module '@rc-component/util/lib/*' {
   const Ret: any;
   export default Ret;
 }