@type-dom/ui 0.5.0 → 0.6.1

package/dist/components/feedback/td-message-box/td-message-box.interface.d.ts

@@ -0,0 +1,185 @@
+import { InputEnum, IFragment, FragmentProps, SvgSvg, TypeNode, CSSProperties, MaybeRef } from '@type-dom/framework';
+import { Signal } from '@type-dom/signals';
+import { ComponentSize } from '../../../constants/size';
+import { TdInput } from '../../form';
+import { IButtonType } from '../../basic/td-button/td-button.interface';
+export interface ITdMessageBox extends IFragment {
+    props: MessageBoxProps;
+}
+export interface MessageBoxProps extends FragmentProps, TdMessageBoxOptions, MessageBoxState {
+    buttonSize?: ComponentSize;
+    /**
+     * @description confirm button type (aligned with Element Plus `confirmButtonType`)
+     */
+    confirmButtonType?: IButtonType;
+    /**
+     * @description cancel button type (aligned with Element Plus `cancelButtonType`)
+     */
+    cancelButtonType?: IButtonType;
+    modal?: boolean;
+    lockScroll?: boolean;
+    showClose?: boolean;
+    closeOnClickModal?: boolean;
+    closeOnPressEscape?: boolean;
+    closeOnHashChange?: boolean;
+    center?: boolean;
+    draggable?: boolean;
+    overflow?: boolean;
+    roundButton?: boolean;
+    container?: string;
+    boxType?: IMessageBoxType;
+}
+type MessageType = '' | 'primary' | 'success' | 'warning' | 'info' | 'error';
+export type IMessageBoxType = '' | 'prompt' | 'alert' | 'confirm';
+export type MessageBoxData = IMessageBoxInputData & Action;
+export type Action = 'confirm' | 'close' | 'cancel';
+export interface IMessageBoxInputData {
+    value: string;
+    input?: TdInput;
+    action?: Action;
+}
+export interface MessageBoxInputValidator {
+    (value?: string | number): boolean | string;
+}
+export declare interface MessageBoxState {
+    autofocus?: boolean;
+    title?: string | TdMessageBoxOptions;
+    message?: string | TypeNode;
+    type?: MessageType;
+    icon?: SvgSvg;
+    customClass?: string;
+    customStyle?: CSSProperties;
+    showInput?: boolean;
+    inputValue?: Signal<string>;
+    inputPlaceholder?: string;
+    inputType?: keyof typeof InputEnum | 'textarea';
+    inputPattern?: RegExp;
+    inputValidator?: MessageBoxInputValidator;
+    inputErrorMessage?: string;
+    showConfirmButton?: boolean;
+    showCancelButton?: boolean;
+    action?: Action;
+    dangerouslyUseHTMLString?: boolean;
+    confirmButtonText?: MaybeRef<string>;
+    cancelButtonText?: MaybeRef<string>;
+    confirmButtonLoading?: boolean;
+    cancelButtonLoading?: boolean;
+    confirmButtonLoadingIcon?: SvgSvg;
+    cancelButtonLoadingIcon?: SvgSvg;
+    confirmButtonClass?: string;
+    confirmButtonDisabled?: boolean;
+    cancelButtonClass?: string;
+    confirmButtonType?: IButtonType;
+    cancelButtonType?: IButtonType;
+    editorErrorMessage?: Signal<string>;
+    beforeClose?: (action: Action, instance: MessageBoxState, done: () => void) => void;
+    callback?: Callback;
+    distinguishCancelAndClose?: boolean;
+    modalFade?: boolean;
+    modalClass?: string;
+    isOnComposition?: false;
+    validateError?: boolean;
+    zIndex?: number;
+}
+export type Callback = (action: Action) => void;
+/** Options used in MessageBox */
+export interface TdMessageBoxOptions {
+    /**
+     * auto focus when open message-box
+     */
+    autofocus?: boolean;
+    /** Callback before MessageBox closes, and it will prevent MessageBox from closing */
+    beforeClose?: (action: Action, instance: MessageBoxState, done: () => void) => void;
+    /** Custom class name for MessageBox */
+    customClass?: string;
+    /** Custom inline style for MessageBox */
+    customStyle?: CSSProperties;
+    /** modal class name for MessageBox */
+    modalClass?: string;
+    /** MessageBox closing callback if you don't prefer Promise */
+    callback?: Callback;
+    /** Text content of cancel button, need to reactivity */
+    cancelButtonText?: MaybeRef<string>;
+    /** Text content of confirm button,  need to reactivity*/
+    confirmButtonText?: MaybeRef<string>;
+    /** Loading Icon content of cancel button */
+    cancelButtonLoadingIcon?: SvgSvg;
+    /** Loading Icon content of confirm button */
+    confirmButtonLoadingIcon?: SvgSvg;
+    /** Custom class name of cancel button */
+    cancelButtonClass?: string;
+    /** Custom class name of confirm button */
+    confirmButtonClass?: string;
+    /** Whether to align the content in center */
+    center?: boolean;
+    /** Whether MessageBox can be drag */
+    draggable?: boolean;
+    /** Draggable MessageBox can overflow the viewport */
+    overflow?: boolean;
+    /** Content of the MessageBox */
+    message?: string | TypeNode;
+    /** Title of the MessageBox */
+    title?: string | TdMessageBoxOptions;
+    /** Message type, used for icon display */
+    type?: MessageType;
+    /** Message box type */
+    boxType?: IMessageBoxType;
+    /** Custom icon component */
+    icon?: SvgSvg;
+    /** Custom close icon component for the close button */
+    closeIcon?: SvgSvg;
+    /** Whether message is treated as HTML string */
+    dangerouslyUseHTMLString?: boolean;
+    /** Whether to distinguish canceling and closing */
+    distinguishCancelAndClose?: boolean;
+    /** Whether to lock body scroll when MessageBox prompts */
+    lockScroll?: boolean;
+    /** Whether to show a cancel button */
+    showCancelButton?: boolean;
+    /** Whether to show a confirm button */
+    showConfirmButton?: boolean;
+    /** Whether to show a close button */
+    showClose?: boolean;
+    /** Whether to use round button */
+    roundButton?: boolean;
+    /** Whether MessageBox can be closed by clicking the mask */
+    closeOnClickModal?: boolean;
+    /** Whether MessageBox can be closed by pressing the ESC */
+    closeOnPressEscape?: boolean;
+    /** Whether to close MessageBox when hash changes */
+    closeOnHashChange?: boolean;
+    /** Whether to show an input */
+    showInput?: boolean;
+    /** Placeholder of input */
+    inputPlaceholder?: string;
+    /** Initial value of input */
+    inputValue?: Signal<string>;
+    /** Regexp for the input */
+    inputPattern?: RegExp;
+    /** Input Type: text, textArea, password or number */
+    inputType?: keyof typeof InputEnum | 'textarea';
+    /** Validation function for the input. Should returns a boolean or string. If a string is returned, it will be assigned to inputErrorMessage */
+    inputValidator?: MessageBoxInputValidator;
+    /** Error message when validation fails */
+    inputErrorMessage?: string;
+    /** Custom size of confirm and cancel buttons */
+    buttonSize?: ComponentSize;
+    /** Custom element to append the message box to */
+    appendTo?: HTMLElement | string;
+}
+export type TdMessageBoxShortcutMethod = ((message: TdMessageBoxOptions['message'], options?: TdMessageBoxOptions) => Promise<MessageBoxData>) & ((message: TdMessageBoxOptions['message'], title: TdMessageBoxOptions['title'], options?: TdMessageBoxOptions) => Promise<MessageBoxData>);
+export interface ITdMessageBoxFn {
+    /** Show a message box */
+    /** Show a message box */
+    (options: TdMessageBoxOptions): Promise<MessageBoxData>;
+    /** Show an alert message box */
+    alert: TdMessageBoxShortcutMethod;
+    /** Show a confirm message box */
+    confirm: TdMessageBoxShortcutMethod;
+    /** Show a prompt message box */
+    prompt: TdMessageBoxShortcutMethod;
+    /** Close current message box */
+    close(): void;
+}
+export {};
+//# sourceMappingURL=td-message-box.interface.d.ts.map

