@onekeyfe/cross-inpage-provider-core - npm Package Compare versions

Comparing version 2.0.0-alpha.0 to 2.0.0-alpha.1

dist/cjs/notification/icon.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.IconLogo = exports.IconClose = void 0;
-exports.IconClose = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 4.79289C4.68342 4.40237 5.31658 4.40237 5.70711 4.79289L12 11.0858L18.2929 4.79289C18.6834 4.40237 19.3166 4.40237 19.7071 4.79289C20.0976 5.18342 20.0976 5.81658 19.7071 6.20711L13.4142 12.5L19.7071 18.7929C20.0976 19.1834 20.0976 19.8166 19.7071 20.2071C19.3166 20.5976 18.6834 20.5976 18.2929 20.2071L12 13.9142L5.70711 20.2071C5.31658 20.5976 4.68342 20.5976 4.29289 20.2071C3.90237 19.8166 3.90237 19.1834 4.29289 18.7929L10.5858 12.5L4.29289 6.20711C3.90237 5.81658 3.90237 5.18342 4.29289 4.79289Z' fill='black'/%3E%3C/svg%3E";
+exports.IconLogo = exports.IconDismiss = void 0;
+exports.IconDismiss = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 4.79289C4.68342 4.40237 5.31658 4.40237 5.70711 4.79289L12 11.0858L18.2929 4.79289C18.6834 4.40237 19.3166 4.40237 19.7071 4.79289C20.0976 5.18342 20.0976 5.81658 19.7071 6.20711L13.4142 12.5L19.7071 18.7929C20.0976 19.1834 20.0976 19.8166 19.7071 20.2071C19.3166 20.5976 18.6834 20.5976 18.2929 20.2071L12 13.9142L5.70711 20.2071C5.31658 20.5976 4.68342 20.5976 4.29289 20.2071C3.90237 19.8166 3.90237 19.1834 4.29289 18.7929L10.5858 12.5L4.29289 6.20711C3.90237 5.81658 3.90237 5.18342 4.29289 4.79289Z' fill='black'/%3E%3C/svg%3E";
 exports.IconLogo = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 21 21' fill='none'%3E%3Cpath d='M10.4987 14.4595C11.3758 14.4595 12.0867 13.7485 12.0867 12.8715C12.0867 11.9945 11.3758 11.2836 10.4987 11.2836C9.62174 11.2836 8.91078 11.9945 8.91078 12.8715C8.91078 13.7485 9.62174 14.4595 10.4987 14.4595Z' fill='black' fill-opacity='0.875'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.4987 19.6668C16.827 19.6668 19.6654 16.8284 19.6654 10.5002C19.6654 4.1719 16.827 1.3335 10.4987 1.3335C4.17044 1.3335 1.33203 4.1719 1.33203 10.5002C1.33203 16.8284 4.17044 19.6668 10.4987 19.6668ZM8.77681 5.22049H11.3269V9.42284H9.74582V6.57329H8.32942L8.77681 5.22049ZM10.4988 15.7798C12.105 15.7798 13.407 14.4778 13.407 12.8715C13.407 11.2653 12.105 9.96325 10.4988 9.96325C8.89255 9.96325 7.59046 11.2653 7.59046 12.8715C7.59046 14.4778 8.89255 15.7798 10.4988 15.7798Z' fill='black' fill-opacity='0.875'/%3E%3C/svg%3E";

dist/cjs/notification/notification.js

