'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
var index$2 = require('../../icon/index.js');
var iconsVue = require('@element-plus/icons-vue');
require('../../../hooks/index.js');
var uploadList = require('./upload-list2.js');
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
var index = require('../../../hooks/use-locale/index.js');
var index$1 = require('../../../hooks/use-namespace/index.js');

const _hoisted_1 = ["onKeydown"];
const _hoisted_2 = ["src"];
const _hoisted_3 = ["onClick"];
const _hoisted_4 = ["onClick"];
const __default__ = {
  name: "ElUploadList"
};
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...__default__,
  props: uploadList.uploadListProps,
  emits: uploadList.uploadListEmits,
  setup(__props, { emit }) {
    const props = __props;
    const { t } = index.useLocale();
    const nsUpload = index$1.useNamespace("upload");
    const nsIcon = index$1.useNamespace("icon");
    const focusing = vue.ref(false);
    const handleClick = (file) => {
      props.handlePreview(file);
    };
    const handleRemove = (file) => {
      emit("remove", file);
    };
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
        vue.createElementVNode("ul", {
          class: vue.normalizeClass([
            vue.unref(nsUpload).b("list"),
            vue.unref(nsUpload).bm("list", _ctx.listType),
            { "is-disabled": _ctx.disabled },
            _ctx.customerClass
          ])
        }, [
          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.files, (file) => {
            return vue.openBlock(), vue.createElementBlock("li", {
              key: file.uid || file.name,
              class: vue.normalizeClass([
                vue.unref(nsUpload).be("list", "item"),
                vue.unref(nsUpload).is(file.status),
                { focusing: focusing.value }
              ]),
              tabindex: "0",
              onKeydown: vue.withKeys(($event) => !_ctx.disabled && handleRemove(file), ["delete"]),
              onFocus: _cache[0] || (_cache[0] = ($event) => focusing.value = true),
              onBlur: _cache[1] || (_cache[1] = ($event) => focusing.value = false),
              onClick: _cache[2] || (_cache[2] = ($event) => focusing.value = false)
            }, [
              vue.renderSlot(_ctx.$slots, "default", { file }, () => [
                _ctx.listType === "picture" || file.status !== "uploading" && _ctx.listType === "picture-card" ? (vue.openBlock(), vue.createElementBlock("img", {
                  key: 0,
                  class: vue.normalizeClass(vue.unref(nsUpload).be("list", "item-thumbnail")),
                  src: file.url,
                  alt: ""
                }, null, 10, _hoisted_2)) : vue.createCommentVNode("v-if", true),
                vue.createElementVNode("a", {
                  class: vue.normalizeClass(vue.unref(nsUpload).be("list", "item-name")),
                  onClick: ($event) => handleClick(file)
                }, [
                  vue.createVNode(vue.unref(index$2.ElIcon), {
                    class: vue.normalizeClass(vue.unref(nsIcon).m("document"))
                  }, {
                    default: vue.withCtx(() => [
                      vue.createVNode(vue.unref(iconsVue.Document))
                    ]),
                    _: 1
                  }, 8, ["class"]),
                  vue.createTextVNode(" " + vue.toDisplayString(file.name), 1)
                ], 10, _hoisted_3),
                _ctx.listType === "text" ? (vue.openBlock(), vue.createElementBlock("label", {
                  key: 1,
                  class: vue.normalizeClass(vue.unref(nsUpload).be("list", "item-status-label"))
                }, [
                  vue.createVNode(vue.unref(index$2.ElIcon), {
                    class: vue.normalizeClass([vue.unref(nsIcon).m("upload-success"), vue.unref(nsIcon).m("circle-check")])
                  }, {
                    default: vue.withCtx(() => [
                      vue.createVNode(vue.unref(iconsVue.CircleCheck))
                    ]),
                    _: 1
                  }, 8, ["class"]),
                  ["picture-card", "picture"].includes(_ctx.listType) ? (vue.openBlock(), vue.createBlock(vue.unref(index$2.ElIcon), {
                    key: 0,
                    class: vue.normalizeClass([vue.unref(nsIcon).m("upload-success"), vue.unref(nsIcon).m("check")])
                  }, {
                    default: vue.withCtx(() => [
                      vue.createVNode(vue.unref(iconsVue.Check))
                    ]),
                    _: 1
                  }, 8, ["class"])) : vue.createCommentVNode("v-if", true)
                ], 2)) : vue.createCommentVNode("v-if", true),
                !_ctx.disabled ? (vue.openBlock(), vue.createBlock(vue.unref(index$2.ElIcon), {
                  key: 2,
                  class: vue.normalizeClass(vue.unref(nsIcon).m("close")),
                  onClick: vue.withModifiers(($event) => handleRemove(file), ["stop"])
                }, {
                  default: vue.withCtx(() => [
                    vue.createVNode(vue.unref(iconsVue.Close))
                  ]),
                  _: 2
                }, 1032, ["class", "onClick"])) : vue.createCommentVNode("v-if", true),
                vue.createCommentVNode(" Due to close btn only appears when li gets focused disappears after li gets blurred, thus keyboard navigation can never reach close btn"),
                vue.createCommentVNode(" This is a bug which needs to be fixed "),
                vue.createCommentVNode(" TODO: Fix the incorrect navigation interaction "),
                !_ctx.disabled ? (vue.openBlock(), vue.createElementBlock("i", {
                  key: 3,
                  class: vue.normalizeClass(vue.unref(nsIcon).m("close-tip"))
                }, vue.toDisplayString(vue.unref(t)("el.upload.deleteTip")), 3)) : vue.createCommentVNode("v-if", true),
                _ctx.listType === "picture-card" ? (vue.openBlock(), vue.createElementBlock("span", {
                  key: 4,
                  class: vue.normalizeClass(vue.unref(nsUpload).be("list", "item-actions"))
                }, [
                  vue.createCommentVNode(` <label
            class="el-upload-list__item-replace"
            for='replace'
          >
            \u66FF\u6362
            <input
              name='replace'
              class="el-upload__input"
              type="file"
              @change="handleReplace"
            />
          </label> `),
                  !_ctx.disabled && _ctx.showDelete ? (vue.openBlock(), vue.createElementBlock("span", {
                    key: 0,
                    class: vue.normalizeClass(vue.unref(nsUpload).be("list", "item-delete")),
                    onClick: vue.withModifiers(($event) => handleRemove(file), ["stop"])
                  }, [
                    vue.createVNode(vue.unref(index$2.ElIcon), {
                      class: vue.normalizeClass(vue.unref(nsIcon).m("delete"))
                    }, {
                      default: vue.withCtx(() => [
                        vue.createVNode(vue.unref(iconsVue.Delete))
                      ]),
                      _: 1
                    }, 8, ["class"])
                  ], 10, _hoisted_4)) : vue.createCommentVNode("v-if", true)
                ], 2)) : vue.createCommentVNode("v-if", true)
              ])
            ], 42, _hoisted_1);
          }), 128))
        ], 2),
        vue.renderSlot(_ctx.$slots, "append")
      ], 64);
    };
  }
});
var ElUploadList = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "/Users/judai/code/d-element-plus/packages/components/upload/src/upload-list.vue"]]);

exports["default"] = ElUploadList;
//# sourceMappingURL=upload-list.js.map