package/dist/components/feedback/td-message-box/td-message-box.interface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-message-box.interface.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/td-message-box/td-message-box.interface.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,SAAS,EACT,aAAa,EACb,MAAM,EACN,QAAQ,EACR,aAAa,EAAE,QAAQ,EACxB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,2CAA2C,CAAC;AAExE,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,KAAK,EAAE,eAAe,CAAC;CACxB;AAED,MAAM,WAAW,eACf,SAAQ,aAAa,EACnB,mBAAmB,EACnB,eAAe;IACjB,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B;;OAEG;IACH,iBAAiB,CAAC,EAAE,WAAW,CAAC;IAChC;;OAEG;IACH,gBAAgB,CAAC,EAAE,WAAW,CAAC;IAC/B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,eAAe,CAAC;CAC3B;AAED,KAAK,WAAW,GAAG,EAAE,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AAE7E,MAAM,MAAM,eAAe,GAAG,EAAE,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;AAClE,MAAM,MAAM,cAAc,GAAG,oBAAoB,GAAG,MAAM,CAAC;AAC3D,MAAM,MAAM,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEpD,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,wBAAwB;IACvC,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;CAC7C;AAED,MAAM,CAAC,OAAO,WAAW,eAAe;IACtC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,mBAAmB,CAAC;IACrC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC5B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,OAAO,SAAS,GAAG,UAAU,CAAC;IAChD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,wBAAwB,CAAC;IAC1C,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,iBAAiB,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACrC,gBAAgB,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACpC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,WAAW,CAAC;IAChC,gBAAgB,CAAC,EAAE,WAAW,CAAC;IAC/B,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IAEpC,WAAW,CAAC,EAAE,CACZ,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,eAAe,EACzB,IAAI,EAAE,MAAM,IAAI,KACb,IAAI,CAAC;IACV,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,eAAe,CAAC,EAAE,KAAK,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,QAAQ,GAAG,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;AAEhD,iCAAiC;AACjC,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,qFAAqF;IACrF,WAAW,CAAC,EAAE,CACZ,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,eAAe,EACzB,IAAI,EAAE,MAAM,IAAI,KACb,IAAI,CAAC;IAEV,uCAAuC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,yCAAyC;IACzC,WAAW,CAAC,EAAE,aAAa,CAAC;IAE5B,sCAAsC;IACtC,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,QAAQ,CAAC;IAEpB,wDAAwD;IACxD,gBAAgB,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IAEpC,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IAErC,4CAA4C;IAC5C,uBAAuB,CAAC,EAAE,MAAM,CAAC;IAEjC,6CAA6C;IAC7C,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAElC,yCAAyC;IACzC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B,0CAA0C;IAC1C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,6CAA6C;IAC7C,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,qCAAqC;IACrC,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,gCAAgC;IAChC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAE5B,8BAA8B;IAC9B,KAAK,CAAC,EAAE,MAAM,GAAG,mBAAmB,CAAC;IAErC,0CAA0C;IAC1C,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,uBAAuB;IACvB,OAAO,CAAC,EAAE,eAAe,CAAC;IAE1B,4BAA4B;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,gDAAgD;IAChD,wBAAwB,CAAC,EAAE,OAAO,CAAC;IAEnC,mDAAmD;IACnD,yBAAyB,CAAC,EAAE,OAAO,CAAC;IAEpC,0DAA0D;IAC1D,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,sCAAsC;IACtC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,uCAAuC;IACvC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B,qCAAqC;IACrC,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,kCAAkC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,4DAA4D;IAC5D,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B,2DAA2D;IAC3D,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B,oDAAoD;IACpD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,2BAA2B;IAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,6BAA6B;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IAE5B,2BAA2B;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,OAAO,SAAS,GAAG,UAAU,CAAC;IAEhD,+IAA+I;IAC/I,cAAc,CAAC,EAAE,wBAAwB,CAAC;IAE1C,0CAA0C;IAC1C,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B,gDAAgD;IAChD,UAAU,CAAC,EAAE,aAAa,CAAC;IAE3B,kDAAkD;IAClD,QAAQ,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;CAEjC;AAED,MAAM,MAAM,0BAA0B,GAAG,CAAC,CACxC,OAAO,EAAE,mBAAmB,CAAC,SAAS,CAAC,EACvC,OAAO,CAAC,EAAE,mBAAmB,KAE1B,OAAO,CAAC,cAAc,CAAC,CAAC,GAC3B,CAAC,CACC,OAAO,EAAE,mBAAmB,CAAC,SAAS,CAAC,EACvC,KAAK,EAAE,mBAAmB,CAAC,OAAO,CAAC,EACnC,OAAO,CAAC,EAAE,mBAAmB,KAE1B,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC;AAEhC,MAAM,WAAW,eAAe;IAG9B,yBAAyB;IAIzB,yBAAyB;IACzB,CACE,OAAO,EAAE,mBAAmB,GAE3B,OAAO,CAAC,cAAc,CAAC,CAAC;IAE3B,gCAAgC;IAChC,KAAK,EAAE,0BAA0B,CAAC;IAElC,iCAAiC;IACjC,OAAO,EAAE,0BAA0B,CAAC;IAEpC,gCAAgC;IAChC,MAAM,EAAE,0BAA0B,CAAC;IAEnC,gCAAgC;IAChC,KAAK,IAAI,IAAI,CAAC;CACf"}

