import type { InjectionKey, Ref } from 'vue'; /** * Basic position with x/y coordinates */ export interface Position { x: number; y: number; } /** * Rectangular bounds (for selection box, collision detection, etc.) */ export interface Rect { x: number; y: number; width: number; height: number; } /** * Item type - file or folder/container */ export type ItemType = 'item' | 'container'; /** * Base interface for freeform items. * Users extend this with their own data via generics. * * @example * interface MyFile extends FreeformItemData { * name: string * size: number * } */ export interface FreeformItemData { id: string; type?: ItemType; position?: Position; disabled?: boolean; } /** * Internal item state managed by the library */ export interface FreeformItemState { selected: boolean; dragging: boolean; dropTarget: boolean; } /** * Complete item with user data + internal state */ export type FreeformItem = T & { __state: FreeformItemState; }; /** * Current drag operation state */ export interface DragState { /** Is a drag operation active? */ active: boolean; /** Items being dragged */ items: T[]; /** Starting position of the drag */ startPosition: Position | null; /** Current position during drag */ currentPosition: Position | null; /** Offset from item origin to mouse position */ offset: Position | null; /** Has the drag threshold been passed? (prevents accidental drags) */ thresholdPassed: boolean; } /** * Drag event payload */ export interface DragEventPayload { items: T[]; position: Position; event: PointerEvent; } /** * Type of drop target */ export type DropTargetType = 'reorder' | 'container' | 'zone' | null; /** * Drop target information */ export interface DropTarget { /** The container item that is the drop target */ item: T; /** Element bounds for hit testing */ bounds: Rect; /** Type of drop target */ type: DropTargetType; /** Whether the drop is accepted by the target */ accepted: boolean; } /** * Drop zone registry entry */ export interface DropZoneEntry { id: string; element: HTMLElement; item?: T; accept?: (items: T[]) => boolean; } /** * Drop event payload */ export interface DropEventPayload { /** Items that were dropped */ items: T[]; /** Target where items were dropped (null = dropped on canvas) */ target: DropTarget | null; /** Final position */ position: Position; /** For sorting: original index */ fromIndex?: number; /** For sorting: new index */ toIndex?: number; /** Container item if dropped into a container */ targetContainer?: T | null; /** Zone ID if dropped to external drop zone */ targetZoneId?: string; /** Container ID if dropped into a container in external zone */ targetContainerId?: string | null; /** Type of drop operation */ dropType: DropTargetType; } /** * Selection state */ export interface SelectionState { /** Currently selected items */ items: T[]; /** Is lasso selection active? */ lassoActive: boolean; /** Current lasso rectangle bounds */ lassoRect: Rect | null; } /** * Selection event payload */ export interface SelectionEventPayload { items: T[]; /** Was shift held? (range select) */ shift: boolean; /** Was ctrl/cmd held? (toggle select) */ ctrl: boolean; } /** * Freeform container props */ export interface FreeformProps { /** Items to display (v-model) */ modelValue: T[]; /** Enable grid-based sorting */ sortable?: boolean; /** Enable lasso selection */ selectionEnabled?: boolean; /** Enable drag & drop */ dragEnabled?: boolean; /** Minimum pixels to move before drag starts */ dragThreshold?: number; /** Disable all interactions */ disabled?: boolean; } /** * Freeform container emits */ export interface FreeformEmits { 'update:modelValue': [items: T[]]; 'select': [payload: SelectionEventPayload]; 'drag-start': [payload: DragEventPayload]; 'drag-move': [payload: DragEventPayload]; 'drag-end': [payload: DragEventPayload]; 'drop': [payload: DropEventPayload]; 'reorder': [fromIndex: number, toIndex: number]; } /** * FreeformItem component props */ export interface FreeformItemProps { /** Item data */ item: T; /** Custom drag handle selector (if not set, whole item is draggable) */ handle?: string; /** Disable dragging for this item */ disabled?: boolean; /** Mark this item as a drop zone (auto-detected if item.type === 'container') */ asDropZone?: boolean; /** Accept function to validate drops (only used when asDropZone is true) */ accept?: (items: T[]) => boolean; } /** * FreeformDropZone component props */ export interface FreeformDropZoneProps { /** Associated item (for container-type items) */ item?: T; /** Accept function to validate drops */ accept?: (items: T[]) => boolean; } /** * Props passed to item slot */ export interface ItemSlotProps { item: T; selected: boolean; dragging: boolean; dropTarget: boolean; } /** * Props passed to selection-box slot */ export interface SelectionBoxSlotProps { bounds: Rect; itemCount: number; } /** * Props passed to drag-ghost slot */ export interface DragGhostSlotProps { items: T[]; count: number; position: Position; } /** * Props passed to drop-indicator slot */ export interface DropIndicatorSlotProps { valid: boolean; bounds: Rect; } /** * Freeform context provided to child components */ export interface FreeformContext { items: Readonly; dragState: Readonly>; selectionState: Readonly>; currentDropTarget: Ref | null>; registerItem: (id: string, element: HTMLElement) => void; unregisterItem: (id: string) => void; registerDropZone: (id: string, element: HTMLElement, item?: T, accept?: (items: T[]) => boolean) => void; unregisterDropZone: (id: string) => void; select: (item: T, options?: { shift?: boolean; ctrl?: boolean; }) => void; selectAll: () => void; clearSelection: () => void; startDrag: (items: T[], event: PointerEvent) => void; } /** * Registered Freeform data for FreeformSelection */ export interface RegisteredFreeform { items: Ref; itemElements: Map; disabled: Ref; selectionState: Ref>; } /** * Selection context provided by FreeformSelection */ export interface SelectionContext { registerFreeform: (ctx: RegisteredFreeform) => void; unregisterFreeform: () => void; } /** * Injection key for selection context */ export declare const SELECTION_CONTEXT_KEY: InjectionKey; /** * Grid cell position */ export interface GridCell { x: number; y: number; } /** * Context provided by FreeformGrid to children */ export interface FreeformGridContext { columns: Ref; rows: Ref; hoveredCell: Ref; isDragging: Ref; } /** * Injection key for FreeformGrid context */ export declare const FREEFORM_GRID_KEY: InjectionKey; /** * Configuration options for the module */ export interface FreeformModuleOptions { /** Prefix for CSS custom properties */ cssPrefix?: string; /** Default drag threshold in pixels */ defaultDragThreshold?: number; } /** * Animation configuration */ export interface AnimationConfig { /** Duration in ms */ duration: number; /** Easing function */ easing: string; }