No button to add the insert link item into the editor

[PaulSinghDev]

Description

The current floating link element exposes no button to trigger the insertion and relies on the user pressing enter. This is not a problem in itself but, if the user is placing the WYSIWYG editor within a form pressing enter will trigger the parent form's onSubmit method and the link will not be inserted.

As such I have wrapped the floating insert in an blank form element which takes the form context away from the parent and means submission is handled by plate opposed to the wrapper.

Steps to Reproduce

1. Make an editor with the floating link insert
2. Stick it within a form
3. Try and insert a link from the insert toolbar

What I expect

The link to be inserted into the editor

## What happened

Pressing enter triggered the parent form's submit method which means the link is never inserted.

Solution

1. Add a button to allow the user to manually add the link to the editor via a button click
2. Wrap the floating inputs in a form element -- Realised this will result in a nested form and a hydration error
3. Add an event listener to the wrapping div and listen for onKeyDownCapture. When the key is Enter or the keyCode is 13 we call e.preventDefault() which stops the wrapping form from submitting.

Notes

I have forked this repo and implemented solution number 3 here: https://github.com/PaulSinghDev/plate-update-floating-link

Click here to add a bounty via Algora.

Funding

• You can sponsor this specific effort via a Polar.sh pledge below
• We receive the pledge once the issue is completed & verified