chore: update @rc-component/dropdown

Author: li-jia-nan

.gitignore

@@ -28,6 +28,7 @@ es
 coverage
 yarn.lock
 package-lock.json
+pnpm-lock.yaml
 
 # dumi
 .dumi/tmp

package.json

@@ -1,6 +1,6 @@
 {
-  "name": "rc-dropdown",
-  "version": "4.2.1",
+  "name": "@rc-component/dropdown",
+  "version": "1.0.0",
   "description": "dropdown ui component for react",
   "keywords": [
     "react",
@@ -46,15 +46,16 @@
   "dependencies": {
     "@babel/runtime": "^7.18.3",
     "@rc-component/trigger": "^2.0.0",
-    "classnames": "^2.2.6",
-    "rc-util": "^5.44.1"
+    "@rc-component/util": "^1.2.0",
+    "classnames": "^2.2.6"
   },
   "devDependencies": {
     "@rc-component/father-plugin": "^1.0.0",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^14.0.0",
     "@types/classnames": "^2.2.6",
     "@types/jest": "^29.0.0",
+    "@types/node": "^22.12.0",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "@types/warning": "^3.0.0",

src/Dropdown.tsx

@@ -1,4 +1,4 @@
-import type { TriggerProps } from '@rc-component/trigger';
+import type { TriggerProps, TriggerRef } from '@rc-component/trigger';
 import Trigger from '@rc-component/trigger';
 import type {
   ActionType,
@@ -7,7 +7,7 @@ import type {
   BuildInPlacements,
 } from '@rc-component/trigger/lib/interface';
 import classNames from 'classnames';
-import { composeRef, getNodeRef, supportRef } from 'rc-util/lib/ref';
+import { composeRef, getNodeRef, supportRef } from '@rc-component/util/lib/ref';
 import React from 'react';
 import useAccessibility from './hooks/useAccessibility';
 import Overlay from './Overlay';
@@ -46,7 +46,10 @@ export interface DropdownProps
   autoFocus?: boolean;
 }
 
-function Dropdown(props: DropdownProps, ref) {
+const Dropdown: React.ForwardRefRenderFunction<TriggerRef, DropdownProps> = (
+  props,
+  ref,
+) => {
   const {
     arrow = false,
     prefixCls = 'rc-dropdown',
@@ -72,9 +75,10 @@ function Dropdown(props: DropdownProps, ref) {
   const [triggerVisible, setTriggerVisible] = React.useState<boolean>();
   const mergedVisible = 'visible' in props ? visible : triggerVisible;
 
-  const triggerRef = React.useRef(null);
-  const overlayRef = React.useRef(null);
-  const childRef = React.useRef(null);
+  const triggerRef = React.useRef<TriggerRef>(null);
+  const overlayRef = React.useRef<HTMLElement>(null);
+  const childRef = React.useRef<HTMLElement>(null);
+
   React.useImperativeHandle(ref, () => triggerRef.current);
 
   const handleVisibleChange = (newVisible: boolean) => {
@@ -174,6 +178,6 @@ function Dropdown(props: DropdownProps, ref) {
       {childrenNode}
     </Trigger>
   );
-}
+};
 
 export default React.forwardRef(Dropdown);

src/Overlay.tsx

@@ -1,4 +1,4 @@
-import { composeRef, getNodeRef, supportRef } from 'rc-util/lib/ref';
+import { composeRef, getNodeRef, supportRef } from '@rc-component/util/lib/ref';
 import React, { forwardRef, useMemo } from 'react';
 import type { DropdownProps } from './Dropdown';
 

src/hooks/useAccessibility.ts

@@ -1,6 +1,6 @@
-import KeyCode from "rc-util/lib/KeyCode";
-import raf from "rc-util/lib/raf";
-import * as React from "react";
+import KeyCode from '@rc-component/util/lib/KeyCode';
+import raf from '@rc-component/util/lib/raf';
+import * as React from 'react';
 
 const { ESC, TAB } = KeyCode;
 
@@ -60,13 +60,13 @@ export default function useAccessibility({
 
   React.useEffect(() => {
     if (visible) {
-      window.addEventListener("keydown", handleKeyDown);
+      window.addEventListener('keydown', handleKeyDown);
       if (autoFocus) {
         // FIXME: hack with raf
         raf(focusMenu, 3);
       }
       return () => {
-        window.removeEventListener("keydown", handleKeyDown);
+        window.removeEventListener('keydown', handleKeyDown);
         focusMenuRef.current = false;
       };
     }

tests/basic.test.tsx

@@ -3,7 +3,7 @@ import { act, fireEvent } from '@testing-library/react';
 import type { MenuRef } from 'rc-menu';
 import Menu, { Divider, Item as MenuItem } from 'rc-menu';
 import { _rs } from 'rc-resize-observer';
-import { spyElementPrototypes } from 'rc-util/lib/test/domHook';
+import { spyElementPrototypes } from '@rc-component/util/lib/test/domHook';
 import type { HTMLAttributes } from 'react';
 import * as React from 'react';
 import { createRef, forwardRef, useImperativeHandle } from 'react';

tests/utils.js tests/utils.tstests/utils.js renamed to tests/utils.ts

@@ -11,7 +11,7 @@ export async function sleep(timeout = 0) {
   });
 }
 
-function customRender(ui, options) {
+function customRender(ui: any, options: any = {}) {
   return render(ui, { wrapper: StrictMode, ...options });
 }