aura-glass/dist/components/interactive/GlassDraggable.d.ts

A comprehensive glassmorphism design system for React applications with 142+ production-ready components

import React from "react";
export interface DragData {
    id: string;
    type: string;
    data?: any;
}
export interface GlassDraggableProps {
    /**
     * Unique identifier for the draggable item
     */
    id: string;
    /**
     * Drag type/category
     */
    type: string;
    /**
     * Additional data to pass during drag
     */
    data?: any;
    /**
     * Drag handle element
     */
    handle?: React.ReactNode;
    /**
     * Children to render
     */
    children: React.ReactNode;
    /**
     * Enable dragging
     */
    disabled?: boolean;
    /**
     * Drag start handler
     */
    onDragStart?: (data: DragData) => void;
    /**
     * Drag end handler
     */
    onDragEnd?: (data: DragData) => void;
    /**
     * Custom className
     */
    className?: string;
}
interface DragContextType {
    draggedItem: DragData | null;
    isDragging: boolean;
    dragOffset: {
        x: number;
        y: number;
    };
    setDraggedItem: (item: DragData | null) => void;
    setIsDragging: (dragging: boolean) => void;
    setDragOffset: (offset: {
        x: number;
        y: number;
    }) => void;
}
export declare const useDragContext: () => DragContextType | {
    isDragging: boolean;
    dragOffset: {
        x: number;
        y: number;
    };
    setIsDragging: () => void;
    setDragOffset: () => void;
};
/**
 * GlassDraggable component
 * Makes any element draggable with visual feedback
 */
export declare const GlassDraggable: React.FC<GlassDraggableProps>;
/**
 * GlassDroppable component
 * Drop zone that accepts draggable items
 */
export interface GlassDroppableProps {
    /**
     * Unique identifier for the drop zone
     */
    id: string;
    /**
     * Accepted drag types
     */
    accept?: string[];
    /**
     * Children to render
     */
    children: React.ReactNode;
    /**
     * Disable dropping
     */
    disabled?: boolean;
    /**
     * Drop handler
     */
    onDrop?: (data: DragData, dropZoneId: string) => void;
    /**
     * Drag over handler
     */
    onDragOver?: (data: DragData, dropZoneId: string) => void;
    /**
     * Drag leave handler
     */
    onDragLeave?: (data: DragData, dropZoneId: string) => void;
    /**
     * Custom className
     */
    className?: string;
}
export declare const GlassDroppable: React.FC<GlassDroppableProps>;
/**
 * GlassSortable component
 * Sortable list with drag-and-drop reordering
 */
export interface SortableItem {
    id: string;
    content: React.ReactNode;
    data?: any;
}
export interface GlassSortableProps {
    /**
     * Items to sort
     */
    items: SortableItem[];
    /**
     * Sort direction
     */
    direction?: "vertical" | "horizontal";
    /**
     * Item change handler
     */
    onChange?: (items: SortableItem[]) => void;
    /**
     * Custom className
     */
    className?: string;
}
export declare const GlassSortable: React.FC<GlassSortableProps>;
/**
 * DragProvider component
 * Provides drag context for advanced drag-and-drop scenarios
 */
export interface DragProviderProps {
    children: React.ReactNode;
    onDragStart?: (data: DragData) => void;
    onDragEnd?: (data: DragData) => void;
}
export declare const DragProvider: React.FC<DragProviderProps>;
export default GlassDraggable;
//# sourceMappingURL=GlassDraggable.d.ts.map