# ui/bindings/draggableviewmixin

module

<a id="interfaces">

## Interfaces

<a id="interface-DraggableView">

### `DraggableView`

<a id="type-definitions">

## Type Definitions

<a id="typedef-DraggableViewDragEvent">

### `DraggableViewDragEvent`

<a id="typedef-DraggableViewMixinConstructor">

### `DraggableViewMixinConstructor`

<a id="functions">

## Functions

<a id="function-DraggableViewMixin">

### `DraggableViewMixin( view ) → DraggableViewMixinConstructor<Base>`

A mixin that brings the possibility to observe dragging of the view element. The view has to implement the [`DraggableView`](module_ui_bindings_draggableviewmixin-DraggableView.md) interface to use it:

```js
export class MyDraggableView extends DraggableViewMixin( View ) implements DraggableView {
		// ...
}
```

Creating a class extending it attaches a set of mouse and touch listeners allowing to observe dragging of the view element:

* `mousedown` and `touchstart` on the view element - starting the dragging.
* `mousemove` and `touchmove` on the document - updating the view coordinates.
* `mouseup` and `touchend` on the document - stopping the dragging.

The mixin itself does not provide a visual feedback (that is, the dragged element does not change its position) - it is up to the developer to implement it.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-ui/src/bindings/draggableviewmixin.ts#L42)

#### Type parameters

* `Base: extends Constructor<View<HTMLElement>>`

#### Parameters

* `view: Base`

#### Returns

* `DraggableViewMixinConstructor<Base>`

---

Full index of the CKEditor 5 API reference: [llms.txt](llms.txt)