namirasoft-account-react 1.3.89 → 1.3.90
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -5,8 +5,12 @@ export interface NSAMessageDialogState {
|
|
|
5
5
|
show: boolean;
|
|
6
6
|
}
|
|
7
7
|
export declare class NSAMessageDialog extends Component<NSAMessageDialogProps, NSAMessageDialogState> {
|
|
8
|
+
private toastRef;
|
|
8
9
|
constructor(props: NSAMessageDialogProps);
|
|
10
|
+
componentDidMount(): void;
|
|
11
|
+
componentWillUnmount(): void;
|
|
9
12
|
show(): void;
|
|
10
13
|
hide(): void;
|
|
14
|
+
handleClickOutside(event: MouseEvent): void;
|
|
11
15
|
render(): import("react/jsx-runtime").JSX.Element;
|
|
12
16
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import { Component } from 'react';
|
|
2
|
+
import { Component, createRef } from 'react';
|
|
3
3
|
import MessageHeader from '../assets/images/icon-notification-header.png';
|
|
4
4
|
import CloseToast from '../assets/images/icon-close.png';
|
|
5
5
|
import Styles from './NSAMessageDialog.module.css';
|
|
@@ -9,8 +9,16 @@ export class NSAMessageDialog extends Component {
|
|
|
9
9
|
constructor(props) {
|
|
10
10
|
super(props);
|
|
11
11
|
this.state = { show: false };
|
|
12
|
+
this.toastRef = createRef();
|
|
12
13
|
this.show = this.show.bind(this);
|
|
13
14
|
this.hide = this.hide.bind(this);
|
|
15
|
+
this.handleClickOutside = this.handleClickOutside.bind(this);
|
|
16
|
+
}
|
|
17
|
+
componentDidMount() {
|
|
18
|
+
document.addEventListener('mousedown', this.handleClickOutside);
|
|
19
|
+
}
|
|
20
|
+
componentWillUnmount() {
|
|
21
|
+
document.removeEventListener('mousedown', this.handleClickOutside);
|
|
14
22
|
}
|
|
15
23
|
show() {
|
|
16
24
|
this.setState({ show: true });
|
|
@@ -18,9 +26,14 @@ export class NSAMessageDialog extends Component {
|
|
|
18
26
|
hide() {
|
|
19
27
|
this.setState({ show: false });
|
|
20
28
|
}
|
|
29
|
+
handleClickOutside(event) {
|
|
30
|
+
if (this.toastRef.current && !this.toastRef.current.contains(event.target)) {
|
|
31
|
+
this.hide();
|
|
32
|
+
}
|
|
33
|
+
}
|
|
21
34
|
render() {
|
|
22
35
|
return (_jsx(_Fragment, { children: this.state.show &&
|
|
23
|
-
_jsx("div", { className: Styles.nsa_toast, children: _jsxs(Toast, { show: this.state.show, children: [_jsxs("div", { className: Styles.nsa_toast_header, children: [_jsxs("article", { children: [_jsx("img", { src: MessageHeader, alt: "MessageHeader", width: 22 }), _jsx("span", { className: `${Styles.nsa_message_title} ms-2`, children: "Mark All As Read" })] }), _jsx("
|
|
36
|
+
_jsx("div", { className: Styles.nsa_toast, ref: this.toastRef, children: _jsxs(Toast, { show: this.state.show, children: [_jsxs("div", { className: Styles.nsa_toast_header, children: [_jsxs("article", { children: [_jsx("img", { src: MessageHeader, alt: "MessageHeader", width: 22 }), _jsx("span", { className: `${Styles.nsa_message_title} ms-2`, children: "Mark All As Read" })] }), _jsx("img", { src: CloseToast, alt: "Close", width: 18, onClick: () => this.hide(), className: Styles.nsa_close_icon })] }), _jsxs("div", { className: Styles.nsa_toast_body, children: [_jsxs("div", { className: Styles.nsa_body_green, children: [_jsx("ul", { className: Styles.nsa_message_item_ul, children: _jsx("li", { className: `${Styles.nsa_message_item_title}`, children: "You\u2019ve Unlocked Our Gold Membership!" }) }), _jsx("p", { className: `${Styles.nsa_message_item_content} nsa_font_13_normal`, children: "Learn More!" })] }), _jsxs("div", { className: Styles.nsa_body_gray, children: [_jsx("ul", { className: Styles.nsa_message_item_ul, children: _jsx("li", { className: `${Styles.nsa_message_item_title}`, children: "You\u2019ve Unlocked Our Gold Membership!" }) }), _jsx("p", { className: `${Styles.nsa_message_item_content} nsa_font_13_normal`, children: "Learn More!" })] }), _jsx("div", { className: 'p-3 mx-0 d-flex justify-content-center', children: _jsx(NSButtonBlue, { onClick: () => { }, title: 'View All' }) })] })] }) }) }));
|
|
24
37
|
}
|
|
25
38
|
}
|
|
26
39
|
//# sourceMappingURL=NSAMessageDialog.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NSAMessageDialog.js","sourceRoot":"","sources":["../../src/components/NSAMessageDialog.tsx"],"names":[],"mappings":";AAAA,
|
|
1
|
+
{"version":3,"file":"NSAMessageDialog.js","sourceRoot":"","sources":["../../src/components/NSAMessageDialog.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
"framework": "npm",
|
|
9
9
|
"application": "package",
|
|
10
10
|
"private": false,
|
|
11
|
-
"version": "1.3.
|
|
11
|
+
"version": "1.3.90",
|
|
12
12
|
"author": "Amir Abolhasani",
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"main": "./dist/main.js",
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"namirasoft-account-client": "^1.3.0",
|
|
29
29
|
"namirasoft-core": "^1.3.57",
|
|
30
30
|
"namirasoft-field": "^1.3.7",
|
|
31
|
-
"namirasoft-site-react": "^1.3.
|
|
31
|
+
"namirasoft-site-react": "^1.3.233",
|
|
32
32
|
"os-browserify": "^0.3.0",
|
|
33
33
|
"path-browserify": "^1.0.1",
|
|
34
34
|
"process": "^0.11.10",
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Component } from 'react';
|
|
1
|
+
import React, { Component, createRef } from 'react';
|
|
2
2
|
import MessageHeader from '../assets/images/icon-notification-header.png';
|
|
3
3
|
import CloseToast from '../assets/images/icon-close.png';
|
|
4
4
|
import Styles from './NSAMessageDialog.module.css';
|
|
@@ -15,27 +15,50 @@ export interface NSAMessageDialogState
|
|
|
15
15
|
|
|
16
16
|
export class NSAMessageDialog extends Component<NSAMessageDialogProps, NSAMessageDialogState>
|
|
17
17
|
{
|
|
18
|
+
private toastRef: React.RefObject<HTMLDivElement>;
|
|
19
|
+
|
|
18
20
|
constructor(props: NSAMessageDialogProps)
|
|
19
21
|
{
|
|
20
22
|
super(props);
|
|
21
23
|
this.state = { show: false };
|
|
24
|
+
this.toastRef = createRef();
|
|
22
25
|
this.show = this.show.bind(this);
|
|
23
26
|
this.hide = this.hide.bind(this);
|
|
27
|
+
this.handleClickOutside = this.handleClickOutside.bind(this);
|
|
28
|
+
}
|
|
29
|
+
override componentDidMount(): void
|
|
30
|
+
{
|
|
31
|
+
document.addEventListener('mousedown', this.handleClickOutside);
|
|
32
|
+
}
|
|
33
|
+
override componentWillUnmount(): void
|
|
34
|
+
{
|
|
35
|
+
document.removeEventListener('mousedown', this.handleClickOutside);
|
|
24
36
|
}
|
|
37
|
+
|
|
38
|
+
|
|
25
39
|
show()
|
|
26
40
|
{
|
|
27
41
|
this.setState({ show: true });
|
|
28
42
|
}
|
|
43
|
+
|
|
29
44
|
hide()
|
|
30
45
|
{
|
|
31
46
|
this.setState({ show: false });
|
|
32
47
|
}
|
|
48
|
+
|
|
49
|
+
handleClickOutside(event: MouseEvent)
|
|
50
|
+
{
|
|
51
|
+
if (this.toastRef.current && !this.toastRef.current.contains(event.target as Node))
|
|
52
|
+
{
|
|
53
|
+
this.hide();
|
|
54
|
+
}
|
|
55
|
+
}
|
|
33
56
|
override render()
|
|
34
57
|
{
|
|
35
58
|
return (
|
|
36
59
|
<>
|
|
37
60
|
{this.state.show &&
|
|
38
|
-
<div className={Styles.nsa_toast}>
|
|
61
|
+
<div className={Styles.nsa_toast} ref={this.toastRef}>
|
|
39
62
|
<Toast show={this.state.show} >
|
|
40
63
|
<div className={Styles.nsa_toast_header}>
|
|
41
64
|
<article>
|
|
@@ -46,15 +69,13 @@ export class NSAMessageDialog extends Component<NSAMessageDialogProps, NSAMessag
|
|
|
46
69
|
/>
|
|
47
70
|
<span className={`${Styles.nsa_message_title} ms-2`}>Mark All As Read</span>
|
|
48
71
|
</article>
|
|
49
|
-
<
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
/>
|
|
57
|
-
</article>
|
|
72
|
+
<img
|
|
73
|
+
src={CloseToast}
|
|
74
|
+
alt="Close"
|
|
75
|
+
width={18}
|
|
76
|
+
onClick={() => this.hide()}
|
|
77
|
+
className={Styles.nsa_close_icon}
|
|
78
|
+
/>
|
|
58
79
|
</div>
|
|
59
80
|
<div className={Styles.nsa_toast_body}>
|
|
60
81
|
<div className={Styles.nsa_body_green}>
|