diff --git a/.gitignore b/.gitignore index 0a00254..e1166b3 100644 --- a/.gitignore +++ b/.gitignore @@ -28,6 +28,7 @@ es coverage yarn.lock package-lock.json +pnpm-lock.yaml # dumi .dumi/tmp diff --git a/package.json b/package.json index 91f30fa..8b52520 100644 --- a/package.json +++ b/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,8 +46,8 @@ "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", @@ -55,6 +55,7 @@ "@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", diff --git a/src/Dropdown.tsx b/src/Dropdown.tsx index 920e443..74eee60 100644 --- a/src/Dropdown.tsx +++ b/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 = ( + props, + ref, +) => { const { arrow = false, prefixCls = 'rc-dropdown', @@ -72,9 +75,10 @@ function Dropdown(props: DropdownProps, ref) { const [triggerVisible, setTriggerVisible] = React.useState(); 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(null); + const overlayRef = React.useRef(null); + const childRef = React.useRef(null); + React.useImperativeHandle(ref, () => triggerRef.current); const handleVisibleChange = (newVisible: boolean) => { @@ -174,6 +178,6 @@ function Dropdown(props: DropdownProps, ref) { {childrenNode} ); -} +}; export default React.forwardRef(Dropdown); diff --git a/src/Overlay.tsx b/src/Overlay.tsx index 6b05dfe..936caa1 100644 --- a/src/Overlay.tsx +++ b/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'; diff --git a/src/hooks/useAccessibility.ts b/src/hooks/useAccessibility.ts index 8d2850d..68bda3e 100644 --- a/src/hooks/useAccessibility.ts +++ b/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; }; } diff --git a/tests/basic.test.tsx b/tests/basic.test.tsx index 2949961..c50712e 100644 --- a/tests/basic.test.tsx +++ b/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'; diff --git a/tests/utils.js b/tests/utils.ts similarity index 88% rename from tests/utils.js rename to tests/utils.ts index 66236b7..73bc4d1 100644 --- a/tests/utils.js +++ b/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 }); }