@@ -7,68 +7,66 @@ "use strict";
 class Notification {
-    constructor(options) {
-        this.options = options;
-        this.el = document.createElement("div");
-        this.el.className = `onekey-notice ${this.options.className ? this.options.className : ""}`;
-        // initial events
-        this.events = {};
-        // inner element
+    constructor(settings) {
+        this.settings = settings;
+        this.element = document.createElement("div");
+        this.element.className = `onekey-alert-message ${this.settings.customClass ? this.settings.customClass : ""}`;
+        // initialize event handlers
+        this.eventHandlers = {};
+        // add inner content
         this.insert();
-        // auto hide animation
-        if (this.options.timeout) {
-            this.startTimer();
+        // start auto-dismiss timer
+        if (this.settings.duration) {
+            this.initiateTimer();
         }
-        // mouse events
-        this.registerEvents();
+        // mouse interaction events
+        this.bindEvents();
     }
     insert() {
         var _a;
-        if (!this.el) {
+        if (!this.element) {
             return;
         }
-        // main
-        const elMain = document.createElement("div");
-        elMain.className = "onekey-notice-content";
-        elMain.innerHTML = this.options.content;
-        (_a = this.el) === null || _a === void 0 ? void 0 : _a.appendChild(elMain);
-        // close button
-        if (this.options.closeable) {
-            this.closeButton = document.createElement("div");
-            this.closeButton.className = "onekey-notice-close-wrapper";
-            const closeBtnImg = document.createElement("img");
-            closeBtnImg.setAttribute("src", icon_1.IconClose);
-            closeBtnImg.className = "onekey-notice-close";
-            this.closeButton.appendChild(closeBtnImg);
-            this.el.appendChild(this.closeButton);
+        // content container
+        const contentContainer = document.createElement("div");
+        contentContainer.className = "onekey-alert-message-body";
+        contentContainer.innerHTML = this.settings.content;
+        (_a = this.element) === null || _a === void 0 ? void 0 : _a.appendChild(contentContainer);
+        // dismiss button
+        if (this.settings.dismissible) {
+            this.dismissButton = document.createElement("div");
+            this.dismissButton.className = "onekey-alert-message-dismiss";
+            const dismissIcon = document.createElement("img");
+            dismissIcon.setAttribute("src", icon_1.IconDismiss);
+            dismissIcon.className = "onekey-alert-close-icon";
+            this.dismissButton.appendChild(dismissIcon);
+            this.element.appendChild(this.dismissButton);
         }
-        this.options.container.appendChild(this.el);
+        this.settings.hostElement.appendChild(this.element);
     }
-    registerEvents() {
+    bindEvents() {
         var _a;
-        this.events.hide = () => this.hide();
-        (_a = this.closeButton) === null || _a === void 0 ? void 0 : _a.addEventListener("click", this.events.hide, false);
+        this.eventHandlers.dismiss = () => this.dismiss();
+        (_a = this.dismissButton) === null || _a === void 0 ? void 0 : _a.addEventListener("click", this.eventHandlers.dismiss, false);
     }
-    startTimer(timeout = this.options.timeout) {
-        this.timer = setTimeout(() => {
-            this.hide();
-        }, timeout);
+    initiateTimer(duration = this.settings.duration) {
+        this.dismissalTimer = setTimeout(() => {
+            this.dismiss();
+        }, duration);
     }
-    stopTimer() {
-        if (this.timer) {
-            clearTimeout(this.timer);
-            this.timer = null;
+    cancelTimer() {
+        if (this.dismissalTimer) {
+            clearTimeout(this.dismissalTimer);
+            this.dismissalTimer = null;
         }
     }
-    hide() {
-        if (!this.el) {
+    dismiss() {
+        if (!this.element) {
             return;
         }
-        this.el.classList.add(".onekey-notice-is-hide");
-        // setTimeout(() => {
-        this.options.container.removeChild(this.el);
-        this.el = null;
-        if (this.options.onHide) {
-            this.options.onHide();
+        this.element.classList.add(".onekey-alert-message-hidden");
+        this.settings.hostElement.removeChild(this.element);
+        this.element = null;
+        if (this.settings.onDismiss) {
+            this.settings.onDismiss();
         }
-        this.stopTimer();
-        // }, 300);
+        this.cancelTimer();
     }
@@ -79,3 +77,3 @@ }
 const styles = `
-    .onekey-notice-container {
+    .onekey-alert-container {
       position: fixed;
@@ -86,3 +84,3 @@ z-index: 99999;
     }
-    .onekey-notice {
+    .onekey-alert-message {
       min-width: 230px;
@@ -110,6 +108,6 @@ min-height: 44px;
     }
-    .onekey-notice + .onekey-notice {
+    .onekey-alert-message + .onekey-alert-message {
       margin-top: 30px;
     }
-    .onekey-notice-content {
+    .onekey-alert-message-body {
       display: flex;
@@ -119,3 +117,3 @@ align-items: center;
     }
-    .onekey-notice-is-hide {
+    .onekey-alert-message-hidden {
       opacity: 0;
@@ -125,6 +123,3 @@ transition: 0.3s;
 
-    .onekey-notice-icon {
-      width: 20px;
-    }
-    .onekey-notice-close-wrapper {
+    .onekey-alert-message-dismiss {
       display: flex;
@@ -137,3 +132,3 @@ justify-content: center;
     }
-    .onekey-notice-close {
+    .onekey-alert-close-icon-close {
       flex-shrink: 0;
@@ -147,3 +142,3 @@ width: 24px;
     }
-    .onekey-notice-default-wallet {
+    .onekey-alert-default-wallet {
       border-radius: 8px;
@@ -158,24 +153,31 @@ height: 71px;
 function notification(options) {
-    const { content = "", 
-    // timeout = 3000,
-    timeout = 0, closeButton = "×", className = "", closeable = false, } = options || {};
+    const { content = "", duration = 0, triggerElement = "×", customClass = "", dismissible = false, } = options || {};
     if (!container) {
+        const hostElement = document.createElement('div');
+        hostElement.id = 'onekey-notification-center';
+        const shadowRoot = hostElement.attachShadow({ mode: 'open' });
         container = document.createElement("div");
-        container.classList.add("onekey-notice-container");
+        container.classList.add("onekey-alert-container");
         style = document.createElement("style");
         style.innerHTML = styles;
-        document.body.appendChild(style);
-        document.body.appendChild(container);
+        shadowRoot.appendChild(style);
+        shadowRoot.appendChild(container);
+        document.body.appendChild(hostElement);
     }
     return new Notification({
         content,
-        timeout,
-        closeButton,
-        container,
-        className,
-        closeable,
-        onHide: () => {
+        duration,
+        triggerElement,
+        hostElement: container,
+        customClass,
+        dismissible,
+        onDismiss: () => {
             if (container && !(container === null || container === void 0 ? void 0 : container.hasChildNodes())) {
-                document.body.removeChild(container);
-                style && document.body.removeChild(style);
+                const rootNode = container.getRootNode();
+                if (rootNode instanceof ShadowRoot) {
+                    document.body.removeChild(rootNode.host);
+                }
+                else {
+                    document.body.removeChild(rootNode);
+                }
                 style = null;
@@ -182,0 +184,0 @@ container = null;

dist/cjs/notification/swtichDefaultWalletNotification.js

@@ -31,3 +31,3 @@ "use strict";
     if (instance) {
-        instance.hide();
+        instance.dismiss();
         instance = null;
@@ -37,5 +37,5 @@ }
     instance = (0, notification_1.default)({
-        closeable: true,
-        timeout: 0,
-        className: "onekey-notice-default-wallet",
+        dismissible: true,
+        duration: 0,
+        customClass: "onekey-alert-default-wallet",
         content: `<div style="display: flex; align-items: center; gap: 8px;">
@@ -42,0 +42,0 @@ <img style="width: 32px;" src="${icon_1.IconLogo}"/>

dist/cjs/versionInfo.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const version = '2.0.0-alpha.0';
+const version = '2.0.0-alpha.1';
 const versionBuild = '2020-0101-1';
@@ -5,0 +5,0 @@ exports.default = {

dist/notification/icon.d.ts

@@ -1,2 +0,2 @@
-export declare const IconClose = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 4.79289C4.68342 4.40237 5.31658 4.40237 5.70711 4.79289L12 11.0858L18.2929 4.79289C18.6834 4.40237 19.3166 4.40237 19.7071 4.79289C20.0976 5.18342 20.0976 5.81658 19.7071 6.20711L13.4142 12.5L19.7071 18.7929C20.0976 19.1834 20.0976 19.8166 19.7071 20.2071C19.3166 20.5976 18.6834 20.5976 18.2929 20.2071L12 13.9142L5.70711 20.2071C5.31658 20.5976 4.68342 20.5976 4.29289 20.2071C3.90237 19.8166 3.90237 19.1834 4.29289 18.7929L10.5858 12.5L4.29289 6.20711C3.90237 5.81658 3.90237 5.18342 4.29289 4.79289Z' fill='black'/%3E%3C/svg%3E";
+export declare const IconDismiss = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 4.79289C4.68342 4.40237 5.31658 4.40237 5.70711 4.79289L12 11.0858L18.2929 4.79289C18.6834 4.40237 19.3166 4.40237 19.7071 4.79289C20.0976 5.18342 20.0976 5.81658 19.7071 6.20711L13.4142 12.5L19.7071 18.7929C20.0976 19.1834 20.0976 19.8166 19.7071 20.2071C19.3166 20.5976 18.6834 20.5976 18.2929 20.2071L12 13.9142L5.70711 20.2071C5.31658 20.5976 4.68342 20.5976 4.29289 20.2071C3.90237 19.8166 3.90237 19.1834 4.29289 18.7929L10.5858 12.5L4.29289 6.20711C3.90237 5.81658 3.90237 5.18342 4.29289 4.79289Z' fill='black'/%3E%3C/svg%3E";
 export declare const IconLogo = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 21 21' fill='none'%3E%3Cpath d='M10.4987 14.4595C11.3758 14.4595 12.0867 13.7485 12.0867 12.8715C12.0867 11.9945 11.3758 11.2836 10.4987 11.2836C9.62174 11.2836 8.91078 11.9945 8.91078 12.8715C8.91078 13.7485 9.62174 14.4595 10.4987 14.4595Z' fill='black' fill-opacity='0.875'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.4987 19.6668C16.827 19.6668 19.6654 16.8284 19.6654 10.5002C19.6654 4.1719 16.827 1.3335 10.4987 1.3335C4.17044 1.3335 1.33203 4.1719 1.33203 10.5002C1.33203 16.8284 4.17044 19.6668 10.4987 19.6668ZM8.77681 5.22049H11.3269V9.42284H9.74582V6.57329H8.32942L8.77681 5.22049ZM10.4988 15.7798C12.105 15.7798 13.407 14.4778 13.407 12.8715C13.407 11.2653 12.105 9.96325 10.4988 9.96325C8.89255 9.96325 7.59046 11.2653 7.59046 12.8715C7.59046 14.4778 8.89255 15.7798 10.4988 15.7798Z' fill='black' fill-opacity='0.875'/%3E%3C/svg%3E";

dist/notification/icon.js

@@ -1,2 +0,2 @@
-export const IconClose = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 4.79289C4.68342 4.40237 5.31658 4.40237 5.70711 4.79289L12 11.0858L18.2929 4.79289C18.6834 4.40237 19.3166 4.40237 19.7071 4.79289C20.0976 5.18342 20.0976 5.81658 19.7071 6.20711L13.4142 12.5L19.7071 18.7929C20.0976 19.1834 20.0976 19.8166 19.7071 20.2071C19.3166 20.5976 18.6834 20.5976 18.2929 20.2071L12 13.9142L5.70711 20.2071C5.31658 20.5976 4.68342 20.5976 4.29289 20.2071C3.90237 19.8166 3.90237 19.1834 4.29289 18.7929L10.5858 12.5L4.29289 6.20711C3.90237 5.81658 3.90237 5.18342 4.29289 4.79289Z' fill='black'/%3E%3C/svg%3E";
+export const IconDismiss = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 4.79289C4.68342 4.40237 5.31658 4.40237 5.70711 4.79289L12 11.0858L18.2929 4.79289C18.6834 4.40237 19.3166 4.40237 19.7071 4.79289C20.0976 5.18342 20.0976 5.81658 19.7071 6.20711L13.4142 12.5L19.7071 18.7929C20.0976 19.1834 20.0976 19.8166 19.7071 20.2071C19.3166 20.5976 18.6834 20.5976 18.2929 20.2071L12 13.9142L5.70711 20.2071C5.31658 20.5976 4.68342 20.5976 4.29289 20.2071C3.90237 19.8166 3.90237 19.1834 4.29289 18.7929L10.5858 12.5L4.29289 6.20711C3.90237 5.81658 3.90237 5.18342 4.29289 4.79289Z' fill='black'/%3E%3C/svg%3E";
 export const IconLogo = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 21 21' fill='none'%3E%3Cpath d='M10.4987 14.4595C11.3758 14.4595 12.0867 13.7485 12.0867 12.8715C12.0867 11.9945 11.3758 11.2836 10.4987 11.2836C9.62174 11.2836 8.91078 11.9945 8.91078 12.8715C8.91078 13.7485 9.62174 14.4595 10.4987 14.4595Z' fill='black' fill-opacity='0.875'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.4987 19.6668C16.827 19.6668 19.6654 16.8284 19.6654 10.5002C19.6654 4.1719 16.827 1.3335 10.4987 1.3335C4.17044 1.3335 1.33203 4.1719 1.33203 10.5002C1.33203 16.8284 4.17044 19.6668 10.4987 19.6668ZM8.77681 5.22049H11.3269V9.42284H9.74582V6.57329H8.32942L8.77681 5.22049ZM10.4988 15.7798C12.105 15.7798 13.407 14.4778 13.407 12.8715C13.407 11.2653 12.105 9.96325 10.4988 9.96325C8.89255 9.96325 7.59046 11.2653 7.59046 12.8715C7.59046 14.4778 8.89255 15.7798 10.4988 15.7798Z' fill='black' fill-opacity='0.875'/%3E%3C/svg%3E";

dist/notification/notification.d.ts

@@ -1,25 +0,25 @@
-interface Options {
+interface NotificationSettings {
     content: string;
-    closeButton: HTMLElement | string;
-    container: HTMLElement;
-    timeout: number;
-    onHide?: () => void;
-    className?: string;
-    closeable: boolean;
+    triggerElement: HTMLElement | string;
+    hostElement: HTMLElement;
+    duration: number;
+    onDismiss?: () => void;
+    customClass?: string;
+    dismissible: boolean;
 }
 declare class Notification {
-    options: Options;
-    el: HTMLDivElement | null;
-    events: Record<string, (...args: any) => void>;
-    closeButton?: HTMLElement;
-    timer?: number | null;
-    constructor(options: Options);
+    settings: NotificationSettings;
+    element: HTMLDivElement | null;
+    eventHandlers: Record<string, (...args: any) => void>;
+    dismissButton?: HTMLElement;
+    dismissalTimer?: number | null;
+    constructor(settings: NotificationSettings);
     insert(): void;
-    registerEvents(): void;
-    startTimer(timeout?: number): void;
-    stopTimer(): void;
-    hide(): void;
+    bindEvents(): void;
+    initiateTimer(duration?: number): void;
+    cancelTimer(): void;
+    dismiss(): void;
 }
-declare function notification(options: Partial<Options>): Notification;
+declare function notification(options: Partial<NotificationSettings>): Notification;
 export default notification;
 export declare const isInSameOriginIframe: () => boolean;

dist/notification/notification.js

 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { IconClose } from './icon';
+import { IconDismiss } from './icon';
 class Notification {
-    constructor(options) {
-        this.options = options;
-        this.el = document.createElement("div");
-        this.el.className = `onekey-notice ${this.options.className ? this.options.className : ""}`;
-        // initial events
-        this.events = {};
-        // inner element
+    constructor(settings) {
+        this.settings = settings;
+        this.element = document.createElement("div");
+        this.element.className = `onekey-alert-message ${this.settings.customClass ? this.settings.customClass : ""}`;
+        // initialize event handlers
+        this.eventHandlers = {};
+        // add inner content
         this.insert();
-        // auto hide animation
-        if (this.options.timeout) {
-            this.startTimer();
+        // start auto-dismiss timer
+        if (this.settings.duration) {
+            this.initiateTimer();
         }
-        // mouse events
-        this.registerEvents();
+        // mouse interaction events
+        this.bindEvents();
     }
     insert() {
         var _a;
-        if (!this.el) {
+        if (!this.element) {
             return;
         }
-        // main
-        const elMain = document.createElement("div");
-        elMain.className = "onekey-notice-content";
-        elMain.innerHTML = this.options.content;
-        (_a = this.el) === null || _a === void 0 ? void 0 : _a.appendChild(elMain);
-        // close button
-        if (this.options.closeable) {
-            this.closeButton = document.createElement("div");
-            this.closeButton.className = "onekey-notice-close-wrapper";
-            const closeBtnImg = document.createElement("img");
-            closeBtnImg.setAttribute("src", IconClose);
-            closeBtnImg.className = "onekey-notice-close";
-            this.closeButton.appendChild(closeBtnImg);
-            this.el.appendChild(this.closeButton);
+        // content container
+        const contentContainer = document.createElement("div");
+        contentContainer.className = "onekey-alert-message-body";
+        contentContainer.innerHTML = this.settings.content;
+        (_a = this.element) === null || _a === void 0 ? void 0 : _a.appendChild(contentContainer);
+        // dismiss button
+        if (this.settings.dismissible) {
+            this.dismissButton = document.createElement("div");
+            this.dismissButton.className = "onekey-alert-message-dismiss";
+            const dismissIcon = document.createElement("img");
+            dismissIcon.setAttribute("src", IconDismiss);
+            dismissIcon.className = "onekey-alert-close-icon";
+            this.dismissButton.appendChild(dismissIcon);
+            this.element.appendChild(this.dismissButton);
         }
-        this.options.container.appendChild(this.el);
+        this.settings.hostElement.appendChild(this.element);
     }
-    registerEvents() {
+    bindEvents() {
         var _a;
-        this.events.hide = () => this.hide();
-        (_a = this.closeButton) === null || _a === void 0 ? void 0 : _a.addEventListener("click", this.events.hide, false);
+        this.eventHandlers.dismiss = () => this.dismiss();
+        (_a = this.dismissButton) === null || _a === void 0 ? void 0 : _a.addEventListener("click", this.eventHandlers.dismiss, false);
     }
-    startTimer(timeout = this.options.timeout) {
-        this.timer = setTimeout(() => {
-            this.hide();
-        }, timeout);
+    initiateTimer(duration = this.settings.duration) {
+        this.dismissalTimer = setTimeout(() => {
+            this.dismiss();
+        }, duration);
     }
-    stopTimer() {
-        if (this.timer) {
-            clearTimeout(this.timer);
-            this.timer = null;
+    cancelTimer() {
+        if (this.dismissalTimer) {
+            clearTimeout(this.dismissalTimer);
+            this.dismissalTimer = null;
         }
     }
-    hide() {
-        if (!this.el) {
+    dismiss() {
+        if (!this.element) {
             return;
         }
-        this.el.classList.add(".onekey-notice-is-hide");
-        // setTimeout(() => {
-        this.options.container.removeChild(this.el);
-        this.el = null;
-        if (this.options.onHide) {
-            this.options.onHide();
+        this.element.classList.add(".onekey-alert-message-hidden");
+        this.settings.hostElement.removeChild(this.element);
+        this.element = null;
+        if (this.settings.onDismiss) {
+            this.settings.onDismiss();
         }
-        this.stopTimer();
-        // }, 300);
+        this.cancelTimer();
     }
@@ -75,3 +73,3 @@ }
 const styles = `
-    .onekey-notice-container {
+    .onekey-alert-container {
       position: fixed;
@@ -82,3 +80,3 @@ z-index: 99999;
     }
-    .onekey-notice {
+    .onekey-alert-message {
       min-width: 230px;
@@ -106,6 +104,6 @@ min-height: 44px;
     }
-    .onekey-notice + .onekey-notice {
+    .onekey-alert-message + .onekey-alert-message {
       margin-top: 30px;
     }
-    .onekey-notice-content {
+    .onekey-alert-message-body {
       display: flex;
@@ -115,3 +113,3 @@ align-items: center;
     }
-    .onekey-notice-is-hide {
+    .onekey-alert-message-hidden {
       opacity: 0;
@@ -121,6 +119,3 @@ transition: 0.3s;
 
-    .onekey-notice-icon {
-      width: 20px;
-    }
-    .onekey-notice-close-wrapper {
+    .onekey-alert-message-dismiss {
       display: flex;
@@ -133,3 +128,3 @@ justify-content: center;
     }
-    .onekey-notice-close {
+    .onekey-alert-close-icon-close {
       flex-shrink: 0;
@@ -143,3 +138,3 @@ width: 24px;
     }
-    .onekey-notice-default-wallet {
+    .onekey-alert-default-wallet {
       border-radius: 8px;
@@ -154,24 +149,31 @@ height: 71px;
 function notification(options) {
-    const { content = "", 
-    // timeout = 3000,
-    timeout = 0, closeButton = "×", className = "", closeable = false, } = options || {};
+    const { content = "", duration = 0, triggerElement = "×", customClass = "", dismissible = false, } = options || {};
     if (!container) {
+        const hostElement = document.createElement('div');
+        hostElement.id = 'onekey-notification-center';
+        const shadowRoot = hostElement.attachShadow({ mode: 'open' });
         container = document.createElement("div");
-        container.classList.add("onekey-notice-container");
+        container.classList.add("onekey-alert-container");
         style = document.createElement("style");
         style.innerHTML = styles;
-        document.body.appendChild(style);
-        document.body.appendChild(container);
+        shadowRoot.appendChild(style);
+        shadowRoot.appendChild(container);
+        document.body.appendChild(hostElement);
     }
     return new Notification({
         content,
-        timeout,
-        closeButton,
-        container,
-        className,
-        closeable,
-        onHide: () => {
+        duration,
+        triggerElement,
+        hostElement: container,
+        customClass,
+        dismissible,
+        onDismiss: () => {
             if (container && !(container === null || container === void 0 ? void 0 : container.hasChildNodes())) {
-                document.body.removeChild(container);
-                style && document.body.removeChild(style);
+                const rootNode = container.getRootNode();
+                if (rootNode instanceof ShadowRoot) {
+                    document.body.removeChild(rootNode.host);
+                }
+                else {
+                    document.body.removeChild(rootNode);
+                }
                 style = null;
@@ -178,0 +180,0 @@ container = null;

dist/notification/swtichDefaultWalletNotification.js

@@ -9,3 +9,3 @@ import notification, { isInSameOriginIframe } from "./notification";
     if (instance) {
-        instance.hide();
+        instance.dismiss();
         instance = null;
@@ -15,5 +15,5 @@ }
     instance = notification({
-        closeable: true,
-        timeout: 0,
-        className: "onekey-notice-default-wallet",
+        dismissible: true,
+        duration: 0,
+        customClass: "onekey-alert-default-wallet",
         content: `<div style="display: flex; align-items: center; gap: 8px;">
@@ -20,0 +20,0 @@ <img style="width: 32px;" src="${IconLogo}"/>

dist/versionInfo.js

@@ -1,2 +0,2 @@
-const version = '2.0.0-alpha.0';
+const version = '2.0.0-alpha.1';
 const versionBuild = '2020-0101-1';
@@ -3,0 +3,0 @@ export default {

package.json

 {
   "name": "@onekeyfe/cross-inpage-provider-core",
-  "version": "2.0.0-alpha.0",
+  "version": "2.0.0-alpha.1",
   "keywords": [
@@ -32,5 +32,5 @@ "cross-inpage-provider"
   "dependencies": {
-    "@onekeyfe/cross-inpage-provider-errors": "2.0.0-alpha.0",
-    "@onekeyfe/cross-inpage-provider-events": "2.0.0-alpha.0",
-    "@onekeyfe/cross-inpage-provider-types": "2.0.0-alpha.0",
+    "@onekeyfe/cross-inpage-provider-errors": "2.0.0-alpha.1",
+    "@onekeyfe/cross-inpage-provider-events": "2.0.0-alpha.1",
+    "@onekeyfe/cross-inpage-provider-types": "2.0.0-alpha.1",
     "events": "^3.3.0",
@@ -40,3 +40,3 @@ "lodash": "^4.17.21",
   },
-  "gitHead": "13b0b3342ff68deef9d05bbaedc2416aab93d093"
+  "gitHead": "b65bb6cb9ac9223590fceb4b846acba1904d7910"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

189465

increased by0.73%

Lines of code

4600

increased by0.09%

Dependency changes

• + Added@onekeyfe/cross-inpage-provider-errors@2.0.0-alpha.1(transitive)

• + Added@onekeyfe/cross-inpage-provider-events@2.0.0-alpha.1(transitive)

• + Added@onekeyfe/cross-inpage-provider-types@2.0.0-alpha.1(transitive)

• - Removed@onekeyfe/cross-inpage-provider-errors@2.0.0-alpha.0(transitive)

• - Removed@onekeyfe/cross-inpage-provider-events@2.0.0-alpha.0(transitive)

• - Removed@onekeyfe/cross-inpage-provider-types@2.0.0-alpha.0(transitive)

• Updated@onekeyfe/cross-inpage-provider-errors@2.0.0-alpha.1

• Updated@onekeyfe/cross-inpage-provider-events@2.0.0-alpha.1

• Updated@onekeyfe/cross-inpage-provider-types@2.0.0-alpha.1