diff --git a/README.md b/README.md
index d265ba0..ff0e824 100644
--- a/README.md
+++ b/README.md
@@ -73,9 +73,13 @@ Additional props are passed to the underlying [`@rc-component/trigger`](https://
 | prefixCls | Component class name prefix | string | `rc-dropdown` |
 | transitionName | Popup transition class name | string | - |
 | trigger | Trigger action | `ActionType \| ActionType[]` | `['hover']` |
-| visible | Controlled visible state | boolean | - |
+| open | Controlled open state | boolean | - |
 | onOverlayClick | Callback when overlay is clicked | `(event: Event) => void` | - |
-| onVisibleChange | Callback when visibility changes | `(visible: boolean) => void` | - |
+| onOpenChange | Callback when the open state changes | `(open: boolean) => void` | - |
+
+`visible` and `onVisibleChange` have been removed. Use `open` and `onOpenChange` instead. This is a breaking API change; callers must migrate when upgrading.
+
+Clicking the overlay closes an uncontrolled dropdown and calls `onOverlayClick`, without calling `onOpenChange`.
 
 ## Development
 
diff --git a/README.zh-CN.md b/README.zh-CN.md
index ed96f31..f0a7efc 100644
--- a/README.zh-CN.md
+++ b/README.zh-CN.md
@@ -73,9 +73,13 @@ npm start
 | prefixCls | 组件类名前缀 | string | `rc-dropdown` |
 | transitionName | 弹层过渡类名 | string | - |
 | trigger | 触发动作 | `ActionType \| ActionType[]` | `['hover']` |
-| visible | 受控可见状态 | boolean | - |
+| open | 受控可见状态 | boolean | - |
 | onOverlayClick | 点击下拉菜单内容时的回调 | `(event: Event) => void` | - |
-| onVisibleChange | 可见性变化时的回调 | `(visible: boolean) => void` | - |
+| onOpenChange | 可见性变化时的回调 | `(open: boolean) => void` | - |
+
+`visible` 和 `onVisibleChange` 已移除，请改用 `open` 和 `onOpenChange`。这是不兼容的 API 变更，调用方升级时需同步迁移。
+
+点击浮层会关闭非受控下拉菜单并调用 `onOverlayClick`，不会调用 `onOpenChange`。
 
 ## 本地开发
 
diff --git a/docs/examples/arrow.jsx b/docs/examples/arrow.jsx
index 224fc06..e291a92 100644
--- a/docs/examples/arrow.jsx
+++ b/docs/examples/arrow.jsx
@@ -7,8 +7,8 @@ function onSelect({ key }) {
   console.log(`${key} selected`);
 }
 
-function onVisibleChange(visible) {
-  console.log(visible);
+function onOpenChange(open) {
+  console.log(open);
 }
 
 const menu = (
@@ -30,7 +30,7 @@ export default function Arrow() {
           trigger={['click']}
           overlay={menu}
           animation="slide-up"
-          onVisibleChange={onVisibleChange}
+          onOpenChange={onOpenChange}
         >
           <button style={{ width: 100 }}>open</button>
         </Dropdown>
@@ -42,7 +42,7 @@ export default function Arrow() {
           trigger={['click']}
           overlay={menu}
           animation="slide-up"
-          onVisibleChange={onVisibleChange}
+          onOpenChange={onOpenChange}
         >
           <button style={{ width: 100 }}>open</button>
         </Dropdown>
diff --git a/docs/examples/multiple.jsx b/docs/examples/multiple.jsx
index 34f33df..b117ddf 100644
--- a/docs/examples/multiple.jsx
+++ b/docs/examples/multiple.jsx
@@ -5,13 +5,13 @@ import '../../assets/index.less';
 
 class Test extends Component {
   state = {
-    visible: false,
+    open: false,
   };
 
-  onVisibleChange = (visible) => {
-    console.log('visible', visible);
+  onOpenChange = (open) => {
+    console.log('open', open);
     this.setState({
-      visible,
+      open,
     });
   };
 
@@ -24,7 +24,7 @@ class Test extends Component {
   confirm = () => {
     console.log(this.selected);
     this.setState({
-      visible: false,
+      open: false,
     });
   };
 
@@ -57,8 +57,8 @@ class Test extends Component {
     return (
       <Dropdown
         trigger={['click']}
-        onVisibleChange={this.onVisibleChange}
-        visible={this.state.visible}
+        onOpenChange={this.onOpenChange}
+        open={this.state.open}
         closeOnSelect={false}
         overlay={menu}
         animation="slide-up"
diff --git a/docs/examples/overlay-callback.jsx b/docs/examples/overlay-callback.jsx
index a402aaf..0b71cab 100644
--- a/docs/examples/overlay-callback.jsx
+++ b/docs/examples/overlay-callback.jsx
@@ -7,8 +7,8 @@ function onSelect({ key }) {
   console.log(`${key} selected`);
 }
 
-function onVisibleChange(visible) {
-  console.log(visible);
+function onOpenChange(open) {
+  console.log(open);
 }
 
 const menuCallback = () => (
@@ -29,7 +29,7 @@ export default function OverlayCallback() {
           trigger={['click']}
           overlay={menuCallback}
           animation="slide-up"
-          onVisibleChange={onVisibleChange}
+          onOpenChange={onOpenChange}
         >
           <button style={{ width: 100 }}>open</button>
         </Dropdown>
diff --git a/docs/examples/simple.jsx b/docs/examples/simple.jsx
index f2f0fec..a672dbb 100644
--- a/docs/examples/simple.jsx
+++ b/docs/examples/simple.jsx
@@ -8,8 +8,8 @@ function onSelect({ key }) {
   console.log(`${key} selected`);
 }
 
-function onVisibleChange(visible) {
-  console.log(visible);
+function onOpenChange(open) {
+  console.log(open);
 }
 
 const menu = (
@@ -31,7 +31,7 @@ export default function Simple() {
           trigger={['click']}
           overlay={menu}
           animation="slide-up"
-          onVisibleChange={onVisibleChange}
+          onOpenChange={onOpenChange}
         >
           <button style={{ width: 100 }}>open</button>
         </Dropdown>
diff --git a/src/Dropdown.tsx b/src/Dropdown.tsx
index f2deba4..6854bae 100644
--- a/src/Dropdown.tsx
+++ b/src/Dropdown.tsx
@@ -25,7 +25,7 @@ export interface DropdownProps
   > {
   minOverlayWidthMatchTrigger?: boolean;
   arrow?: boolean;
-  onVisibleChange?: (visible: boolean) => void;
+  onOpenChange?: (open: boolean) => void;
   onOverlayClick?: (e: Event) => void;
   prefixCls?: string;
   transitionName?: string;
@@ -41,7 +41,7 @@ export interface DropdownProps
   alignPoint?: boolean;
   showAction?: ActionType[];
   hideAction?: ActionType[];
-  visible?: boolean;
+  open?: boolean;
   autoFocus?: boolean;
 }
 
@@ -59,18 +59,18 @@ const Dropdown = React.forwardRef<TriggerRef, DropdownProps>((props, ref) => {
     hideAction,
     overlayClassName,
     overlayStyle,
-    visible,
+    open,
     trigger = ['hover'],
     autoFocus,
     overlay,
     children,
-    onVisibleChange,
+    onOpenChange,
     disabled,
     ...otherProps
   } = props as DropdownProps & { disabled?: boolean };
 
-  const [triggerVisible, setTriggerVisible] = React.useState<boolean>();
-  const mergedVisible = 'visible' in props ? visible : triggerVisible;
+  const [triggerOpen, setTriggerOpen] = React.useState<boolean>();
+  const mergedOpen = 'open' in props ? open : triggerOpen;
   const mergedMotionName = animation
     ? `${prefixCls}-${animation}`
     : transitionName;
@@ -80,22 +80,22 @@ const Dropdown = React.forwardRef<TriggerRef, DropdownProps>((props, ref) => {
   const childRef = React.useRef(null);
   React.useImperativeHandle(ref, () => triggerRef.current);
 
-  const handleVisibleChange = (newVisible: boolean) => {
-    setTriggerVisible(newVisible);
-    onVisibleChange?.(newVisible);
+  const handleOpenChange = (newOpen: boolean) => {
+    setTriggerOpen(newOpen);
+    onOpenChange?.(newOpen);
   };
 
   useAccessibility({
-    visible: mergedVisible,
+    open: mergedOpen,
     triggerRef: childRef,
-    onVisibleChange: handleVisibleChange,
+    onOpenChange: handleOpenChange,
     autoFocus,
     overlayRef,
   });
 
   const onClick = (e) => {
     const { onOverlayClick } = props;
-    setTriggerVisible(false);
+    setTriggerOpen(false);
 
     if (onOverlayClick) {
       onOverlayClick(e);
@@ -140,7 +140,7 @@ const Dropdown = React.forwardRef<TriggerRef, DropdownProps>((props, ref) => {
   >;
   const childClassName = clsx(
     elementChild.props?.className,
-    mergedVisible && getOpenClassName(),
+    mergedOpen && getOpenClassName(),
   );
   const triggerChildProps: React.HTMLAttributes<HTMLElement> &
     React.RefAttributes<HTMLElement> = {
@@ -148,21 +148,20 @@ const Dropdown = React.forwardRef<TriggerRef, DropdownProps>((props, ref) => {
     ref: composeRef(childRef, getNodeRef(elementChild)),
   };
 
-  const childrenNode =
-    supportRef(elementChild) ? (
-      React.cloneElement(
-        elementChild as React.ReactElement<
-          React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>
-        >,
-        triggerChildProps,
-      )
-    ) : (
-      <span className={childClassName} ref={childRef}>
-        {React.cloneElement(elementChild, {
-          className: childClassName,
-        })}
-      </span>
-    );
+  const childrenNode = supportRef(elementChild) ? (
+    React.cloneElement(
+      elementChild as React.ReactElement<
+        React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>
+      >,
+      triggerChildProps,
+    )
+  ) : (
+    <span className={childClassName} ref={childRef}>
+      {React.cloneElement(elementChild, {
+        className: childClassName,
+      })}
+    </span>
+  );
 
   let triggerHideAction = hideAction;
   if (!triggerHideAction && trigger.indexOf('contextMenu') !== -1) {
@@ -185,10 +184,10 @@ const Dropdown = React.forwardRef<TriggerRef, DropdownProps>((props, ref) => {
       popupPlacement={placement}
       popupAlign={align}
       popupMotion={{ motionName: mergedMotionName }}
-      popupVisible={mergedVisible}
+      popupVisible={mergedOpen}
       stretch={getMinOverlayWidthMatchTrigger() ? 'minWidth' : ''}
       popup={getMenuElementOrLambda()}
-      onOpenChange={handleVisibleChange}
+      onOpenChange={handleOpenChange}
       onPopupClick={onClick}
       getPopupContainer={getPopupContainer}
     >
diff --git a/src/hooks/useAccessibility.ts b/src/hooks/useAccessibility.ts
index 2fdc744..7f31291 100644
--- a/src/hooks/useAccessibility.ts
+++ b/src/hooks/useAccessibility.ts
@@ -4,26 +4,26 @@ import * as React from 'react';
 const { ESC, TAB } = KeyCode;
 
 interface UseAccessibilityProps {
-  visible: boolean;
+  open: boolean;
   triggerRef: React.RefObject<any>;
-  onVisibleChange?: (visible: boolean) => void;
+  onOpenChange?: (open: boolean) => void;
   autoFocus?: boolean;
   overlayRef?: React.RefObject<any>;
 }
 
 export default function useAccessibility({
-  visible,
+  open,
   triggerRef,
-  onVisibleChange,
+  onOpenChange,
   autoFocus,
   overlayRef,
 }: UseAccessibilityProps) {
   const focusMenuRef = React.useRef<boolean>(false);
 
   const handleCloseMenuAndReturnFocus = () => {
-    if (visible) {
+    if (open) {
       triggerRef.current?.focus?.();
-      onVisibleChange?.(false);
+      onOpenChange?.(false);
     }
   };
 
@@ -58,7 +58,7 @@ export default function useAccessibility({
   };
 
   React.useEffect(() => {
-    if (visible) {
+    if (open) {
       window.addEventListener('keydown', handleKeyDown);
       if (autoFocus) {
         // FIXME: hack with raf
@@ -72,5 +72,5 @@ export default function useAccessibility({
     return () => {
       focusMenuRef.current = false;
     };
-  }, [visible]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [open]); // eslint-disable-line react-hooks/exhaustive-deps
 }
diff --git a/tests/__snapshots__/basic.test.tsx.snap b/tests/__snapshots__/basic.test.tsx.snap
index ad46ebc..c771852 100644
--- a/tests/__snapshots__/basic.test.tsx.snap
+++ b/tests/__snapshots__/basic.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`dropdown simply works 1`] = `
     >
       <li
         class="rc-menu-item"
-        data-menu-id="rc-menu-uuid-1"
+        data-menu-id="rc-menu-uuid-test-id-1"
         role="menuitem"
         tabindex="-1"
       >
@@ -36,7 +36,7 @@ exports[`dropdown simply works 1`] = `
       />
       <li
         class="rc-menu-item"
-        data-menu-id="rc-menu-uuid-2"
+        data-menu-id="rc-menu-uuid-test-id-2"
         role="menuitem"
         tabindex="-1"
       >
diff --git a/tests/basic.test.tsx b/tests/basic.test.tsx
index 9feda1a..f6a6e41 100644
--- a/tests/basic.test.tsx
+++ b/tests/basic.test.tsx
@@ -62,9 +62,9 @@ describe('dropdown', () => {
     jest.clearAllTimers();
   });
 
-  it('default visible', () => {
+  it('default open', () => {
     const { container } = render(
-      <Dropdown overlay={<div className="check-for-visible">Test</div>} visible>
+      <Dropdown overlay={<div className="check-for-visible">Test</div>} open>
         <button className="my-button">open</button>
       </Dropdown>,
     );
@@ -76,14 +76,14 @@ describe('dropdown', () => {
     ).toBeTruthy();
   });
 
-  it('supports controlled visible prop', () => {
-    const onVisibleChange = jest.fn();
+  it('supports controlled open prop', () => {
+    const onOpenChange = jest.fn();
     const { container } = render(
       <Dropdown
         overlay={<div className="check-for-visible">Test</div>}
-        visible
+        open
         trigger={['click']}
-        onVisibleChange={onVisibleChange}
+        onOpenChange={onOpenChange}
       >
         <button className="my-button">open</button>
       </Dropdown>,
@@ -96,7 +96,7 @@ describe('dropdown', () => {
     ).toBeTruthy();
 
     fireEvent.click(container.querySelector('.my-button'));
-    expect(onVisibleChange).toHaveBeenCalledWith(false);
+    expect(onOpenChange).toHaveBeenCalledWith(false);
   });
 
   it('forwards ref to trigger', () => {
@@ -203,7 +203,7 @@ describe('dropdown', () => {
     const overlay = <div style={{ width: overlayWidth }}>Test</div>;
 
     const { container, baseElement } = render(
-      <Dropdown trigger={['click']} overlay={overlay} visible>
+      <Dropdown trigger={['click']} overlay={overlay} open>
         <button style={{ width: 100 }} className="my-button">
           open
         </button>
@@ -230,7 +230,7 @@ describe('dropdown', () => {
         trigger={['click']}
         overlay={overlay}
         minOverlayWidthMatchTrigger={false}
-        visible
+        open
       >
         <button style={{ width: 100 }} className="my-button">
           open
@@ -304,7 +304,7 @@ describe('dropdown', () => {
       <button {...props}>open</button>
     );
     const { container } = render(
-      <Dropdown overlay={<div style={{ width: 50 }}>Test</div>} visible>
+      <Dropdown overlay={<div style={{ width: 50 }}>Test</div>} open>
         <LegacyButton className="my-button" />
       </Dropdown>,
     );
@@ -509,7 +509,7 @@ describe('dropdown', () => {
           </Menu.SubMenu>
         </Menu>
       ),
-      visible: true,
+      open: true,
       getPopupContainer: (node) => node,
     };
 
@@ -530,7 +530,7 @@ describe('dropdown', () => {
           <Menu.Item key="1">foo</Menu.Item>
         </Menu>
       ),
-      visible: true,
+      open: true,
     };
 
     render(
diff --git a/tests/open.test.tsx b/tests/open.test.tsx
new file mode 100644
index 0000000..ce244b7
--- /dev/null
+++ b/tests/open.test.tsx
@@ -0,0 +1,94 @@
+import { act, fireEvent } from '@testing-library/react';
+import * as React from 'react';
+import Dropdown from '../src';
+import { render } from './utils';
+
+describe('open API', () => {
+  beforeEach(() => {
+    jest.useFakeTimers();
+  });
+
+  afterEach(() => {
+    jest.clearAllTimers();
+    jest.useRealTimers();
+  });
+
+  it('keeps controlled state until open changes', () => {
+    const onOpenChange = jest.fn();
+    const dropdown = (open: boolean) => (
+      <Dropdown
+        open={open}
+        onOpenChange={onOpenChange}
+        trigger={['click']}
+        overlay={<div>menu</div>}
+      >
+        <button type="button">trigger</button>
+      </Dropdown>
+    );
+    const { getByRole, rerender } = render(dropdown(false));
+    const button = getByRole('button');
+
+    fireEvent.click(button);
+    expect(onOpenChange).toHaveBeenLastCalledWith(true);
+    expect(button).not.toHaveClass('rc-dropdown-open');
+
+    rerender(dropdown(true));
+    expect(button).toHaveClass('rc-dropdown-open');
+    fireEvent.click(button);
+    expect(onOpenChange).toHaveBeenLastCalledWith(false);
+    expect(button).toHaveClass('rc-dropdown-open');
+
+    rerender(dropdown(false));
+    expect(button).not.toHaveClass('rc-dropdown-open');
+  });
+
+  it.each([27, 9])(
+    'notifies onOpenChange and restores focus for key %s',
+    (keyCode) => {
+      const onOpenChange = jest.fn();
+      const Overlay = () => <div>menu</div>;
+      const { getByRole } = render(
+        <Dropdown
+          onOpenChange={onOpenChange}
+          trigger={['click']}
+          overlay={<Overlay />}
+        >
+          <button type="button">trigger</button>
+        </Dropdown>,
+      );
+      const button = getByRole('button');
+      fireEvent.click(button);
+      expect(button).toHaveClass('rc-dropdown-open');
+      expect(onOpenChange).toHaveBeenNthCalledWith(1, true);
+
+      fireEvent.keyDown(window, { keyCode });
+      expect(onOpenChange).toHaveBeenNthCalledWith(2, false);
+      expect(onOpenChange).toHaveBeenCalledTimes(2);
+      expect(button).not.toHaveClass('rc-dropdown-open');
+      expect(button).toHaveFocus();
+    },
+  );
+
+  it('preserves overlay click callback behavior', () => {
+    const onOpenChange = jest.fn();
+    const onOverlayClick = jest.fn();
+    const { getByRole, getByText } = render(
+      <Dropdown
+        onOpenChange={onOpenChange}
+        onOverlayClick={onOverlayClick}
+        trigger={['click']}
+        overlay={<div>menu</div>}
+      >
+        <button type="button">trigger</button>
+      </Dropdown>,
+    );
+    const button = getByRole('button');
+    fireEvent.click(button);
+    act(() => jest.runAllTimers());
+    fireEvent.click(getByText('menu'));
+    expect(button).not.toHaveClass('rc-dropdown-open');
+    expect(onOverlayClick).toHaveBeenCalledTimes(1);
+    expect(onOpenChange).toHaveBeenCalledTimes(1);
+    expect(onOpenChange).toHaveBeenCalledWith(true);
+  });
+});
diff --git a/tests/props.test.tsx b/tests/props.test.tsx
index 6eae17e..86aa15f 100644
--- a/tests/props.test.tsx
+++ b/tests/props.test.tsx
@@ -22,12 +22,13 @@ it('does not forward disabled to Trigger', () => {
   const runtimeProps = { disabled: true };
 
   render(
-    <Dropdown {...runtimeProps} visible overlay={<div />}>
+    <Dropdown {...runtimeProps} open overlay={<div />}>
       <button type="button">open</button>
     </Dropdown>,
   );
 
   const triggerProps = mockTriggerRender.mock.calls[0][0];
   expect(triggerProps).not.toHaveProperty('disabled');
+  expect(triggerProps).not.toHaveProperty('open');
   expect(triggerProps).toHaveProperty('popupVisible', true);
 });
diff --git a/tests/ref.test.tsx b/tests/ref.test.tsx
new file mode 100644
index 0000000..4f0532a
--- /dev/null
+++ b/tests/ref.test.tsx
@@ -0,0 +1,65 @@
+import type { TriggerRef } from '@rc-component/trigger';
+import { supportRef } from '@rc-component/util';
+import { fireEvent } from '@testing-library/react';
+import * as React from 'react';
+import Dropdown from '../src';
+import { render } from './utils';
+
+jest.mock('@rc-component/util', () => {
+  const actual = jest.requireActual('@rc-component/util');
+  return {
+    ...actual,
+    supportRef: jest.fn(actual.supportRef),
+  };
+});
+
+it('wraps children without ref support and keeps click state in sync', () => {
+  const LegacyButton = (props: React.HTMLAttributes<HTMLButtonElement>) => (
+    <button {...props} type="button">
+      trigger
+    </button>
+  );
+  const actualSupportRef = jest.requireActual('@rc-component/util').supportRef;
+  const mockSupportRef = supportRef as jest.MockedFunction<typeof supportRef>;
+
+  // React 19 accepts refs on function components. Exercise the fallback used
+  // by older React versions without changing ref support for other elements.
+  mockSupportRef.mockImplementation((node) =>
+    React.isValidElement(node) && node.type === LegacyButton
+      ? false
+      : actualSupportRef(node),
+  );
+
+  const ref = React.createRef<TriggerRef>();
+  const onOpenChange = jest.fn();
+  try {
+    const { getByRole, unmount } = render(
+      <Dropdown
+        ref={ref}
+        trigger={['click']}
+        overlay={<div>menu</div>}
+        onOpenChange={onOpenChange}
+      >
+        <LegacyButton />
+      </Dropdown>,
+    );
+    const button = getByRole('button');
+    const wrapper = button.parentElement;
+    expect(wrapper.tagName).toBe('SPAN');
+    expect(ref.current.nativeElement).toBe(wrapper);
+
+    fireEvent.click(button);
+    expect(onOpenChange).toHaveBeenNthCalledWith(1, true);
+    expect(wrapper).toHaveClass('rc-dropdown-open');
+    expect(button).toHaveClass('rc-dropdown-open');
+
+    fireEvent.click(button);
+    expect(onOpenChange).toHaveBeenNthCalledWith(2, false);
+    expect(onOpenChange).toHaveBeenCalledTimes(2);
+    expect(wrapper).not.toHaveClass('rc-dropdown-open');
+    expect(button).not.toHaveClass('rc-dropdown-open');
+    unmount();
+  } finally {
+    mockSupportRef.mockImplementation(actualSupportRef);
+  }
+});