import { CardProps } from '@mui/material';
import { PanelDefinition, PanelGroupItemId } from '@perses-dev/core';
import { ReactNode } from 'react';
import { PanelHeaderProps } from './PanelHeader';
export interface PanelProps extends CardProps<'section'> {
    definition: PanelDefinition;
    readHandlers?: PanelHeaderProps['readHandlers'];
    editHandlers?: PanelHeaderProps['editHandlers'];
    panelOptions?: PanelOptions;
    panelGroupItemId?: PanelGroupItemId;
    viewQueriesHandler?: PanelHeaderProps['viewQueriesHandler'];
}
export type PanelOptions = {
    /**
     * Allow you to hide the panel header if desired.
     * This can be useful in embedded mode for example.
     */
    hideHeader?: boolean;
    /**
     * Whether to show panel icons always, or only when hovering over the panel.
     * Default: if the dashboard is in editing mode or the panel is in fullscreen mode: 'always', otherwise 'hover'
     */
    showIcons?: 'always' | 'hover';
    /**
     * Content to render in right of the panel header. (top right of the panel)
     * It will only be rendered when the panel is in edit mode.
     */
    extra?: (props: PanelExtraProps) => ReactNode;
};
export type PanelExtraProps = {
    /**
     * The PanelDefinition for the panel.
     */
    panelDefinition?: PanelDefinition;
    /**
     * The PanelGroupItemId for the panel.
     */
    panelGroupItemId?: PanelGroupItemId;
};
/**
 * Renders a PanelDefinition's content inside of a Card.
 *
 * Internal structure:
 * <Panel>                  // renders an entire panel, incl. header and action buttons
 *   <PanelContent>         // renders loading, error or panel based on the queries' status
 *     <PanelPluginLoader>  // loads a panel plugin from the plugin registry and renders the PanelComponent with data from props.queryResults
 */
export declare const Panel: import("react").NamedExoticComponent<PanelProps>;
//# sourceMappingURL=Panel.d.ts.map