crop area becomes smaller

[Cikayo]

It is normal for the first operation.

However, there is a problem with the second operation.

I need your help.Thanks!

[ValentinH]

What is different between the two cases? Could you please share a codesandbox showing the issue?

[Cikayo]

What is different between the two cases? Could you please share a codesandbox showing the issue?

Here is my code.
https://codesandbox.io/s/suspicious-ishizaka-fquxnh?file=/src/App.js

After selecting an image for the first time, click Cancel. Problem selecting another image the second time.

[ValentinH]

I'm not fully getting why this is happening but it seems to be related with the way antd-modal hides its content when the modal is closed.

I managed to fix it by not rendering the modal at all if imageUrl is empty:

and reset it on cancel:

Here's a working sandbox:
https://codesandbox.io/s/blissful-zeh-tur30j?file=/src/App.js

[Cikayo]

Wow! It's working. Thanks!

At first, I thought it was the component Cropper that cached the image. And try the code. I'm going in the wrong direction.

Thank you again for your help.

[ValentinH]

Yes this is also the first thing I tried as there are often issues when the Cropper is rendered outside of screen. For example, when a modal is closed but its content isn't unmounted.

[ValentinH]

If you don't want to fully unmount the modal when it's just supposed to be closed, you can have a look to #267. You might have some luck there as the author was using the Modal from antd (dont know how similar it is to antd-mobile Mask).