'use strict';

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

var vue = require('vue');
var index = require('../fileComponent/index.js');
var index$1 = require('../previewFile/index.js');
var fileList = require('./fileList.js');

var _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...{
    name: "GmFileList"
  },
  __name: "FileList",
  props: fileList.fileProProps,
  setup(__props) {
    const props = __props;
    const fileListStyle = vue.computed(() => {
      return {
        gap: props.fileListGap,
        ...props.fileListStyle
      };
    });
    const fileStyle = vue.computed(() => {
      return {
        width: props.fileWidth,
        height: props.fileHeight,
        border: "1px solid #ccc",
        overflow: "hidden",
        borderRadius: "5px",
        ...props.fileStyle
      };
    });
    const dialog = vue.ref(false);
    const fileIndex = vue.ref(0);
    const handleClick = (file, index) => {
      fileIndex.value = index;
      dialog.value = true;
    };
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock(
        vue.Fragment,
        null,
        [
          vue.createElementVNode(
            "div",
            {
              class: "gm-flex gm-flex-wrap gm-items-center",
              style: vue.normalizeStyle(fileListStyle.value)
            },
            [
              (vue.openBlock(true), vue.createElementBlock(
                vue.Fragment,
                null,
                vue.renderList(_ctx.fileList, (file, index$1) => {
                  return vue.openBlock(), vue.createElementBlock("div", {
                    key: index$1,
                    class: "gm-cursor-pointer"
                  }, [
                    vue.createVNode(vue.unref(index.GmFileComponent), vue.mergeProps(props, {
                      fileStyle: fileStyle.value,
                      file,
                      controls: false,
                      "on-click": (value) => handleClick(value, index$1)
                    }), {
                      default: vue.withCtx(() => [
                        vue.renderSlot(_ctx.$slots, "default", { file })
                      ]),
                      _: 2
                      /* DYNAMIC */
                    }, 1040, ["fileStyle", "file", "on-click"])
                  ]);
                }),
                128
                /* KEYED_FRAGMENT */
              ))
            ],
            4
            /* STYLE */
          ),
          vue.createVNode(vue.unref(index$1.GmPreviewFile), vue.mergeProps(props, {
            dialogVisible: dialog.value,
            "onUpdate:dialogVisible": _cache[0] || (_cache[0] = ($event) => dialog.value = $event),
            "file-index": fileIndex.value,
            "onUpdate:fileIndex": _cache[1] || (_cache[1] = ($event) => fileIndex.value = $event)
          }), null, 16, ["dialogVisible", "file-index"])
        ],
        64
        /* STABLE_FRAGMENT */
      );
    };
  }
});

exports.default = _sfc_main;
//# sourceMappingURL=FileList.vue2.js.map
