Index: src/UploadTest.vue
===================================================================
--- src/UploadTest.vue	(revision 4b96189c351c92e8383b4411f7a4a73de521da76)
+++ src/UploadTest.vue	(revision 4b96189c351c92e8383b4411f7a4a73de521da76)
@@ -0,0 +1,201 @@
+<script setup lang="ts">
+
+import { ref, getCurrentInstance } from 'vue'
+
+import UploadZone from './UploadZone.vue'
+
+const inst = getCurrentInstance()
+
+const auto_start = ref(false)
+const auto_reset = ref(false)
+const keep_going = ref(false)
+const max_jobs = ref(3)
+
+const reset = (): void => {
+  (inst as any).refs.uploader.reset()
+}
+
+const start = (): void => {
+  (inst as any).refs.uploader.start()
+}
+
+</script>
+
+<template>
+  <component class='uploader' :is='UploadZone' target='https://vite.js29a.usermd.net/upload.php'
+             :max-jobs='max_jobs' :auto-start='auto_start' :auto-reset='auto_reset'
+             :keep-going='keep_going' ref='uploader'>
+    <template #idle='{ pick }'>
+      <div class='idle'>
+        idle
+        <br />
+        <button @click='pick()'>pick</button>
+      </div>
+    </template>
+
+    <template #hover>
+      <div class='hover'>
+        hover
+      </div>
+    </template>
+
+    <template #wait='{ start, queue }'>
+      <div class='wait'>
+        wait
+        <br />
+        <button @click='pick()'>pick</button>
+        <br />
+        <button @click='start()'>start</button>
+        <br/>
+        <div v-for='file in queue'>{{ file.name }}</div>
+      </div>
+    </template>
+
+    <template #uploading='{ progress, current, queue, abort, errors }'>
+      <div class='uploading'>
+        uploading
+        <br />
+        <button @click='abort()'>abort</button>
+        <br />
+        {{ progress.length }} / {{ current.length }} / {{ queue.length }}
+        <br />
+        <button @click='abort()'>abort</button>
+        <b>errors:</b> <span v-for='error in errors'>{{ error.file.name }}</span>
+        <b>progress:</b> <div v-for='item in progress'>{{ item }}</div>
+        <b>current:</b>
+        <div v-for='item in current'>
+          {{ item.file.name }}: {{ item.current }} of {{ item.total }}
+        </div>
+        <b>remaining:</b>
+        <div v-for='file in queue'>{{ file.name }}</div>
+      </div>
+    </template>
+
+    <template #done='{ result, reset }'>
+      <div class='done'>
+        done
+        <br />
+        <button @click='reset()'>reset</button>
+        <br />
+        <div v-for='item in result'>{{ item }}</div>
+      </div>
+    </template>
+
+    <template #error='{ error, reset }'>
+      <div class='error'>
+        error
+        <br />
+        <button @click='reset()'>reset</button>
+        <div>{{ error }}</div>
+      </div>
+    </template>
+
+    <template #aborted='{ result, reset }'>
+      <div class='aborted'>
+        aborted
+        <br />
+        <button @click='reset()'>reset</button>
+        <div v-for='item in result'>{{ item }}</div>
+      </div>
+    </template>
+
+    <template #with-errors='{ result, errors }'>
+      <div class='with-errors'>
+        with errors
+        <br />
+        <b>errors(s):</b>
+        <div v-for='item in errors'>{{ item.file.name }} / {{ item.error }}</div>
+        <b>ok:</b>
+        <div v-for='item in result'>{{ item }}</div>
+      </div>
+    </template>
+  </component>
+</template>
+
+<style scoped>
+
+.uploader {
+  border: 3px dashed #fff;
+  width: 512px;
+  height: 384px;
+  position: absolute;
+  border-radius: 20px;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.idle,
+.hover,
+.wait,
+.uploading,
+.done,
+.error,
+.aborted,
+.with-errors {
+  width: 100%;
+  height: 100%;
+  border: 1px solid #0ff;
+  padding: 5px;
+  overflow: auto;
+}
+
+.status {
+  width: 25%;
+  height: auto;
+  background-color: #555;
+  color: #fff;
+  position: absolute;
+  right: 0px;
+  bottom: 0px;
+  padding: 2px 2px 2px 2px;
+  text-align: center;
+  font-weight: bold;
+  border-radius: 10px 0px 0px 0px;
+  border: 1px solid #0ff;
+  opacity: 0.75;
+}
+
+.idle {
+  background-color: #088;
+  color: black;
+}
+
+.hover {
+  background-color: #088;
+  color: white;
+  cursor: copy;
+}
+
+.wait {
+  background-color: #880;
+  color: black;
+}
+
+.uploading {
+  background-color: #050;
+  color: white;
+}
+
+.done {
+  background-color: #00f;
+  color: white;
+}
+
+.error {
+  background-color: #800;
+  color: white;
+}
+
+.aborted {
+  background-color: #300;
+  color: white;
+}
+
+.with-errors {
+  background-color: #800;
+  color: white;
+}
+
+</style>
+
Index: src/UploadTest0.vue
===================================================================
--- src/UploadTest0.vue	(revision 54176ee8abe2033da05f8e84d73bea143054abc9)
+++ 	(revision )
@@ -1,201 +1,0 @@
-<script setup lang="ts">
-
-import { ref, getCurrentInstance } from 'vue'
-
-import UploadZone from './UploadZone.vue'
-
-const inst = getCurrentInstance()
-
-const auto_start = ref(false)
-const auto_reset = ref(false)
-const keep_going = ref(false)
-const max_jobs = ref(3)
-
-const reset = (): void => {
-  (inst as any).refs.uploader.reset()
-}
-
-const start = (): void => {
-  (inst as any).refs.uploader.start()
-}
-
-</script>
-
-<template>
-  <component class='uploader' :is='UploadZone' target='https://vite.js29a.usermd.net/upload.php'
-             :max-jobs='max_jobs' :auto-start='auto_start' :auto-reset='auto_reset'
-             :keep-going='keep_going' ref='uploader'>
-    <template #idle='{ pick }'>
-      <div class='idle'>
-        idle
-        <br />
-        <button @click='pick()'>pick</button>
-      </div>
-    </template>
-
-    <template #hover>
-      <div class='hover'>
-        hover
-      </div>
-    </template>
-
-    <template #wait='{ start, queue }'>
-      <div class='wait'>
-        wait
-        <br />
-        <button @click='pick()'>pick</button>
-        <br />
-        <button @click='start()'>start</button>
-        <br/>
-        <div v-for='file in queue'>{{ file.name }}</div>
-      </div>
-    </template>
-
-    <template #uploading='{ progress, current, queue, abort, errors }'>
-      <div class='uploading'>
-        uploading
-        <br />
-        <button @click='abort()'>abort</button>
-        <br />
-        {{ progress.length }} / {{ current.length }} / {{ queue.length }}
-        <br />
-        <button @click='abort()'>abort</button>
-        <b>errors:</b> <span v-for='error in errors'>{{ error.file.name }}</span>
-        <b>progress:</b> <div v-for='item in progress'>{{ item }}</div>
-        <b>current:</b>
-        <div v-for='item in current'>
-          {{ item.file.name }}: {{ item.current }} of {{ item.total }}
-        </div>
-        <b>remaining:</b>
-        <div v-for='file in queue'>{{ file.name }}</div>
-      </div>
-    </template>
-
-    <template #done='{ result, reset }'>
-      <div class='done'>
-        done
-        <br />
-        <button @click='reset()'>reset</button>
-        <br />
-        <div v-for='item in result'>{{ item }}</div>
-      </div>
-    </template>
-
-    <template #error='{ error, reset }'>
-      <div class='error'>
-        error
-        <br />
-        <button @click='reset()'>reset</button>
-        <div>{{ error }}</div>
-      </div>
-    </template>
-
-    <template #aborted='{ result, reset }'>
-      <div class='aborted'>
-        aborted
-        <br />
-        <button @click='reset()'>reset</button>
-        <div v-for='item in result'>{{ item }}</div>
-      </div>
-    </template>
-
-    <template #with-errors='{ result, errors }'>
-      <div class='with-errors'>
-        with errors
-        <br />
-        <b>errors(s):</b>
-        <div v-for='item in errors'>{{ item.file.name }} / {{ item.error }}</div>
-        <b>ok:</b>
-        <div v-for='item in result'>{{ item }}</div>
-      </div>
-    </template>
-  </component>
-</template>
-
-<style scoped>
-
-.uploader {
-  border: 3px dashed #fff;
-  width: 512px;
-  height: 384px;
-  position: absolute;
-  border-radius: 20px;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
-
-.idle,
-.hover,
-.wait,
-.uploading,
-.done,
-.error,
-.aborted,
-.with-errors {
-  width: 100%;
-  height: 100%;
-  border: 1px solid #0ff;
-  padding: 5px;
-  overflow: auto;
-}
-
-.status {
-  width: 25%;
-  height: auto;
-  background-color: #555;
-  color: #fff;
-  position: absolute;
-  right: 0px;
-  bottom: 0px;
-  padding: 2px 2px 2px 2px;
-  text-align: center;
-  font-weight: bold;
-  border-radius: 10px 0px 0px 0px;
-  border: 1px solid #0ff;
-  opacity: 0.75;
-}
-
-.idle {
-  background-color: #088;
-  color: black;
-}
-
-.hover {
-  background-color: #088;
-  color: white;
-  cursor: copy;
-}
-
-.wait {
-  background-color: #880;
-  color: black;
-}
-
-.uploading {
-  background-color: #050;
-  color: white;
-}
-
-.done {
-  background-color: #00f;
-  color: white;
-}
-
-.error {
-  background-color: #800;
-  color: white;
-}
-
-.aborted {
-  background-color: #300;
-  color: white;
-}
-
-.with-errors {
-  background-color: #800;
-  color: white;
-}
-
-</style>
-
Index: src/UploadZone.vue
===================================================================
--- src/UploadZone.vue	(revision 4b96189c351c92e8383b4411f7a4a73de521da76)
+++ src/UploadZone.vue	(revision 4b96189c351c92e8383b4411f7a4a73de521da76)
@@ -0,0 +1,299 @@
+<script setup lang="ts">
+
+import { ref, defineProps, withDefaults, defineEmits, getCurrentInstance, defineExpose } from 'vue'
+
+import $ from 'jQuery'
+
+interface Props {
+  target: string
+  tag?: string
+  maxJobs?: number
+  autoStart?: boolean | string
+  autoReset?: boolean | string
+  keepGoing?: boolean | string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  maxJobs: 3,
+  autoStart: false,
+  autoReset: false,
+  keepGoing: false,
+  tag: 'div'
+})
+
+const emit = defineEmits<{
+  (e: 'drag:over', evt: any): void
+  (e: 'drag:out', evt: any): void
+  (e: 'drop', evt: any, files: any[]): void
+  (e: 'upload:progress', vec: any[]): void
+  (e: 'upload:done', vec: any[]): void
+}>()
+
+const inst = getCurrentInstance()
+
+enum Mode {
+  m_idle = 'idle',
+  m_hover = 'hover',
+  m_wait = 'wait',
+  m_uploading = 'uploading',
+  m_done = 'done',
+  m_error = 'error',
+  m_with_errors = 'with_errors', // XXX av when keep-going set
+  m_aborted = 'aborted'
+}
+
+const mode = ref('idle' as Mode)
+
+const queue = ref([] as any[])
+const progress = ref({} as any)
+const results = ref([] as any[])
+const current = ref([] as any[])
+const error = ref({} as any)
+
+const errors = ref([] as any)
+
+let files: any[] = []
+
+let cur_jobs = 0
+let cur_file = 0
+
+let aborted = false
+
+const extract_files = (evt: any): any[] => {
+  const files = []
+
+  if(evt.dataTransfer && evt.dataTransfer.items !== undefined) {
+    for(const item of evt.dataTransfer.items)
+      if(item.kind == 'file')
+        files.push(item.getAsFile())
+  }
+  else
+    if(evt.dataTransfer)
+      for(const file of evt.dataTransfer.files)
+        files.push(file)
+    else // XXX elem click
+      for(const file of evt.target.files)
+        files.push(file)
+
+  return files
+}
+
+const drop = (evt: any): void => {
+  if(mode.value != Mode.m_hover && mode.value != Mode.m_idle && mode.value != Mode.m_wait)
+    return
+
+  mode.value = Mode.m_wait
+  files = files.concat(extract_files(evt))
+  emit('drop', evt, files)
+  queue.value = files
+
+  if(props.autoStart || props.autoStart === '')
+    start_cb()
+}
+
+const drag_over = (evt: any): void => {
+  if(mode.value != Mode.m_idle)
+    return
+
+  mode.value = Mode.m_hover
+  emit('drag:over', evt)
+}
+
+const drag_out = (evt: any): void => {
+  if(mode.value != Mode.m_hover)
+    return
+
+  mode.value = Mode.m_idle
+  //console.log('out', evt)
+  emit('drag:out', evt)
+}
+
+const start_cb = (): void => {
+  if(mode.value != Mode.m_wait)
+    return
+
+  aborted = false
+
+  mode.value = Mode.m_uploading
+
+  results.value = []
+  progress.value = []
+  current.value = []
+  errors.value = []
+
+  error.value = {}
+  cur_file = 0
+  cur_jobs = 0
+
+  while(cur_jobs < props.maxJobs && cur_file < files.length)
+    start_job()
+}
+
+const reset_cb = (): void => {
+  mode.value = Mode.m_idle
+  files = []
+}
+
+const pick_cb = (): void => {
+  if(mode.value != Mode.m_idle && Mode.value != Mode.m_wait)
+    return
+
+  const inp = document.createElement('input')
+  inp.setAttribute('type', 'file')
+  inp.setAttribute('multiple', 'true')
+  inp.addEventListener('input', (evt: any): void => {
+    drop(evt)
+  })
+  inp.click()
+}
+
+const abort_cb = (): void => {
+  if(mode.value != Mode.m_uploading)
+    return
+
+  aborted = true
+}
+
+const start_job = () => {
+  cur_jobs += 1
+
+  const fd = new FormData()
+  const cur = files[cur_file]
+  fd.append('file', files[cur_file])
+
+  current.value.push({
+    file: files[cur_file],
+    current: 0,
+    total: files[cur_file].size
+  })
+
+  queue.value = queue.value.filter(queue.value, (file) => {
+    return file !== cur
+  })
+
+  cur_file += 1
+
+  $.ajax({
+    url: props.target,
+    type: 'POST',
+    data: fd,
+    contentType: false,
+    processData: false,
+    xhr: (): any => {
+      const xhr = new window.XMLHttpRequest()
+
+      xhr.upload.addEventListener('progress', (evt): void => {
+        queue.value.forEach(current.value, (item) => {
+          if(item.file === cur) {
+            item.current = evt.loaded
+            item.total = evt.total
+          }
+        })
+      })
+
+      return xhr
+    }
+  })
+    .then((res: any) => {
+      current.value = queue.value.filter(current.value, (item) => {
+        return item.file !== cur
+      })
+
+      progress.value.push(res)
+      results.value.push(res)
+
+      emit('upload:progress', progress.value)
+
+      cur_jobs -= 1
+
+      if(aborted) {
+        if(props.autoReset || props.autoReset === '') {
+          mode.value = Mode.m_idle
+          files = [] // # XXX can drop w/o reset
+        }
+        else
+          mode.value = Mode.m_aborted
+
+        return
+      }
+
+      if(cur_file == files.length && !cur_jobs) {
+        emit('upload:done', results.value)
+
+        files = [] // XXX can drop w/o reset
+
+        if(errors.value.length) {
+          if(props.keepGoing || props.keepGoing === '')
+            mode.value = Mode.m_with_errors
+          else
+            mode.value = Mode.m_error
+        }
+        else
+          if(props.autoReset || props.autoReset === '')
+            mode.value = Mode.m_idle
+          else
+            mode.value = Mode.m_done
+
+        return
+      }
+
+      while(cur_jobs < props.maxJobs && cur_file < files.length)
+        start_job()
+    })
+    .catch((err: any) => {
+      if(props.keepGoing || props.keepGoing === '') {
+        current.value = current.value.filter(current.value, (item) => {
+          return item.file !== cur
+        })
+
+        errors.value.push({
+          error: err,
+          file: cur
+        })
+
+        cur_jobs -= 1
+
+        if(cur_file == files.length && !cur_jobs) {
+          mode.value = Mode.m_with_errors
+          return
+        }
+
+        while(cur_jobs < props.maxJobs && cur_file < files.length)
+          start_job()
+      }
+      else {
+        mode.value = Mode.m_error
+        error.value = err
+      }
+    })
+}
+
+defineExpose({
+  reset: reset_cb,
+  start: start_cb,
+  pick: pick_cb,
+  abort: abort_cb
+})
+
+</script>
+
+<template bindings="">
+  <component is='props.tag' @drop.prevent='drop' @dragover.prevent='drag_over' @dragleave.prevent='drag_out'>
+    <slot name='idle' v-if='mode == "idle"' v-bind:pick='pick_cb' />
+    <slot name='hover' v-if='mode == "hover"' />
+    <slot name='wait' v-if='mode == "wait"' v-bind:start='start_cb'
+          v-bind:queue='queue' v-bind:reset='reset_cb' />
+    <slot name='uploading' v-if='mode == "uploading"'
+          v-bind:progress='progress'
+          v-bind:current='current'
+          v-bind:queue='queue'
+          v-bind:errors='errors'
+          v-bind:abort='abort_cb' />
+    <slot name='done' v-if='mode == "done"' v-bind:result='results' v-bind:reset='reset_cb' />
+    <slot name='error' v-if='mode == "error"' v-bind:error='error' v-bind:reset='reset_cb' />
+    <slot name='aborted' v-if='mode == "aborted"' v-bind:result='results' v-bind:reset='reset_cb' />
+    <slot name='with-errors' v-if='mode == "with_errors"' v-bind:result='results' v-bind:errors='errors'
+          v-bind:reset='reset_cb' />
+  </component>
+</template>
+
Index: src/UploadZone0.vue
===================================================================
--- src/UploadZone0.vue	(revision 54176ee8abe2033da05f8e84d73bea143054abc9)
+++ 	(revision )
@@ -1,299 +1,0 @@
-<script setup lang="ts">
-
-import { ref, defineProps, withDefaults, defineEmits, getCurrentInstance, defineExpose } from 'vue'
-
-import $ from 'jQuery'
-
-interface Props {
-  target: string
-  tag?: string
-  maxJobs?: number
-  autoStart?: boolean | string
-  autoReset?: boolean | string
-  keepGoing?: boolean | string
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  maxJobs: 3,
-  autoStart: false,
-  autoReset: false,
-  keepGoing: false,
-  tag: 'div'
-})
-
-const emit = defineEmits<{
-  (e: 'drag:over', evt: any): void
-  (e: 'drag:out', evt: any): void
-  (e: 'drop', evt: any, files: any[]): void
-  (e: 'upload:progress', vec: any[]): void
-  (e: 'upload:done', vec: any[]): void
-}>()
-
-const inst = getCurrentInstance()
-
-enum Mode {
-  m_idle = 'idle',
-  m_hover = 'hover',
-  m_wait = 'wait',
-  m_uploading = 'uploading',
-  m_done = 'done',
-  m_error = 'error',
-  m_with_errors = 'with_errors', // XXX av when keep-going set
-  m_aborted = 'aborted'
-}
-
-const mode = ref('idle' as Mode)
-
-const queue = ref([] as any[])
-const progress = ref({} as any)
-const results = ref([] as any[])
-const current = ref([] as any[])
-const error = ref({} as any)
-
-const errors = ref([] as any)
-
-let files: any[] = []
-
-let cur_jobs = 0
-let cur_file = 0
-
-let aborted = false
-
-const extract_files = (evt: any): any[] => {
-  const files = []
-
-  if(evt.dataTransfer && evt.dataTransfer.items !== undefined) {
-    for(const item of evt.dataTransfer.items)
-      if(item.kind == 'file')
-        files.push(item.getAsFile())
-  }
-  else
-    if(evt.dataTransfer)
-      for(const file of evt.dataTransfer.files)
-        files.push(file)
-    else // XXX elem click
-      for(const file of evt.target.files)
-        files.push(file)
-
-  return files
-}
-
-const drop = (evt: any): void => {
-  if(mode.value != Mode.m_hover && mode.value != Mode.m_idle && mode.value != Mode.m_wait)
-    return
-
-  mode.value = Mode.m_wait
-  files = files.concat(extract_files(evt))
-  emit('drop', evt, files)
-  queue.value = files
-
-  if(props.autoStart || props.autoStart === '')
-    start_cb()
-}
-
-const drag_over = (evt: any): void => {
-  if(mode.value != Mode.m_idle)
-    return
-
-  mode.value = Mode.m_hover
-  emit('drag:over', evt)
-}
-
-const drag_out = (evt: any): void => {
-  if(mode.value != Mode.m_hover)
-    return
-
-  mode.value = Mode.m_idle
-  //console.log('out', evt)
-  emit('drag:out', evt)
-}
-
-const start_cb = (): void => {
-  if(mode.value != Mode.m_wait)
-    return
-
-  aborted = false
-
-  mode.value = Mode.m_uploading
-
-  results.value = []
-  progress.value = []
-  current.value = []
-  errors.value = []
-
-  error.value = {}
-  cur_file = 0
-  cur_jobs = 0
-
-  while(cur_jobs < props.maxJobs && cur_file < files.length)
-    start_job()
-}
-
-const reset_cb = (): void => {
-  mode.value = Mode.m_idle
-  files = []
-}
-
-const pick_cb = (): void => {
-  if(mode.value != Mode.m_idle && Mode.value != Mode.m_wait)
-    return
-
-  const inp = document.createElement('input')
-  inp.setAttribute('type', 'file')
-  inp.setAttribute('multiple', 'true')
-  inp.addEventListener('input', (evt: any): void => {
-    drop(evt)
-  })
-  inp.click()
-}
-
-const abort_cb = (): void => {
-  if(mode.value != Mode.m_uploading)
-    return
-
-  aborted = true
-}
-
-const start_job = () => {
-  cur_jobs += 1
-
-  const fd = new FormData()
-  const cur = files[cur_file]
-  fd.append('file', files[cur_file])
-
-  current.value.push({
-    file: files[cur_file],
-    current: 0,
-    total: files[cur_file].size
-  })
-
-  queue.value = queue.value.filter(queue.value, (file) => {
-    return file !== cur
-  })
-
-  cur_file += 1
-
-  $.ajax({
-    url: props.target,
-    type: 'POST',
-    data: fd,
-    contentType: false,
-    processData: false,
-    xhr: (): any => {
-      const xhr = new window.XMLHttpRequest()
-
-      xhr.upload.addEventListener('progress', (evt): void => {
-        queue.value.forEach(current.value, (item) => {
-          if(item.file === cur) {
-            item.current = evt.loaded
-            item.total = evt.total
-          }
-        })
-      })
-
-      return xhr
-    }
-  })
-    .then((res: any) => {
-      current.value = queue.value.filter(current.value, (item) => {
-        return item.file !== cur
-      })
-
-      progress.value.push(res)
-      results.value.push(res)
-
-      emit('upload:progress', progress.value)
-
-      cur_jobs -= 1
-
-      if(aborted) {
-        if(props.autoReset || props.autoReset === '') {
-          mode.value = Mode.m_idle
-          files = [] // # XXX can drop w/o reset
-        }
-        else
-          mode.value = Mode.m_aborted
-
-        return
-      }
-
-      if(cur_file == files.length && !cur_jobs) {
-        emit('upload:done', results.value)
-
-        files = [] // XXX can drop w/o reset
-
-        if(errors.value.length) {
-          if(props.keepGoing || props.keepGoing === '')
-            mode.value = Mode.m_with_errors
-          else
-            mode.value = Mode.m_error
-        }
-        else
-          if(props.autoReset || props.autoReset === '')
-            mode.value = Mode.m_idle
-          else
-            mode.value = Mode.m_done
-
-        return
-      }
-
-      while(cur_jobs < props.maxJobs && cur_file < files.length)
-        start_job()
-    })
-    .catch((err: any) => {
-      if(props.keepGoing || props.keepGoing === '') {
-        current.value = current.value.filter(current.value, (item) => {
-          return item.file !== cur
-        })
-
-        errors.value.push({
-          error: err,
-          file: cur
-        })
-
-        cur_jobs -= 1
-
-        if(cur_file == files.length && !cur_jobs) {
-          mode.value = Mode.m_with_errors
-          return
-        }
-
-        while(cur_jobs < props.maxJobs && cur_file < files.length)
-          start_job()
-      }
-      else {
-        mode.value = Mode.m_error
-        error.value = err
-      }
-    })
-}
-
-defineExpose({
-  reset: reset_cb,
-  start: start_cb,
-  pick: pick_cb,
-  abort: abort_cb
-})
-
-</script>
-
-<template bindings="">
-  <component is='props.tag' @drop.prevent='drop' @dragover.prevent='drag_over' @dragleave.prevent='drag_out'>
-    <slot name='idle' v-if='mode == "idle"' v-bind:pick='pick_cb' />
-    <slot name='hover' v-if='mode == "hover"' />
-    <slot name='wait' v-if='mode == "wait"' v-bind:start='start_cb'
-          v-bind:queue='queue' v-bind:reset='reset_cb' />
-    <slot name='uploading' v-if='mode == "uploading"'
-          v-bind:progress='progress'
-          v-bind:current='current'
-          v-bind:queue='queue'
-          v-bind:errors='errors'
-          v-bind:abort='abort_cb' />
-    <slot name='done' v-if='mode == "done"' v-bind:result='results' v-bind:reset='reset_cb' />
-    <slot name='error' v-if='mode == "error"' v-bind:error='error' v-bind:reset='reset_cb' />
-    <slot name='aborted' v-if='mode == "aborted"' v-bind:result='results' v-bind:reset='reset_cb' />
-    <slot name='with-errors' v-if='mode == "with_errors"' v-bind:result='results' v-bind:errors='errors'
-          v-bind:reset='reset_cb' />
-  </component>
-</template>
-