import { type Scope } from "@loke/ui/context";
import { DismissableLayer } from "@loke/ui/dismissable-layer";
import { FocusScope } from "@loke/ui/focus-scope";
import { Portal as PortalPrimitive } from "@loke/ui/portal";
import { Primitive } from "@loke/ui/primitive";
import { type ComponentPropsWithoutRef, type FC, type ReactNode } from "react";
type ScopedProps
= P & {
__scopeDialog?: Scope;
};
declare const createDialogScope: import("@loke/ui/context").CreateScope;
interface DialogProps {
/** The content of the dialog. This should include DialogTrigger, DialogContent, and other dialog subcomponents. */
children?: ReactNode;
/** Whether the dialog should be open by default. */
defaultOpen?: boolean;
/** Whether the dialog should trap focus. */
modal?: boolean;
/** Event handler called when the open state of the dialog changes. */
onOpenChange?(open: boolean): void;
/** Whether the dialog is currently open. */
open?: boolean;
}
/**
* Dialog component for displaying modal content
*
* The Dialog component provides a way to show content in a modal overlay, interrupting the user's current task to focus on important information or actions.
*
* Key features:
* - Controlled visibility of modal content
* - Customizable trigger element
* - Overlay background for focus
* - Accessible keyboard navigation and focus management
* - Customizable content, title, and description components
*
* Usage considerations:
* - Use for important interactions that require user attention
* - Ensure the dialog content is concise and focused
* - Provide clear actions for the user to proceed or dismiss the dialog
* - Consider the impact on mobile devices and ensure responsive design
*/
declare const Dialog: FC;
type PrimitiveButtonProps = ComponentPropsWithoutRef;
interface DialogTriggerProps extends PrimitiveButtonProps {
}
/**
* DialogTrigger component for opening the dialog
*
* This component renders a button that opens the associated Dialog when clicked. It automatically handles the open state of the dialog.
*/
declare const DialogTrigger: import("react").ForwardRefExoticComponent>;
type PortalProps = ComponentPropsWithoutRef;
interface DialogPortalProps {
/**
* The content of the portal.
*/
children?: ReactNode;
/**
* Specify a container element to portal the content into.
*/
container?: PortalProps["container"];
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
declare const DialogPortal: FC;
interface DialogOverlayProps extends DialogOverlayImplProps {
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
declare const DialogOverlay: import("react").ForwardRefExoticComponent>;
type PrimitiveDivProps = ComponentPropsWithoutRef;
interface DialogOverlayImplProps extends PrimitiveDivProps {
}
interface DialogContentProps extends DialogContentTypeProps {
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
declare const DialogContent: import("react").ForwardRefExoticComponent>;
interface DialogContentTypeProps extends Omit {
}
type DismissableLayerProps = ComponentPropsWithoutRef;
type FocusScopeProps = ComponentPropsWithoutRef;
interface DialogContentImplProps extends Omit {
/**
* Event handler called when auto-focusing on close.
* Can be prevented.
*/
onCloseAutoFocus?: FocusScopeProps["onUnmountAutoFocus"];
/**
* Event handler called when auto-focusing on open.
* Can be prevented.
*/
onOpenAutoFocus?: FocusScopeProps["onMountAutoFocus"];
/**
* When `true`, focus cannot escape the `Content` via keyboard,
* pointer, or a programmatic focus.
* @defaultValue false
*/
trapFocus?: FocusScopeProps["trapped"];
}
type PrimitiveHeading2Props = ComponentPropsWithoutRef;
interface DialogTitleProps extends PrimitiveHeading2Props {
}
declare const DialogTitle: import("react").ForwardRefExoticComponent>;
type PrimitiveParagraphProps = ComponentPropsWithoutRef;
interface DialogDescriptionProps extends PrimitiveParagraphProps {
}
declare const DialogDescription: import("react").ForwardRefExoticComponent>;
interface DialogCloseProps extends PrimitiveButtonProps {
}
/**
* DialogClose component for closing the dialog
*
* This component renders a button that closes the dialog when clicked. It's typically used for secondary dismissal actions, as the main close button is already included in the DialogContent.
*/
declare const DialogClose: import("react").ForwardRefExoticComponent>;
interface WarningProviderProps {
children?: ReactNode;
contentName: string;
docsSlug: "alert-dialog" | "dialog";
titleName: string;
}
/** @deprecated This compatibility component no longer emits runtime warnings. */
declare const WarningProvider: FC>;
declare const Root: FC;
declare const Trigger: import("react").ForwardRefExoticComponent>;
declare const Portal: FC;
declare const Overlay: import("react").ForwardRefExoticComponent>;
declare const Content: import("react").ForwardRefExoticComponent>;
declare const Title: import("react").ForwardRefExoticComponent>;
declare const Description: import("react").ForwardRefExoticComponent>;
declare const Close: import("react").ForwardRefExoticComponent>;
export type { DialogCloseProps, DialogContentProps, DialogDescriptionProps, DialogOverlayProps, DialogPortalProps, DialogProps, DialogTitleProps, DialogTriggerProps, };
export { Close, Content, createDialogScope, Description, Dialog, DialogClose, DialogContent, DialogDescription, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Overlay, Portal, Root, Title, Trigger, WarningProvider, };