namirasoft-site-react 1.3.350 → 1.3.352

package/src/components/NSRadioButton.tsx

@@ -1,101 +1,101 @@
-import React from "react";
-import Styles from "./NSRadioButton.module.css";
-import { IBaseComponentProps } from "../props/IBaseComponentProps";
-import { IValidationProps } from "../props/IValidationProps";
-import { IValidationStringProps } from "../props/IValidationStringProps";
-import { NSBoxErrorNotifier } from "./NSBoxErrorNotifier";
-
-export interface INSRadioButtonProps extends IBaseComponentProps, IValidationProps, IValidationStringProps
-{
-    title: string;
-    placeholder?: string;
-    defaultValue?: boolean;
-    isSelected?: boolean;
-    onChanged?: (e: NSRadioButton) => void;
-    onClick?: () => void;
-}
-
-export interface INSBoxBooleanState
-{
-    value: boolean;
-    error?: string;
-}
-
-export class NSRadioButton extends React.Component<INSRadioButtonProps, INSBoxBooleanState> {
-    constructor(props: INSRadioButtonProps)
-    {
-        super(props);
-        this.state = { value: props.defaultValue ?? false };
-        this.getValue = this.getValue.bind(this);
-        this.setValue = this.setValue.bind(this);
-        this.onClicked = this.onClicked.bind(this);
-    }
-
-    getError(): string | null
-    {
-        return null;
-    }
-
-    getValue(): boolean
-    {
-        let error = this.getError();
-        if (error)
-        {
-            this.setState({ error });
-            throw new Error(error);
-        }
-        return this.state.value;
-    }
-
-    setValue(value: boolean): void
-    {
-        this.setState({ value }, () =>
-        {
-            if (this.props.onChanged)
-                this.props.onChanged(this);
-        });
-    }
-
-    private onClicked(): void
-    {
-        this.setValue(true);
-        if (this.props.onClick)
-            this.props.onClick();
-    }
-
-    override componentDidUpdate(prevProps: INSRadioButtonProps)
-    {
-        if (prevProps.isSelected !== this.props.isSelected)
-        {
-            this.setValue(this.props.isSelected ?? false);
-        }
-    }
-
-    override render()
-    {
-        return (
-            <>
-                <div
-                    id={this.props.id}
-                    className={`${Styles.ns_input_parent} ${this.props.classList?.join(" ")}`}
-                    style={this.props.style}
-                >
-                    <div className={Styles.ns_input_transparent} onClick={this.onClicked}></div>
-                    <div className={Styles.ns_checkbox_parent} >
-                        <input
-                            type="radio"
-                            name={this.props.name}
-                            className={Styles.ns_input}
-                            checked={this.state.value}
-                            onChange={() => { }} 
-                        />
-                        <span className={Styles.ns_input_title}>
-                            {this.props.required && <span style={{ color: "red" }} >*</span>} {this.props.title}
-                        </span>
-                    </div>
-                </div>
-                <NSBoxErrorNotifier error={this.state.error} clearError={() => this.setState({ error: "" })} />
-            </>
-        );
-    }
+import React from "react";
+import Styles from "./NSRadioButton.module.css";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+import { IValidationProps } from "../props/IValidationProps";
+import { IValidationStringProps } from "../props/IValidationStringProps";
+import { NSBoxErrorNotifier } from "./NSBoxErrorNotifier";
+
+export interface INSRadioButtonProps extends IBaseComponentProps, IValidationProps, IValidationStringProps
+{
+    title: string;
+    placeholder?: string;
+    defaultValue?: boolean;
+    isSelected?: boolean;
+    onChanged?: (e: NSRadioButton) => void;
+    onClick?: () => void;
+}
+
+export interface INSBoxBooleanState
+{
+    value: boolean;
+    error?: string;
+}
+
+export class NSRadioButton extends React.Component<INSRadioButtonProps, INSBoxBooleanState> {
+    constructor(props: INSRadioButtonProps)
+    {
+        super(props);
+        this.state = { value: props.defaultValue ?? false };
+        this.getValue = this.getValue.bind(this);
+        this.setValue = this.setValue.bind(this);
+        this.onClicked = this.onClicked.bind(this);
+    }
+
+    getError(): string | null
+    {
+        return null;
+    }
+
+    getValue(): boolean
+    {
+        let error = this.getError();
+        if (error)
+        {
+            this.setState({ error });
+            throw new Error(error);
+        }
+        return this.state.value;
+    }
+
+    setValue(value: boolean): void
+    {
+        this.setState({ value }, () =>
+        {
+            if (this.props.onChanged)
+                this.props.onChanged(this);
+        });
+    }
+
+    private onClicked(): void
+    {
+        this.setValue(true);
+        if (this.props.onClick)
+            this.props.onClick();
+    }
+
+    override componentDidUpdate(prevProps: INSRadioButtonProps)
+    {
+        if (prevProps.isSelected !== this.props.isSelected)
+        {
+            this.setValue(this.props.isSelected ?? false);
+        }
+    }
+
+    override render()
+    {
+        return (
+            <>
+                <div
+                    id={this.props.id}
+                    className={`${Styles.ns_input_parent} ${this.props.classList?.join(" ")}`}
+                    style={this.props.style}
+                >
+                    <div className={Styles.ns_input_transparent} onClick={this.onClicked}></div>
+                    <div className={Styles.ns_checkbox_parent} >
+                        <input
+                            type="radio"
+                            name={this.props.name}
+                            className={Styles.ns_input}
+                            checked={this.state.value}
+                            onChange={() => { }} 
+                        />
+                        <span className={Styles.ns_input_title}>
+                            {this.props.required && <span style={{ color: "red" }} >*</span>} {this.props.title}
+                        </span>
+                    </div>
+                </div>
+                <NSBoxErrorNotifier error={this.state.error} clearError={() => this.setState({ error: "" })} />
+            </>
+        );
+    }
 }

package/src/components/NSSection.module.css

@@ -1,11 +1,11 @@
-.ns_section {
-	background-repeat: no-repeat;
-	background-size: cover;
-	background-position: center;
-}
-
-.ns_section_center {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
+.ns_section {
+	background-repeat: no-repeat;
+	background-size: cover;
+	background-position: center;
+}
+
+.ns_section_center {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
 }

package/src/components/NSSection.tsx

@@ -1,24 +1,24 @@
-import { ReactNode } from "react";
-import Styles from './NSSection.module.css'
-import { IBaseComponentProps } from "../props/IBaseComponentProps";
-
-export interface INSSectionProps extends IBaseComponentProps
-{
-	children: ReactNode;
-	center_items?: boolean;
-}
-
-export function NSSection(props: INSSectionProps)
-{
-	let styles = [Styles.ns_section];
-	if (props.center_items)
-		styles.push(Styles.ns_section_center);
-	return (
-		<section id={props.id}
-			className={`${styles.join(" ")} ${props.classList?.join(" ")}`}
-			style={props.style}
-		>
-			{props.children}
-		</section>
-	);
+import { ReactNode } from "react";
+import Styles from './NSSection.module.css'
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+
+export interface INSSectionProps extends IBaseComponentProps
+{
+	children: ReactNode;
+	center_items?: boolean;
+}
+
+export function NSSection(props: INSSectionProps)
+{
+	let styles = [Styles.ns_section];
+	if (props.center_items)
+		styles.push(Styles.ns_section_center);
+	return (
+		<section id={props.id}
+			className={`${styles.join(" ")} ${props.classList?.join(" ")}`}
+			style={props.style}
+		>
+			{props.children}
+		</section>
+	);
 }

package/src/components/NSSectionBars.module.css

@@ -1,11 +1,11 @@
-.ns_entity_bar_container {
-	display: flex;
-	flex-direction: column;
-	justify-content: center;
-	align-items: center;
-	margin-left: auto;
-	margin-right: auto;
-	padding-left: 1rem;
-	padding-right: 1rem;
-	gap: 24px;
+.ns_entity_bar_container {
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	margin-left: auto;
+	margin-right: auto;
+	padding-left: 1rem;
+	padding-right: 1rem;
+	gap: 24px;
 }

package/src/components/NSSectionBars.tsx

@@ -1,26 +1,26 @@
-import Styles from './NSSectionBars.module.css';
-import { NSEntityBar, INSEntityBarProps } from './NSEntityBar';
-import { NSSection } from './NSSection';
-import { NSSpace, NSSpaceSizeType } from './NSSpace';
-import { IBaseComponentProps } from "../props/IBaseComponentProps";
-
-export interface INSSectionBarsProps extends IBaseComponentProps
-{
-	title?: string;
-	bars: INSEntityBarProps[]
-}
-
-export function NSSectionBars(props: INSSectionBarsProps)
-{
-	return (
-		<NSSection {...props} >
-			<NSSpace size={NSSpaceSizeType.NORMAL} />
-			<div className={`container mx-auto px-4 lg:px-12 ${Styles.ns_entity_bar_container}`}>
-				{
-					props.bars?.map((bar) => <NSEntityBar key={bar.id} {...bar} />)
-				}
-			</div>
-			<NSSpace size={NSSpaceSizeType.NORMAL} />
-		</NSSection>
-	);
+import Styles from './NSSectionBars.module.css';
+import { NSEntityBar, INSEntityBarProps } from './NSEntityBar';
+import { NSSection } from './NSSection';
+import { NSSpace, NSSpaceSizeType } from './NSSpace';
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+
+export interface INSSectionBarsProps extends IBaseComponentProps
+{
+	title?: string;
+	bars: INSEntityBarProps[]
+}
+
+export function NSSectionBars(props: INSSectionBarsProps)
+{
+	return (
+		<NSSection {...props} >
+			<NSSpace size={NSSpaceSizeType.NORMAL} />
+			<div className={`container mx-auto px-4 lg:px-12 ${Styles.ns_entity_bar_container}`}>
+				{
+					props.bars?.map((bar) => <NSEntityBar key={bar.id} {...bar} />)
+				}
+			</div>
+			<NSSpace size={NSSpaceSizeType.NORMAL} />
+		</NSSection>
+	);
 }

package/src/components/NSSectionCards.module.css

@@ -1,39 +1,39 @@
-.ns_section_cards_holder {
-	display: flex;
-	flex-direction: column;
-	justify-content: center;
-	align-items: center;
-	margin-left: auto;
-	margin-right: auto;
-	padding-left: 1rem;
-	padding-right: 1rem;
-}
-
-.ns_section_cards_title_container {
-	margin-bottom: 32px;
-}
-
-.ns_card_container {
-	display: flex;
-	flex-direction: row;
-	flex-wrap: wrap;
-	justify-content: center;
-	gap: 24px;
-	width: 100%;
-}
-
-.ns_section_cards_link_container {
-	margin-top: 48px;
-	width: 100%;
-	text-align: center;
-}
-
-.ns_description {
-	text-align: center;
-	font-style: normal;
-	font-weight: inherit;
-	font-size: 16px;
-	font-family: inherit;
-	line-height: inherit;
-	margin-bottom: 16px;
+.ns_section_cards_holder {
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	margin-left: auto;
+	margin-right: auto;
+	padding-left: 1rem;
+	padding-right: 1rem;
+}
+
+.ns_section_cards_title_container {
+	margin-bottom: 32px;
+}
+
+.ns_card_container {
+	display: flex;
+	flex-direction: row;
+	flex-wrap: wrap;
+	justify-content: center;
+	gap: 24px;
+	width: 100%;
+}
+
+.ns_section_cards_link_container {
+	margin-top: 48px;
+	width: 100%;
+	text-align: center;
+}
+
+.ns_description {
+	text-align: center;
+	font-style: normal;
+	font-weight: inherit;
+	font-size: 16px;
+	font-family: inherit;
+	line-height: inherit;
+	margin-bottom: 16px;
 }

package/src/components/NSSectionCards.tsx

@@ -1,52 +1,52 @@
-import Styles from './NSSectionCards.module.css';
-import { NSTitle } from './NSTitle';
-import { NSCard, INSCardProps } from './NSCard';
-import { NSSection } from './NSSection';
-import { NSLinkBlue } from './NSLinkBlue';
-import { NSSpace, NSSpaceSizeType } from './NSSpace';
-import { IBaseComponentProps } from "../props/IBaseComponentProps";
-import { ILinkProps } from '../props/ILinkProps';
-
-export interface INSSectionCardsProps extends IBaseComponentProps
-{
-	title?: string;
-	description?: {
-		text: string,
-		color?: string
-	};
-	button?: ILinkProps;
-	cards: INSCardProps[];
-}
-
-export function NSSectionCards(props: INSSectionCardsProps) 
-{
-	return (
-		<NSSection {...props} >
-			<NSSpace size={NSSpaceSizeType.NORMAL} />
-			<div className={`container mx-auto px-4 lg:px-12 ${Styles.ns_section_cards_holder}`}>
-				{
-					props.title &&
-					<div className={Styles.ns_section_cards_title_container}>
-						<NSTitle title={props.title} />
-						{
-							props.description &&
-							<p style={{ color: props.description?.color }} className={Styles.ns_description}> {props.description.text} </p>
-						}
-					</div>
-				}
-				<div className={` ${Styles.ns_card_container}`}>
-					{
-						props.cards?.map((card) => <NSCard key={card.id} {...card} />)
-					}
-				</div>
-				{
-					props.button &&
-					<div className={`mt-12 w-full- text-center ${Styles.ns_section_cards_link_container}`}>
-						<NSLinkBlue {...props.button} />
-					</div>
-				}
-			</div>
-			<NSSpace size={NSSpaceSizeType.NORMAL} />
-		</NSSection>
-	);
+import Styles from './NSSectionCards.module.css';
+import { NSTitle } from './NSTitle';
+import { NSCard, INSCardProps } from './NSCard';
+import { NSSection } from './NSSection';
+import { NSLinkBlue } from './NSLinkBlue';
+import { NSSpace, NSSpaceSizeType } from './NSSpace';
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+import { ILinkProps } from '../props/ILinkProps';
+
+export interface INSSectionCardsProps extends IBaseComponentProps
+{
+	title?: string;
+	description?: {
+		text: string,
+		color?: string
+	};
+	button?: ILinkProps;
+	cards: INSCardProps[];
+}
+
+export function NSSectionCards(props: INSSectionCardsProps) 
+{
+	return (
+		<NSSection {...props} >
+			<NSSpace size={NSSpaceSizeType.NORMAL} />
+			<div className={`container mx-auto px-4 lg:px-12 ${Styles.ns_section_cards_holder}`}>
+				{
+					props.title &&
+					<div className={Styles.ns_section_cards_title_container}>
+						<NSTitle title={props.title} />
+						{
+							props.description &&
+							<p style={{ color: props.description?.color }} className={Styles.ns_description}> {props.description.text} </p>
+						}
+					</div>
+				}
+				<div className={` ${Styles.ns_card_container}`}>
+					{
+						props.cards?.map((card) => <NSCard key={card.id} {...card} />)
+					}
+				</div>
+				{
+					props.button &&
+					<div className={`mt-12 w-full- text-center ${Styles.ns_section_cards_link_container}`}>
+						<NSLinkBlue {...props.button} />
+					</div>
+				}
+			</div>
+			<NSSpace size={NSSpaceSizeType.NORMAL} />
+		</NSSection>
+	);
 }

package/src/components/NSSectionTitle.tsx

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

package/src/components/NSSpace.tsx

@@ -1,29 +1,29 @@
-import { IBaseComponentProps } from "../props/IBaseComponentProps";
-
-export interface INSSpaceProps extends IBaseComponentProps
-{
-	size: NSSpaceSizeType;
-}
-
-export enum NSSpaceSizeType
-{
-	NANO = "4px",
-	MICRO = "8px",
-	MINI = "16px",
-	SMALL = "24px",
-	MEDUIM = "32px",
-	NORMAL = "48px",
-	LARGE = "64px",
-	XLARGE = "80px",
-	XXLARGE = "96px",
-	XXXLARGE = "128px",
-}
-
-export function NSSpace(props: INSSpaceProps)
-{
-	return (
-		<hr id={props.id}
-			className={props.classList?.join(" ")}
-			style={{ ...props.style, width: "100%", height: props.size, margin: "0px", padding: "0px", background: "transparent", color: "transparent", border: 0, position: "relative", zIndex: -1 }} />
-	);
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+
+export interface INSSpaceProps extends IBaseComponentProps
+{
+	size: NSSpaceSizeType;
+}
+
+export enum NSSpaceSizeType
+{
+	NANO = "4px",
+	MICRO = "8px",
+	MINI = "16px",
+	SMALL = "24px",
+	MEDUIM = "32px",
+	NORMAL = "48px",
+	LARGE = "64px",
+	XLARGE = "80px",
+	XXLARGE = "96px",
+	XXXLARGE = "128px",
+}
+
+export function NSSpace(props: INSSpaceProps)
+{
+	return (
+		<hr id={props.id}
+			className={props.classList?.join(" ")}
+			style={{ ...props.style, width: "100%", height: props.size, margin: "0px", padding: "0px", background: "transparent", color: "transparent", border: 0, position: "relative", zIndex: -1 }} />
+	);
 }