Task update cropper.js to v2

[bambamboole]

Description

This PR aims to tackle #15778 .
Its my first PR in this repository, and am more a backend guy, but I thought I could tackle a simple task as updating a dependency :).

Its still WIP and I like to ask for support, since I struggle a bit with implementing the 2.0 api into the file upload component.

Things to do:

• update dependency
• instantiate it properly
• Fix CSS issue with canvas and image
• make buttons work again
• make all fields update to the correct value

Visual changes

no visual changes (when we fix the issues ;) )

Functional changes

• Code style has been fixed by running the composer cs command.
• Changes have been tested to not break existing functionality.
• Documentation is up-to-date.

[bambamboole]

I do not get the cropperjs buttons to work somehow.
Also in the browser console executing

document.querySelector('cropper-image').$center('contain') 

makes nothing...

Every help appreciated :)

[alex-elivate]

I tested this PR. Here are a few issues I found.

• The canvas is showing a tiny section of the image on the top. I think the imageEditorViewportWidth and imageEditorViewportHeight need to be set.
• Alpine.js is throwing "Invalid left-hand side in assignment" errors. The blade template should be updated to clear these errors. I think it's this code here:

x-on:click.prevent.stop="
    currentRatio = @js($label) {!! ';' !!}
    editor.getCropperSelection()?.aspectRatio = @js($ratio)
"

• Two images are being shown. I think you have to hide the original image.

It also looks like cropper v2 has changed how you crop. Instead of selecting the entire image, you have to paint a square to crop.

Let me know how I can help.