namirasoft-site-react 1.3.304 → 1.3.305

package/src/App.css

@@ -1,17 +1,17 @@
-/*Start Input Tell*/
-.country-name {
-    color: #000 !important;
-}
-.country-list {
-    max-width: 206px;
-}
-.react-tel-input .flag-dropdown {
-    border: 1px solid #cacaca;
-    border-radius: 5px 0 0 5px;
-    border: 1px solid rgba(47, 0, 236, 0.6) !important;
-}
-/*End Input Tell*/
-.ns_font_16_bold{
-    font-size: 16px;
-    font-weight: 600;
+/*Start Input Tell*/
+.country-name {
+    color: #000 !important;
+}
+.country-list {
+    max-width: 206px;
+}
+.react-tel-input .flag-dropdown {
+    border: 1px solid #cacaca;
+    border-radius: 5px 0 0 5px;
+    border: 1px solid rgba(47, 0, 236, 0.6) !important;
+}
+/*End Input Tell*/
+.ns_font_16_bold{
+    font-size: 16px;
+    font-weight: 600;
 }

package/src/App.tsx

@@ -1,167 +1,168 @@
-import './App.css';
-import 'bootstrap/dist/css/bootstrap.min.css';
-import { NSBarAction, NSBoxBoolean, NSBoxEmail, NSBoxEnum, NSBoxSearch, NSBoxString, NSLayout, NSNoData, NSPagination, NSPrintModal, NSSpace, NSSpaceSizeType, NSTabPage, NSTable } from './main';
-import { NSBoxLabel } from './components/NSBoxLabel';
-import NSRadioButton from './components/NSRadioButton';
-import NSTag from './components/NSTag';
-import NSButton from './components/NSButton';
-import { useRef } from 'react';
-
-export interface INSBarActionState
-{
-	id: string;
-	menu_item: string;
-	handler: () => void;
-	isActive: () => boolean;
-}
-export function App()
-{
-	const onClicked = () =>
-	{
-		console.log("clicked")
-	}
-	let icons = [
-		{ src: "https://static.namirasoft.com/image/namirasoft/message/logo/base.png", alt: "", onClicked, count: 1 },
-		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
-		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
-		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
-		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
-		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
-		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
-	];
-	let content1 = () => <>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
-	</>;
-	let content2 = () => <div>Content for Tab2</div>;
-	let content3 = () => <div>Content for Tab3</div>;
-	const tabs = [
-		{ title: 'Information', getContent: content1 },
-		{ title: 'Price History', getContent: content2 },
-		{ title: 'Price Estimator', getContent: content3 }
-	];
-
-	const getColumns = (): { [key: string]: string } =>
-	{
-		return {
-			id: "ID",
-			name: "Name",
-			user_id: "User Id",
-			os: "OS"
-		};
-	};
-	let rows = [
-		{
-			id: 1,
-			name: "Accountant",
-			policy: "Lorem ipsum dolor sit amet, consetetur ",
-		},
-		{
-			id: 2,
-			name: "Accountant",
-			policy: "Lorem ipsum dolor sit amet, consetetur ",
-		},
-		{
-			id: 3,
-			name: "Accountant",
-			policy: "Lorem ipsum dolor sit amet, consetetur ",
-		},
-		{
-			id: 4,
-			name: "Accountant",
-			policy: "Lorem ipsum dolor sit amet, consetetur ",
-		},
-	]
-	let group: any = [
-		[
-			{
-				id: "1",
-				handler: () => { },
-				isActive: () => false,
-				menu_item: "1"
-			}, {
-				id: "2",
-				handler: () => { },
-				isActive: () => true,
-				menu_item: "2"
-			},
-			{
-				id: "2",
-				handler: () => { },
-				isActive: () => true,
-				menu_item: "3"
-			}
-		]
-	]
-	let table = useRef<NSTable<any>>(null);
-	function getCell(row: any, column: string): any
-	{
-		if (column === "check")
-		{
-			return <>
-				<input id={`checkbox_${row.id}`} type="checkbox" className="table_checkbox" />
-				<label htmlFor={`checkbox_${row.id}`}></label>
-			</>
-		} else
-		{
-			return (row as any)[column];
-		}
-	}
-	return (
-		<>
-			<NSLayout
-				header={{
-					title: "any",
-					icons: icons
-				}}
-				scope="Namirasoft Account Console"
-				logo="exampleLogoUrl"
-				notifications={[]}
-				background=""
-			>
-				<>
-					<NSTabPage tabs={tabs} />
-					<NSSpace size={NSSpaceSizeType.SMALL} />
-					<NSPagination totalItems={100} onPageChange={() => { }} />
-				</>
-				<NSTable
-					ref={table}
-					columns={getColumns()}
-					getCell={getCell}
-					getRowKey={row => row.id.toString()}
-					getColumnAttributes={() => { return {} }}
-					totalItems={0}
-					reload={() => { return table.current?.setRows(rows) }}
-				/>
-				<NSBarAction title='' menus={group} />
-				<NSBoxEmail title='Email' required />
-				<NSBoxString title='String' required />
-				<NSRadioButton title={"Radio Button"} />
-				<NSSpace size={NSSpaceSizeType.LARGE} />
-				<NSBoxBoolean defaultValue={true} title='' required />
-				<NSButton title='Clear Filters' onClick={() => window.location.reload()} style={{ width: "136px", border: "2px solid #001664" }} />
-				<NSTag />
-				<NSNoData lable="No New Message" />
-				<div className="d-flex flex-row gap-2 w-100">
-					<NSBoxString title="Name" required />
-					<NSBoxEnum options={[]} required title='Notification_sender_topic_id' multiple />
-					<NSBoxEmail title="Name" required />
-					<NSBoxSearch title="Name" required />
-				</div>
-				<NSSpace size={NSSpaceSizeType.MEDUIM} />
-				<NSBoxBoolean title='CheckBox' required />
-				<NSPrintModal onClose={() => { }} />
-
-			</NSLayout>
-		</>
-	);
+import './App.css';
+import 'bootstrap/dist/css/bootstrap.min.css';
+import { NSBarAction, NSBoxBoolean, NSBoxEmail, NSBoxEnum, NSBoxSearch, NSBoxString, NSLayout, NSNoData, NSPagination, NSPrintModal, NSSpace, NSSpaceSizeType, NSTabPage, NSTable } from './main';
+import { NSBoxLabel } from './components/NSBoxLabel';
+import NSRadioButton from './components/NSRadioButton';
+import NSTag from './components/NSTag';
+import NSButton from './components/NSButton';
+import { useRef } from 'react';
+
+export interface INSBarActionState
+{
+	id: string;
+	menu_item: string;
+	handler: () => void;
+	isActive: () => boolean;
+}
+export function App()
+{
+	const onClicked = () =>
+	{
+		console.log("clicked")
+	}
+	let icons = [
+		{ src: "https://static.namirasoft.com/image/namirasoft/message/logo/base.png", alt: "", onClicked, count: 1 },
+		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
+		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
+		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
+		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
+		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
+		{ src: "https://static.namirasoft.com/image/concept/logout/white.svg", alt: "", onClicked },
+	];
+	let content1 = () => <>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+		<NSBoxLabel title="URL"><p style={{ color: "#000" }}>http://URL.com</p></NSBoxLabel>
+	</>;
+	let content2 = () => <div>Content for Tab2</div>;
+	let content3 = () => <div>Content for Tab3</div>;
+	const tabs = [
+		{ title: 'Information', getContent: content1 },
+		{ title: 'Price History', getContent: content2 },
+		{ title: 'Price Estimator', getContent: content3 }
+	];
+
+	const getColumns = (): { [key: string]: string } =>
+	{
+		return {
+			id: "ID",
+			name: "Name",
+			user_id: "User Id",
+			os: "OS"
+		};
+	};
+	let rows = [
+		{
+			id: 1,
+			name: "Accountant",
+			policy: "Lorem ipsum dolor sit amet, consetetur ",
+		},
+		{
+			id: 2,
+			name: "Accountant",
+			policy: "Lorem ipsum dolor sit amet, consetetur ",
+		},
+		{
+			id: 3,
+			name: "Accountant",
+			policy: "Lorem ipsum dolor sit amet, consetetur ",
+		},
+		{
+			id: 4,
+			name: "Accountant",
+			policy: "Lorem ipsum dolor sit amet, consetetur ",
+		},
+	]
+	let group: any = [
+		[
+			{
+				id: "1",
+				handler: () => { },
+				isActive: () => false,
+				menu_item: "1"
+			}, {
+				id: "2",
+				handler: () => { },
+				isActive: () => true,
+				menu_item: "2"
+			},
+			{
+				id: "2",
+				handler: () => { },
+				isActive: () => true,
+				menu_item: "3"
+			}
+		]
+	]
+	let table = useRef<NSTable<any>>(null);
+	function getCell(row: any, column: string): any
+	{
+		if (column === "check")
+		{
+			return <>
+				<input id={`checkbox_${row.id}`} type="checkbox" className="table_checkbox" />
+				<label htmlFor={`checkbox_${row.id}`}></label>
+			</>
+		} else
+		{
+			return (row as any)[column];
+		}
+	}
+	return (
+		<>
+			<NSLayout
+				header={{
+					title: "any",
+					icons: icons
+				}}
+				scope="Namirasoft Account Console"
+				logo="exampleLogoUrl"
+				notifications={[]}
+				background=""
+			>
+				<>
+					<NSTabPage tabs={tabs} />
+					<NSSpace size={NSSpaceSizeType.SMALL} />
+					<NSPagination totalItems={100} onPageChange={() => { }} />
+				</>
+				<NSTable
+					ref={table}
+					columns={getColumns()}
+					getCell={getCell}
+					getRowKey={row => row.id.toString()}
+					getColumnAttributes={() => { return {} }}
+					totalItems={0}
+					reload={() => { return table.current?.setRows(rows) }}
+					checkbox={true}
+				/>
+				<NSBarAction title='' menus={group} />
+				<NSBoxEmail title='Email' required />
+				<NSBoxString title='String' required />
+				<NSRadioButton title={"Radio Button"} />
+				<NSSpace size={NSSpaceSizeType.LARGE} />
+				<NSBoxBoolean defaultValue={true} title='' required />
+				<NSButton title='Clear Filters' onClick={() => window.location.reload()} style={{ width: "136px", border: "2px solid #001664" }} />
+				<NSTag />
+				<NSNoData lable="No New Message" />
+				<div className="d-flex flex-row gap-2 w-100">
+					<NSBoxString title="Name" required />
+					<NSBoxEnum options={[]} required title='Notification_sender_topic_id' multiple />
+					<NSBoxEmail title="Name" required />
+					<NSBoxSearch title="Name" required />
+				</div>
+				<NSSpace size={NSSpaceSizeType.MEDUIM} />
+				<NSBoxBoolean title='CheckBox' required />
+				<NSPrintModal onClose={() => { }} />
+
+			</NSLayout>
+		</>
+	);
 }

package/src/CopyToClipboard.ts

@@ -1,7 +1,7 @@
-export default class CopyToClipboard
-{
-    static copyToClipboard(value: string): void
-    {
-        navigator.clipboard.writeText(value);
-    }
+export default class CopyToClipboard
+{
+    static copyToClipboard(value: string): void
+    {
+        navigator.clipboard.writeText(value);
+    }
 };

package/src/Validator.ts

@@ -1,111 +1,111 @@
-import { PhoneOperation, RegexTemplate } from "namirasoft-core";
-import { IValidationNumberProps } from "./props/IValidationNumberProps";
-import { IValidationProps } from "./props/IValidationProps";
-import { IValidationStringProps } from "./props/IValidationStringProps";
-
-export class Validator
-{
-    static getError(name: string, value: string | number | null | undefined, validator: IValidationProps): string | null
-    {
-        if (validator.required)
-            if (!value)
-                return `${name} is required.`;
-        if (value != null)
-            if (validator.regex)
-                if (!validator.regex.regex.test(value + ""))
-                    return `${name} is not a valid ${validator.regex.name}.`;
-        if (value != null)
-            if (validator.validator)
-            {
-                let error = validator.validator(name, value);
-                if (error)
-                    return error;
-            }
-        return null;
-    }
-    static getErrorString(name: string, value: string | null | undefined, validator: IValidationStringProps): string | null
-    {
-        if (value != null)
-        {
-            if (validator.max_length != null)
-                if (validator.max_length < value.length)
-                    return `Max length of ${name} should be ${validator.max_length} characters.`;
-            if (validator.min_length != null)
-                if (validator.min_length > value.length)
-                    return `Minlength of ${name} should be ${validator.min_length} characters.`;
-        }
-        return null;
-    }
-    static getErrorNumber(name: string, value: number | null | undefined, validator: IValidationNumberProps): string | null
-    {
-        if (value != null)
-        {
-            if (isNaN(value))
-                return `${name} is not a number.`;
-            if (validator.max != null)
-                if (validator.max < value)
-                    return `Max value of ${name} should be ${validator.max} characters.`;
-            if (validator.min != null)
-                if (validator.min > value)
-                    return `Min value of ${name} should be ${validator.min} characters.`;
-        }
-        return null;
-    }
-    static getErrorEmail(name: string, value: string | null | undefined): string | null
-    {
-        return Validator.getError(name, value, {
-            required: true, regex: {
-                name: "Email",
-                regex: RegexTemplate.Email
-            }
-        });
-    }
-    static getErrorDate(name: string, value: string | null | undefined): string | null
-    {
-        return Validator.getError(name, value, {
-            required: true, regex: {
-                name: "Date",
-                regex: RegexTemplate.Date
-            }
-        });
-    }
-    static getErrorTime(name: string, value: string | null | undefined): string | null
-    {
-        return Validator.getError(name, value, {
-            required: true, regex: {
-                name: "Time",
-                regex: RegexTemplate.Time
-            }
-        });
-    }
-    static getErrorDuration(name: string, value: string | null | undefined): string | null
-    {
-        return Validator.getError(name, value, {
-            required: true, regex: {
-                name: "Duration",
-                regex: RegexTemplate.Duration
-            }
-        });
-    }
-    static getErrorIP(name: string, value: string | null | undefined): string | null
-    {
-        return Validator.getError(name, value, {
-            required: true, regex: {
-                name: "IP",
-                regex: RegexTemplate.IP
-            }
-        });
-    }
-    static getErrorPhone(name: string, value: string | null | undefined): string | null
-    {
-        return Validator.getError(name, value, {
-            required: true, validator: () =>
-            {
-                if (value)
-                    if (!PhoneOperation.isValid(value))
-                        return `${name} is not a valid phone number`;
-                return null;
-            }
-        });
-    }
+import { PhoneOperation, RegexTemplate } from "namirasoft-core";
+import { IValidationNumberProps } from "./props/IValidationNumberProps";
+import { IValidationProps } from "./props/IValidationProps";
+import { IValidationStringProps } from "./props/IValidationStringProps";
+
+export class Validator
+{
+    static getError(name: string, value: string | number | null | undefined, validator: IValidationProps): string | null
+    {
+        if (validator.required)
+            if (!value)
+                return `${name} is required.`;
+        if (value != null)
+            if (validator.regex)
+                if (!validator.regex.regex.test(value + ""))
+                    return `${name} is not a valid ${validator.regex.name}.`;
+        if (value != null)
+            if (validator.validator)
+            {
+                let error = validator.validator(name, value);
+                if (error)
+                    return error;
+            }
+        return null;
+    }
+    static getErrorString(name: string, value: string | null | undefined, validator: IValidationStringProps): string | null
+    {
+        if (value != null)
+        {
+            if (validator.max_length != null)
+                if (validator.max_length < value.length)
+                    return `Max length of ${name} should be ${validator.max_length} characters.`;
+            if (validator.min_length != null)
+                if (validator.min_length > value.length)
+                    return `Minlength of ${name} should be ${validator.min_length} characters.`;
+        }
+        return null;
+    }
+    static getErrorNumber(name: string, value: number | null | undefined, validator: IValidationNumberProps): string | null
+    {
+        if (value != null)
+        {
+            if (isNaN(value))
+                return `${name} is not a number.`;
+            if (validator.max != null)
+                if (validator.max < value)
+                    return `Max value of ${name} should be ${validator.max} characters.`;
+            if (validator.min != null)
+                if (validator.min > value)
+                    return `Min value of ${name} should be ${validator.min} characters.`;
+        }
+        return null;
+    }
+    static getErrorEmail(name: string, value: string | null | undefined): string | null
+    {
+        return Validator.getError(name, value, {
+            required: true, regex: {
+                name: "Email",
+                regex: RegexTemplate.Email
+            }
+        });
+    }
+    static getErrorDate(name: string, value: string | null | undefined): string | null
+    {
+        return Validator.getError(name, value, {
+            required: true, regex: {
+                name: "Date",
+                regex: RegexTemplate.Date
+            }
+        });
+    }
+    static getErrorTime(name: string, value: string | null | undefined): string | null
+    {
+        return Validator.getError(name, value, {
+            required: true, regex: {
+                name: "Time",
+                regex: RegexTemplate.Time
+            }
+        });
+    }
+    static getErrorDuration(name: string, value: string | null | undefined): string | null
+    {
+        return Validator.getError(name, value, {
+            required: true, regex: {
+                name: "Duration",
+                regex: RegexTemplate.Duration
+            }
+        });
+    }
+    static getErrorIP(name: string, value: string | null | undefined): string | null
+    {
+        return Validator.getError(name, value, {
+            required: true, regex: {
+                name: "IP",
+                regex: RegexTemplate.IP
+            }
+        });
+    }
+    static getErrorPhone(name: string, value: string | null | undefined): string | null
+    {
+        return Validator.getError(name, value, {
+            required: true, validator: () =>
+            {
+                if (value)
+                    if (!PhoneOperation.isValid(value))
+                        return `${name} is not a valid phone number`;
+                return null;
+            }
+        });
+    }
 }