Skip to content

chore: update type notification #2710

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Aug 18, 2020
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 18 additions & 40 deletions types/notification.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,14 @@
// Definitions: https://github.com/vueComponent/ant-design-vue/types

import { AntdComponent } from './component';
import { VNode } from 'vue';

export interface NotificationOptions {
import { VNodeChild, CSSProperties } from 'vue';
export type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
export interface NotificationOptions extends NotificationConfigOptions {
/**
* Customized close button
* @type VNode | Function
*/
btn?: VNode | Function;
btn?: VNodeChild | JSX.Element | Function;

/**
* Customized CSS class
Expand All @@ -22,20 +22,13 @@ export interface NotificationOptions {
* The content of notification box (required)
* @type string | VNode | Function
*/
description: string | VNode | Function;

/**
* Time in seconds before Notification is closed. When set to 0 or null, it will never be closed automatically
* @default 4.5
* @type number
*/
duration?: number;
description: VNodeChild | JSX.Element | Function;

/**
* Customized icon
* @type VNode | Function
*/
icon?: VNode | Function;
icon?: VNodeChild | JSX.Element | Function;

/**
* The unique identifier of the Notification
Expand All @@ -47,38 +40,25 @@ export interface NotificationOptions {
* The title of notification box (required)
* @type string | VNode | Function
*/
message: string | VNode | Function;

/**
* Position of Notification, can be one of topLeft topRight bottomLeft bottomRight
* @default 'topRight'
* @type string
*/
placement?: string;
message: VNodeChild | JSX.Element | Function;

/**
* Customized inline style
* @type object | string
*/
style?: object | string;
style?: CSSProperties | string;

/**
* Specify a function that will be called when the close button is clicked
* @type Function
*/
onClose?: Function;
onClose?: () => void;

/**
* Specify a function that will be called when the notification is clicked
* @type Function
*/
onClick?: Function;

closeIcon?: any;

getContainer?: () => HTMLElement;
bottom?: string;
top?: string;
onClick?: () => void;
}

export interface NotificationConfigOptions {
Expand All @@ -94,7 +74,7 @@ export interface NotificationConfigOptions {
* @default 4.5
* @type number
*/
duration?: number;
duration?: number | null;

/**
* Return the mount node for Notification
Expand All @@ -108,19 +88,22 @@ export interface NotificationConfigOptions {
* @default 'topRight'
* @type string
*/
placement?: string;
placement?: NotificationPlacement;

/**
* Distance from the top of the viewport, when placement is topRight or topLeft (unit: pixels).
* @default '24px'
* @type string
*/
top?: string;

closeIcon?: any;
/**
* custom close icon
* @type VNode | function
*/
closeIcon?: VNodeChild | JSX.Element | Function;
}

export declare class Notification {
export interface NotificationApi {
success(config: NotificationOptions): void;
warning(config: NotificationOptions): void;
warn(config: NotificationOptions): void;
Expand All @@ -132,8 +115,3 @@ export declare class Notification {
destroy(): void;
}

declare module 'vue/types/vue' {
interface Vue {
$notification: Notification;
}
}