namirasoft-site-react 1.3.48 → 1.3.50

package/dist/App.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import './App.css';
 import 'bootstrap/dist/css/bootstrap.min.css';
-import { NSFooter, NSHeader, NSTable } from './main';
+import { NSFooter, NSHeader, NSTable, NSMessenger } from './main';
 export function App() {
     let columns = {
         "id": "ID",
@@ -28,6 +28,6 @@ export function App() {
             status: "Done"
         }
     ];
-    return (_jsxs(_Fragment, { children: [_jsx(NSHeader, { name: 'Header', scope: 'Namira Software Corporation', logo: 'https://static.namirasoft.com/logo/namirasoft/base.png', account: false, background: { color: "transparent !important" } }), _jsx("div", { className: "container", children: _jsx(NSTable, { columns: columns, rows: rows, getRowKey: row => row.id.toString() }) }), _jsx(NSFooter, { name: 'Footer', scope: 'Namira Software Corporation', logo: 'https://static.namirasoft.com/logo/namirasoft/base.png' })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(NSHeader, { name: 'Header', scope: 'Namira Software Corporation', logo: 'https://static.namirasoft.com/logo/namirasoft/base.png', account: false, background: { color: "transparent !important" } }), _jsx(NSMessenger, { title: "Too many request . please try again in 155829 seconds", Success: false }), _jsx("div", { className: "container", children: _jsx(NSTable, { columns: columns, rows: rows, getRowKey: row => row.id.toString() }) }), _jsx(NSFooter, { name: 'Footer', scope: 'Namira Software Corporation', logo: 'https://static.namirasoft.com/logo/namirasoft/base.png' })] }));
 }
 //# sourceMappingURL=App.js.map

package/dist/App.js.map