package/dist/components/feedback/td-message-box/td-message-box.interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-message-box.interface.js","sourceRoot":"","sources":["../../../../src/components/feedback/td-message-box/td-message-box.interface.ts"],"names":[],"mappings":""}

package/dist/components/feedback/td-notification/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/td-notification/index.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,cAAc,8CAAS,CAAC;AACrC,eAAe,cAAc,CAAC;AAE9B,mBAAmB,6BAA6B,CAAC"}

package/dist/components/feedback/td-notification/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/feedback/td-notification/index.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,UAAU,CAAC;AAE9B,uEAAuE;AACvE,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC;AACrC,eAAe,cAAc,CAAC"}

package/dist/components/feedback/td-notification/notify.d.ts

@@ -0,0 +1,16 @@
+import { TypeNode } from '@type-dom/framework';
+import type { NotificationOptions, Notify } from './td-notification.interface';
+import './style/index';
+/**
+ * This function gets called when user click `x` button or press `esc` or the time reached its limitation.
+ * Emitted by transition@before-leave event so that we can fetch the current notification.offsetHeight, if this was called
+ * by @after-leave the DOM element will be removed from the page thus we can no longer fetch the offsetHeight.
+ * @param {String} id notification id to be closed
+ * @param {Position} position the positioning strategy
+ * @param {Function} userOnClose the callback called when close passed by user
+ */
+export declare function close(id: string, position: NotificationOptions['position'], userOnClose?: (vm: TypeNode) => void): void;
+export declare function closeAll(): void;
+declare const _default: Notify;
+export default _default;
+//# sourceMappingURL=notify.d.ts.map

