vue3-sketch-ruler/lib/composables/useSketchRuler.d.ts

> 是一个基于 Vue 3 + TypeScript 的标尺组件库，适用于低代码平台、大屏可视化、做图工具等场景，提供类似 Photoshop 的缩放与标尺辅助线体验。

import { ComputedRef, Ref, CSSProperties } from 'vue';
import { RulerState, GuideLine, RulerPalette, TransformEngine } from '@sketch-ruler/core';
import { RulerContext } from '../state/ruler-context';
export interface SketchRulerOptions {
    width: number;
    height: number;
    canvasWidth: number;
    canvasHeight: number;
    thick?: number;
    scale?: number;
    palette?: Partial<RulerPalette>;
    lines?: {
        h: number[];
        v: number[];
    };
    snapThreshold?: number;
    lockLine?: boolean;
    minZoom?: number;
    maxZoom?: number;
    zoomStep?: number;
    autoCenter?: boolean;
    showRuler?: boolean;
}
export interface UseSketchRulerReturn {
    engine: TransformEngine;
    scale: Ref<number>;
    offset: Ref<{
        x: number;
        y: number;
    }>;
    rectWidth: ComputedRef<number>;
    rectHeight: ComputedRef<number>;
    rectStyle: ComputedRef<CSSProperties>;
    canvasStyle: ComputedRef<CSSProperties>;
    cornerStyle: ComputedRef<CSSProperties>;
    paletteCpu: ComputedRef<RulerPalette>;
    horizontalLines: ComputedRef<GuideLine[]>;
    verticalLines: ComputedRef<GuideLine[]>;
    state: Ref<RulerState>;
    zoomIn: () => void;
    zoomOut: () => void;
    reset: () => void;
    panBy: (dx: number, dy: number) => void;
    setTransform: (t: {
        scale?: number;
        x?: number;
        y?: number;
    }) => void;
    addLine: (line: Omit<GuideLine, 'id'>) => void;
    moveLine: (id: string, position: number) => void;
    removeLine: (id: string) => void;
    toggleLineLock: (id: string) => void;
    context: RulerContext;
}
export declare function useSketchRuler(options: SketchRulerOptions): UseSketchRulerReturn;
//# sourceMappingURL=useSketchRuler.d.ts.map