Avatar profile modal : Crop functionality is not keyboard accessible

Issue Summary

Crop functionality is not keyboard accessible in the Avatar profile modal.

Element: "Crop Tool"

Steps to Reproduce

1. Navigate to the Jira dashboard page.
2. Navigate to the "User profile for Admin " link in the top right corner in the header section and activate it.
3. Activate the "Profile" link that becomes available after step 2.
4. In the Admin profile dashboard in the "Summary" main section, navigate to the Avatar image icon button and activate it.
5. After activating a modal dialog will appear to select Images for a profile photo.
6. In the "Upload a new avatar" activate the "Choose file" button and select an image that you want to upload in JPG or PNG format.

Actual Results

After selecting the image which is to be uploaded an Avatar profile image, a crop tool appears on the image. The crop tool functionality is not accessible by keyboard only and screen reader users. The focus only moves between Confirm and Cancel buttons. With the mouse, the user is able to Resize and Crop the image and select the desired area.

This makes it keyboard-only and screen reader users inaccessible to the crop functionality for the Crop image.

Expected Results

Following are the expected keyboard interactions.

• The interactive crop tool should receive keyboard focus and the screen reader focus.
• The cropping feature should function for any input mode, i.e. it should work from only the keyboard, only the mouse, only touch, or any combination of those.
• When the user is cropping the image with the tool the focus should not move to other elements unless the Custom key function is not activated. 
• Proper instructions should be provided on how to crop the image using keyboard, and the instruction should be accessible to the screen reader user.
• The tool should be given custom key functions and instructions should be provided to be able to crop the image with a keyboard.

The following key combinations can be implemented to make the crop tool accessible with the keyboard:

1. Shift + (Down /Up) arrow key - Will adjust the height of the tool.
2. Shift + (Right /Left) arrow key - Will adjust the width of the tool.
3. Alt + (Right /Left) arrow key - Will rotate the tool in a Clockwise or Anti-clockwise direction.
4. Ctrl + (Right /Left) arrow key - Will move the tool Right/Left.
5. Ctrl + (Up /Down) arrow key - Will move the tool Up/Down.

Refer to the following example:
https://y831o.csb.app/

Screenshot

Screen Recording

JRASERVER-73392.mov

Workaround

Currently, there is no known workaround for this behavior. A workaround will be added here when available

Bug Ref: 723133