package/dist/components/feedback/td-notification/notify.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notify.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/td-notification/notify.ts"],"names":[],"mappings":"AAcA,OAAO,EAAc,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAE3D,OAAO,KAAK,EACV,mBAAmB,EAGnB,MAAM,EAEP,MAAM,6BAA6B,CAAC;AAGrC,OAAO,eAAe,CAAC;AAiHvB;;;;;;;GAOG;AACH,wBAAgB,KAAK,CACnB,EAAE,EAAE,MAAM,EACV,QAAQ,EAAE,mBAAmB,CAAC,UAAU,CAAC,EACzC,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,QAAQ,KAAK,IAAI,GACnC,IAAI,CA0BN;AAED,wBAAgB,QAAQ,IAAI,IAAI,CAQ/B;wBAKwB,MAAM;AAA/B,wBAAgC"}

package/dist/components/feedback/td-notification/notify.js

@@ -0,0 +1,160 @@
+// import { createVNode, isVNode, render } from 'vue'
+// import {
+//   debugWarn,
+//   isClient,
+//   isElement,
+//   isFunction,
+//   isString,
+//   isUndefined,
+// } from '@element-plus/utils'
+// import NotificationConstructor from './notification.vue'
+// import { notificationTypes } from './notification'
+//
+// import type { Ref, VNode } from 'vue'
+import { isTypeNode } from '@type-dom/framework';
+import { debugWarn, isClient, isElement, isString } from '@type-dom/utils';
+import { TdNotification } from './td-notification.class';
+import { notificationTypes } from './td-notification.const';
+import './style/index';
+// This should be a queue but considering there were `non-autoclosable` notifications.
+const notifications = {
+    'top-left': [],
+    'top-right': [],
+    'bottom-left': [],
+    'bottom-right': [],
+};
+// the gap size between each notification
+const GAP_SIZE = 16;
+let seed = 1;
+const notify = function (options = {}) {
+    if (!isClient)
+        return { close: () => undefined };
+    if (isString(options) || isTypeNode(options)) {
+        options = { message: options };
+    }
+    const position = options?.position || 'top-right';
+    let verticalOffset = options.offset || 0;
+    notifications[position].forEach(({ vm }) => {
+        const realDom = vm.downRealElement?.dom;
+        verticalOffset += (realDom?.offsetHeight || 0) + GAP_SIZE;
+    });
+    verticalOffset += GAP_SIZE;
+    const id = `notification_${seed++}`;
+    const userOnClose = options.onClose;
+    const props = {
+        ...options,
+        offset: verticalOffset,
+        id,
+        onClose: () => {
+            close(id, position, userOnClose);
+        },
+    };
+    let appendTo = document.body;
+    if (isElement(options.appendTo)) {
+        appendTo = options.appendTo;
+    }
+    else if (isString(options.appendTo)) {
+        appendTo = document.querySelector(options.appendTo);
+    }
+    // should fallback to default value with a warning
+    if (!isElement(appendTo)) {
+        debugWarn('ElNotification', 'the appendTo option is not an HTMLElement. Falling back to document.body.');
+        appendTo = document.body;
+    }
+    const container = document.createElement('div');
+    // const vm = createVNode(
+    //   NotificationConstructor,
+    //   props,
+    //   isFunction(props.message)
+    //     ? props.message
+    //     : isVNode(props.message)
+    //     ? () => props.message
+    //     : null
+    // )
+    props.onDestroy = () => {
+        // render(null, container)
+        // container.removeChild(container.firstElementChild!);
+        vm.unmount();
+    };
+    const vm = new TdNotification(props);
+    // vm.appContext = isUndefined(context) ? notify._context : context
+    // clean notification element preventing mem leak
+    // vm.props.onDestroy = () => {
+    //   // render(null, container)
+    //   // container.removeChild(container.firstElementChild!);
+    //   vm.unmount();
+    // }
+    // instances will remove this item when close function gets called. So we do not need to worry about it.
+    // render(vm, container)
+    vm.mount(container);
+    notifications[position].push({ vm });
+    appendTo.appendChild(container.firstElementChild);
+    return {
+        // instead of calling the onClose function directly, setting this value so that we can have the full lifecycle
+        // for out component, so that all closing steps will not be skipped.
+        close: () => {
+            // ;(vm.component!.exposed as { visible: Ref<boolean> }).visible.value =
+            //   false
+            vm.visible?.set(false);
+        },
+    };
+};
+notificationTypes.forEach((type) => {
+    notify[type] = (options = {}) => {
+        if (isString(options) || isTypeNode(options)) {
+            options = {
+                message: options,
+            };
+        }
+        return notify({ ...options, type });
+    };
+});
+/**
+ * This function gets called when user click `x` button or press `esc` or the time reached its limitation.
+ * Emitted by transition@before-leave event so that we can fetch the current notification.offsetHeight, if this was called
+ * by @after-leave the DOM element will be removed from the page thus we can no longer fetch the offsetHeight.
+ * @param {String} id notification id to be closed
+ * @param {Position} position the positioning strategy
+ * @param {Function} userOnClose the callback called when close passed by user
+ */
+export function close(id, position, userOnClose) {
+    // maybe we can store the index when inserting the vm to notification list.
+    const orientedNotifications = notifications[position];
+    const idx = orientedNotifications.findIndex(({ vm }) => vm.props?.id === id);
+    if (idx === -1)
+        return;
+    const { vm } = orientedNotifications[idx];
+    if (!vm)
+        return;
+    // calling user's on close function before notification gets removed from DOM.
+    userOnClose?.(vm);
+    // note that this is called @before-leave, that's why we were able to fetch this property.
+    const removedHeight = vm.divRef.get()?.offsetHeight;
+    const verticalPos = position?.split('-')[0];
+    orientedNotifications.splice(idx, 1);
+    const len = orientedNotifications.length;
+    if (len < 1)
+        return;
+    // starting from the removing item.
+    for (let i = idx; i < len; i++) {
+        // new position equals the current offsetTop minus removed height plus 16px(the gap size between each item)
+        const { divRef } = orientedNotifications[i].vm;
+        const pos = Number.parseInt(divRef.get().style[verticalPos], 10) -
+            removedHeight -
+            GAP_SIZE;
+        orientedNotifications[i].vm.props.offset = pos;
+    }
+}
+export function closeAll() {
+    // loop through all directions, close them at once.
+    for (const orientedNotifications of Object.values(notifications)) {
+        orientedNotifications.forEach(({ vm }) => {
+            // same as the previous close method, we'd like to make sure lifecycle gets handle properly.
+            vm.visible?.set(false);
+        });
+    }
+}
+notify.closeAll = closeAll;
+// notify._context = null
+export default notify;
+//# sourceMappingURL=notify.js.map

