<style>
.sortable > div {
-webkit-touch-callout:none;
-ms-touch-action:none; touch-action:none;
-moz-user-select:none; -webkit-user-select:none; -ms-user-select:none; user-select:none;
}
div:global(.isDragging) { visibility:hidden }
div:global(.ui-sortable-placeholder) { height:20px }
</style>
<script context="module">
import { enableBodyScroll, disableBodyScroll } from 'body-scroll-lock'
</script>
<script>
import { draggable, sortable } from 'svelte-agnostic-draggable'
/**** map all touch events to mouse events ****/
import mapTouchToMouseFor from 'svelte-touch-to-mouse'
mapTouchToMouseFor('.sortable > div')
mapTouchToMouseFor('.draggable')
/**** Svelte Event Handling ****/
let isDragging = false // temporarily hides original draggable
function onDragStart () { isDragging = true }
function onDragStop () { isDragging = false }
function onSortableActivate () { disableBodyScroll(document.body) }
function onSortableDeactivate () { enableBodyScroll(document.body) }
let ListView