'use strict';

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

var vue = require('vue');
require('../../../../utils/index.cjs');
var context = require('../../../../components/table/src/context.cjs');
var log = require('../../../../utils/log.cjs');
var raf = require('../../../../utils/vue/raf.cjs');
var addEventListener = require('../../../../utils/event/addEventListener.cjs');
var supportsPassive = require('../../../../utils/event/supportsPassive.cjs');

const events = {
  mouse: {
    start: "mousedown",
    move: "mousemove",
    stop: "mouseup"
  },
  touch: {
    start: "touchstart",
    move: "touchmove",
    stop: "touchend"
  }
};
const defaultMinWidth = 50;
var DragHandleVue = /* @__PURE__ */ vue.defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "DragHandle",
  props: {
    prefixCls: String,
    width: {
      type: Number,
      required: true
    },
    minWidth: {
      type: Number,
      default: defaultMinWidth
    },
    maxWidth: {
      type: Number,
      default: Number.POSITIVE_INFINITY
    },
    column: {
      type: Object,
      default: void 0
    }
  },
  setup(props) {
    let startX = 0;
    let moveEvent = {
      remove: () => {
      }
    };
    let stopEvent = {
      remove: () => {
      }
    };
    const removeEvents = () => {
      moveEvent.remove();
      stopEvent.remove();
    };
    vue.onUnmounted(() => {
      removeEvents();
    });
    vue.watchEffect(() => {
      log.warningFn(!Number.isNaN(props.width), "Table", "width must be a number when use resizable");
    });
    const {
      onResizeColumn
    } = context.useInjectTableContext();
    const minWidth = vue.computed(() => {
      return typeof props.minWidth === "number" && !Number.isNaN(props.minWidth) ? props.minWidth : defaultMinWidth;
    });
    const maxWidth = vue.computed(() => {
      return typeof props.maxWidth === "number" && !Number.isNaN(props.maxWidth) ? props.maxWidth : Number.POSITIVE_INFINITY;
    });
    const instance = vue.getCurrentInstance();
    let baseWidth = 0;
    const dragging = vue.shallowRef(false);
    let rafId;
    const updateWidth = (e) => {
      let pageX = 0;
      if (e.touches) {
        if (e.touches.length) {
          pageX = e.touches[0].pageX;
        } else {
          pageX = e.changedTouches[0].pageX;
        }
      } else {
        pageX = e.pageX;
      }
      const tmpDeltaX = startX - pageX;
      let w = Math.max(baseWidth - tmpDeltaX, minWidth.value);
      w = Math.min(w, maxWidth.value);
      raf.raf.cancel(rafId);
      rafId = raf.raf(() => {
        onResizeColumn(w, props.column.__originColumn__);
      });
    };
    const handleMove = (e) => {
      updateWidth(e);
    };
    const handleStop = (e) => {
      dragging.value = false;
      updateWidth(e);
      removeEvents();
    };
    const handleStart = (e, eventsFor) => {
      dragging.value = true;
      removeEvents();
      baseWidth = instance.vnode.el.parentNode.getBoundingClientRect().width;
      if (e instanceof MouseEvent && e.which !== 1)
        return;
      if (e.stopPropagation)
        e.stopPropagation();
      startX = e.touches ? e.touches[0].pageX : e.pageX;
      moveEvent = addEventListener.addEventListenerWrap(document.documentElement, eventsFor.move, handleMove);
      stopEvent = addEventListener.addEventListenerWrap(document.documentElement, eventsFor.stop, handleStop);
    };
    const handleDown = (e) => {
      e.stopPropagation();
      e.preventDefault();
      handleStart(e, events.mouse);
    };
    const handleTouchDown = (e) => {
      e.stopPropagation();
      e.preventDefault();
      handleStart(e, events.touch);
    };
    const handleClick = (e) => {
      e.stopPropagation();
      e.preventDefault();
    };
    return () => {
      const {
        prefixCls
      } = props;
      const touchEvents = {
        [supportsPassive.supportsPassive ? "onTouchstartPassive" : "onTouchstart"]: (e) => handleTouchDown(e)
      };
      return vue.createVNode("div", {
        "class": `${prefixCls}-resize-handle ${dragging.value ? "dragging" : ""}`,
        "onMousedown": handleDown,
        ...touchEvents,
        "onClick": handleClick
      }, [vue.createVNode("div", {
        "class": `${prefixCls}-resize-handle-line`
      }, null)]);
    };
  }
});

exports.default = DragHandleVue;
//# sourceMappingURL=DragHandle.cjs.map