package/dist/components/feedback/td-notification/notify.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"notify.js","sourceRoot":"","sources":["../../../../src/components/feedback/td-notification/notify.ts"],"names":[],"mappings":"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"}

package/dist/components/feedback/td-notification/style/css.d.ts

@@ -0,0 +1,3 @@
+import '../../../base/style/css';
+import '../../../../theme-chalk/el-notification.css';
+//# sourceMappingURL=css.d.ts.map

package/dist/components/feedback/td-notification/style/css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/style/css.ts"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC;AACjC,OAAO,6CAA6C,CAAC"}

package/dist/components/feedback/td-notification/style/css.js

@@ -0,0 +1,3 @@
+import '../../../base/style/css';
+import '../../../../theme-chalk/el-notification.css';
+//# sourceMappingURL=css.js.map

package/dist/components/feedback/td-notification/style/css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.js","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/style/css.ts"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC;AACjC,OAAO,6CAA6C,CAAC"}

package/dist/components/feedback/td-notification/style/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/style/index.ts"],"names":[],"mappings":"AAAA,OAAO,mCAAmC,CAAC;AAC3C,OAAO,2CAA2C,CAAC"}

package/dist/components/feedback/td-notification/style/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/style/index.ts"],"names":[],"mappings":"AAAA,OAAO,mCAAmC,CAAC;AAC3C,OAAO,2CAA2C,CAAC"}

