namirasoft-site-react 1.4.1 → 1.4.3

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 }} />
+	);
 }

package/src/components/NSTabPage.module.css

@@ -1,60 +1,60 @@
-.ns_tab_page_panel {
-    border-radius: 8px;
-    overflow: hidden;
-    background: #141B5C;
-    padding: 16px;
-    width: 100%;
-}
-
-.ns_tab_page_panel ul {
-    list-style-type: none;
-    margin: 0;
-    padding: 0;
-    display: flex;
-    overflow-x: auto;
-}
-
-.ns_tab_page_panel li {
-    text-align: center;
-    padding: 0px 16px;
-    cursor: pointer;
-    color: #fff;
-    font-size: 16px;
-    font-weight: 600;
-    border-right: 1px solid #fff;
-    margin: 14px 0;
-}
-
-.ns_tab_page_panel li:last-child {
-    border-right: none;
-}
-
-.ns_tab_page_panel li.active {
-    background-color: #fff;
-    border-radius: 8px 8px 0 0;
-    color: #141B5C;
-    margin: 0;
-    padding: 14px 16px;
-    box-shadow: 0px 2px 2px 2px #141B5C;
-}
-
-.ns_tab_content_column {
-    padding: 16px;
-    border-radius: 0 8px 8px 8px;
-    background-color: #fff;
-    gap: 0;
-    border-right: 1px solid #ccc;
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-    overflow-y: auto;
-}
-
-.ns_tab_content_grid {
-    padding: 16px;
-    border-radius: 0 8px 8px 8px;
-    background-color: #fff;
-    display: grid;
-    gap: 0;
-    border-right: 1px solid #ccc;
+.ns_tab_page_panel {
+    border-radius: 8px;
+    overflow: hidden;
+    background: #141B5C;
+    padding: 16px;
+    width: 100%;
+}
+
+.ns_tab_page_panel ul {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    overflow-x: auto;
+}
+
+.ns_tab_page_panel li {
+    text-align: center;
+    padding: 0px 16px;
+    cursor: pointer;
+    color: #fff;
+    font-size: 16px;
+    font-weight: 600;
+    border-right: 1px solid #fff;
+    margin: 14px 0;
+}
+
+.ns_tab_page_panel li:last-child {
+    border-right: none;
+}
+
+.ns_tab_page_panel li.active {
+    background-color: #fff;
+    border-radius: 8px 8px 0 0;
+    color: #141B5C;
+    margin: 0;
+    padding: 14px 16px;
+    box-shadow: 0px 2px 2px 2px #141B5C;
+}
+
+.ns_tab_content_column {
+    padding: 16px;
+    border-radius: 0 8px 8px 8px;
+    background-color: #fff;
+    gap: 0;
+    border-right: 1px solid #ccc;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    overflow-y: auto;
+}
+
+.ns_tab_content_grid {
+    padding: 16px;
+    border-radius: 0 8px 8px 8px;
+    background-color: #fff;
+    display: grid;
+    gap: 0;
+    border-right: 1px solid #ccc;
 }

package/src/components/NSTabPage.tsx

@@ -1,54 +1,54 @@
-"use client";
-import Styles from './NSTabPage.module.css';
-import { IBaseComponentProps } from "../props/IBaseComponentProps";
-import { Component } from "react";
-
-export interface NSTabPageTab
-{
-    title: string;
-    getContent: () => React.ReactNode;
-}
-
-export interface NSTabPageProps extends IBaseComponentProps
-{
-    tabs: NSTabPageTab[]
-    grid?: boolean;
-}
-
-export interface NSTabPageState
-{
-    activeTabIndex: number
-}
-
-export class NSTabPage extends Component<NSTabPageProps, NSTabPageState>
-{
-    constructor(props: NSTabPageProps)
-    {
-        super(props);
-        this.state = { activeTabIndex: 0 };
-    }
-    override render()
-    {
-
-        return (
-            <div className={` ${Styles.ns_tab_page_panel} ${this.props.classList}`} style={this.props.style}>
-                <ul>
-                    {
-                        this.props.tabs.map((tab, index) => (
-                            <li
-                                key={index}
-                                className={this.state.activeTabIndex === index ? Styles.active : ''}
-                                onClick={() => this.setState({ activeTabIndex: index })}
-                            >
-                                {tab.title}
-                            </li>
-                        ))
-                    }
-                </ul>
-                <div className={this.props.grid ? Styles.ns_tab_content_grid : Styles.ns_tab_content_column}>
-                    {this.props.tabs[this.state.activeTabIndex].getContent()}
-                </div>
-            </div>
-        );
-    }
+"use client";
+import Styles from './NSTabPage.module.css';
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+import { Component } from "react";
+
+export interface NSTabPageTab
+{
+    title: string;
+    getContent: () => React.ReactNode;
+}
+
+export interface NSTabPageProps extends IBaseComponentProps
+{
+    tabs: NSTabPageTab[]
+    grid?: boolean;
+}
+
+export interface NSTabPageState
+{
+    activeTabIndex: number
+}
+
+export class NSTabPage extends Component<NSTabPageProps, NSTabPageState>
+{
+    constructor(props: NSTabPageProps)
+    {
+        super(props);
+        this.state = { activeTabIndex: 0 };
+    }
+    override render()
+    {
+
+        return (
+            <div className={` ${Styles.ns_tab_page_panel} ${this.props.classList}`} style={this.props.style}>
+                <ul>
+                    {
+                        this.props.tabs.map((tab, index) => (
+                            <li
+                                key={index}
+                                className={this.state.activeTabIndex === index ? Styles.active : ''}
+                                onClick={() => this.setState({ activeTabIndex: index })}
+                            >
+                                {tab.title}
+                            </li>
+                        ))
+                    }
+                </ul>
+                <div className={this.props.grid ? Styles.ns_tab_content_grid : Styles.ns_tab_content_column}>
+                    {this.props.tabs[this.state.activeTabIndex].getContent()}
+                </div>
+            </div>
+        );
+    }
 }