namirasoft-site-react 1.4.13 → 1.4.16
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.
- package/dist/App.js +5 -2
- package/dist/App.js.map +1 -1
- package/dist/components/NSBarAlert.d.ts +8 -0
- package/dist/components/NSBarAlert.js +7 -0
- package/dist/components/NSBarAlert.js.map +1 -0
- package/dist/components/NSBarAlert.module.css +68 -0
- package/dist/components/NSLayout.d.ts +2 -0
- package/dist/components/NSLayout.js +6 -3
- package/dist/components/NSLayout.js.map +1 -1
- package/dist/main.d.ts +1 -0
- package/dist/main.js +1 -0
- package/dist/main.js.map +1 -1
- package/package.json +3 -3
- package/src/App.tsx +11 -2
- package/src/components/NSBarAlert.module.css +68 -0
- package/src/components/NSBarAlert.tsx +31 -0
- package/src/components/NSLayout.tsx +31 -11
- package/src/main.ts +1 -0
package/dist/App.js
CHANGED
|
@@ -11,7 +11,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
|
|
|
11
11
|
import './App.css';
|
|
12
12
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
|
13
13
|
import { NSTable } from './components/NSTable';
|
|
14
|
-
import { NSBoxDate, NSBoxPhone, NSNotFoundPage } from './main';
|
|
14
|
+
import { NSBarAlert, NSBoxDate, NSBoxPhone, NSNotFoundPage } from './main';
|
|
15
15
|
const fakeFormatter = {
|
|
16
16
|
format: (value) => { return value; }
|
|
17
17
|
};
|
|
@@ -160,6 +160,9 @@ export function App() {
|
|
|
160
160
|
getRows: getFakeRows,
|
|
161
161
|
getRowKey: getFakeRowKey,
|
|
162
162
|
};
|
|
163
|
-
return (_jsxs(_Fragment, { children: [_jsx("div", { children: "NSLayout " }), _jsx("div", { children: "NSLayout " }), _jsx("div", { children: "NSLayout " }), _jsx(NSTable, Object.assign({}, tableProps)), _jsx(NSNotFoundPage, {}), _jsx(NSBoxDate, { required: true, title: '' }), _jsx(NSBoxPhone, { required: true, title: '' })
|
|
163
|
+
return (_jsxs(_Fragment, { children: [_jsx("div", { children: "NSLayout " }), _jsx("div", { children: "NSLayout " }), _jsx("div", { children: "NSLayout " }), _jsx(NSTable, Object.assign({}, tableProps)), _jsx(NSNotFoundPage, {}), _jsx(NSBoxDate, { required: true, title: '' }), _jsx(NSBoxPhone, { required: true, title: '' }), _jsx(NSBarAlert, { isVisible: () => true, onContinue: () => window.open("/"), title: {
|
|
164
|
+
title: "Verify Your Email",
|
|
165
|
+
description: "Lorem ipsum dolor sit amet consectetur. In ipsum gravida libero vitae tempor.Ipsum"
|
|
166
|
+
} })] }));
|
|
164
167
|
}
|
|
165
168
|
//# sourceMappingURL=App.js.map
|
package/dist/App.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,WAAW,CAAC;AACnB,OAAO,sCAAsC,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAgD,MAAM,sBAAsB,CAAC;AAC7F,OAAO,EAAuB,SAAS,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { IBaseComponentProps } from '../props/IBaseComponentProps';
|
|
2
|
+
import { INSBarTitleProps } from './NSBarTitle';
|
|
3
|
+
export interface INSBarAlertProps extends IBaseComponentProps {
|
|
4
|
+
title: INSBarTitleProps;
|
|
5
|
+
onContinue?: () => void;
|
|
6
|
+
isVisible: () => boolean;
|
|
7
|
+
}
|
|
8
|
+
export declare function NSBarAlert(props: INSBarAlertProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { NSSection } from './NSSection';
|
|
3
|
+
import Styles from './NSBarAlert.module.css';
|
|
4
|
+
export function NSBarAlert(props) {
|
|
5
|
+
return (_jsx(NSSection, { style: props.style, classList: [Styles.ns_bar_alert_holder], children: _jsx("div", { className: "container", children: _jsxs("article", { className: Styles.ns_bar_alert_container, children: [_jsxs("div", { className: Styles.ns_bar_alert_description, children: [_jsx("img", { src: "https://static.namirasoft.com/image/concept/alarm/blue.svg", alt: "Alarm", width: 24, height: 24 }), _jsxs("h3", { children: [" ", props.title.title, " "] }), _jsxs("p", { children: [" ", props.title.description, " "] })] }), _jsx("div", { className: Styles.ns_bar_alert_link, children: _jsx("button", { onClick: props.onContinue, children: " Continue " }) })] }) }) }));
|
|
6
|
+
}
|
|
7
|
+
//# sourceMappingURL=NSBarAlert.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NSBarAlert.js","sourceRoot":"","sources":["../../src/components/NSBarAlert.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,MAAM,MAAM,yBAAyB,CAAC;AAS7C,MAAM,UAAU,UAAU,CAAC,KAAuB;IAEjD,OAAO,CACN,KAAC,SAAS,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,SAAS,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,YACrE,cAAK,SAAS,EAAC,WAAW,YACzB,mBAAS,SAAS,EAAE,MAAM,CAAC,sBAAsB,aAChD,eAAK,SAAS,EAAE,MAAM,CAAC,wBAAwB,aAC9C,cAAK,GAAG,EAAC,4DAA4D,EAAC,GAAG,EAAC,OAAO,EAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,EAC3G,8BAAM,KAAK,CAAC,KAAK,CAAC,KAAK,SAAO,EAC9B,6BAAK,KAAK,CAAC,KAAK,CAAC,WAAW,SAAM,IAC7B,EACN,cAAK,SAAS,EAAE,MAAM,CAAC,iBAAiB,YACvC,iBAAQ,OAAO,EAAE,KAAK,CAAC,UAAU,4BAAuB,GACnD,IACG,GACL,GACK,CACZ,CAAC;AACH,CAAC"}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
.ns_bar_alert_holder {
|
|
2
|
+
color: #141B5C;
|
|
3
|
+
background-color: #FE9900;
|
|
4
|
+
padding: 16px 0;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
.ns_bar_alert_container {
|
|
8
|
+
display: flex;
|
|
9
|
+
flex-wrap: wrap;
|
|
10
|
+
flex-direction: row;
|
|
11
|
+
justify-content: center;
|
|
12
|
+
align-items: center;
|
|
13
|
+
gap: 8px;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.ns_bar_alert_description {
|
|
17
|
+
color: inherit;
|
|
18
|
+
display: flex;
|
|
19
|
+
flex-wrap: wrap;
|
|
20
|
+
flex-direction: row;
|
|
21
|
+
justify-content: center;
|
|
22
|
+
align-items: center;
|
|
23
|
+
gap: 8px;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.ns_bar_alert_description>h3 {
|
|
27
|
+
color: inherit;
|
|
28
|
+
font-size: 20px;
|
|
29
|
+
font-weight: 600;
|
|
30
|
+
margin: 0 16px 2px 8px;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.ns_bar_alert_description>p {
|
|
34
|
+
color: inherit;
|
|
35
|
+
font-size: 12px;
|
|
36
|
+
font-weight: 300;
|
|
37
|
+
margin-bottom: 0;
|
|
38
|
+
text-align: center;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.ns_bar_alert_link>button {
|
|
42
|
+
color: inherit;
|
|
43
|
+
font-size: 16px;
|
|
44
|
+
font-weight: 600;
|
|
45
|
+
text-decoration: underline;
|
|
46
|
+
border: none;
|
|
47
|
+
outline: none;
|
|
48
|
+
background: none;
|
|
49
|
+
cursor: pointer;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
|
|
53
|
+
@media only screen and (min-width: 768px) {
|
|
54
|
+
.ns_bar_alert_container {
|
|
55
|
+
justify-content: space-between;
|
|
56
|
+
gap: 0;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.ns_bar_alert_description {
|
|
60
|
+
justify-content: space-between;
|
|
61
|
+
gap: 0;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.ns_bar_alert_description>p {
|
|
65
|
+
text-align: start;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
}
|
|
@@ -6,6 +6,7 @@ import { INSBarActionProps } from './NSBarAction';
|
|
|
6
6
|
import { INSBarHeroBannerProps } from './NSBarHeroBanner';
|
|
7
7
|
import { INSBarTitleProps } from './NSBarTitle';
|
|
8
8
|
import { INSRouterProps } from '../routing/INSRouterProps';
|
|
9
|
+
import { INSBarAlertProps } from './NSBarAlert';
|
|
9
10
|
export interface INSLayoutProps extends IBaseComponentProps, INSRouterProps {
|
|
10
11
|
scope: string;
|
|
11
12
|
logo: string;
|
|
@@ -13,6 +14,7 @@ export interface INSLayoutProps extends IBaseComponentProps, INSRouterProps {
|
|
|
13
14
|
header: IHeaderProps;
|
|
14
15
|
notifications: INSBarNotificationProps[];
|
|
15
16
|
action?: INSBarActionProps;
|
|
17
|
+
alerts?: INSBarAlertProps[];
|
|
16
18
|
banner?: INSBarHeroBannerProps;
|
|
17
19
|
title?: INSBarTitleProps;
|
|
18
20
|
children: ReactNode;
|
|
@@ -7,9 +7,10 @@ import { NSBarAction } from './NSBarAction';
|
|
|
7
7
|
import { NSBarHeroBanner } from './NSBarHeroBanner';
|
|
8
8
|
import { NSBarTitle } from './NSBarTitle';
|
|
9
9
|
import { NSSpace, NSSpaceSizeType } from './NSSpace';
|
|
10
|
+
import { NSBarAlert } from './NSBarAlert';
|
|
10
11
|
export const isNotEmptyString = (string) => string && string.trim() !== "";
|
|
11
12
|
export function NSLayout(props) {
|
|
12
|
-
var _a;
|
|
13
|
+
var _a, _b;
|
|
13
14
|
function isValidAction(action) {
|
|
14
15
|
if (action) {
|
|
15
16
|
if ((isNotEmptyString(action.title)) || (isNotEmptyString(action.description)))
|
|
@@ -17,7 +18,9 @@ export function NSLayout(props) {
|
|
|
17
18
|
}
|
|
18
19
|
return false;
|
|
19
20
|
}
|
|
20
|
-
|
|
21
|
+
let alerts = (_a = props.alerts) !== null && _a !== void 0 ? _a : [];
|
|
22
|
+
alerts = alerts.filter((a) => a.isVisible());
|
|
23
|
+
return (_jsxs("div", { id: props.id, className: `${Styles.ns_container} ${(_b = props.classList) === null || _b === void 0 ? void 0 : _b.join(" ")}`, style: {
|
|
21
24
|
minHeight: "100vh",
|
|
22
25
|
width: "100%",
|
|
23
26
|
display: "flex",
|
|
@@ -26,7 +29,7 @@ export function NSLayout(props) {
|
|
|
26
29
|
background: props.background,
|
|
27
30
|
backgroundSize: "cover",
|
|
28
31
|
backgroundAttachment: "fixed"
|
|
29
|
-
}, children: [_jsx(NSHeader, { scope: props.scope, name: "Header", logo: props.logo, header: props.header, isLoggedIn: props.isLoggedIn, notifier: props.notifier }), props.notifications.length !== 0 && props.notifications.map(props => _jsxs(_Fragment, { children: [_jsx(NSBarNotification, Object.assign({}, props)), _jsx(NSSpace, { size: NSSpaceSizeType.MINI })] })), isValidAction(props.action) && _jsx(NSBarAction, Object.assign({}, props.action)), props.banner && _jsx(NSBarHeroBanner, Object.assign({}, props.banner)), _jsx(NSSpace, { size: NSSpaceSizeType.SMALL }), props.title &&
|
|
32
|
+
}, children: [_jsx(NSHeader, { scope: props.scope, name: "Header", logo: props.logo, header: props.header, isLoggedIn: props.isLoggedIn, notifier: props.notifier }), props.notifications.length !== 0 && props.notifications.map(props => _jsxs(_Fragment, { children: [_jsx(NSBarNotification, Object.assign({}, props)), _jsx(NSSpace, { size: NSSpaceSizeType.MINI })] })), alerts.length !== 0 && alerts.map(alert => _jsxs(_Fragment, { children: [_jsx(NSBarAlert, Object.assign({}, alert)), _jsx(NSSpace, { size: NSSpaceSizeType.MINI })] })), isValidAction(props.action) && _jsx(NSBarAction, Object.assign({}, props.action)), props.banner && _jsx(NSBarHeroBanner, Object.assign({}, props.banner)), _jsx(NSSpace, { size: NSSpaceSizeType.SMALL }), props.title &&
|
|
30
33
|
_jsxs(_Fragment, { children: [_jsx(NSBarTitle, Object.assign({}, props.title)), _jsx(NSSpace, { size: NSSpaceSizeType.MEDUIM })] }), _jsx("main", { className: `d-flex flex-column text-white ${Styles.ns_layout_main}`, children: props.children }), _jsx(NSSpace, { size: NSSpaceSizeType.MEDUIM }), _jsx(NSFooter, { scope: props.scope, name: "Footer", logo: props.logo, isLoggedIn: props.isLoggedIn })] }));
|
|
31
34
|
}
|
|
32
35
|
//# sourceMappingURL=NSLayout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NSLayout.js","sourceRoot":"","sources":["../../src/components/NSLayout.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,uBAAuB,CAAC;AAE3C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EAAE,iBAAiB,EAA2B,MAAM,qBAAqB,CAAC;AAEjF,OAAO,EAAqB,WAAW,EAAE,MAAM,eAAe,CAAC;AAC/D,OAAO,EAAyB,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EAAoB,UAAU,EAAE,MAAM,cAAc,CAAC;AAC5D,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"NSLayout.js","sourceRoot":"","sources":["../../src/components/NSLayout.tsx"],"names":[],"mappings":"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"}
|
package/dist/main.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export * from "./components/NSAccordion";
|
|
2
2
|
export * from "./components/NSActionMenu";
|
|
3
3
|
export * from "./components/NSBarAction";
|
|
4
|
+
export * from "./components/NSBarAlert";
|
|
4
5
|
export * from "./components/NSBarHeroBanner";
|
|
5
6
|
export * from "./components/NSBarNotification";
|
|
6
7
|
export * from "./components/NSBarTitle";
|
package/dist/main.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export * from "./components/NSAccordion";
|
|
2
2
|
export * from "./components/NSActionMenu";
|
|
3
3
|
export * from "./components/NSBarAction";
|
|
4
|
+
export * from "./components/NSBarAlert";
|
|
4
5
|
export * from "./components/NSBarHeroBanner";
|
|
5
6
|
export * from "./components/NSBarNotification";
|
|
6
7
|
export * from "./components/NSBarTitle";
|
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"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.4.
|
|
11
|
+
"version": "1.4.16",
|
|
12
12
|
"author": "Amir Abolhasani, Alireza Esmaeeli",
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"main": "./dist/main.js",
|
|
@@ -22,11 +22,11 @@
|
|
|
22
22
|
},
|
|
23
23
|
"dependencies": {
|
|
24
24
|
"@ant-design/charts": "^2.2.1",
|
|
25
|
-
"@types/node": "^22.
|
|
25
|
+
"@types/node": "^22.6.0",
|
|
26
26
|
"@types/react": "^18.3.8",
|
|
27
27
|
"@types/react-bootstrap": "^0.32.37",
|
|
28
28
|
"@types/react-dom": "^18.3.0",
|
|
29
|
-
"antd": "^5.
|
|
29
|
+
"antd": "^5.21.0",
|
|
30
30
|
"bootstrap": "^5.3.3",
|
|
31
31
|
"chart.js": "^4.4.4",
|
|
32
32
|
"copyfiles": "^2.4.1",
|
package/src/App.tsx
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import './App.css';
|
|
2
2
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
|
3
3
|
import { NSTable, INSTableProps, TableColumnInfo, TableRowInfo } from './components/NSTable';
|
|
4
|
-
import { BaseColumnFormatter, NSBoxDate, NSBoxPhone, NSNotFoundPage } from './main';
|
|
4
|
+
import { BaseColumnFormatter, NSBarAlert, NSBoxDate, NSBoxPhone, NSNotFoundPage } from './main';
|
|
5
5
|
|
|
6
6
|
export interface INSBarActionState
|
|
7
7
|
{
|
|
@@ -182,7 +182,16 @@ export function App()
|
|
|
182
182
|
required
|
|
183
183
|
title=''
|
|
184
184
|
/>
|
|
185
|
-
|
|
185
|
+
<NSBarAlert
|
|
186
|
+
isVisible={() => true}
|
|
187
|
+
onContinue={() => window.open("/")}
|
|
188
|
+
title={
|
|
189
|
+
{
|
|
190
|
+
title: "Verify Your Email",
|
|
191
|
+
description: "Lorem ipsum dolor sit amet consectetur. In ipsum gravida libero vitae tempor.Ipsum"
|
|
192
|
+
}
|
|
193
|
+
}
|
|
194
|
+
/>
|
|
186
195
|
</>
|
|
187
196
|
);
|
|
188
197
|
}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
.ns_bar_alert_holder {
|
|
2
|
+
color: #141B5C;
|
|
3
|
+
background-color: #FE9900;
|
|
4
|
+
padding: 16px 0;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
.ns_bar_alert_container {
|
|
8
|
+
display: flex;
|
|
9
|
+
flex-wrap: wrap;
|
|
10
|
+
flex-direction: row;
|
|
11
|
+
justify-content: center;
|
|
12
|
+
align-items: center;
|
|
13
|
+
gap: 8px;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.ns_bar_alert_description {
|
|
17
|
+
color: inherit;
|
|
18
|
+
display: flex;
|
|
19
|
+
flex-wrap: wrap;
|
|
20
|
+
flex-direction: row;
|
|
21
|
+
justify-content: center;
|
|
22
|
+
align-items: center;
|
|
23
|
+
gap: 8px;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.ns_bar_alert_description>h3 {
|
|
27
|
+
color: inherit;
|
|
28
|
+
font-size: 20px;
|
|
29
|
+
font-weight: 600;
|
|
30
|
+
margin: 0 16px 2px 8px;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.ns_bar_alert_description>p {
|
|
34
|
+
color: inherit;
|
|
35
|
+
font-size: 12px;
|
|
36
|
+
font-weight: 300;
|
|
37
|
+
margin-bottom: 0;
|
|
38
|
+
text-align: center;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.ns_bar_alert_link>button {
|
|
42
|
+
color: inherit;
|
|
43
|
+
font-size: 16px;
|
|
44
|
+
font-weight: 600;
|
|
45
|
+
text-decoration: underline;
|
|
46
|
+
border: none;
|
|
47
|
+
outline: none;
|
|
48
|
+
background: none;
|
|
49
|
+
cursor: pointer;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
|
|
53
|
+
@media only screen and (min-width: 768px) {
|
|
54
|
+
.ns_bar_alert_container {
|
|
55
|
+
justify-content: space-between;
|
|
56
|
+
gap: 0;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.ns_bar_alert_description {
|
|
60
|
+
justify-content: space-between;
|
|
61
|
+
gap: 0;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.ns_bar_alert_description>p {
|
|
65
|
+
text-align: start;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { IBaseComponentProps } from '../props/IBaseComponentProps';
|
|
2
|
+
import { INSBarTitleProps } from './NSBarTitle';
|
|
3
|
+
import { NSSection } from './NSSection';
|
|
4
|
+
import Styles from './NSBarAlert.module.css';
|
|
5
|
+
|
|
6
|
+
export interface INSBarAlertProps extends IBaseComponentProps
|
|
7
|
+
{
|
|
8
|
+
title: INSBarTitleProps;
|
|
9
|
+
onContinue?: () => void;
|
|
10
|
+
isVisible: () => boolean;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
export function NSBarAlert(props: INSBarAlertProps)
|
|
14
|
+
{
|
|
15
|
+
return (
|
|
16
|
+
<NSSection style={props.style} classList={[Styles.ns_bar_alert_holder]}>
|
|
17
|
+
<div className="container">
|
|
18
|
+
<article className={Styles.ns_bar_alert_container}>
|
|
19
|
+
<div className={Styles.ns_bar_alert_description}>
|
|
20
|
+
<img src="https://static.namirasoft.com/image/concept/alarm/blue.svg" alt="Alarm" width={24} height={24} />
|
|
21
|
+
<h3> {props.title.title} </h3>
|
|
22
|
+
<p> {props.title.description} </p>
|
|
23
|
+
</div>
|
|
24
|
+
<div className={Styles.ns_bar_alert_link}>
|
|
25
|
+
<button onClick={props.onContinue} > Continue </button>
|
|
26
|
+
</div>
|
|
27
|
+
</article>
|
|
28
|
+
</div>
|
|
29
|
+
</NSSection>
|
|
30
|
+
);
|
|
31
|
+
}
|
|
@@ -10,6 +10,7 @@ import { INSBarHeroBannerProps, NSBarHeroBanner } from './NSBarHeroBanner';
|
|
|
10
10
|
import { INSBarTitleProps, NSBarTitle } from './NSBarTitle';
|
|
11
11
|
import { NSSpace, NSSpaceSizeType } from './NSSpace';
|
|
12
12
|
import { INSRouterProps } from '../routing/INSRouterProps';
|
|
13
|
+
import { INSBarAlertProps, NSBarAlert } from './NSBarAlert';
|
|
13
14
|
|
|
14
15
|
export interface INSLayoutProps extends IBaseComponentProps, INSRouterProps
|
|
15
16
|
{
|
|
@@ -19,6 +20,7 @@ export interface INSLayoutProps extends IBaseComponentProps, INSRouterProps
|
|
|
19
20
|
header: IHeaderProps;
|
|
20
21
|
notifications: INSBarNotificationProps[];
|
|
21
22
|
action?: INSBarActionProps;
|
|
23
|
+
alerts?: INSBarAlertProps[];
|
|
22
24
|
banner?: INSBarHeroBannerProps;
|
|
23
25
|
title?: INSBarTitleProps;
|
|
24
26
|
children: ReactNode;
|
|
@@ -33,12 +35,16 @@ export function NSLayout(props: INSLayoutProps)
|
|
|
33
35
|
if (action)
|
|
34
36
|
{
|
|
35
37
|
if ((isNotEmptyString(action.title)) || (isNotEmptyString(action.description))
|
|
36
|
-
|
|
38
|
+
//todo: check action menus array lenghts
|
|
37
39
|
)
|
|
38
40
|
return true;
|
|
39
41
|
}
|
|
40
42
|
return false;
|
|
41
43
|
}
|
|
44
|
+
|
|
45
|
+
let alerts = props.alerts ?? [];
|
|
46
|
+
alerts = alerts.filter((a) => a.isVisible());
|
|
47
|
+
|
|
42
48
|
return (
|
|
43
49
|
<div id={props.id}
|
|
44
50
|
className={`${Styles.ns_container} ${props.classList?.join(" ")}`}
|
|
@@ -60,17 +66,31 @@ export function NSLayout(props: INSLayoutProps)
|
|
|
60
66
|
isLoggedIn={props.isLoggedIn}
|
|
61
67
|
notifier={props.notifier}
|
|
62
68
|
/>
|
|
63
|
-
{
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
{
|
|
69
|
+
{
|
|
70
|
+
props.notifications.length !== 0 && props.notifications.map(props =>
|
|
71
|
+
<>
|
|
72
|
+
<NSBarNotification {...props} />
|
|
73
|
+
<NSSpace size={NSSpaceSizeType.MINI} />
|
|
74
|
+
</>
|
|
75
|
+
)
|
|
76
|
+
}
|
|
77
|
+
{
|
|
78
|
+
alerts.length !== 0 && alerts.map(alert =>
|
|
79
|
+
<>
|
|
80
|
+
<NSBarAlert {...alert} />
|
|
81
|
+
<NSSpace size={NSSpaceSizeType.MINI} />
|
|
82
|
+
</>
|
|
83
|
+
)
|
|
84
|
+
}
|
|
85
|
+
{
|
|
86
|
+
isValidAction(props.action) && <NSBarAction {...props.action} />
|
|
87
|
+
}
|
|
88
|
+
{
|
|
89
|
+
props.banner && <NSBarHeroBanner {...props.banner} />
|
|
90
|
+
}
|
|
72
91
|
<NSSpace size={NSSpaceSizeType.SMALL} />
|
|
73
|
-
{
|
|
92
|
+
{
|
|
93
|
+
props.title &&
|
|
74
94
|
<>
|
|
75
95
|
<NSBarTitle {...props.title} ></NSBarTitle >
|
|
76
96
|
<NSSpace size={NSSpaceSizeType.MEDUIM} />
|
package/src/main.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export * from "./components/NSAccordion";
|
|
2
2
|
export * from "./components/NSActionMenu";
|
|
3
3
|
export * from "./components/NSBarAction";
|
|
4
|
+
export * from "./components/NSBarAlert";
|
|
4
5
|
export * from "./components/NSBarHeroBanner";
|
|
5
6
|
export * from "./components/NSBarNotification";
|
|
6
7
|
export * from "./components/NSBarTitle";
|