import React from "react";
import { CardProps as MuiCardProps, Grid2Props } from "@mui/material";
export * from "./shared";
export interface CardProps<T = unknown> extends Omit<MuiCardProps, "onSubmit"> {
    /**
     * If true, the card will always be in edit mode.
     * Overrides, the `isEditable` prop.
     * Does not affect `isDisabled` or `isOpen`.
     * Keeps the card in `edit` mode even after submitting.
     */
    alwaysEditable?: boolean;
    /**
     * Number of columns to use in the grid.
     * Not neccary to include unless you are trying to achive
     * a very specific layout with multi-column spanning fields or gaps.
     */
    columns?: number;
    /**
     * Start the card in `edit` mode. Should be used with `isEdtiable`.
     * The card will still be able to exit `edit` mode. This is just the default state.
     * Use `alwaysEditable` to keep the card in `edit` mode permanently.
     */
    defaultEditing?: boolean;
    /**
     * Enables `edit` mode and the toggle in `CardHeader` if true.
     * Use `alwaysEditable` to keep the card in `edit` mode permanently.
     * Use `defaultEditing` to set the default state of the card.
     */
    isEditable?: boolean;
    /**
     * Disables the card and all fields if true.
     * This is a global disable, not a per-field disable.
     * Only makes sense when `isEditable` is true.
     */
    isDisabled?: boolean;
    /**
     * Uses compact layout for card and all fields if true.
     * Compact cards are designed to be placed in `RightColumn`.
     */
    isCompact?: boolean;
    /**
     * Enables accordion-like behavior if true.
     * Does not affect `isEditable` or `isDisabled`.
     */
    isCollapsible?: boolean;
    /**
     * Start the card in `open` mode. Should be used with `isCollapsible`.
     * The card will still be able to close. This is just the default state.
     */
    isOpen?: boolean;
    /**
     * Function to call when the form is submitted.
     * All card fields should be treaded as uncontrolled and access via standard DOM Form APIs.
     * The first arguments provies `Object.fromEntries(new FormData(form))` for convenience.
     * The second argument is the form event. This can be used to `getAll` or `get` form values
     * which are "unserializable" by `Object.fromEntries` (such as shared `FormName`s).
     *
     * The function should return a string to display as a success message.
     * If the function returns `null` or `undefined`, no message will be displayed.
     * Shows a generic error message if the function throws an error.
     * You can show your own error message by catching the error, queueing a snackbar and returning null.
     *
     * Type this function using the generic version of the card component.
     *
     * @example
     * ```tsx
     * interface MyCardValues {
     *   name: string;
     *   email: string;
     *   }
     *
     * ...
     *
     * <Card<MyCardValues> onSubmit={...} />
     */
    onSubmit?: (values: T, event: React.FormEvent<HTMLFormElement>) => Promise<string | null | undefined>;
    /**
     * The MUI `Grid2` size of the card.
     * Defaults to `12` (full width), which is what you want in most cases.
     * @see https://mui.com/material-ui/react-grid2/
     */
    size?: Grid2Props["size"];
    /**
     * Additional props to pass to the `Grid2` component.
     * @see https://mui.com/material-ui/react-grid2/
     */
    gridProps?: Omit<Grid2Props, "size">;
}
/**
 * A card component that wraps a form with `onSubmit` and provides `cardContext`.
 * This should be your building block for all admin forms not better represented by a Table.
 * Generic type `T` is used to type the `FormData` of `onSubmit`.
 * @example
 * ```tsx
 * interface MyCardValues {
 *   name: string;
 *   email: string;
 * }
 *
 * <Card<MyCardValues>
 *   onSubmit={(values) => {
 *     console.log(values);
 *     return "Success!";
 *  }}>
 *   <CardHeader title="My Card" />
 *   <CardContent>
 *     <CardRow>
 *       <TextField name="name" label="Name" />
 *       <TextField name="email" label="Email" />
 *     <CardRow/>
 *   </CardContent>
 *   <CardActions>
 *     <CardCancelButton />
 *     <CardSaveButton />
 *   </CardActions>
 * </Card>
 */
export declare function Card<T>({ alwaysEditable, children, columns, defaultEditing, isCollapsible, isCompact, isDisabled: isDisabledDefault, isEditable, isOpen: isOpenDefault, onSubmit, sx, size, gridProps, ...props }: CardProps<T>): React.JSX.Element;
export default Card;