import { computed, ref, watchEffect } from 'vue';
import classNames from '../../../_util/classNames';
export default function useDrag(options) {
  const {
    prefixCls,
    direction,
    className,
    style,
    maxSize,
    minSize,
    containerRef,
    currentSize,
    onResize,
    onResizeEnd,
    onResizeStart
  } = options;
  const isDragging = ref(false);
  const startPos = ref(0);
  const startSize = ref(0);
  const isHorizontal = computed(() => direction.value === 'left' || direction.value === 'right');
  const handleMouseDown = e => {
    e.preventDefault();
    e.stopPropagation();
    isDragging.value = true;
    if (isHorizontal.value) {
      startPos.value = e.clientX;
    } else {
      startPos.value = e.clientY;
    }
    let _startSize;
    if (typeof currentSize.value === 'number') {
      _startSize = currentSize.value;
    } else if (containerRef === null || containerRef === void 0 ? void 0 : containerRef.value) {
      const rect = containerRef.value.getBoundingClientRect();
      _startSize = isHorizontal.value ? rect.width : rect.height;
    }
    startSize.value = _startSize;
    onResizeStart === null || onResizeStart === void 0 ? void 0 : onResizeStart(_startSize);
  };
  const handleMouseMove = e => {
    if (!isDragging.value) {
      return;
    }
    const currentPos = isHorizontal.value ? e.clientX : e.clientY;
    let delta = currentPos - startPos.value;
    if (direction.value === 'right' || direction.value === 'bottom') {
      delta = -delta;
    }
    let newSize = startSize.value + delta;
    if (newSize < 0) {
      newSize = 0;
    }
    if (maxSize.value && newSize > maxSize.value) {
      newSize = maxSize.value;
    }
    if (minSize.value && newSize < minSize.value) {
      newSize = minSize.value;
    }
    onResize === null || onResize === void 0 ? void 0 : onResize(newSize);
  };
  const handleMouseUp = () => {
    if (isDragging.value) {
      isDragging.value = false;
      if (containerRef === null || containerRef === void 0 ? void 0 : containerRef.value) {
        const rect = containerRef.value.getBoundingClientRect();
        const finalSize = isHorizontal.value ? rect.width : rect.height;
        onResizeEnd === null || onResizeEnd === void 0 ? void 0 : onResizeEnd(finalSize);
      }
    }
  };
  watchEffect(onCleanup => {
    if (isDragging.value) {
      document.addEventListener('mousemove', handleMouseMove);
      document.addEventListener('mouseup', handleMouseUp);
    }
    onCleanup(() => {
      document.removeEventListener('mousemove', handleMouseMove);
      document.removeEventListener('mouseup', handleMouseUp);
    });
  });
  const dragElementClassName = computed(() => classNames(`${prefixCls.value}-dragger`, `${prefixCls.value}-dragger-${direction.value}`, {
    [`${prefixCls.value}-dragger-dragging`]: isDragging.value,
    [`${prefixCls.value}-dragger-horizontal`]: isHorizontal.value,
    [`${prefixCls.value}-dragger-vertical`]: !isHorizontal.value
  }, className.value));
  return {
    isDragging,
    dragElementProps: computed(() => ({
      className: dragElementClassName.value,
      style: style.value,
      onMousedown: handleMouseDown
    }))
  };
}