package/dist/components/feedback/td-notification/td-notification.class.d.ts

@@ -0,0 +1,11 @@
+import { Fragment } from '@type-dom/framework';
+import { Signal } from '@type-dom/signals';
+import { ITdNotification, NotificationProps } from './td-notification.interface';
+export declare class TdNotification extends Fragment<NotificationProps> implements ITdNotification {
+    visible?: Signal<boolean>;
+    close?: () => void;
+    divRef: Signal<HTMLElement | undefined>;
+    constructor(params?: NotificationProps);
+    setup(): void;
+}
+//# sourceMappingURL=td-notification.class.d.ts.map

package/dist/components/feedback/td-notification/td-notification.class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-notification.class.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/td-notification/td-notification.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAML,QAAQ,EAMT,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAY,MAAM,EAAU,MAAM,mBAAmB,CAAC;AAO7D,OAAO,EACL,eAAe,EACf,iBAAiB,EAClB,MAAM,6BAA6B,CAAC;AAGrC,qBAAa,cAAe,SAAQ,QAAQ,CAAC,iBAAiB,CAAE,YAAW,eAAe;IACxF,OAAO,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC,WAAW,GAAG,SAAS,CAAC,CAAC;gBAG5B,MAAM,GAAE,iBAAsB;IAOjC,KAAK;CA8Of"}

