'use strict';

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

var vue = require('vue');
require('../../../hooks/index.cjs');
var Preview = require('./Preview.cjs');
var context = require('./context.cjs');
var utils = require('./utils.cjs');
var index = require('../../../hooks/use-merged-state/index.cjs');

function imageGroupProps() {
  return {
    previewPrefixCls: String,
    preview: {
      type: [Boolean, Object],
      default: true
    },
    icons: {
      type: Object,
      default: () => ({})
    }
  };
}
const Group = /* @__PURE__ */ vue.defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "PreviewGroup",
  inheritAttrs: false,
  props: imageGroupProps(),
  setup(props, {
    slots
  }) {
    const preview = vue.computed(() => {
      const defaultValues = {
        visible: void 0,
        onVisibleChange: () => {
        },
        getContainer: void 0,
        current: 0
      };
      return typeof props.preview === "object" ? utils.mergeDefaultValue(props.preview, defaultValues) : defaultValues;
    });
    const previewUrls = vue.reactive(/* @__PURE__ */ new Map());
    const current = vue.ref();
    const previewVisible = vue.computed(() => preview.value.visible);
    const getPreviewContainer = vue.computed(() => preview.value.getContainer);
    const onPreviewVisibleChange = (val, preVal) => {
      var _a, _b;
      (_b = (_a = preview.value).onVisibleChange) == null ? void 0 : _b.call(_a, val, preVal);
    };
    const [isShowPreview, setShowPreview] = index.useMergedState(!!previewVisible.value, {
      value: previewVisible,
      onChange: onPreviewVisibleChange
    });
    const mousePosition = vue.ref(null);
    const isControlled = vue.computed(() => previewVisible.value !== void 0);
    const previewUrlsKeys = vue.computed(() => Array.from(previewUrls.keys()));
    const currentControlledKey = vue.computed(() => previewUrlsKeys.value[preview.value.current]);
    const canPreviewUrls = vue.computed(() => new Map(Array.from(previewUrls).filter(([, {
      canPreview
    }]) => !!canPreview).map(([id, {
      url
    }]) => [id, url])));
    const setPreviewUrls = (id, url, canPreview = true) => {
      previewUrls.set(id, {
        url,
        canPreview
      });
    };
    const setCurrent = (val) => {
      current.value = val;
    };
    const setMousePosition = (val) => {
      mousePosition.value = val;
    };
    const registerImage = (id, url, canPreview = true) => {
      const unRegister = () => {
        previewUrls.delete(id);
      };
      previewUrls.set(id, {
        url,
        canPreview
      });
      return unRegister;
    };
    const onPreviewClose = (e) => {
      e == null ? void 0 : e.stopPropagation();
      setShowPreview(false);
      setMousePosition(null);
    };
    vue.watch(currentControlledKey, (val) => {
      setCurrent(val);
    }, {
      immediate: true,
      flush: "post"
    });
    vue.watchEffect(() => {
      if (isShowPreview.value && isControlled.value)
        setCurrent(currentControlledKey.value);
    }, {
      flush: "post"
    });
    context.imageContext.provide({
      isPreviewGroup: vue.shallowRef(true),
      previewUrls: canPreviewUrls,
      setPreviewUrls,
      current,
      setCurrent,
      setShowPreview,
      setMousePosition,
      registerImage
    });
    return () => {
      const {
        ...dialogProps
      } = preview.value;
      return vue.createVNode(vue.Fragment, null, [slots.default && slots.default(), vue.createVNode(Preview.default, {
        ...dialogProps,
        "ria-hidden": !isShowPreview.value,
        "visible": isShowPreview.value,
        "prefixCls": props.previewPrefixCls,
        "onClose": onPreviewClose,
        "mousePosition": mousePosition.value,
        "src": canPreviewUrls.value.get(current.value),
        "icons": props.icons,
        "getContainer": getPreviewContainer.value
      }, null)]);
    };
  }
});

exports.default = Group;
exports.imageGroupProps = imageGroupProps;
//# sourceMappingURL=PreviewGroup.cjs.map