@@ -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,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAErD,MAAM,UAAU,GAAG;IAElB,IAAI,OAAO,GAAG;QACb,IAAI,EAAE,IAAI;QACV,SAAS,EAAE,SAAS;QACpB,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,SAAS;QACpB,MAAM,EAAE,MAAM;QACd,QAAQ,EAAE,QAAQ;KAClB,CAAA;IACD,IAAI,IAAI,GAAG,CAAC;YACX,EAAE,EAAE,CAAC;YACL,OAAO,EAAE,oBAAoB;YAC7B,KAAK,EAAE,OAAO;YACd,OAAO,EAAE,yCAAyC;YAClD,IAAI,EAAE,IAAI;YACV,MAAM,EAAE,MAAM;SACd;QACD;YACC,EAAE,EAAE,CAAC;YACL,OAAO,EAAE,oBAAoB;YAC7B,KAAK,EAAE,OAAO;YACd,OAAO,EAAE,yCAAyC;YAClD,IAAI,EAAE,IAAI;YACV,MAAM,EAAE,MAAM;SACd;KACA,CAAA;IAUD,OAAO,CACN,8BACC,KAAC,QAAQ,IACR,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,6BAA6B,EACnC,IAAI,EAAC,wDAAwD,EAC7D,OAAO,EAAE,KAAK,EACd,UAAU,EAAE,EAAE,KAAK,EAAE,wBAAwB,EAAE,GAC9C,EAEF,cAAK,SAAS,EAAC,WAAW,YACzB,KAAC,OAAO,IAAM,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,QAAQ,EAAE,GAAI,GAC9E,EACN,KAAC,QAAQ,IAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,6BAA6B,EAAC,IAAI,EAAC,wDAAwD,GAAG,IAC1H,CACH,CAAC;AACH,CAAC"}
+{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":";AAAA,OAAO,WAAW,CAAC;AACnB,OAAO,sCAAsC,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAElE,MAAM,UAAU,GAAG;IAEf,IAAI,OAAO,GAAG;QACV,IAAI,EAAE,IAAI;QACV,SAAS,EAAE,SAAS;QACpB,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,SAAS;QACpB,MAAM,EAAE,MAAM;QACd,QAAQ,EAAE,QAAQ;KACrB,CAAA;IACD,IAAI,IAAI,GAAG,CAAC;YACR,EAAE,EAAE,CAAC;YACL,OAAO,EAAE,oBAAoB;YAC7B,KAAK,EAAE,OAAO;YACd,OAAO,EAAE,yCAAyC;YAClD,IAAI,EAAE,IAAI;YACV,MAAM,EAAE,MAAM;SACjB;QACD;YACI,EAAE,EAAE,CAAC;YACL,OAAO,EAAE,oBAAoB;YAC7B,KAAK,EAAE,OAAO;YACd,OAAO,EAAE,yCAAyC;YAClD,IAAI,EAAE,IAAI;YACV,MAAM,EAAE,MAAM;SACjB;KACA,CAAA;IAUD,OAAO,CACH,8BACI,KAAC,QAAQ,IACL,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,6BAA6B,EACnC,IAAI,EAAC,wDAAwD,EAC7D,OAAO,EAAE,KAAK,EACd,UAAU,EAAE,EAAE,KAAK,EAAE,wBAAwB,EAAE,GACjD,EACF,KAAC,WAAW,IAAC,KAAK,EAAC,uDAAuD,EAAC,OAAO,EAAE,KAAK,GAAG,EAC5F,cAAK,SAAS,EAAC,WAAW,YACtB,KAAC,OAAO,IAAM,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,QAAQ,EAAE,GAAI,GACjF,EACN,KAAC,QAAQ,IAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,6BAA6B,EAAC,IAAI,EAAC,wDAAwD,GAAG,IAC7H,CACN,CAAC;AACN,CAAC"}

package/dist/components/NSMessenger.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+export interface NSMessengerProps {
+    title: string;
+    Success: boolean;
+}
+export interface NSMessengerState {
+    show: boolean;
+}
+export declare class NSMessenger extends React.Component<NSMessengerProps, NSMessengerState> {
+    constructor(props: NSMessengerProps);
+    componentDidMount(): void;
+    handleDestroy: () => void;
+    render(): import("react/jsx-runtime").JSX.Element;
+}

package/dist/components/NSMessenger.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from "react";
+import Exit from '../assets/images/close-vector.png';
+import Styles from "./NSMessenger.module.css";
+export class NSMessenger extends React.Component {
+    constructor(props) {
+        super(props);
+        this.handleDestroy = () => {
+            this.setState({ show: false });
+        };
+        this.state = {
+            show: true,
+        };
+    }
+    componentDidMount() {
+        setTimeout(() => { this.handleDestroy(); }, 8000);
+    }
+    render() {
+        return _jsx(_Fragment, { children: this.state.show && (_jsxs("div", { className: `${Styles.ns_messenger} "" ${this.props.Success == true ? Styles.ns_green : Styles.ns_red}`, children: [_jsx("p", { className: `mb-0 ns-font-16-normal`, children: this.props.title }), _jsx("img", { className: Styles.ns_exit_icon, src: Exit, alt: "exit", width: 32, height: 32, onClick: () => this.handleDestroy() })] })) });
+    }
+}
+//# sourceMappingURL=NSMessenger.js.map

package/dist/components/NSMessenger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NSMessenger.js","sourceRoot":"","sources":["../../src/components/NSMessenger.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,mCAAmC,CAAC;AACrD,OAAO,MAAM,MAAM,0BAA0B,CAAC;AAa9C,MAAM,OAAO,WAAY,SAAQ,KAAK,CAAC,SAA6C;IAEhF,YAAY,KAAuB;QAE/B,KAAK,CAAC,KAAK,CAAC,CAAC;QAWjB,kBAAa,GAAG,GAAG,EAAE;YAEjB,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC;QACnC,CAAC,CAAC;QAbE,IAAI,CAAC,KAAK,GAAG;YACT,IAAI,EAAE,IAAI;SACb,CAAC;IACN,CAAC;IAEQ,iBAAiB;QAEtB,UAAU,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,aAAa,EAAE,CAAA,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;IACrD,CAAC;IAOQ,MAAM;QAEX,OAAO,4BACF,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,CAChB,eAAK,SAAS,EAAE,GAAG,MAAM,CAAC,YAAY,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,EAAE,aACvG,YAAG,SAAS,EAAE,wBAAwB,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAK,EAC9D,cACI,SAAS,EAAE,MAAM,CAAC,YAAY,EAC9B,GAAG,EAAE,IAAI,EACT,GAAG,EAAC,MAAM,EACV,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EACV,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,GACrC,IACA,CACT,GACF,CAAA;IACP,CAAC;CACJ"}

package/dist/components/NSMessenger.module.css

@@ -0,0 +1,16 @@
+.ns_messenger {
+    background-color: #fff;
+    padding: 12px 15px;
+    display: flex;
+        justify-content: space-between;
+        align-items: center;
+}
+
+.ns_green {
+    border: 3px solid rgba(112, 224, 0, 1);
+    box-shadow: 1px 1px 8px 0px rgba(112, 224, 0, 1);
+}
+.ns_red {
+    border: 3px solid red;
+    box-shadow: 1px 1px 8px 0px red;
+}

package/dist/components/NSSpace.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
 export interface NSSpaceProps {
     size: NSSpaceSizeType;
 }
@@ -14,8 +13,4 @@ export declare enum NSSpaceSizeType {
     XXLARGE = "96px",
     XXXLARGE = "128px"
 }
-export interface NSSpaceState {
-}
-export declare class NSSpace extends React.Component<NSSpaceProps, NSSpaceState> {
-    render(): import("react/jsx-runtime").JSX.Element;
-}
+export declare function NSSpace(props: NSSpaceProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/NSSpace.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import React from "react";
 export var NSSpaceSizeType;
 (function (NSSpaceSizeType) {
     NSSpaceSizeType["NANO"] = "4px";
@@ -13,9 +12,7 @@ export var NSSpaceSizeType;
     NSSpaceSizeType["XXLARGE"] = "96px";
     NSSpaceSizeType["XXXLARGE"] = "128px";
 })(NSSpaceSizeType || (NSSpaceSizeType = {}));
-export class NSSpace extends React.Component {
-    render() {
-        return (_jsx("hr", { style: { width: "100%", height: this.props.size, margin: "0px", padding: "0px", background: "transparent", color: "transparent", border: 0 } }));
-    }
+export function NSSpace(props) {
+    return (_jsx("hr", { style: { width: "100%", height: props.size, margin: "0px", padding: "0px", background: "transparent", color: "transparent", border: 0 } }));
 }
 //# sourceMappingURL=NSSpace.js.map

package/dist/components/NSSpace.js.map

@@ -1 +1 @@
-{"version":3,"file":"NSSpace.js","sourceRoot":"","sources":["../../src/components/NSSpace.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,MAAM,CAAN,IAAY,eAYX;AAZD,WAAY,eAAe;IAEvB,+BAAY,CAAA;IACZ,gCAAa,CAAA;IACb,gCAAa,CAAA;IACb,iCAAc,CAAA;IACd,kCAAe,CAAA;IACf,kCAAe,CAAA;IACf,iCAAc,CAAA;IACd,kCAAe,CAAA;IACf,mCAAgB,CAAA;IAChB,qCAAkB,CAAA;AACtB,CAAC,EAZW,eAAe,KAAf,eAAe,QAY1B;AAMD,MAAM,OAAO,OAAQ,SAAQ,KAAK,CAAC,SAAqC;IAE3D,MAAM;QAEX,OAAO,CACH,aAAI,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,CAAC,EAAE,GAAI,CACvJ,CAAC;IACN,CAAC;CACJ"}
+{"version":3,"file":"NSSpace.js","sourceRoot":"","sources":["../../src/components/NSSpace.tsx"],"names":[],"mappings":";AAKA,MAAM,CAAN,IAAY,eAYX;AAZD,WAAY,eAAe;IAEvB,+BAAY,CAAA;IACZ,gCAAa,CAAA;IACb,gCAAa,CAAA;IACb,iCAAc,CAAA;IACd,kCAAe,CAAA;IACf,kCAAe,CAAA;IACf,iCAAc,CAAA;IACd,kCAAe,CAAA;IACf,mCAAgB,CAAA;IAChB,qCAAkB,CAAA;AACtB,CAAC,EAZW,eAAe,KAAf,eAAe,QAY1B;AAED,MAAM,UAAU,OAAO,CAAC,KAAmB;IAEvC,OAAO,CACH,aAAI,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,CAAC,EAAE,GAAI,CAClJ,CAAC;AACN,CAAC"}

package/dist/main.d.ts

@@ -25,6 +25,7 @@ export * from "./components/NSLayout";
 export * from "./components/NSLayoutHeroBanner";
 export * from "./components/NSLayoutTitle";
 export * from "./components/NSLoading";
+export * from "./components/NSMessenger";
 export * from "./components/NSSelectBox";
 export * from "./components/NSSpace";
 export * from "./components/NSSection";

package/dist/main.js

@@ -25,6 +25,7 @@ export * from "./components/NSLayout";
 export * from "./components/NSLayoutHeroBanner";
 export * from "./components/NSLayoutTitle";
 export * from "./components/NSLoading";
+export * from "./components/NSMessenger";
 export * from "./components/NSSelectBox";
 export * from "./components/NSSpace";
 export * from "./components/NSSection";

package/dist/main.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qCAAqC,CAAC;AACpD,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC"}
+{"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qCAAqC,CAAC;AACpD,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC"}

package/package.json

@@ -8,7 +8,7 @@
     "framework": "npm",
     "application": "package",
     "private": false,
-    "version": "1.3.48",
+    "version": "1.3.50",
     "author": "Amir Abolhasani, Alireza Esmaeeli, Hooman Shashaeh",
     "license": "MIT",
     "main": "./dist/main.js",

package/src/App.tsx

@@ -1,57 +1,57 @@
 import './App.css';
 import 'bootstrap/dist/css/bootstrap.min.css';
-import { NSFooter, NSHeader, NSTable } from './main';
+import { NSFooter, NSHeader, NSTable, NSMessenger } from './main';
 
 export function App()
 {
-	let columns = {
-		"id": "ID",
-		"project": "Project",
-		"level": "Level",
-		"message": "Message",
-		"cent": "Cent",
-		"status": "Status",
-	}
-	let rows = [{
-		id: 1,
-		project: "Namirasoft Account",
-		level: "Debug",
-		message: "Lorem ipsum dolor sit amet, consetetur ",
-		cent: "24",
-		status: "Done"
-	},
-	{
-		id: 2,
-		project: "Namirasoft Account",
-		level: "Debug",
-		message: "Lorem ipsum dolor sit amet, consetetur ",
-		cent: "24",
-		status: "Done"
-	}
-	]
-	interface Row
-	{
-		id: number,
-		project: string,
-		level: string,
-		message: string,
-		cent: string,
-		status: string
-	}
-	return (
-		<>
-			<NSHeader
-				name='Header'
-				scope='Namira Software Corporation'
-				logo='https://static.namirasoft.com/logo/namirasoft/base.png'
-				account={false}
-				background={{ color: "transparent !important" }}
-			/>
-
-			<div className="container">
-				<NSTable<Row> columns={columns} rows={rows} getRowKey={row => row.id.toString()} />
-			</div>
-			<NSFooter name='Footer' scope='Namira Software Corporation' logo='https://static.namirasoft.com/logo/namirasoft/base.png' />
-		</>
-	);
+    let columns = {
+        "id": "ID",
+        "project": "Project",
+        "level": "Level",
+        "message": "Message",
+        "cent": "Cent",
+        "status": "Status",
+    }
+    let rows = [{
+        id: 1,
+        project: "Namirasoft Account",
+        level: "Debug",
+        message: "Lorem ipsum dolor sit amet, consetetur ",
+        cent: "24",
+        status: "Done"
+    },
+    {
+        id: 2,
+        project: "Namirasoft Account",
+        level: "Debug",
+        message: "Lorem ipsum dolor sit amet, consetetur ",
+        cent: "24",
+        status: "Done"
+    }
+    ]
+    interface Row
+    {
+        id: number,
+        project: string,
+        level: string,
+        message: string,
+        cent: string,
+        status: string
+    }
+    return (
+        <>
+            <NSHeader
+                name='Header'
+                scope='Namira Software Corporation'
+                logo='https://static.namirasoft.com/logo/namirasoft/base.png'
+                account={false}
+                background={{ color: "transparent !important" }}
+            />
+            <NSMessenger title="Too many request . please try again in 155829 seconds" Success={false}/>
+            <div className="container">
+                <NSTable<Row> columns={columns} rows={rows} getRowKey={row => row.id.toString()} />
+            </div>
+            <NSFooter name='Footer' scope='Namira Software Corporation' logo='https://static.namirasoft.com/logo/namirasoft/base.png' />
+        </>
+    );
 }   

package/src/components/NSMessenger.module.css

@@ -0,0 +1,16 @@
+.ns_messenger {
+    background-color: #fff;
+    padding: 12px 15px;
+    display: flex;
+        justify-content: space-between;
+        align-items: center;
+}
+
+.ns_green {
+    border: 3px solid rgba(112, 224, 0, 1);
+    box-shadow: 1px 1px 8px 0px rgba(112, 224, 0, 1);
+}
+.ns_red {
+    border: 3px solid red;
+    box-shadow: 1px 1px 8px 0px red;
+}

package/src/components/NSMessenger.tsx

@@ -0,0 +1,56 @@
+"use client";
+
+import React from "react";
+import Exit from '../assets/images/close-vector.png';
+import Styles from "./NSMessenger.module.css";
+
+export interface NSMessengerProps
+{
+    title: string;
+    Success: boolean;
+}
+
+export interface NSMessengerState
+{
+    show: boolean;
+}
+
+export class NSMessenger extends React.Component<NSMessengerProps, NSMessengerState>
+{
+    constructor(props: NSMessengerProps)
+    {
+        super(props);
+        this.state = {
+            show: true,
+        };
+    }
+
+    override componentDidMount(): void
+    {
+        setTimeout(() => { this.handleDestroy() }, 8000);
+    }
+
+    handleDestroy = () =>
+    {
+        this.setState({ show: false });
+    };
+
+    override render()
+    {
+        return <>
+            {this.state.show && (
+                <div className={`${Styles.ns_messenger} "" ${this.props.Success == true ? Styles.ns_green : Styles.ns_red}`}>
+                    <p className={`mb-0 ns-font-16-normal`}>{this.props.title}</p>
+                    <img
+                        className={Styles.ns_exit_icon}
+                        src={Exit}
+                        alt="exit"
+                        width={32}
+                        height={32}
+                        onClick={() => this.handleDestroy()}
+                    />
+                </div>
+            )}
+        </>
+    }
+}

package/src/components/NSSpace.tsx

@@ -1,5 +1,3 @@
-import React from "react";
-
 export interface NSSpaceProps
 {
     size: NSSpaceSizeType;
@@ -19,16 +17,9 @@ export enum NSSpaceSizeType
     XXXLARGE = "128px",
 }
 
-export interface NSSpaceState
-{
-}
-
-export class NSSpace extends React.Component<NSSpaceProps, NSSpaceState>
+export function NSSpace(props: NSSpaceProps)
 {
-    override render()
-    {
-        return (
-            <hr style={{ width: "100%", height: this.props.size, margin: "0px", padding: "0px", background: "transparent", color: "transparent", border: 0 }} />
-        );
-    }
+    return (
+        <hr style={{ width: "100%", height: props.size, margin: "0px", padding: "0px", background: "transparent", color: "transparent", border: 0 }} />
+    );
 }

package/src/main.ts

@@ -25,6 +25,7 @@ export * from "./components/NSLayout";
 export * from "./components/NSLayoutHeroBanner";
 export * from "./components/NSLayoutTitle";
 export * from "./components/NSLoading";
+export * from "./components/NSMessenger";
 export * from "./components/NSSelectBox";
 export * from "./components/NSSpace";
 export * from "./components/NSSection";