'use strict';

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

var vue = require('vue');
var iconsVue = require('@ant-design/icons-vue');
require('../../../utils/index.cjs');
require('../../../vue-components/index.cjs');
require('../../../hooks/index.cjs');
var useConfigInject = require('../../config-provider/src/hooks/useConfigInject.cjs');
var index = require('../style/index.cjs');
var FloatButton = require('./FloatButton.cjs');
var context = require('./context.cjs');
var props = require('./props.cjs');
var constants = require('./constants.cjs');
var initDefaultProps = require('../../../utils/vue/initDefaultProps.cjs');
var index$1 = require('../../../hooks/use-merged-state/index.cjs');
var props$1 = require('../../../utils/vue/props.cjs');
var canUseDom = require('../../../utils/dom/canUseDom.cjs');
var _class = require('../../../utils/dom/class.cjs');
var transition = require('../../../vue-components/transition/src/transition.cjs');

var floatButtonGroup = /* @__PURE__ */ vue.defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "AFloatButtonGroup",
  inheritAttrs: false,
  props: initDefaultProps.initDefaultProps(props.floatButtonGroupProps(), {
    type: "default",
    shape: "circle"
  }),
  setup(props, {
    attrs,
    slots,
    emit
  }) {
    const {
      prefixCls,
      direction
    } = useConfigInject.default(constants.floatButtonPrefixCls, props);
    const [wrapSSR, hashId] = index.default(prefixCls);
    const [open, setOpen] = index$1.useMergedState(false, {
      value: vue.computed(() => props.open)
    });
    const floatButtonGroupRef = vue.ref(null);
    const floatButtonRef = vue.ref(null);
    context.useProvideFloatButtonGroupContext({
      shape: vue.computed(() => props.shape)
    });
    const hoverTypeAction = {
      onMouseenter() {
        var _a;
        setOpen(true);
        emit("update:open", true);
        (_a = props.onOpenChange) == null ? void 0 : _a.call(props, true);
      },
      onMouseleave() {
        var _a;
        setOpen(false);
        emit("update:open", false);
        (_a = props.onOpenChange) == null ? void 0 : _a.call(props, false);
      }
    };
    const hoverAction = vue.computed(() => {
      return props.trigger === "hover" ? hoverTypeAction : {};
    });
    const handleOpenChange = () => {
      var _a;
      const nextOpen = !open.value;
      emit("update:open", nextOpen);
      (_a = props.onOpenChange) == null ? void 0 : _a.call(props, nextOpen);
      setOpen(nextOpen);
    };
    const onClick = (e) => {
      var _a, _b, _c;
      if ((_a = floatButtonGroupRef.value) == null ? void 0 : _a.contains(e.target)) {
        if ((_b = props$1.findDOMNode(floatButtonRef.value)) == null ? void 0 : _b.contains(e.target))
          handleOpenChange();
        return;
      }
      setOpen(false);
      emit("update:open", false);
      (_c = props.onOpenChange) == null ? void 0 : _c.call(props, false);
    };
    vue.watch(vue.computed(() => props.trigger), (value) => {
      if (!canUseDom.canUseDom())
        return;
      document.removeEventListener("click", onClick);
      if (value === "click")
        document.addEventListener("click", onClick);
    }, {
      immediate: true
    });
    vue.onBeforeUnmount(() => {
      document.removeEventListener("click", onClick);
    });
    return () => {
      var _a;
      const {
        shape = "circle",
        type = "default",
        tooltip,
        description,
        trigger
      } = props;
      const groupPrefixCls = `${prefixCls.value}-group`;
      const groupCls = _class.classNames(groupPrefixCls, hashId.value, attrs.class, {
        [`${groupPrefixCls}-rtl`]: direction.value === "rtl",
        [`${groupPrefixCls}-${shape}`]: shape,
        [`${groupPrefixCls}-${shape}-shadow`]: !trigger
      });
      const wrapperCls = _class.classNames(hashId.value, `${groupPrefixCls}-wrap`);
      const transitionProps = transition.getTransitionProps(`${groupPrefixCls}-wrap`);
      return wrapSSR(vue.createVNode("div", {
        "ref": floatButtonGroupRef,
        ...attrs,
        "class": groupCls,
        ...hoverAction.value
      }, [trigger && ["click", "hover"].includes(trigger) ? vue.createVNode(vue.Fragment, null, [vue.createVNode(vue.Transition, transitionProps, {
        default: () => [vue.withDirectives(vue.createVNode("div", {
          "class": wrapperCls
        }, [slots.default && slots.default()]), [[vue.vShow, open.value]])]
      }), vue.createVNode(FloatButton.default, {
        "ref": floatButtonRef,
        "type": type,
        "shape": shape,
        "tooltip": tooltip,
        "description": description
      }, {
        icon: () => {
          var _a2, _b;
          return open.value ? ((_a2 = slots.closeIcon) == null ? void 0 : _a2.call(slots)) || vue.createVNode(iconsVue.CloseOutlined, null, null) : ((_b = slots.icon) == null ? void 0 : _b.call(slots)) || vue.createVNode(iconsVue.FileTextOutlined, null, null);
        },
        tooltip: slots.tooltip,
        description: slots.description
      })]) : (_a = slots.default) == null ? void 0 : _a.call(slots)]));
    };
  }
});

exports.default = floatButtonGroup;
//# sourceMappingURL=FloatButtonGroup.cjs.map
