import { defineComponent, ref } from 'vue'

import { initDefaultProps } from '../_util/props-util'
import AjaxUpload from './AjaxUploader'
import type { RcFile } from './interface'
import { uploadProps } from './interface'

function empty() {}

export default defineComponent({
  compatConfig: { MODE: 3 },
  name: 'Upload',
  inheritAttrs: false,
  props: initDefaultProps(uploadProps(), {
    componentTag: 'span',
    prefixCls: 'rc-upload',
    data: {},
    headers: {},
    name: 'file',
    multipart: false,
    onStart: empty,
    onError: empty,
    onSuccess: empty,
    multiple: false,
    beforeUpload: null,
    customRequest: null,
    withCredentials: false,
    openFileDialogOnClick: true,
  }),
  setup(props, { slots, attrs, expose }) {
    const uploader = ref()

    const abort = (file: RcFile) => {
      uploader.value?.abort(file)
    }
    expose({
      abort,
    })
    return () => {
      return <AjaxUpload {...props} {...attrs} v-slots={slots} ref={uploader} />
    }
  },
})
