fix(editor): prevent ghost slides and state corruption when clicking between slides

[danish17]

Problem

In the block editor, clicking in the gap between slides caused two distinct bugs:

• Loop enabled: slides permanently reordered and lost their transforms ("ghost slide")
• Loop disabled: carousel jumped to slide 0, navigation buttons disabled, dots collapsed to one

The issue did not reproduce on the frontend.

Root Cause

Embla ships with three built-in watchers that are all enabled by default:

Watcher	Mechanism	Editor trigger
watchSlides	MutationObserver on .embla__container	Gutenberg injects its block insertion-point indicator and block appender as direct children of .embla__container; Embla detected these as slide additions/removals and called reInit()
watchResize	ResizeObserver on the viewport	Block toolbar appearing on selection causes a layout measurement that could trigger reInit()
watchDrag	Pointer event listeners	Clicks in the CSS gap area started Embla's drag tracking and caused unintended scroll snapping

The primary culprit was watchSlides: after reInit(), Embla recalculated scroll snaps with Gutenberg's UI node counted as an extra slide, producing wrong transforms and snap positions.

Fix

Disable all three watchers in the editor's Embla initialisation (viewport/edit.tsx):

watchSlides: false,  // Gutenberg injects UI nodes into .embla__container
watchResize: false,  // Block toolbar can cause spurious reInit
watchDrag:   false,  // Clicks in slide gaps must not trigger scroll

Also fixed a pre-existing ESLint warning (react-hooks/exhaustive-deps): emblaRef.current was read inside the effect cleanup function. It is now captured into a stable viewportEl variable at effect mount time.

[justlevine]

Should we update these links to rtcamp/carousel-kit ?

[danish17]

Yes, I will raise a separate PR for this.