/* import { EditorComponent, EDITOR_COMPONENT } from '../../editor' */
import './signature.css'

/**
 * 签名组件类
 */
export class Signature {
  constructor(options) {
    // 常量定义
    this.MAX_RECORD_COUNT = 1000 // 最大撤销记录数
    this.DEFAULT_WIDTH = 390     // 默认画布宽度
    this.DEFAULT_HEIGHT = 180    // 默认画布高度
    
    // 初始化属性
    this.undoStack = []         // 撤销栈
    this.x = 0                  // 当前绘制x坐标
    this.y = 0                  // 当前绘制y坐标
    this.isDrawing = false      // 是否正在绘制
    this.isDrawn = false        // 是否已经绘制
    this.linePoints = []        // 线条点位数组
    this.options = options      // 配置选项
    this.preTimeStamp = 0       // 上一次时间戳
    this.dpr = window.devicePixelRatio  // 设备像素比
    
    // 计算画布尺寸
    this.canvasWidth = (options.width || this.DEFAULT_WIDTH) * this.dpr
    this.canvasHeight = (options.height || this.DEFAULT_HEIGHT) * this.dpr

    // 渲染DOM并获取引用
    const { mask, container, trashContainer, undoContainer, canvas } = this._render()
    this.mask = mask
    this.container = container
    this.trashContainer = trashContainer
    this.undoContainer = undoContainer
    this.canvas = canvas
    
    // 初始化画布上下文
    this.ctx = canvas.getContext('2d')
    this.ctx.scale(this.dpr, this.dpr)
    this.ctx.lineCap = 'round'
    
    // 绑定事件
    this._bindEvent()
    this._clearUndoFn()
    
    // 防止页面滚动
    document.documentElement.classList.add('overflow-hidden')
    document.body.classList.add('overflow-hidden')
    this.container.classList.add('overflow-hidden')
  }

  // ... 其他代码保持不变，只转换类型标注 ...

  /**
   * 转换签名为图片数据
   * @returns {Object|null} 包含签名图片数据的对象
   */
  _toData() {
    if (!this.linePoints.length) return null
    
    // 查找签名范围
    const startX = this.linePoints[0][0]
    const startY = this.linePoints[0][1]
    let minX = startX
    let minY = startY
    let maxX = startX
    let maxY = startY
    
    // 计算签名的边界框
    for (let p = 0; p < this.linePoints.length; p++) {
      const point = this.linePoints[p]
      if (minX > point[0]) minX = point[0]
      if (maxX < point[0]) maxX = point[0]
      if (minY > point[1]) minY = point[1]
      if (maxY < point[1]) maxY = point[1]
    }
    
    // 处理边框宽度
    const lineWidth = this.ctx.lineWidth
    minX = minX < lineWidth ? 0 : minX - lineWidth
    minY = minY < lineWidth ? 0 : minY - lineWidth
    maxX = maxX + lineWidth
    maxY = maxY + lineWidth
    const sw = maxX - minX
    const sh = maxY - minY
    
    // 裁剪签名图像
    const imageData = this.ctx.getImageData(
      minX * this.dpr,
      minY * this.dpr,
      sw * this.dpr,
      sh * this.dpr
    )
    
    // 创建新画布并输出结果
    const canvas = document.createElement('canvas')
    canvas.style.width = `${sw}px`
    canvas.style.height = `${sh}px`
    canvas.width = sw * this.dpr
    canvas.height = sh * this.dpr
    const ctx = canvas.getContext('2d')
    ctx.putImageData(imageData, 0, 0)
    
    return {
      value: canvas.toDataURL(),
      width: sw,
      height: sh
    }
  }
}