package/dist/components/feedback/td-notification/td-notification.class.js

@@ -0,0 +1,222 @@
+import { Div, Head, P, Transition, Fragment, onMounted, addEmits, emit, defaultProps, } from '@type-dom/framework';
+import { computed, signal } from '@type-dom/signals';
+import { CloseComponents, TypeComponentsMap } from '../../../utils/icon';
+import { EVENT_CODE } from '../../../constants/aria';
+import { TdIcon } from '../../basic/td-icon/td-icon.class';
+import { TdProgress } from '../../data/td-progress/td-progress.class';
+import { useGlobalComponentSettings } from '../../configuration/td-config-provider';
+import { notificationEmits, notificationProps } from './td-notification.const';
+import { useEventListener, useIntervalFn, useTimeoutFn } from '@type-dom/use';
+export class TdNotification extends Fragment {
+    visible;
+    close;
+    divRef;
+    // todo option 基于notify中的调用设置
+    constructor(params = {}) {
+        super(params);
+        defaultProps(this, notificationProps);
+        this.divRef = signal();
+        addEmits(this, notificationEmits);
+    }
+    setup() {
+        const props = this.props;
+        // const emit = this.emit;
+        const { ns, zIndex } = useGlobalComponentSettings('notification');
+        const { nextZIndex, currentZIndex } = zIndex;
+        const { Close } = CloseComponents;
+        const visible = signal(false);
+        let timer = undefined;
+        // countdown state: `elapsed` accumulates the time already consumed so the
+        // auto-close timer (and the progress bar) can resume where it was paused.
+        const percentage = signal(0);
+        let startedAt = 0;
+        let elapsed = 0;
+        let isHovered = false;
+        const typeClass = computed(() => {
+            const type = props.type;
+            return type && TypeComponentsMap[type] ? ns.m(type) : '';
+        });
+        const iconComponent = computed(() => {
+            if (!props.type)
+                return props.icon;
+            return TypeComponentsMap[props.type] || props.icon;
+        });
+        const horizontalClass = computed(() => props.position?.endsWith('right') ? 'right' : 'left');
+        const verticalProperty = computed(() => props.position?.startsWith('top') ? 'top' : 'bottom');
+        const positionStyle = computed(() => {
+            return {
+                [verticalProperty.get()]: `${props.offset}px`,
+                zIndex: props.zIndex ?? currentZIndex.get(),
+            };
+        });
+        const showProgressBar = computed(() => !!props.progress && props.duration > 0);
+        const progressStatus = computed(() => {
+            switch (props.type) {
+                case 'success':
+                    return 'success';
+                case 'warning':
+                    return 'warning';
+                case 'error':
+                    return 'exception';
+                default:
+                    return undefined;
+            }
+        });
+        const progressProps = computed(() => ({
+            status: progressStatus.get(),
+            strokeWidth: 3,
+            showText: false,
+            ...(typeof props.progress === 'object' ? props.progress : undefined),
+        }));
+        // tick interval matches the 0.1s width transition in the style, keeping the bar smooth
+        const { pause: pauseProgress, resume: resumeProgress } = useIntervalFn(() => {
+            percentage.set(Math.max(0, 100 - ((elapsed + Date.now() - startedAt) / props.duration) * 100));
+        }, 100, { immediate: false });
+        function startTimer() {
+            if (props.duration <= 0)
+                return;
+            timer?.();
+            pauseProgress();
+            startedAt = Date.now();
+            const remaining = Math.max(0, props.duration - elapsed);
+            // close timer with remaining duration
+            ({ stop: timer } = useTimeoutFn(() => {
+                if (visible.get())
+                    close();
+            }, remaining));
+            // progress bar resumes from current position
+            if (showProgressBar.get()) {
+                percentage.set((remaining / props.duration) * 100);
+                resumeProgress();
+            }
+        }
+        function clearTimer() {
+            timer?.();
+            pauseProgress();
+            if (startedAt > 0) {
+                elapsed += Date.now() - startedAt;
+                startedAt = 0;
+            }
+        }
+        function close() {
+            visible.set(false);
+            clearTimer();
+        }
+        function onMouseEnter() {
+            isHovered = true;
+            if (props.pauseOnHover)
+                clearTimer();
+        }
+        function onMouseLeave() {
+            isHovered = false;
+            if (props.pauseOnHover)
+                startTimer();
+        }
+        function onKeydown({ code }) {
+            if (code === EVENT_CODE.delete || code === EVENT_CODE.backspace) {
+                clearTimer(); // press delete/backspace clear timer
+            }
+            else if (code === EVENT_CODE.esc) {
+                // press esc to close the notification
+                if (visible.get()) {
+                    close();
+                }
+            }
+            else {
+                // resume timer — keep it paused while the pointer is still over the notification
+                if (isHovered && props.pauseOnHover)
+                    return;
+                clearTimer();
+                startTimer();
+            }
+        }
+        // lifecycle
+        onMounted(() => {
+            startTimer();
+            nextZIndex();
+            visible.set(true);
+        });
+        useEventListener(document, 'keydown', onKeydown);
+        this.visible = visible;
+        /** @description close notification */
+        this.close = close;
+        this.addChild(new Transition({
+            name: 'fade',
+            onBeforeLeave: () => {
+                // console.log('beforeLeave');
+                props.onClose?.();
+            },
+            onAfterLeave: () => {
+                // console.log('afterLeave');
+                emit(this, 'destroy');
+            },
+            slot: new Div({
+                refDom: this.divRef,
+                vShow: visible,
+                class: [ns.b(), props.customClass, horizontalClass.get()],
+                attrObj: {
+                    id: props.id,
+                    role: 'alert',
+                },
+                styleObj: positionStyle,
+                onMouseenter: onMouseEnter,
+                onMouseleave: onMouseLeave,
+                onClick: props.onClick,
+                slot: [
+                    new TdIcon({
+                        vIf: iconComponent,
+                        class: [ns.e('icon'), typeClass.get()],
+                        slot: iconComponent.get() &&
+                            new (iconComponent.get())(),
+                    }),
+                    new Div({
+                        class: 'group',
+                        slot: [
+                            new Head({
+                                class: ns.e('title'),
+                                nodeName: 'h2',
+                                slot: props.title,
+                            }),
+                            new Div({
+                                vShow: props.message,
+                                class: ns.e('content'),
+                                styleObj: props.title ? undefined : { margin: 0 },
+                                slot: props.slot ??
+                                    props.slots?.default ?? [
+                                    !props.dangerouslyUseHTMLString
+                                        ? new P({
+                                            slot: props.message,
+                                        })
+                                        : new P({
+                                            html: props.message,
+                                        }),
+                                ],
+                            }),
+                            new TdIcon({
+                                vIf: props.showClose,
+                                class: ns.e('closeBtn'),
+                                slot: new Close(),
+                                onClick: (evt) => {
+                                    evt?.stopPropagation();
+                                    close();
+                                },
+                            }),
+                        ],
+                    }),
+                    new Div({
+                        vIf: showProgressBar,
+                        class: ns.e('progress'),
+                        attrObj: {
+                            ariaHidden: 'true',
+                        },
+                        slot: new TdProgress({
+                            ...progressProps.get(),
+                            percentage,
+                        }),
+                    }),
+                ],
+            }),
+        }));
+    }
+}
+//# sourceMappingURL=td-notification.class.js.map