2022-12-08 11:04:25 +00:00
|
|
|
import { ButtonHTMLAttributes, VNode } from 'vue';
|
2022-09-06 12:03:37 +00:00
|
|
|
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
|
|
|
|
|
|
|
|
type ToastPositionType = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' | 'center' | undefined;
|
|
|
|
|
|
|
|
type ToastMessageSeverityType = 'success' | 'info' | 'warn' | 'error' | undefined;
|
|
|
|
|
|
|
|
export interface ToastMessageOptions {
|
|
|
|
/**
|
|
|
|
* Severity level of the message.
|
|
|
|
* @see ToastMessageSeverityType
|
|
|
|
* Default value is 'info'.
|
|
|
|
*/
|
|
|
|
severity?: any | undefined;
|
|
|
|
/**
|
|
|
|
* Summary content of the message.
|
|
|
|
*/
|
|
|
|
summary?: string | undefined;
|
|
|
|
/**
|
|
|
|
* Detail content of the message.
|
|
|
|
*/
|
|
|
|
detail?: any | undefined;
|
|
|
|
/**
|
|
|
|
* Whether the message can be closed manually using the close icon.
|
|
|
|
* Default value is true.
|
|
|
|
*/
|
|
|
|
closable?: boolean | undefined;
|
|
|
|
/**
|
|
|
|
* Delay in milliseconds to close the message automatically.
|
|
|
|
* Default value is 3000.
|
|
|
|
*/
|
|
|
|
life?: number | undefined;
|
|
|
|
/**
|
|
|
|
* Key of the Toast to display the message.
|
|
|
|
*/
|
|
|
|
group?: string | undefined;
|
|
|
|
/**
|
|
|
|
* Style class of the message.
|
|
|
|
*/
|
|
|
|
styleClass?: any;
|
|
|
|
/**
|
|
|
|
* Style class of the content.
|
|
|
|
*/
|
|
|
|
contentStyleClass?: any;
|
|
|
|
}
|
|
|
|
|
|
|
|
export interface ToastBreakpointsType {
|
|
|
|
/**
|
|
|
|
* Breakpoint for responsive mode.
|
|
|
|
*
|
|
|
|
* Example:
|
|
|
|
*
|
|
|
|
* <Toast :breakpoints="{'960px': { width: '75vw', ... }" ... />
|
|
|
|
*
|
|
|
|
*/
|
|
|
|
[key: string]: any;
|
|
|
|
}
|
|
|
|
|
|
|
|
export interface ToastProps {
|
|
|
|
/**
|
|
|
|
* Unique identifier of a message group.
|
|
|
|
*/
|
|
|
|
group?: string | undefined;
|
|
|
|
/**
|
|
|
|
* Position of the toast in viewport.
|
|
|
|
* @see ToastPositionType
|
|
|
|
* Default value is 'top-right'.
|
|
|
|
*/
|
|
|
|
position?: ToastPositionType;
|
|
|
|
/**
|
|
|
|
* Whether to automatically manage layering.
|
|
|
|
* Default value is true.
|
|
|
|
*/
|
|
|
|
autoZIndex?: boolean | undefined;
|
|
|
|
/**
|
|
|
|
* Base zIndex value to use in layering.
|
|
|
|
* Default value is 0.
|
|
|
|
*/
|
|
|
|
baseZIndex?: number | undefined;
|
|
|
|
/**
|
|
|
|
* Object literal to define styles per screen size.
|
|
|
|
* @see ToastBreakpointsType
|
|
|
|
*/
|
|
|
|
breakpoints?: ToastBreakpointsType;
|
2022-12-08 11:04:25 +00:00
|
|
|
/**
|
|
|
|
* Icon to display in the toast close button.
|
|
|
|
* Default value is 'pi pi-times'.
|
|
|
|
*/
|
|
|
|
closeIcon?: string | undefined;
|
|
|
|
/**
|
|
|
|
* Icon to display in the toast with info severity.
|
|
|
|
* Default value is 'pi pi-info-circle'.
|
|
|
|
*/
|
|
|
|
infoIcon?: string | undefined;
|
|
|
|
/**
|
|
|
|
* Icon to display in the toast with warn severity.
|
|
|
|
* Default value is 'pi pi-exclamation-triangle'.
|
|
|
|
*/
|
|
|
|
warnIcon?: string | undefined;
|
|
|
|
/**
|
|
|
|
* Icon to display in the toast with error severity.
|
|
|
|
* Default value is 'pi pi-times'.
|
|
|
|
*/
|
|
|
|
errorIcon?: string | undefined;
|
|
|
|
/**
|
|
|
|
* Icon to display in the toast with success severity.
|
|
|
|
* Default value is 'pi pi-check'.
|
|
|
|
*/
|
|
|
|
successIcon?: string | undefined;
|
|
|
|
/**
|
|
|
|
* Uses to pass all properties of the HTMLButtonElement to the close button.
|
|
|
|
*/
|
|
|
|
closeButtonProps?: ButtonHTMLAttributes | undefined;
|
2022-09-06 12:03:37 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
export interface ToastSlots {
|
|
|
|
/**
|
|
|
|
* Custom message template.
|
|
|
|
* @param {Object} scope - message slot's params.
|
|
|
|
*/
|
2022-09-14 11:26:01 +00:00
|
|
|
message: (scope: {
|
|
|
|
/**
|
|
|
|
* Message of the component
|
|
|
|
*/
|
|
|
|
message: any;
|
|
|
|
}) => VNode[];
|
2022-09-06 12:03:37 +00:00
|
|
|
}
|
|
|
|
|
2022-09-14 11:26:01 +00:00
|
|
|
export declare type ToastEmits = {};
|
2022-09-06 12:03:37 +00:00
|
|
|
|
2022-09-14 11:26:01 +00:00
|
|
|
declare class Toast extends ClassComponent<ToastProps, ToastSlots, ToastEmits> {}
|
2022-09-06 12:03:37 +00:00
|
|
|
|
|
|
|
declare module '@vue/runtime-core' {
|
|
|
|
interface GlobalComponents {
|
2022-09-14 11:26:01 +00:00
|
|
|
Toast: GlobalComponentConstructor<Toast>;
|
2022-09-06 12:03:37 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
*
|
|
|
|
* Toast is used to display messages in an overlay.
|
|
|
|
*
|
|
|
|
* Helper API:
|
|
|
|
*
|
|
|
|
* - ToastService
|
|
|
|
*
|
|
|
|
* Demos:
|
|
|
|
*
|
2022-09-14 11:26:01 +00:00
|
|
|
* - [Toast](https://www.primefaces.org/primevue/toast)
|
2022-09-06 12:03:37 +00:00
|
|
|
*
|
|
|
|
*/
|
|
|
|
export default Toast;
|