import { CSSProperties } from 'glamor';
import React from 'react';
import { ApphouseComponent } from '../component.interfaces';
/**
 * Interface for the Droppable component styles
 */
export type DroppableStyles = CSSProperties;
/**
 * Interface for the Droppable component props
 */
export interface DroppableProps extends ApphouseComponent<DroppableStyles> {
    /**
     * The index of the droppable item
     */
    index: number;
    /**
     * The function to call when an item is dropped in this area
     * @param draggedItemIndex
     * @param droppedItemIndex
     */
    onDrop: (draggedItemIndex?: number, droppedItemIndex?: number) => void;
    /**
     * The children of the droppable
     */
    children?: React.ReactNode;
}
/**
 * A component that creates a drop area.
 * This component comes without any styles, you can set your own styles by passing
 * a style object to the styleOverwrites prop
 */
export declare const Droppable: (props: DroppableProps) => import("react/jsx-runtime").JSX.Element;