93 lines
2.2 KiB
TypeScript
93 lines
2.2 KiB
TypeScript
import __ReactToolbox from "../index.d.ts";
|
|
|
|
export interface DialogTheme {
|
|
/**
|
|
* Used for the root when the dialog is active.
|
|
*/
|
|
active?: string;
|
|
/**
|
|
* Used to wrap the dialog body.
|
|
*/
|
|
body?: string;
|
|
/**
|
|
* Used in buttons when the dialog implements actions.
|
|
*/
|
|
button?: string;
|
|
/**
|
|
* Used for the root element.
|
|
*/
|
|
dialog?: string;
|
|
/**
|
|
* Used for the navigation element when it implements actions.
|
|
*/
|
|
navigation?: string;
|
|
/**
|
|
* Used for the title element of the dialog.
|
|
*/
|
|
title?: string;
|
|
}
|
|
|
|
interface DialogActionProps {
|
|
/**
|
|
* The text string to use for the name of the button.
|
|
*/
|
|
label?: string;
|
|
/**
|
|
* Callback called when the component is clicked.
|
|
*/
|
|
onClick?: __React.MouseEventHandler;
|
|
}
|
|
|
|
interface DialogProps extends __ReactToolbox.Props {
|
|
/**
|
|
* A array of objects representing the buttons for the dialog navigation area. The properties will be transferred to the buttons.
|
|
*/
|
|
actions?: DialogActionProps[];
|
|
/**
|
|
* If true, the dialog will be active.
|
|
* @default false
|
|
*/
|
|
active?: boolean;
|
|
/**
|
|
* Children to pass through the component.
|
|
*/
|
|
children?: __React.ReactNode;
|
|
/**
|
|
* Callback called when the ESC key is pressed with the overlay active.
|
|
*/
|
|
onEscKeyDown?: __React.KeyboardEventHandler;
|
|
/**
|
|
* Callback to be invoked when the dialog overlay is clicked.
|
|
*/
|
|
onOverlayClick?: __React.MouseEventHandler;
|
|
/**
|
|
* Callback called when the mouse button is pressed on the overlay.
|
|
*/
|
|
onOverlayMouseDown?: __React.MouseEventHandler;
|
|
/**
|
|
* Callback called when the mouse is moving over the overlay.
|
|
*/
|
|
onOverlayMouseMove?: __React.MouseEventHandler;
|
|
/**
|
|
* Callback called when the mouse button is released over the overlay.
|
|
*/
|
|
onOverlayMouseUp?: __React.MouseEventHandler;
|
|
/**
|
|
* Classnames object defining the component style.
|
|
*/
|
|
theme?: DialogTheme;
|
|
/**
|
|
* The text string to use as standar title of the dialog.
|
|
*/
|
|
title?: string;
|
|
/**
|
|
* Used to determine the size of the dialog. It can be small, normal or large.
|
|
* @default normal
|
|
*/
|
|
type?: string;
|
|
}
|
|
|
|
export class Dialog extends __React.Component<DialogProps, {}> { }
|
|
|
|
export default Dialog;
|