chore: add afterOpenChange (#393)

Author: zombieJ

src/Preview/index.tsx

@@ -88,6 +88,7 @@ export interface InternalPreviewConfig {
   open?: boolean;
   getContainer?: PortalProps['getContainer'];
   zIndex?: number;
+  afterOpenChange?: (open: boolean) => void;
 
   // Operation
   movable?: boolean;
@@ -170,6 +171,7 @@ const Preview: React.FC<PreviewProps> = props => {
     movable = true,
     onClose,
     open,
+    afterOpenChange,
     icons = {},
     closeIcon,
     getContainer,
@@ -366,6 +368,7 @@ const Preview: React.FC<PreviewProps> = props => {
     if (!nextVisible) {
       setLockScroll(false);
     }
+    afterOpenChange?.(nextVisible);
   };
 
   // ========================== Portal ==========================

tests/preview.test.tsx

@@ -974,11 +974,13 @@ describe('Preview', () => {
 
   it('should be closed when press esc after click portal', () => {
     const onOpenChange = jest.fn();
+    const afterOpenChange = jest.fn();
     const { container } = render(
       <Image
         src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
         preview={{
           onOpenChange,
+          afterOpenChange,
         }}
       />,
     );
@@ -991,15 +993,17 @@ describe('Preview', () => {
     expect(document.querySelector('.rc-image-preview')).toBeTruthy();
 
     expect(onOpenChange).toHaveBeenCalledWith(true);
+    expect(afterOpenChange).toHaveBeenCalledWith(true);
 
     fireEvent.click(document.querySelector('.rc-image-preview-actions'));
 
     fireEvent.keyDown(window, { key: 'Escape', keyCode: 27 });
 
     expect(onOpenChange).toHaveBeenCalledWith(false);
-    expect(onOpenChange).toHaveBeenCalledTimes(2);
+    expect(afterOpenChange).toHaveBeenCalledWith(false);
 
-    onOpenChange.mockRestore();
+    expect(onOpenChange).toHaveBeenCalledTimes(2);
+    expect(afterOpenChange).toHaveBeenCalledTimes(2);
   });
 
   it('not modify preview image size', () => {

tests/previewGroup.test.tsx

@@ -15,8 +15,9 @@ describe('PreviewGroup', () => {
   it('onChange should be called', () => {
     const onChange = jest.fn();
     const onOpenChange = jest.fn();
+    const afterOpenChange = jest.fn();
     const { container } = render(
-      <Image.PreviewGroup preview={{ onChange, onOpenChange }}>
+      <Image.PreviewGroup preview={{ onChange, onOpenChange, afterOpenChange }}>
         <Image src="src1" className="firstImg" />
         <Image preview={false} src="src2" />
         <Image src="src3" />
@@ -29,7 +30,8 @@ describe('PreviewGroup', () => {
       jest.runAllTimers();
     });
     expect(onChange).not.toHaveBeenCalled();
-    expect(onOpenChange).toBeCalledWith(true, { current: 0 });
+    expect(onOpenChange).toHaveBeenCalledWith(true, { current: 0 });
+    expect(afterOpenChange).toHaveBeenCalledWith(true);
 
     fireEvent.click(document.querySelector('.rc-image-preview-switch-next'));
     act(() => {