namirasoft-site-react 1.3.59 → 1.3.60

package/src/components/NSPanel.tsx

@@ -1,18 +1,20 @@
 "use client";
 
 import { Component, ReactNode } from "react";
-import Styles from './NSPanel.module.css'
+import Styles from './NSPanel.module.css';
+import { BaseComponentProps } from "../props/BaseComponentProps";
 
-export interface NSSectionProps
+export interface NSSectionProps extends BaseComponentProps
 {
     children: ReactNode;
     grid: boolean;
 }
 
 export interface NSSectionState
-{}
+{ }
 
-export class NSPanel extends Component<NSSectionProps, NSSectionState> {
+export class NSPanel extends Component<NSSectionProps, NSSectionState>
+{
     constructor(props: NSSectionProps)
     {
         super(props);
@@ -21,7 +23,7 @@ export class NSPanel extends Component<NSSectionProps, NSSectionState> {
     {
         return (
             <section
-                className={this.props.grid ? Styles.ns_panel_grid : Styles.ns_panel_column  } >
+                className={this.props.grid ? Styles.ns_panel_grid : Styles.ns_panel_column} >
                 {this.props.children}
             </section>
         );

package/src/components/NSSection.tsx

@@ -3,8 +3,9 @@
 import { Component, ReactNode } from "react";
 import Styles from './NSSection.module.css'
 import { BackgroundProps } from "../props/BackgroundProps";
+import { BaseComponentProps } from "../props/BaseComponentProps";
 
-export interface NSSectionProps
+export interface NSSectionProps extends BaseComponentProps
 {
 	children: ReactNode;
 	background?: BackgroundProps;

package/src/components/NSSectionBars.tsx

@@ -6,8 +6,9 @@ import { NSEntityBar, NSEntityBarProps } from './NSEntityBar';
 import { NSSection } from './NSSection';
 import { BackgroundProps } from '../props/BackgroundProps';
 import { NSSpace, NSSpaceSizeType } from './NSSpace';
+import { BaseComponentProps } from "../props/BaseComponentProps";
 
-export interface NSSectionBarsProps
+export interface NSSectionBarsProps extends BaseComponentProps
 {
 	background?: BackgroundProps;
 	bars: NSEntityBarProps[]

package/src/components/NSSectionCards.tsx

@@ -8,8 +8,9 @@ import { NSSection } from './NSSection';
 import { NSLinkBlue } from './NSLinkBlue';
 import { BackgroundProps } from '../props/BackgroundProps';
 import { NSSpace, NSSpaceSizeType } from './NSSpace';
+import { BaseComponentProps } from "../props/BaseComponentProps";
 
-export interface NSSectionCardsProps
+export interface NSSectionCardsProps extends BaseComponentProps
 {
 	title?: {
 		text: string,
@@ -39,7 +40,7 @@ export class NSSectionCards extends Component<NSSectionCardsProps>
 						{
 							this.props.title &&
 							<div className={Styles.ns_section_cards_title_container}>
-									<NSTitle color={this.props.title?.color} title={this.props.title?.text} />
+								<NSTitle color={this.props.title?.color} title={this.props.title?.text} />
 								{
 									this.props.description &&
 									<p style={{ color: this.props.description?.color }} className={Styles.ns_description}> {this.props.description.text} </p>

package/src/components/NSSectionTitle.tsx

@@ -5,8 +5,9 @@ import { NSSection } from './NSSection';
 import { NSTitle } from './NSTitle';
 import { BackgroundProps } from '../props/BackgroundProps';
 import { NSSpace, NSSpaceSizeType } from './NSSpace';
+import { BaseComponentProps } from "../props/BaseComponentProps";
 
-export interface NSSectionTitleProps
+export interface NSSectionTitleProps extends BaseComponentProps
 {
 	title: {
 		text: string,

package/src/components/NSSelectBox.tsx

@@ -5,8 +5,9 @@ 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";
 
-export interface NSSelectBoxProps
+export interface NSSelectBoxProps extends BaseComponentProps
 {
     title: string;
     options: SelectProps['options'];
@@ -14,26 +15,38 @@ export interface NSSelectBoxProps
 
 export interface NSSelectBoxState
 {
-    value: string[];
+    value: string | null;
+    values: string[];
 }
 
-export class NSSelectBox extends React.Component<NSSelectBoxProps, NSSelectBoxState> {
+export class NSSelectBox extends React.Component<NSSelectBoxProps, NSSelectBoxState>
+{
     constructor(props: NSSelectBoxProps)
     {
         super(props);
         this.state = {
-            value: [],
+            value: null,
+            values: [],
         };
-        this.setValue = this.setValue.bind(this);
+        this.getValues = this.getValues.bind(this);
+        this.setValues = this.setValues.bind(this);
     }
-    setValue(value: string[]): void
+    setValue(value: string | null): void
     {
         this.setState({ value });
     }
-    getValue(): string[]
+    getValue(): string | null
     {
         return this.state.value;
     }
+    setValues(values: string[]): void
+    {
+        this.setState({ values });
+    }
+    getValues(): string[]
+    {
+        return this.state.values;
+    }
     override render()
     {
         return (
@@ -44,7 +57,7 @@ export class NSSelectBox extends React.Component<NSSelectBoxProps, NSSelectBoxSt
                     style={{ width: '100%' }}
                     className={Styles.ns_input_select}
                     placeholder="Combo Box"
-                    onChange={this.setValue}
+                    onChange={this.setValues}
                     optionLabelProp="label"
                     options={this.props.options}
                     optionRender={(option) => (

package/src/components/NSSpace.tsx

@@ -1,4 +1,6 @@
-export interface NSSpaceProps
+import { BaseComponentProps } from "../props/BaseComponentProps";
+
+export interface NSSpaceProps extends BaseComponentProps
 {
     size: NSSpaceSizeType;
 }

package/src/components/NSTable.tsx

@@ -6,8 +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";
 
-export interface NSTableProps<RowType>
+export interface NSTableProps<RowType> extends BaseComponentProps
 {
     columns: { [key: string]: string };
     rows: RowType[];

package/src/components/NSTitle.tsx

@@ -2,8 +2,9 @@
 
 import { Component } from 'react';
 import Styles from './NSTitle.module.css';
+import { BaseComponentProps } from "../props/BaseComponentProps";
 
-export interface NSTitleProps
+export interface NSTitleProps extends BaseComponentProps
 {
 	title: string;
 	color?: string;

package/src/main.ts

@@ -6,7 +6,7 @@ export * from "./components/NSButtonRed";
 export * from "./components/NSCard";
 export * from "./components/NSEntityCardBackground";
 export * from "./components/NSEntityBar";
-export * from "./components/NSError";
+export * from "./components/NSInputErrorNotifier";
 export * from "./components/NSFooter";
 export * from "./components/NSHeader";
 export * from "./components/NSCopyToClipboard";
@@ -27,7 +27,7 @@ export * from "./components/NSLayout";
 export * from "./components/NSLayoutHeroBanner";
 export * from "./components/NSLayoutTitle";
 export * from "./components/NSLoading";
-export * from "./components/NSMessenger";
+export * from "./components/NSNotification";
 export * from "./components/NSSelectBox";
 export * from "./components/NSSpace";
 export * from "./components/NSSection";

package/src/props/NSButtonProps.ts

@@ -1,7 +1,8 @@
 import { BackgroundProps } from "./BackgroundProps";
+import { BaseComponentProps } from "./BaseComponentProps";
 import { ImageProps } from "./ImageProps";
 
-export interface NSButtonProps
+export interface NSButtonProps extends BaseComponentProps // todo
 {
     title: string;
     onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;

package/dist/components/NSError.d.ts

@@ -1,11 +0,0 @@
-import React from "react";
-export interface NSErrorProps {
-    text: string;
-    show: boolean;
-}
-export interface NSErroState {
-}
-export declare class NSError extends React.Component<NSErrorProps, NSErroState> {
-    constructor(props: NSErrorProps);
-    render(): import("react/jsx-runtime").JSX.Element;
-}

package/dist/components/NSError.js

@@ -1,14 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import React from "react";
-import Styles from "./NSError.module.css";
-import Danger from '../assets/images/danger.svg';
-export class NSError extends React.Component {
-    constructor(props) {
-        super(props);
-    }
-    render() {
-        return _jsx(_Fragment, { children: this.props.show && (_jsx(_Fragment, { children: _jsxs("div", { className: "d-flex justify-content-start align-items-center gap-2 ms-2", children: [_jsx("img", { className: "", src: Danger, alt: "Error Icon", width: 13, height: 13 }), _jsx("span", { className: Styles.ns_input_error, children: this.props.text })] }) })) });
-    }
-}
-//# sourceMappingURL=NSError.js.map

package/dist/components/NSError.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"NSError.js","sourceRoot":"","sources":["../../src/components/NSError.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,sBAAsB,CAAC;AAC1C,OAAO,MAAM,MAAM,6BAA6B,CAAC;AAWjD,MAAM,OAAO,OAAQ,SAAQ,KAAK,CAAC,SAAoC;IAEnE,YAAY,KAAmB;QAE3B,KAAK,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC;IAEQ,MAAM;QAEX,OAAO,4BACF,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,CAChB,4BACI,eAAK,SAAS,EAAC,4DAA4D,aACvE,cACI,SAAS,EAAE,EAAE,EACb,GAAG,EAAE,MAAM,EACX,GAAG,EAAC,YAAY,EAChB,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACZ,EACF,eAAM,SAAS,EAAE,MAAM,CAAC,cAAc,YAAG,IAAI,CAAC,KAAK,CAAC,IAAI,GAAQ,IAC9D,GACP,CACN,GACF,CAAA;IACP,CAAC;CACJ"}

package/dist/components/NSMessenger.d.ts

@@ -1,14 +0,0 @@
-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

@@ -1,23 +0,0 @@
-"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

@@ -1 +0,0 @@
-{"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

@@ -1,16 +0,0 @@
-.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/NSError.tsx

@@ -1,42 +0,0 @@
-"use client";
-
-import React from "react";
-import Styles from "./NSError.module.css";
-import Danger from '../assets/images/danger.svg';
-
-export interface NSErrorProps
-{
-    text: string;
-    show: boolean;
-}
-
-export interface NSErroState
-{ }
-
-export class NSError extends React.Component<NSErrorProps, NSErroState>
-{
-    constructor(props: NSErrorProps)
-    {
-        super(props);
-    }
-
-    override render()
-    {
-        return <>
-            {this.props.show && (
-                <>
-                    <div className="d-flex justify-content-start align-items-center gap-2 ms-2">
-                        <img
-                            className={""}
-                            src={Danger}
-                            alt="Error Icon"
-                            width={13}
-                            height={13}
-                        />
-                        <span className={Styles.ns_input_error}>{this.props.text}</span>
-                    </div>
-                </>
-            )}
-        </>
-    }
-}

package/src/components/NSMessenger.module.css

@@ -1,16 +0,0 @@
-.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;
-}