Use same visual hints when moving components as when adding

-{}Updated scope{}--

Story

As a user wanting to move a component in an experience page, I want to use the same mechanism as when adding a component instead of dragging & dropping

Acceptance criteria

• When clicking on the Move icon from the component action bar:
  • The page banner indicate the moving mode and has a button to cancel
  • Hovering the page component will use a similar overlay as for adding new component but with a different Pin icon
• When clicking the Up or Down icons from the component action bar, the component will move directly up/down one component
• A component moved will trigger an unpublished change status for the component 

Figma designs  

--{}OLD SCOPE{}--

Story
As a user dragging components within the preview, I want to see the same visual placement hints as when I add a component from the component catalog

Acceptance criteria
1) Dragging components that have already been added to a page within the preview has the same indicators to show where it will be placed
2) Add a move button instead of drag and drop functionality to drag components around

Description
In CMS-12753 (for 14.2) visual hints were added to drop new components more accurately.

It is expected by a client that the visual hint are also there when moving existing components around:

I thought that this would also be the case with existing components on which are already in place, but that still has the "old, less accurate" way of trying to get the component in the right spot.