diff --git a/docs/examples/body-overflow.tsx b/docs/examples/body-overflow.tsx index 7183b01..924de83 100644 --- a/docs/examples/body-overflow.tsx +++ b/docs/examples/body-overflow.tsx @@ -41,7 +41,7 @@ export default () => { { + onOpenChange={(next) => { console.log('Visible Change:', next); setOpen(next); }} @@ -100,7 +100,7 @@ export default () => { arrow action="click" popupVisible={open1} - onPopupVisibleChange={(next) => { + onOpenChange={(next) => { console.log('Visible Change:', next); setOpen1(next); }} @@ -156,7 +156,7 @@ export default () => { arrow action="contextMenu" popupVisible={open2} - onPopupVisibleChange={(next) => { + onOpenChange={(next) => { console.log('Visible Change:', next); setOpen2(next); }} @@ -205,7 +205,7 @@ export default () => { arrow action="contextMenu" popupVisible={open3} - onPopupVisibleChange={(next) => { + onOpenChange={(next) => { console.log('Visible Change:', next); setOpen3(next); }} diff --git a/docs/examples/click-nested.tsx b/docs/examples/click-nested.tsx index 0509d07..e76c9fe 100644 --- a/docs/examples/click-nested.tsx +++ b/docs/examples/click-nested.tsx @@ -45,7 +45,7 @@ const NestPopup = ({ open, setOpen }) => { builtinPlacements={builtinPlacements} popup={
i am a click popup
} popupVisible={open} - onPopupVisibleChange={setOpen} + onOpenChange={setOpen} >
i am a click popup{' '} @@ -77,7 +77,7 @@ const Test = () => { action={['click']} builtinPlacements={builtinPlacements} popupVisible={open1} - onPopupVisibleChange={setOpen1} + onOpenChange={setOpen1} popup={ // Level 2 diff --git a/docs/examples/container.tsx b/docs/examples/container.tsx index 41d1e69..07c4380 100644 --- a/docs/examples/container.tsx +++ b/docs/examples/container.tsx @@ -165,7 +165,7 @@ export default () => { }} popupStyle={{ boxShadow: '0 0 5px red' }} popupVisible={visible} - onPopupVisibleChange={(nextVisible) => { + onOpenChange={(nextVisible) => { setVisible(nextVisible); }} // getPopupContainer={() => popHolderRef.current} diff --git a/docs/examples/portal.tsx b/docs/examples/portal.tsx index 2b2c6fa..3c2f650 100644 --- a/docs/examples/portal.tsx +++ b/docs/examples/portal.tsx @@ -86,7 +86,7 @@ const Test = () => {
} - onPopupVisibleChange={(visible) => { + onOpenChange={(visible) => { console.log('visible change:', visible); }} > diff --git a/src/index.tsx b/src/index.tsx index 5bd2bf5..dc9c713 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -62,7 +62,7 @@ export interface TriggerProps { // ==================== Open ===================== popupVisible?: boolean; defaultPopupVisible?: boolean; - onPopupVisibleChange?: (visible: boolean) => void; + onOpenChange?: (visible: boolean) => void; afterPopupVisibleChange?: (visible: boolean) => void; // =================== Portal ==================== @@ -138,7 +138,7 @@ export function generateTrigger( // Open popupVisible, defaultPopupVisible, - onPopupVisibleChange, + onOpenChange, afterPopupVisibleChange, // Delay @@ -299,7 +299,7 @@ export function generateTrigger( mergedOpen) !== nextOpen ) { lastTriggerRef.current.push(nextOpen); - onPopupVisibleChange?.(nextOpen); + onOpenChange?.(nextOpen); } }); diff --git a/tests/basic.test.jsx b/tests/basic.test.jsx index 1031248..2163ea2 100644 --- a/tests/basic.test.jsx +++ b/tests/basic.test.jsx @@ -433,13 +433,13 @@ describe('Trigger.Basic', () => { }, }; let innerVisible = null; - function onInnerPopupVisibleChange(value) { + function onInnerOpenChange(value) { innerVisible = value; } const innerTrigger = (
{ ); let visible = null; - function onPopupVisibleChange(value) { + function onOpenChange(value) { visible = value; } const { container } = render( { describe('click window to hide', () => { it('should hide', async () => { - const onPopupVisibleChange = jest.fn(); + const onOpenChange = jest.fn(); const { container } = render( trigger} > @@ -992,22 +992,22 @@ describe('Trigger.Basic', () => { fireEvent.click(container.querySelector('.target')); await awaitFakeTimer(); - expect(onPopupVisibleChange).toHaveBeenCalledWith(true); - onPopupVisibleChange.mockReset(); + expect(onOpenChange).toHaveBeenCalledWith(true); + onOpenChange.mockReset(); // Click outside to close fireEvent.mouseDown(document.body); fireEvent.click(document.body); await awaitFakeTimer(); - expect(onPopupVisibleChange).toHaveBeenCalledWith(false); + expect(onOpenChange).toHaveBeenCalledWith(false); }); it('should not hide when mouseDown inside but mouseUp outside', async () => { - const onPopupVisibleChange = jest.fn(); + const onOpenChange = jest.fn(); const { container } = render( trigger} > @@ -1017,14 +1017,14 @@ describe('Trigger.Basic', () => { fireEvent.click(container.querySelector('.target')); await awaitFakeTimer(); - expect(onPopupVisibleChange).toHaveBeenCalledWith(true); - onPopupVisibleChange.mockReset(); + expect(onOpenChange).toHaveBeenCalledWith(true); + onOpenChange.mockReset(); // Click outside to close fireEvent.mouseDown(document.querySelector('strong')); fireEvent.click(document.body); await awaitFakeTimer(); - expect(onPopupVisibleChange).not.toHaveBeenCalled(); + expect(onOpenChange).not.toHaveBeenCalled(); }); // https://github.com/ant-design/ant-design/issues/42526 @@ -1039,7 +1039,7 @@ describe('Trigger.Basic', () => { }} /> trigger} @@ -1088,11 +1088,11 @@ describe('Trigger.Basic', () => { }); it('not trigger open when hover hidden popup node', () => { - const onPopupVisibleChange = jest.fn(); + const onOpenChange = jest.fn(); const { container } = render( trigger} getPopupContainer={() => container} @@ -1102,15 +1102,15 @@ describe('Trigger.Basic', () => { ); trigger(container, '.target', 'mouseEnter'); - expect(onPopupVisibleChange).toHaveBeenCalledWith(true); - onPopupVisibleChange.mockReset(); + expect(onOpenChange).toHaveBeenCalledWith(true); + onOpenChange.mockReset(); trigger(container, '.target', 'mouseLeave'); - expect(onPopupVisibleChange).toHaveBeenCalledWith(false); - onPopupVisibleChange.mockReset(); + expect(onOpenChange).toHaveBeenCalledWith(false); + onOpenChange.mockReset(); trigger(container, '.popup', 'mouseEnter'); - expect(onPopupVisibleChange).not.toHaveBeenCalled(); + expect(onOpenChange).not.toHaveBeenCalled(); }); // https://gith(ub.com/ant-design/ant-design/issues/44830 @@ -1121,7 +1121,7 @@ describe('Trigger.Basic', () => { return ( {String(open)}} action={['click']} popupAlign={placementAlignMap.left} diff --git a/tests/portal.test.jsx b/tests/portal.test.jsx index 79b3735..f7fb5da 100644 --- a/tests/portal.test.jsx +++ b/tests/portal.test.jsx @@ -33,14 +33,14 @@ describe('Trigger.Portal', () => { ); }; - const onPopupVisibleChange = jest.fn(); + const onOpenChange = jest.fn(); const { container } = render(
tooltip2 @@ -55,7 +55,7 @@ describe('Trigger.Portal', () => { // Show the popup fireEvent.mouseEnter(container.querySelector('.target')); - expect(onPopupVisibleChange).toHaveBeenCalledWith(true); + expect(onOpenChange).toHaveBeenCalledWith(true); fireEvent.mouseLeave(container.querySelector('.target')); // Mouse enter popup @@ -68,6 +68,6 @@ describe('Trigger.Portal', () => { jest.runAllTimers(); }); - expect(onPopupVisibleChange).toHaveBeenCalledWith(false); + expect(onOpenChange).toHaveBeenCalledWith(false); }); });