@etsoo/react/lib/mjs/components/DnDList.d.ts

TypeScript ReactJs UI Independent Framework

import { UniqueIdentifier } from "@dnd-kit/core";
import { DataTypes } from "@etsoo/shared";
import React, { CSSProperties } from "react";
/**
 * DnD list forward ref
 */
export interface DnDListRef<D extends object> {
    /**
     * Add item
     * @param item New item
     */
    addItem(item: D): void;
    /**
     * Add items
     * @param items items
     */
    addItems(items: D[]): void;
    /**
     * Delete item
     * @param index Item index
     */
    deleteItem(index: number): void;
    /**
     * Edit item
     * @param newItem New item
     * @param index Index
     */
    editItem(newItem: D, index: number): boolean;
}
/**
 * DnD sortable list properties
 */
export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
    /**
     * Get list item style callback
     */
    getItemStyle: (index: number, isDragging: boolean) => CSSProperties;
    /**
     * Item renderer
     */
    itemRenderer: (item: D, index: number, nodeRef: React.ComponentProps<any>, actionNodeRef: React.ComponentProps<any>) => React.ReactElement;
    /**
     * List items
     */
    items: D[];
    /**
     * Unique key field
     */
    keyField: K;
    /**
     * Label field
     */
    labelField: K;
    /**
     * Methods ref
     */
    mRef?: React.Ref<DnDListRef<D>>;
    /**
     * Data change handler
     */
    onChange?: (items: D[]) => void;
    /**
     * Drag end handler
     */
    onDragEnd?: (items: D[]) => void;
}
/**
 * DnD (Drag and Drop) sortable list
 * @param props Props
 * @returns Component
 */
export declare function DnDList<D extends {
    id: UniqueIdentifier;
}, K extends DataTypes.Keys<D, UniqueIdentifier> = DataTypes.Keys<D, UniqueIdentifier>>(props: DnDListPros<D, K>): import("react/jsx-runtime").JSX.Element;