/**
 * @license MIT
 * author: Cube Dev Team
 * @cube-dev/ui-kit v0.0.0-canary-e980ce7
 * Released under the MIT license.
 */

import { jsx as _jsx } from "react/jsx-runtime";
import { useRef } from 'react';
import { useDropIndicator } from 'react-aria';
import { DropIndicatorElement } from './styled.js';
// =============================================================================
// Component
// =============================================================================
/**
 * Visual drop indicator for drag-and-drop tab reordering.
 *
 * Renders a vertical line showing where the dragged tab will be dropped.
 * Only visible when the drop target is active.
 */
export function TabDropIndicator({ target, dropState, position, }) {
    const ref = useRef(null);
    const { dropIndicatorProps, isHidden, isDropTarget } = useDropIndicator({ target }, dropState, ref);
    if (isHidden) {
        return null;
    }
    return (_jsx(DropIndicatorElement, { ref: ref, role: "option", ...dropIndicatorProps, mods: {
            'drop-target': isDropTarget,
            after: position === 'after',
            before: position === 'before',
        } }));
}

        