@szum-tech/design-system/dist/components/sortable/index.d.cts

Szum-Tech design system with tailwindcss support

import * as React from 'react';
import { DragEndEvent, DragStartEvent, Modifiers, DraggableSyntheticListeners, DragOverlay, UniqueIdentifier } from '@dnd-kit/core';

type SortableProps<T> = Omit<React.ComponentProps<"div">, "onDragStart" | "onDragEnd"> & {
    value: T[];
    onValueChange: (value: T[]) => void;
    getItemValue: (item: T) => string;
    children: React.ReactNode;
    onMove?: (event: {
        event: DragEndEvent;
        activeIndex: number;
        overIndex: number;
    }) => void;
    strategy?: "horizontal" | "vertical" | "grid";
    onDragStart?: (event: DragStartEvent) => void;
    onDragEnd?: (event: DragEndEvent) => void;
    modifiers?: Modifiers;
    asChild?: boolean;
};
declare function Sortable<T>({ value, onValueChange, getItemValue, className, asChild, onMove, strategy, onDragStart, onDragEnd, modifiers, children, ...props }: SortableProps<T>): React.JSX.Element;

type SortableItemProps = React.ComponentProps<"div"> & {
    value: string;
    disabled?: boolean;
    asChild?: boolean;
};
declare function SortableItem({ value, className, asChild, disabled, children, ...props }: SortableItemProps): React.JSX.Element;

interface SortableItemContextValue {
    listeners: DraggableSyntheticListeners | undefined;
    isDragging?: boolean;
    disabled?: boolean;
}
declare function useSortableItemContext(consumerName: string): SortableItemContextValue;

type SortableItemHandleProps = React.ComponentProps<"div"> & {
    cursor?: boolean;
    asChild?: boolean;
};
declare function SortableItemHandle({ className, asChild, cursor, children, ...props }: SortableItemHandleProps): React.JSX.Element;

type SortableOverlayProps = Omit<React.ComponentProps<typeof DragOverlay>, "children"> & {
    children?: React.ReactNode | ((params: {
        value: UniqueIdentifier;
    }) => React.ReactNode);
};
declare function SortableOverlay({ children, className, ...props }: SortableOverlayProps): React.ReactPortal;

export { Sortable, SortableItem, SortableItemHandle, type SortableItemHandleProps, type SortableItemProps, SortableOverlay, type SortableOverlayProps, type SortableProps, useSortableItemContext };