Users may select an image using a file input, drag and drop, or another method that works best in the consuming context. Once a file is selected, the image cropper modal should appear.

Using a custom file input.

Using the default file input.

Either the file input or a custom trigger will ultimately open a file chooser.