namirasoft-site-react 1.3.65 → 1.3.67

package/src/components/NSLayoutTitle.tsx

@@ -1,17 +1,17 @@
 import Styles from './NSLayoutTitle.module.css';
 import { ReactNode } from 'react';
-import { NSLayout, NSLayoutProps } from './NSLayout';
+import { NSLayout, INSLayoutProps } from './NSLayout';
 import { NSSpace, NSSpaceSizeType } from './NSSpace';
-import { BaseComponentProps } from '../props/BaseComponentProps';
+import { IBaseComponentProps } from '../props/IBaseComponentProps';
 
-export interface NSLayoutTitleProps extends NSLayoutProps, BaseComponentProps
+export interface INSLayoutTitleProps extends INSLayoutProps, IBaseComponentProps
 {
 	title: string;
 	description?: string;
 	children: ReactNode;
 }
 
-export function NSLayoutTitle(props: NSLayoutTitleProps)
+export function NSLayoutTitle(props: INSLayoutTitleProps)
 {
 	let lines = (props.description ?? "").split(/(\n|\\n|<br>|<br\s*\/>)/gm);
 	return (

package/src/components/NSLink.tsx

@@ -1,12 +1,12 @@
-import { BaseComponentProps } from "../props/BaseComponentProps";
-import { LinkProps } from "../props/LinkProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+import { ILinkProps } from "../props/ILinkProps";
 import Styles from "./NSLink.module.css";
 
-export interface NSLinkProps extends LinkProps, BaseComponentProps
+export interface INSILinkProps extends ILinkProps, IBaseComponentProps
 {
 }
 
-export function NSLink(props: NSLinkProps)
+export function NSLink(props: INSILinkProps)
 {
 	return (
 		<div

package/src/components/NSLinkBlue.tsx

@@ -1,6 +1,6 @@
-import { NSLink, NSLinkProps } from "./NSLink";
+import { NSLink, INSILinkProps } from "./NSLink";
 
-export function NSLinkBlue(props: NSLinkProps)
+export function NSLinkBlue(props: INSILinkProps)
 {
 	return <NSLink id={props.id} classList={props.classList} style={{ ...props.style, backgroundColor: "#366EFF" }} title={props.title} href={props.href} target={props.target} />;
 }

package/src/components/NSLinkGreen.tsx

@@ -1,6 +1,6 @@
-import { NSLink, NSLinkProps } from "./NSLink";
+import { NSLink, INSILinkProps } from "./NSLink";
 
-export function NSLinkGreen(props: NSLinkProps)
+export function NSLinkGreen(props: INSILinkProps)
 {
     return <NSLink id={props.id} classList={props.classList} style={{ ...props.style, backgroundColor: "#06D182" }} title={props.title} href={props.href} target={props.target} />;
 }

package/src/components/NSLinkRed.tsx

@@ -1,6 +1,6 @@
-import { NSLink, NSLinkProps } from "./NSLink";
+import { NSLink, INSILinkProps } from "./NSLink";
 
-export function NSLinkRed(props: NSLinkProps)
+export function NSLinkRed(props: INSILinkProps)
 {
     return <NSLink id={props.id} classList={props.classList} style={{ ...props.style, backgroundColor: "rgb(265, 63, 63, 1)" }} title={props.title} href={props.href} target={props.target} />;
 }

package/src/components/NSLoading.tsx

@@ -1,12 +1,12 @@
 import Styles from './NSLoading.module.css';
 import { NSSection } from './NSSection';
-import { BaseComponentProps } from "../props/BaseComponentProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
 
-export interface NSLoadingProps extends BaseComponentProps
+export interface INSLoadingProps extends IBaseComponentProps
 {
 }
 
-export function NSLoading(props: NSLoadingProps)
+export function NSLoading(props: INSLoadingProps)
 {
 	return (
 		<NSSection {...props}>

package/src/components/NSNotification.tsx

@@ -1,8 +1,8 @@
 import Exit from '../assets/images/close-vector.png';
 import Styles from "./NSNotification.module.css";
-import { BaseComponentProps } from "../props/BaseComponentProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
 
-export interface NSNotificationProps extends BaseComponentProps
+export interface INSNotificationProps extends IBaseComponentProps
 {
     text: string;
     type: NotificationType;
@@ -27,9 +27,9 @@ export enum NotificationType
     Error = "Error",
 }
 
-export function NSNotification(props: NSNotificationProps)
+export function NSNotification(props: INSNotificationProps)
 {
-    let className = Styles["ns_" + props.color.toString().toLowerCase];
+    let className = Styles["ns_" + props.color.toString().toLowerCase()];
     return (
         <div id={props.id}
             className={`${Styles.ns_messenger} ${className}`}

package/src/components/NSPagination.tsx

@@ -1,13 +1,13 @@
-import { BaseComponentProps } from '../props/BaseComponentProps';
+import { IBaseComponentProps } from '../props/IBaseComponentProps';
 import Styles from './NSPagination.module.css';
 
-export interface NSPaginationProps extends BaseComponentProps
+export interface INSPaginationProps extends IBaseComponentProps
 {
     size: number;
     page: number;
 }
 
-export function NSPagination(props: NSPaginationProps)
+export function NSPagination(props: INSPaginationProps)
 {
     let page = props.page;
     let size = props.size;

package/src/components/NSPanel.tsx

@@ -1,13 +1,13 @@
 import { ReactNode } from "react";
 import Styles from './NSPanel.module.css';
-import { BaseComponentProps } from "../props/BaseComponentProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
 
-export interface NSSectionProps extends BaseComponentProps
+export interface INSSectionProps extends IBaseComponentProps
 {
     children: ReactNode;
     grid: boolean;
 }
-export function NSPanel(props: NSSectionProps)
+export function NSPanel(props: INSSectionProps)
 {
     return (
         <section id={props.id}

package/src/components/NSSection.tsx

@@ -1,14 +1,14 @@
 import { ReactNode } from "react";
 import Styles from './NSSection.module.css'
-import { BaseComponentProps } from "../props/BaseComponentProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
 
-export interface NSSectionProps extends BaseComponentProps
+export interface INSSectionProps extends IBaseComponentProps
 {
 	children: ReactNode;
 	center_items?: boolean;
 }
 
-export function NSSection(props: NSSectionProps)
+export function NSSection(props: INSSectionProps)
 {
 	let styles = [Styles.ns_section];
 	if (props.center_items)

package/src/components/NSSectionBars.tsx

@@ -1,16 +1,16 @@
 import Styles from './NSSectionBars.module.css';
-import { NSEntityBar, NSEntityBarProps } from './NSEntityBar';
+import { NSEntityBar, INSEntityBarProps } from './NSEntityBar';
 import { NSSection } from './NSSection';
 import { NSSpace, NSSpaceSizeType } from './NSSpace';
-import { BaseComponentProps } from "../props/BaseComponentProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
 
-export interface NSSectionBarsProps extends BaseComponentProps
+export interface INSSectionBarsProps extends IBaseComponentProps
 {
 	title?: string;
-	bars: NSEntityBarProps[]
+	bars: INSEntityBarProps[]
 }
 
-export function NSSectionBars(props: NSSectionBarsProps)
+export function NSSectionBars(props: INSSectionBarsProps)
 {
 	return (
 		<NSSection {...props} >

package/src/components/NSSectionCards.tsx

@@ -1,24 +1,24 @@
 import Styles from './NSSectionCards.module.css';
 import { NSTitle } from './NSTitle';
-import { NSCard, NSCardProps } from './NSCard';
+import { NSCard, INSCardProps } from './NSCard';
 import { NSSection } from './NSSection';
 import { NSLinkBlue } from './NSLinkBlue';
 import { NSSpace, NSSpaceSizeType } from './NSSpace';
-import { BaseComponentProps } from "../props/BaseComponentProps";
-import { LinkProps } from '../props/LinkProps';
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+import { ILinkProps } from '../props/ILinkProps';
 
-export interface NSSectionCardsProps extends BaseComponentProps
+export interface INSSectionCardsProps extends IBaseComponentProps
 {
 	title?: string;
 	description?: {
 		text: string,
 		color?: string
 	};
-	button?: LinkProps;
-	cards: NSCardProps[];
+	button?: ILinkProps;
+	cards: INSCardProps[];
 }
 
-export function NSSectionCards(props: NSSectionCardsProps) 
+export function NSSectionCards(props: INSSectionCardsProps) 
 {
 	return (
 		<NSSection {...props} >

package/src/components/NSSectionTitle.tsx

@@ -2,15 +2,15 @@ import { ReactNode } from 'react';
 import { NSSection } from './NSSection';
 import { NSTitle } from './NSTitle';
 import { NSSpace, NSSpaceSizeType } from './NSSpace';
-import { BaseComponentProps } from "../props/BaseComponentProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
 
-export interface NSSectionTitleProps extends BaseComponentProps
+export interface INSSectionTitleProps extends IBaseComponentProps
 {
 	title: string;
 	children: ReactNode
 }
 
-export function NSSectionTitle(props: NSSectionTitleProps)
+export function NSSectionTitle(props: INSSectionTitleProps)
 {
 	return (
 		<NSSection {...props} >

package/src/components/NSSelectBox.tsx

@@ -5,12 +5,12 @@ import Styles from "./NSSelectBox.module.css";
 import { Select, Space } from 'antd';
 import type { SelectProps } from 'antd';
 import IconSelectBox from '../assets/images/icon-select-box.svg';
-import { BaseComponentProps } from "../props/BaseComponentProps";
-import { ValidationProps } from "../props/ValidationProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+import { IValidationProps } from "../props/IValidationProps";
 import { Validator } from "../Validator";
 import { NSInputErrorNotifier } from "./NSInputErrorNotifier";
 
-export interface NSSelectBoxProps extends BaseComponentProps, ValidationProps
+export interface INSSelectBoxProps extends IBaseComponentProps, IValidationProps
 {
     title: string;
     options: SelectProps['options'];
@@ -23,9 +23,9 @@ export interface NSSelectBoxState
     error?: string;
 }
 
-export class NSSelectBox extends React.Component<NSSelectBoxProps, NSSelectBoxState>
+export class NSSelectBox extends React.Component<INSSelectBoxProps, NSSelectBoxState>
 {
-    constructor(props: NSSelectBoxProps)
+    constructor(props: INSSelectBoxProps)
     {
         super(props);
         this.state = {

package/src/components/NSSpace.tsx

@@ -1,6 +1,6 @@
-import { BaseComponentProps } from "../props/BaseComponentProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
 
-export interface NSSpaceProps extends BaseComponentProps
+export interface INSSpaceProps extends IBaseComponentProps
 {
     size: NSSpaceSizeType;
 }
@@ -19,7 +19,7 @@ export enum NSSpaceSizeType
     XXXLARGE = "128px",
 }
 
-export function NSSpace(props: NSSpaceProps)
+export function NSSpace(props: INSSpaceProps)
 {
     return (
         <hr id={props.id}

package/src/components/NSTable.tsx

@@ -6,9 +6,9 @@ import { NSPagination } from './NSPagination';
 import { NSSpace, NSSpaceSizeType } from './NSSpace';
 import Styles from './NSTable.module.css';
 import { Component } from 'react';
-import { BaseComponentProps } from "../props/BaseComponentProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
 
-export interface NSTableProps<RowType> extends BaseComponentProps
+export interface INSTableProps<RowType> extends IBaseComponentProps
 {
     columns: { [key: string]: string };
     rows: RowType[];
@@ -24,9 +24,9 @@ export interface NSTableState<RowType>
     modalState: boolean
 }
 
-export class NSTable<RowType> extends Component<NSTableProps<RowType>, NSTableState<RowType>>
+export class NSTable<RowType> extends Component<INSTableProps<RowType>, NSTableState<RowType>>
 {
-    constructor(props: NSTableProps<RowType>)
+    constructor(props: INSTableProps<RowType>)
     {
         super(props);
         this.state = { columns: props.columns, rows: props.rows, modalState: false };

package/src/components/NSTitle.tsx

@@ -1,12 +1,12 @@
 import Styles from './NSTitle.module.css';
-import { BaseComponentProps } from "../props/BaseComponentProps";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
 
-export interface NSTitleProps extends BaseComponentProps
+export interface INSTitleProps extends IBaseComponentProps
 {
 	title: string;
 }
 
-export function NSTitle(props: NSTitleProps)
+export function NSTitle(props: INSTitleProps)
 {
 	return (
 		<h2

package/src/main.ts

@@ -40,4 +40,15 @@ export * from "./components/NSPagination";
 export * from "./components/NSTable";
 export * from "./components/NSTitle";
 export * from "./pages/NSLoginPage";
-export * from "./pages/NSNotFoundPage";
+export * from "./pages/NSNotFoundPage";
+export * from "./props/IBaseComponentProps";
+export * from "./props/IImageProps";
+export * from "./props/ILinkProps";
+export * from "./props/INamirasoftProps";
+export * from "./props/IValidationNumberProps";
+export * from "./props/IValidationProps";
+export * from "./props/IValidationRegexProps";
+export * from "./props/IValidationStringProps";
+export * from "./routing/INSRouterMaker";
+export * from "./routing/NSRouterMaker";
+export * from "./routing/Notifier";

package/src/pages/NSLoginPage.tsx

@@ -3,7 +3,7 @@ import { NSButtonGreen } from '../components/NSButtonGreen';
 import { NSLinkBlue } from '../components/NSLinkBlue';
 import { NSSpace, NSSpaceSizeType } from '../components/NSSpace';
 
-export interface NSLoginPageProps
+export interface INSLoginPageProps
 {
     title: string;
     logo: string;
@@ -12,7 +12,7 @@ export interface NSLoginPageProps
     onClick?: () => void;
 }
 
-export function NSLoginPage(props: NSLoginPageProps)
+export function NSLoginPage(props: INSLoginPageProps)
 {
     let button = <></>;
     if (props.href)

package/src/props/{BaseComponentProps.ts → IBaseComponentProps.ts}

@@ -1,6 +1,6 @@
 import React from "react";
 
-export interface BaseComponentProps
+export interface IBaseComponentProps
 {
     id?: string;
     classList?: string[]

package/src/props/{ImageProps.ts → IImageProps.ts}

@@ -1,4 +1,4 @@
-export interface ImageProps
+export interface IImageProps
 {
     src: string;
     alt?: string;

package/src/props/{LinkProps.ts → ILinkProps.ts}

@@ -1,4 +1,4 @@
-export interface LinkProps
+export interface ILinkProps
 {
 	title?: string;
 	href: string;

package/src/props/INamirasoftProps.ts

@@ -0,0 +1,6 @@
+import { Notifier } from "../routing/Notifier";
+
+export interface INamirasoftProps
+{
+    notifier: Notifier;
+}

package/src/props/IValidationNumberProps.ts

@@ -0,0 +1,5 @@
+export interface IValidationNumberProps 
+{
+    min?: number;
+    max?: number;
+}

package/src/props/IValidationProps.ts

@@ -0,0 +1,8 @@
+import { IValidationRegexProps } from "./IValidationRegexProps";
+
+export interface IValidationProps
+{
+    required: boolean;
+    regex?: IValidationRegexProps;
+    validator?: (name: string, value: string | number | null | undefined) => string | null;
+}

package/src/props/IValidationRegexProps.ts

@@ -0,0 +1,5 @@
+export interface IValidationRegexProps
+{
+    name: string
+    regex: RegExp;
+}

package/src/props/{ValidationStringProps.ts → IValidationStringProps.ts}

@@ -1,4 +1,4 @@
-export interface ValidationStringProps
+export interface IValidationStringProps
 {
     min_length?: number;
     max_length?: number;

package/src/routing/INSRouterMaker.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { INamirasoftProps } from "../props/INamirasoftProps";
+
+export interface INSRouterMaker
+{
+    onRender(props: INamirasoftProps): React.JSX.Element;
+}

package/src/routing/NSRouterMaker.tsx

@@ -0,0 +1,33 @@
+import { INamirasoftProps } from '../props/INamirasoftProps';
+import { INotifierState, Notifier } from './Notifier';
+import { INSRouterMaker } from './INSRouterMaker';
+
+export class NSRouterMaker
+{
+    private state: INotifierState | undefined;
+    private setState: React.Dispatch<React.SetStateAction<INotifierState | undefined>>;
+    private component: INSRouterMaker;
+    constructor(state: INotifierState | undefined, setState: React.Dispatch<React.SetStateAction<INotifierState | undefined>>, component: INSRouterMaker)
+    {
+        this.state = state;
+        this.setState = setState;
+        this.component = component;
+        this.init = this.init.bind(this);
+        this.onRender = this.onRender.bind(this);
+    }
+    private init(): { props: INamirasoftProps }
+    {
+        let notifier: Notifier = new Notifier(this.state, this.setState);
+
+        let props: INamirasoftProps = {
+            notifier
+        };
+
+        return { props };
+    }
+    onRender(): React.JSX.Element
+    {
+        let { props } = this.init();
+        return this.component.onRender(props);
+    }
+};

package/src/routing/Notifier.ts

@@ -0,0 +1,84 @@
+import axios from "axios";
+import { NSNotificationColor, INSNotificationProps, NotificationType } from "../components/NSNotification";
+
+export interface INotifierState
+{
+    notifications?: INSNotificationProps[];
+}
+
+export class Notifier
+{
+    private static Counter: number = 1;
+    private state: INotifierState | undefined;
+    private setState: React.Dispatch<React.SetStateAction<INotifierState | undefined>>;
+    constructor(state: INotifierState | undefined, setState: React.Dispatch<React.SetStateAction<INotifierState | undefined>>)
+    {
+        this.state = state;
+        this.setState = setState;
+        this.notify = this.notify.bind(this);
+        this.onInformation = this.onInformation.bind(this);
+        this.onSuccess = this.onSuccess.bind(this);
+        this.onWarning = this.onWarning.bind(this);
+        this.onError = this.onError.bind(this);
+        this.delNotification = this.delNotification.bind(this);
+        this.getNotifications = this.getNotifications.bind(this);
+    }
+    private notify(message: INSNotificationProps) 
+    {
+        let notifications: INSNotificationProps[] = [];
+        if (this.state?.notifications)
+            notifications.push(...this.state.notifications);
+        notifications.push(message);
+        this.setState({ notifications });
+        setTimeout(() =>
+        {
+            message.onClose();
+        }, 5000);
+        window.scrollTo({ top: 0, left: 0, behavior: 'smooth' });
+    }
+    onInformation(text: string) 
+    {
+        let id = Notifier.Counter++ + "";
+        this.notify({ id, text, type: NotificationType.Information, color: NSNotificationColor.GRAY, onClose: () => this.delNotification(id) });
+    }
+    onSuccess(text: string) 
+    {
+        let id = Notifier.Counter++ + "";
+        this.notify({ id, text, type: NotificationType.Success, color: NSNotificationColor.GREEN, onClose: () => this.delNotification(id) });
+    }
+    onWarning(text: string) 
+    {
+        let id = Notifier.Counter++ + "";
+        this.notify({ id, text, type: NotificationType.Warning, color: NSNotificationColor.YELLOW, onClose: () => this.delNotification(id) });
+    }
+    onError(error: Error | string) 
+    {
+        let id = Notifier.Counter++ + "";
+        let text: string = "";
+        if (error instanceof Error)
+        {
+            text = error.message;
+            if (axios.isAxiosError(error))
+                if (error.response?.data)
+                    text = error.response.data;
+        }
+        else
+            text = error;
+        this.notify({ id, text, type: NotificationType.Error, color: NSNotificationColor.RED, onClose: () => this.delNotification(id) });
+    }
+    delNotification(id: string): void
+    {
+        if (!this.state)
+            return;
+
+        let notifications: INSNotificationProps[] = [];
+        if (this.state.notifications)
+            notifications.push(...this.state.notifications);
+        notifications = notifications.filter(x => x.id !== id);
+        this.setState({ notifications });
+    }
+    getNotifications(): INSNotificationProps[]
+    {
+        return this.state?.notifications ?? [];
+    }
+}

package/dist/props/BaseComponentProps.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=BaseComponentProps.js.map

package/dist/props/BaseComponentProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BaseComponentProps.js","sourceRoot":"","sources":["../../src/props/BaseComponentProps.ts"],"names":[],"mappings":""}

package/dist/props/ImageProps.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=ImageProps.js.map

package/dist/props/ImageProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ImageProps.js","sourceRoot":"","sources":["../../src/props/ImageProps.ts"],"names":[],"mappings":""}

package/dist/props/LinkProps.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=LinkProps.js.map

package/dist/props/LinkProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LinkProps.js","sourceRoot":"","sources":["../../src/props/LinkProps.ts"],"names":[],"mappings":""}

package/dist/props/ValidationNumberProps.d.ts

@@ -1,4 +0,0 @@
-export interface ValidationNumberProps {
-    min?: number;
-    max?: number;
-}

package/dist/props/ValidationNumberProps.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=ValidationNumberProps.js.map

package/dist/props/ValidationNumberProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ValidationNumberProps.js","sourceRoot":"","sources":["../../src/props/ValidationNumberProps.ts"],"names":[],"mappings":""}

package/dist/props/ValidationProps.d.ts

@@ -1,6 +0,0 @@
-import { ValidationRegexProps } from "./ValidationRegexProps";
-export interface ValidationProps {
-    required: boolean;
-    regex?: ValidationRegexProps;
-    validator?: (name: string, value: string | number | null | undefined) => string | null;
-}

package/dist/props/ValidationProps.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=ValidationProps.js.map

package/dist/props/ValidationProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ValidationProps.js","sourceRoot":"","sources":["../../src/props/ValidationProps.ts"],"names":[],"mappings":""}

package/dist/props/ValidationRegexProps.d.ts

@@ -1,4 +0,0 @@
-export interface ValidationRegexProps {
-    name: string;
-    regex: RegExp;
-}

package/dist/props/ValidationRegexProps.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=ValidationRegexProps.js.map

package/dist/props/ValidationRegexProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ValidationRegexProps.js","sourceRoot":"","sources":["../../src/props/ValidationRegexProps.ts"],"names":[],"mappings":""}

package/dist/props/ValidationStringProps.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=ValidationStringProps.js.map

package/dist/props/ValidationStringProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ValidationStringProps.js","sourceRoot":"","sources":["../../src/props/ValidationStringProps.ts"],"names":[],"mappings":""}

package/src/props/ValidationNumberProps.ts

@@ -1,5 +0,0 @@
-export interface ValidationNumberProps 
-{
-    min?: number;
-    max?: number;
-}