/* * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved. * This file is licensed to you under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. You may obtain a copy * of the License at https://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software distributed under * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS * OF ANY KIND, either express or implied. See the License for the specific language * governing permissions and limitations under the License. */ import { KanbanCardData, KanbanColumnData } from "../../components/kanban/types.js"; import * as _dnd_kit_core0 from "@dnd-kit/core"; import * as _dnd_kit_core_dist_hooks_utilities0 from "@dnd-kit/core/dist/hooks/utilities"; //#region src/hooks/kanban/index.d.ts /** * Hook that provides drag-and-drop interactions for a kanban column. * * This hook integrates with `@dnd-kit/core` to enable dropping cards into columns. * It tracks hover states, validates drop targets based on the column's `canDrop` property, * and provides visual feedback states for both the column itself and cards within it. * * @param column - The kanban column data object containing the column's id, canDrop status, and other properties * * @returns An object containing: * - `ref` - Ref callback to attach to the droppable column DOM element * - `isHighlighted` - Boolean indicating if the column should be visually highlighted (when a card from another column is being dragged) * - `isActive` - Boolean indicating if the column is actively being hovered over and can accept the drop * * @example * ```tsx * function KanbanColumn({ column }: { column: KanbanColumnData }) { * const { ref, isHighlighted, isActive } = useColumnInteractions(column); * * return ( *
*

{column.title}

* {column.cards.map(card => )} *
* ); * } * ``` */ declare function useColumnInteractions(column: KanbanColumnData): { ref: (element: HTMLElement | null) => void; isHighlighted: boolean; isActive: boolean; }; /** * Hook that provides drag-and-drop interactions for a kanban card. * * This hook integrates with `@dnd-kit/sortable` to enable dragging, dropping, and reordering * of cards within and between columns. It handles transform animations, drag state tracking, * and edge detection for insertion positioning. * * @param card - The kanban card data object containing the card's id and other properties * * @returns An object containing: * - `ref` - Ref callback to attach to the draggable card DOM element * - `isDragging` - Boolean indicating if this card is currently being dragged * - `closestEdge` - The closest edge ('top' or 'bottom') when another card is hovering over this card, or null if not hovering * - `style` - CSS style object with transform and transition properties for drag animations * - `attributes` - Accessibility and drag attributes to spread on the card element * - `listeners` - Event listeners to spread on the drag handle element * * @example * ```tsx * function KanbanCard({ card }: { card: KanbanCardData }) { * const { ref, isDragging, closestEdge, style, attributes, listeners } = useCardInteractions(card); * * return ( *
* {card.title} * {closestEdge && } *
* ); * } * ``` */ declare function useCardInteractions(card: KanbanCardData): { ref: (node: HTMLElement | null) => void; isDragging: boolean; closestEdge: "top" | "bottom" | undefined; style: { transform: string | undefined; transition: string | undefined; }; attributes: _dnd_kit_core0.DraggableAttributes; listeners: _dnd_kit_core_dist_hooks_utilities0.SyntheticListenerMap | undefined; }; //#endregion export { useCardInteractions, useColumnInteractions }; //# sourceMappingURL=index.d.ts.map