namirasoft-site-react 1.2.7 → 1.2.9

package/dist/App.js

@@ -18,6 +18,8 @@ import { NSInputPhone } from './components/NSInputPhone';
 import { NSButtonGreen } from './components/NSButtonGreen';
 import { NSButtonRed } from './components/NSButtonRed';
 import { NSSelectBox } from './components/NSSelectBox';
+import { NSLinkGreen } from './components/NSLinkGreen';
+import { NSLinkRed } from './components/NSLinkRed';
 export function App() {
     const options = [
         {
@@ -41,6 +43,6 @@ export function App() {
             desc: 'Test4',
         },
     ];
-    return (_jsxs("div", { className: "App", children: [_jsx(NSHeader, { scope: 'test', name: 'test' }), _jsxs("div", { className: 'my-4', children: [_jsx(NSInputText, { title: 'Text' }), _jsx(NSInputInteger, { title: 'Integer' }), _jsx(NSInputFloat, { title: 'Floating Point' }), _jsx(NSInputPrice, { title: 'Price' }), _jsx(NSInputDate, { title: 'Date' }), _jsx(NSInputTime, { title: 'Time' }), _jsx(NSInputDuration, { title: 'Duration' }), _jsx(NSInputString, { title: 'String' }), _jsx(NSInputIP, { title: 'IP' }), _jsx(NSInputEmail, { title: 'Email' }), _jsx(NSInputSearch, { title: 'Search' }), _jsx(NSInputPhone, { title: 'Phone' }), _jsx(NSSelectBox, { title: "t", options: options }), _jsx(NSButtonGreen, { title: 'Save', onClick: () => { } }), _jsx(NSButtonRed, { title: 'Delete', onClick: () => { } })] }), _jsx(NSFooter, { scope: 'test', name: 'test' })] }));
+    return (_jsxs("div", { className: "App", children: [_jsx(NSHeader, { scope: 'test', name: 'test' }), _jsxs("div", { className: 'my-4', children: [_jsx(NSInputText, { title: 'Text' }), _jsx(NSInputInteger, { title: 'Integer' }), _jsx(NSInputFloat, { title: 'Floating Point' }), _jsx(NSInputPrice, { title: 'Price' }), _jsx(NSInputDate, { title: 'Date' }), _jsx(NSInputTime, { title: 'Time' }), _jsx(NSInputDuration, { title: 'Duration' }), _jsx(NSInputString, { title: 'String' }), _jsx(NSInputIP, { title: 'IP' }), _jsx(NSInputEmail, { title: 'Email' }), _jsx(NSInputSearch, { title: 'Search' }), _jsx(NSInputPhone, { title: 'Phone' }), _jsx(NSSelectBox, { title: "t", options: options }), _jsx(NSButtonGreen, { title: 'Save', onClick: () => { } }), _jsx(NSButtonRed, { title: 'Delete', onClick: () => { } }), _jsx(NSLinkGreen, { title: "Add +", href: "/" }), _jsx(NSLinkRed, { title: "Delete", href: "/" })] }), _jsx(NSFooter, { scope: 'test', name: 'test' })] }));
 }
 //# sourceMappingURL=App.js.map

package/dist/App.js.map

@@ -1 +1 @@
-{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":"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"}

package/dist/components/NSButtonGreen.d.ts

@@ -1,11 +1,14 @@
 import React from "react";
 interface IProps {
     title: string;
-    onClick: () => void;
+    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
 }
 interface IState {
+    title: string;
 }
 export declare class NSButtonGreen extends React.Component<IProps, IState> {
+    constructor(props: IProps);
+    setTitle(title: string): void;
     render(): import("react/jsx-runtime").JSX.Element;
 }
 export {};

package/dist/components/NSButtonGreen.js

@@ -2,8 +2,15 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 import Style from "./NSButtonGreen.module.css";
 export class NSButtonGreen extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = { title: props.title };
+    }
+    setTitle(title) {
+        this.setState({ title });
+    }
     render() {
-        return _jsx("button", { onClick: this.props.onClick, className: Style.ns_button_green, children: this.props.title });
+        return _jsx("button", { onClick: e => this.props.onClick(e), className: Style.ns_button_green, children: this.state.title });
     }
 }
 //# sourceMappingURL=NSButtonGreen.js.map

package/dist/components/NSButtonGreen.js.map

@@ -1 +1 @@
-{"version":3,"file":"NSButtonGreen.js","sourceRoot":"","sources":["../../src/components/NSButtonGreen.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,MAAM,4BAA4B,CAAC;AAQ/C,MAAM,OAAO,aAAc,SAAQ,KAAK,CAAC,SAAyB;IAErD,MAAM;QACX,OAAO,iBAAQ,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,SAAS,EAAE,KAAK,CAAC,eAAe,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAU,CAAC;IAC9G,CAAC;CACJ"}
+{"version":3,"file":"NSButtonGreen.js","sourceRoot":"","sources":["../../src/components/NSButtonGreen.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,MAAM,4BAA4B,CAAC;AAa/C,MAAM,OAAO,aAAc,SAAQ,KAAK,CAAC,SAAyB;IAE9D,YAAY,KAAa;QAErB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC;IACxC,CAAC;IACD,QAAQ,CAAC,KAAa;QAElB,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7B,CAAC;IACQ,MAAM;QAEX,OAAO,iBAAQ,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,KAAK,CAAC,eAAe,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAU,CAAC;IACtH,CAAC;CACJ"}

package/dist/components/NSButtonRed.d.ts

@@ -1,11 +1,16 @@
 import React from "react";
 interface IProps {
     title: string;
-    onClick: () => void;
+    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}
+interface IState {
+    title: string;
 }
 interface IState {
 }
 export declare class NSButtonRed extends React.Component<IProps, IState> {
+    constructor(props: IProps);
+    setTitle(title: string): void;
     render(): import("react/jsx-runtime").JSX.Element;
 }
 export {};

package/dist/components/NSButtonRed.js

@@ -2,8 +2,15 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 import Style from "./NSButtonRed.module.css";
 export class NSButtonRed extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = { title: props.title };
+    }
+    setTitle(title) {
+        this.setState({ title });
+    }
     render() {
-        return _jsx("button", { onClick: this.props.onClick, className: Style.ns_button_red, children: this.props.title });
+        return _jsx("button", { onClick: e => this.props.onClick(e), className: Style.ns_button_red, children: this.state.title });
     }
 }
 //# sourceMappingURL=NSButtonRed.js.map

package/dist/components/NSButtonRed.js.map

@@ -1 +1 @@
-{"version":3,"file":"NSButtonRed.js","sourceRoot":"","sources":["../../src/components/NSButtonRed.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,MAAM,0BAA0B,CAAC;AAQ7C,MAAM,OAAO,WAAY,SAAQ,KAAK,CAAC,SAAyB;IAEnD,MAAM;QACX,OAAO,iBAAQ,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,SAAS,EAAE,KAAK,CAAC,aAAa,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAU,CAAC;IAC5G,CAAC;CACJ"}
+{"version":3,"file":"NSButtonRed.js","sourceRoot":"","sources":["../../src/components/NSButtonRed.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,MAAM,0BAA0B,CAAC;AAe7C,MAAM,OAAO,WAAY,SAAQ,KAAK,CAAC,SAAyB;IAE5D,YAAY,KAAa;QAErB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC;IACxC,CAAC;IACD,QAAQ,CAAC,KAAa;QAElB,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7B,CAAC;IACQ,MAAM;QAEX,OAAO,iBAAQ,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,KAAK,CAAC,aAAa,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAU,CAAC;IACpH,CAAC;CACJ"}

package/dist/components/NSFooter.js

@@ -20,14 +20,14 @@ export class NSFooter extends React.Component {
         });
     }
     hasChild(id) {
-        return this.state.filters.filter(f => f.parent_id === id).length > 0;
+        return this.state.filters.filter(f => f.parent_id == id).length > 0;
     }
     render() {
         return (_jsx("div", { className: Styles.ns_footer, children: _jsxs("div", { className: "container", children: [_jsxs("div", { className: `d-flex justify-content-between ${Styles.ns_footer_parent_items}`, children: [_jsx("div", { className: "d-none d-md-block", children: _jsx("div", { children: _jsx("a", { href: "/", children: _jsx("img", { src: "https://static.namirasoft.com/logo/account/base.png", alt: 'footer', width: 48, height: 48 }) }) }) }), _jsx("div", { className: "d-flex flex-wrap w-100 gap-5", children: this.render_menu(0, null) }), _jsx("div", { className: "justify-content-end d-none d-md-flex", children: _jsx("div", { children: _jsx("a", { href: "/", children: _jsx("img", { src: "https://static.namirasoft.com/logo/namirasoft/name.png", alt: 'footer', width: 48, height: 48 }) }) }) })] }), _jsxs("div", { className: "d-flex justify-content-center gap-4 mb-3 d-block d-md-none", children: [_jsx("div", { children: _jsx("a", { href: "/", children: _jsx("img", { src: "https://static.namirasoft.com/logo/account/base.png", alt: 'footer', width: 48, height: 48 }) }) }), _jsx("div", { children: _jsx("a", { href: "/", children: _jsx("img", { src: "https://static.namirasoft.com/logo/namirasoft/name.png", alt: 'footer', width: 48, height: 48 }) }) })] }), _jsx("div", { className: `row ${Styles.ns_footer_copyright}`, children: "\u00A9Copyright 2010 - 2023 Namira Software Corporation. All rights reserved." })] }) }));
     }
     render_menu(level, parent_id) {
         var _a;
-        let fs = (_a = this.state.filters) === null || _a === void 0 ? void 0 : _a.filter(f => f.parent_id === parent_id);
+        let fs = (_a = this.state.filters) === null || _a === void 0 ? void 0 : _a.filter(f => f.parent_id == parent_id);
         return (_jsx(_Fragment, { children: (fs === null || fs === void 0 ? void 0 : fs.map(f => this.render_menuItem(level, f))) }));
     }
     render_menuItem(level, filter) {

package/dist/components/NSFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"NSFooter.js","sourceRoot":"","sources":["../../src/components/NSFooter.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"NSFooter.js","sourceRoot":"","sources":["../../src/components/NSFooter.tsx"],"names":[],"mappings":"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"}

package/dist/components/NSInputFloat.js.map

@@ -1 +1 @@
-{"version":3,"file":"NSInputFloat.js","sourceRoot":"","sources":["../../src/components/NSInputFloat.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,2BAA2B,CAAC;AAC/C,OAAO,cAAc,MAAM,uCAAuC,CAAC;AAYnE,MAAM,OAAO,YAAa,SAAQ,KAAK,CAAC,SAAyB;IAC7D,YAAY,KAAa;QAErB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG;YACT,KAAK,EAAE,EAAE;SACZ,CAAC;QACF,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC3D,CAAC;IACD,QAAQ,CAAC,CAAsC;QAE3C,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;IAC7C,CAAC;IACD,eAAe,CAAC,KAAa;QAEzB,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7B,CAAC;IACD,QAAQ;QAEJ,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;IAC5B,CAAC;IACQ,MAAM;QAEX,OAAO,CACH,eAAK,SAAS,EAAE,GAAG,MAAM,CAAC,eAAe,MAAM,aAC3C,eAAM,SAAS,EAAE,MAAM,CAAC,cAAc,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAQ,EACjE,cACI,SAAS,EAAE,MAAM,CAAC,aAAa,EAC/B,GAAG,EAAE,cAAc,EACnB,GAAG,EAAC,MAAM,EACV,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACZ,EACF,gBACI,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,QAAQ,EAC1B,WAAW,EAAC,KAAK,GACnB,IAEA,CACT,CAAC;IACN,CAAC;CACJ"}
+{"version":3,"file":"NSInputFloat.js","sourceRoot":"","sources":["../../src/components/NSInputFloat.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,2BAA2B,CAAC;AAC/C,OAAO,cAAc,MAAM,uCAAuC,CAAC;AAYnE,MAAM,OAAO,YAAa,SAAQ,KAAK,CAAC,SAAyB;IAC7D,YAAY,KAAa;QAErB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG;YACT,KAAK,EAAE,EAAE;SACZ,CAAC;QACF,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC3D,CAAC;IACD,QAAQ,CAAC,CAAsC;QAE3C,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;IAC7C,CAAC;IACD,eAAe,CAAC,KAAa;QAEzB,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7B,CAAC;IACD,QAAQ;QAEJ,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;IAC5B,CAAC;IACQ,MAAM;QAEX,OAAO,CACH,eAAK,SAAS,EAAE,GAAG,MAAM,CAAC,eAAe,MAAM,aAC3C,eAAM,SAAS,EAAE,MAAM,CAAC,cAAc,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAQ,EACjE,cACI,SAAS,EAAE,MAAM,CAAC,aAAa,EAC/B,GAAG,EAAE,cAAc,EACnB,GAAG,EAAC,MAAM,EACV,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACZ,EACF,gBACI,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,QAAQ,EAC1B,WAAW,EAAC,KAAK,GACnB,IACA,CACT,CAAC;IACN,CAAC;CACJ"}

package/dist/components/NSInputString.d.ts

@@ -1,15 +1,17 @@
 import React from "react";
 interface IProps {
     title: string;
+    defaultValue?: string;
+    onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
 }
 interface IState {
     value: string;
 }
 export declare class NSInputString extends React.Component<IProps, IState> {
     constructor(props: IProps);
-    setValue(e: React.ChangeEvent<HTMLInputElement>): void;
-    setDefaultValue(value: string): void;
     getValue(): string;
+    setValue(value: string): void;
+    private onChanged;
     render(): import("react/jsx-runtime").JSX.Element;
 }
 export {};

package/dist/components/NSInputString.js

@@ -4,25 +4,28 @@ import Styles from "./NSInputString.module.css";
 import IconInputString from '../assets/images/icon-input-string.svg';
 export class NSInputString extends React.Component {
     constructor(props) {
+        var _a;
         super(props);
         this.state = {
-            value: "",
+            value: (_a = props.defaultValue) !== null && _a !== void 0 ? _a : "",
         };
-        this.setValue = this.setValue.bind(this);
         this.getValue = this.getValue.bind(this);
-        this.setDefaultValue = this.setDefaultValue.bind(this);
+        this.setValue = this.setValue.bind(this);
+        this.onChanged = this.onChanged.bind(this);
     }
-    setValue(e) {
-        this.setState({ value: e.target.value });
+    getValue() {
+        return this.state.value;
     }
-    setDefaultValue(value) {
+    setValue(value) {
         this.setState({ value });
     }
-    getValue() {
-        return this.state.value;
+    onChanged(e) {
+        this.setValue(e.target.value);
+        if (this.props.onChanged)
+            this.props.onChanged(e);
     }
     render() {
-        return (_jsxs("div", { className: `${Styles.ns_input_parent} p-2`, children: [_jsx("span", { className: Styles.ns_input_title, children: this.props.title }), _jsx("img", { className: Styles.ns_input_icon, src: IconInputString, alt: "icon", width: 24, height: 24 }), _jsx("input", { value: this.state.value, onChange: this.setValue, type: "text", className: Styles.ns_input, placeholder: "12AB34cf" })] }));
+        return (_jsxs("div", { className: `${Styles.ns_input_parent} p-2`, children: [_jsx("span", { className: Styles.ns_input_title, children: this.props.title }), _jsx("img", { className: Styles.ns_input_icon, src: IconInputString, alt: "icon", width: 24, height: 24 }), _jsx("input", { value: this.state.value, onChange: this.onChanged, type: "text", className: Styles.ns_input, placeholder: "12AB34cf" })] }));
     }
 }
 //# sourceMappingURL=NSInputString.js.map

package/dist/components/NSInputString.js.map

@@ -1 +1 @@
-{"version":3,"file":"NSInputString.js","sourceRoot":"","sources":["../../src/components/NSInputString.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,4BAA4B,CAAC;AAChD,OAAO,eAAe,MAAM,wCAAwC,CAAC;AAYrE,MAAM,OAAO,aAAc,SAAQ,KAAK,CAAC,SAAyB;IAC9D,YAAY,KAAa;QAErB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG;YACT,KAAK,EAAE,EAAE;SACZ,CAAC;QACF,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC3D,CAAC;IACD,QAAQ,CAAC,CAAsC;QAE3C,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;IAC7C,CAAC;IACD,eAAe,CAAC,KAAa;QAEzB,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7B,CAAC;IACD,QAAQ;QAEJ,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;IAC5B,CAAC;IACQ,MAAM;QAEX,OAAO,CACH,eAAK,SAAS,EAAE,GAAG,MAAM,CAAC,eAAe,MAAM,aAC3C,eAAM,SAAS,EAAE,MAAM,CAAC,cAAc,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAQ,EACjE,cACI,SAAS,EAAE,MAAM,CAAC,aAAa,EAC/B,GAAG,EAAE,eAAe,EACpB,GAAG,EAAC,MAAM,EACV,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACZ,EACF,gBACI,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,MAAM,CAAC,QAAQ,EAC1B,WAAW,EAAC,UAAU,GACxB,IACA,CACT,CAAC;IACN,CAAC;CACJ"}
+{"version":3,"file":"NSInputString.js","sourceRoot":"","sources":["../../src/components/NSInputString.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,4BAA4B,CAAC;AAChD,OAAO,eAAe,MAAM,wCAAwC,CAAC;AAcrE,MAAM,OAAO,aAAc,SAAQ,KAAK,CAAC,SAAyB;IAE9D,YAAY,KAAa;;QAErB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG;YACT,KAAK,EAAE,MAAA,KAAK,CAAC,YAAY,mCAAI,EAAE;SAClC,CAAC;QACF,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC/C,CAAC;IACD,QAAQ;QAEJ,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;IAC5B,CAAC;IACD,QAAQ,CAAC,KAAa;QAElB,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7B,CAAC;IACO,SAAS,CAAC,CAAsC;QAEpD,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC9B,IAAI,IAAI,CAAC,KAAK,CAAC,SAAS;YACpB,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IAChC,CAAC;IACQ,MAAM;QAEX,OAAO,CACH,eAAK,SAAS,EAAE,GAAG,MAAM,CAAC,eAAe,MAAM,aAC3C,eAAM,SAAS,EAAE,MAAM,CAAC,cAAc,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAQ,EACjE,cACI,SAAS,EAAE,MAAM,CAAC,aAAa,EAC/B,GAAG,EAAE,eAAe,EACpB,GAAG,EAAC,MAAM,EACV,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACZ,EACF,gBACI,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,MAAM,CAAC,QAAQ,EAC1B,WAAW,EAAC,UAAU,GACxB,IACA,CACT,CAAC;IACN,CAAC;CACJ"}

package/dist/components/NSLinkGreen.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+interface IProps {
+    title: string;
+    href: string;
+}
+interface IState {
+    title: string;
+    href: string;
+}
+export declare class NSLinkGreen extends React.Component<IProps, IState> {
+    constructor(props: IProps);
+    setTitle(title: string): void;
+    setHRef(href: string): void;
+    render(): import("react/jsx-runtime").JSX.Element;
+}
+export {};

package/dist/components/NSLinkGreen.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Style from "./NSLinkGreen.module.css";
+import React from "react";
+import { Link } from "react-router-dom";
+export class NSLinkGreen extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = { title: props.title, href: props.href };
+    }
+    setTitle(title) {
+        this.setState({ title });
+    }
+    setHRef(href) {
+        this.setState({ href });
+    }
+    render() {
+        return (_jsx("div", { className: Style.ns_link_green, children: _jsx(Link, { className: "text-white text-decoration-none", to: this.state.href, children: this.state.title }) }));
+    }
+}
+//# sourceMappingURL=NSLinkGreen.js.map

package/dist/components/NSLinkGreen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NSLinkGreen.js","sourceRoot":"","sources":["../../src/components/NSLinkGreen.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,0BAA0B,CAAC;AAC7C,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAcxC,MAAM,OAAO,WAAY,SAAQ,KAAK,CAAC,SAAyB;IAE5D,YAAY,KAAa;QAErB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC;IAC1D,CAAC;IACD,QAAQ,CAAC,KAAa;QAElB,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7B,CAAC;IACD,OAAO,CAAC,IAAY;QAEhB,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;IAC5B,CAAC;IACQ,MAAM;QAEX,OAAO,CACH,cAAK,SAAS,EAAE,KAAK,CAAC,aAAa,YAC/B,KAAC,IAAI,IAAC,SAAS,EAAC,iCAAiC,EAAC,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAQ,GAC9F,CACT,CAAA;IACL,CAAC;CACJ"}

package/dist/components/NSLinkGreen.module.css

@@ -0,0 +1,16 @@
+.ns_link_green {
+    display: flex;
+    border-radius: 8px;
+    background-color: #06D182;
+    color: #ffffff;
+    border: 0;
+    box-shadow: inset 0 -4px 4px 0px rgb(0 0 0 / 25%);
+    font-size: 16px;
+    text-decoration: none;
+    width: 128px;
+    height: 48px;
+    text-align: center;
+    align-items: center;
+    justify-content: center;
+    font-weight: 400;
+}

package/dist/components/NSLinkRed.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+interface IProps {
+    title: string;
+    href: string;
+}
+interface IState {
+    title: string;
+    href: string;
+}
+export declare class NSLinkRed extends React.Component<IProps, IState> {
+    constructor(props: IProps);
+    setTitle(title: string): void;
+    setHRef(href: string): void;
+    render(): import("react/jsx-runtime").JSX.Element;
+}
+export {};

package/dist/components/NSLinkRed.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Style from "./NSLinkRed.module.css";
+import React from "react";
+import { Link } from "react-router-dom";
+export class NSLinkRed extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = { title: props.title, href: props.href };
+    }
+    setTitle(title) {
+        this.setState({ title });
+    }
+    setHRef(href) {
+        this.setState({ href });
+    }
+    render() {
+        return _jsx("div", { className: Style.ns_link_red, children: _jsx(Link, { className: "text-white text-decoration-none", to: this.state.href, children: this.state.title }) });
+    }
+}
+//# sourceMappingURL=NSLinkRed.js.map

package/dist/components/NSLinkRed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NSLinkRed.js","sourceRoot":"","sources":["../../src/components/NSLinkRed.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,wBAAwB,CAAC;AAC3C,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAcxC,MAAM,OAAO,SAAU,SAAQ,KAAK,CAAC,SAAyB;IAE1D,YAAY,KAAa;QAErB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC;IAC1D,CAAC;IACD,QAAQ,CAAC,KAAa;QAElB,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7B,CAAC;IACD,OAAO,CAAC,IAAY;QAEhB,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;IAC5B,CAAC;IACQ,MAAM;QAEX,OAAO,cAAK,SAAS,EAAE,KAAK,CAAC,WAAW,YACpC,KAAC,IAAI,IAAC,SAAS,EAAC,iCAAiC,EAAC,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAQ,GAC9F,CAAA;IACV,CAAC;CACJ"}

package/dist/components/NSLinkRed.module.css

@@ -0,0 +1,16 @@
+.ns_link_red {
+    display: flex;
+    border-radius: 8px;
+    background-color: rgb(265, 63, 63, 1);
+    color: #ffffff;
+    border: 0;
+    box-shadow: inset 0 -4px 4px 0px rgb(0 0 0 / 25%);
+    font-size: 16px;
+    text-decoration: none;
+    width: 128px;
+    height: 48px;
+    text-align: center;
+    align-items: center;
+    justify-content: center;
+    font-weight: 400;
+}

package/dist/components/NSTable.d.ts

@@ -0,0 +1,27 @@
+import "./SOPProjectListTable.modules.css";
+import { Component } from 'react';
+interface IProps<RowType> {
+    columns: {
+        [key: string]: string;
+    };
+    rows: RowType[];
+    getRowKey: (row: any, rowIndex: number) => string;
+    getColumnAttributes: (column: string, columnIndex: number) => {
+        [key: string]: string;
+    };
+    getCell: (row: any, column: string, rowIndex: number, columnIndex: number) => any;
+}
+interface IState<RowType> {
+    columns: {
+        [key: string]: string;
+    };
+    rows: RowType[];
+}
+export declare class NSTable<RowType> extends Component<IProps<RowType>, IState<RowType>> {
+    constructor(props: IProps<RowType>);
+    setColumns(columns: {
+        [key: string]: string;
+    }): void;
+    render(): import("react/jsx-runtime").JSX.Element;
+}
+export {};

package/dist/components/NSTable.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import "./SOPProjectListTable.modules.css";
+import { Component } from 'react';
+export class NSTable extends Component {
+    constructor(props) {
+        super(props);
+        this.state = { columns: props.columns, rows: props.rows };
+    }
+    setColumns(columns) {
+        this.setState({ columns });
+    }
+    render() {
+        let column_keys = Object.keys(this.state.columns);
+        return (_jsx("div", { className: "project_list_container", children: _jsxs("table", { className: "table", children: [_jsx("thead", { className: "thead", children: _jsx("tr", { children: column_keys.map(column_key => _jsx("th", { scope: "col", children: this.state.columns[column_key] }, column_key)) }) }), _jsx("tbody", { className: "tbody", children: this.state.rows.map((row, rowIndex) => _jsx("tr", { children: column_keys.map((column, columnIndex) => (_jsx("td", Object.assign({}, this.props.getColumnAttributes(column, columnIndex), { children: this.props.getCell(row, column, rowIndex, columnIndex) })))) }, this.props.getRowKey(row, rowIndex))) })] }) }));
+    }
+}
+//# sourceMappingURL=NSTable.js.map

package/dist/components/NSTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NSTable.js","sourceRoot":"","sources":["../../src/components/NSTable.tsx"],"names":[],"mappings":";AAAA,OAAO,mCAAmC,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAiBlC,MAAM,OAAO,OAAiB,SAAQ,SAA2C;IAE7E,YAAY,KAAsB;QAE9B,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC;IAC9D,CAAC;IACD,UAAU,CAAC,OAAkC;QAEzC,IAAI,CAAC,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;IAC/B,CAAC;IACQ,MAAM;QAEX,IAAI,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAClD,OAAO,CACH,cAAK,SAAS,EAAC,wBAAwB,YACnC,iBAAO,SAAS,EAAC,OAAO,aACpB,gBAAO,SAAS,EAAC,OAAO,YACpB,uBACK,WAAW,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC,aAAqB,KAAK,EAAC,KAAK,YAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,IAAvD,UAAU,CAAmD,CAAC,GACrG,GACD,EACR,gBAAO,SAAS,EAAC,OAAO,YAEhB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,QAAQ,EAAE,EAAE,CAClC,uBAEQ,WAAW,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,WAAW,EAAE,EAAE,CAAC,CACrC,6BAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,MAAM,EAAE,WAAW,CAAC,cACtD,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,CAAC,IACtD,CACR,CAAC,IAND,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE,QAAQ,CAAC,CAQvC,CAAC,GAET,IACL,GACL,CACV,CAAA;IACL,CAAC;CACJ"}

package/dist/components/NSTable.modules.css

@@ -0,0 +1,77 @@
+.thead th {
+    background-color: rgb(0, 0, 0, 0.3);
+    color: rgba(255, 255, 255, 1);
+    border: none;
+}
+
+.tbody th {
+    background-color: rgb(0, 0, 0, 0.3);
+    color: rgba(255, 255, 255, 1);
+    border: none;
+}
+
+.tbody td {
+    background-color: rgb(0, 0, 0, 0.3);
+    color: rgba(255, 255, 255, 1);
+    border: none;
+}
+
+.project_list_container {
+    border: none;
+    text-align: left;
+}
+
+@media only screen and (max-width:600px) {
+    .project_list_container {
+        overflow: scroll;
+    }
+}
+
+/* table-satus */
+.inqueue_status {
+    color: white;
+    background-color: rgba(255, 148, 50, 1);
+    font-size: 12px;
+    width: 96px;
+    height: 24px;
+    border-radius: 24px;
+    border: none;
+    text-align: center;
+    padding-top: 2px;
+}
+
+.reserving_status {
+    color: white;
+    background-color: rgba(255, 79, 79, 1);
+    font-size: 12px;
+    width: 96px;
+    height: 24px;
+    border-radius: 24px;
+    border: none;
+    text-align: center;
+    padding-top: 2px;
+}
+
+.done-status {
+    color: white;
+    background-color: rgba(6, 209, 130, 1);
+    font-size: 12px;
+    width: 96px;
+    height: 24px;
+    border-radius: 24px;
+    border: none;
+    text-align: center;
+    padding-top: 2px;
+}
+
+.inprogress_status {
+    color: white;
+    background-color: rgba(230, 208, 19, 1);
+    font-size: 12px;
+    width: 96px;
+    height: 24px;
+    border-radius: 24px;
+    border: none;
+    text-align: center;
+    padding-top: 2px;
+}

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":";AAAA,OAAO,QAAQ,MAAM,kBAAkB,CAAC;AACxC,OAAO,aAAa,CAAC;AACrB,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,MAAM,IAAI,GAAG,QAAQ,CAAC,UAAU,CAC9B,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAgB,CAC/C,CAAC;AACF,IAAI,CAAC,MAAM,CAAC,KAAC,GAAG,KAAG,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":";AAAA,OAAO,QAAQ,MAAM,kBAAkB,CAAC;AACxC,OAAO,aAAa,CAAC;AACrB,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,MAAM,IAAI,GAAG,QAAQ,CAAC,UAAU,CAC5B,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAgB,CACjD,CAAC;AACF,IAAI,CAAC,MAAM,CAAC,KAAC,GAAG,KAAG,CAAC,CAAC"}

package/dist/main.d.ts

@@ -15,3 +15,6 @@ export * from "./components/NSInputString";
 export * from "./components/NSInputText";
 export * from "./components/NSInputTime";
 export * from "./components/NSSelectBox";
+export * from "./components/NSLinkGreen";
+export * from "./components/NSLinkRed";
+export * from "./components/NSTable";

package/dist/main.js

@@ -15,4 +15,7 @@ export * from "./components/NSInputString";
 export * from "./components/NSInputText";
 export * from "./components/NSInputTime";
 export * from "./components/NSSelectBox";
+export * from "./components/NSLinkGreen";
+export * from "./components/NSLinkRed";
+export * from "./components/NSTable";
 //# sourceMappingURL=main.js.map

package/dist/main.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC"}
+{"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC"}

package/package.json

@@ -1,51 +1,53 @@
 {
-  "name": "namirasoft-site-react",
-  "version": "1.2.7",
-  "main": "./dist/main.js",
-  "types": "./dist/main.d.ts",
-  "dependencies": {
-    "@types/node": "^20.10.6",
-    "@types/react": "^18.2.46",
-    "@types/react-dom": "^18.2.18",
-    "antd": "^5.12.5",
-    "bootstrap": "^5.3.2",
-    "namirasoft-api-link": "^1.2.3",
-    "namirasoft-core": "^1.2.4",
-    "path-browserify": "^1.0.1",
-    "react": "^18.2.0",
-    "react-app-rewired": "^2.2.1",
-    "react-bootstrap": "^2.9.2",
-    "react-dom": "^18.2.0",
-    "react-phone-input-2": "^2.15.1",
-    "react-phone-number-input": "^3.3.8",
-    "react-scripts": "5.0.1"
-  },
-  "scripts": {
-    "start": "react-app-rewired start",
-    "build": "npm run copy",
-    "test": "react-app-rewired test",
-    "eject": "react-app-rewired eject",
-    "copy": "copyfiles -u 1 src/**/*.html src/**/*.css src/**/*.svg src/**/*.png src/**/*.jpg dist/"
-  },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
-  },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "devDependencies": {
-    "copyfiles": "^2.4.1"
-  }
+    "name": "namirasoft-site-react",
+    "version": "1.2.9",
+    "main": "./dist/main.js",
+    "types": "./dist/main.d.ts",
+    "dependencies": {
+        "@types/node": "^20.11.0",
+        "@types/react": "^18.2.47",
+        "@types/react-dom": "^18.2.18",
+        "antd": "^5.13.0",
+        "bootstrap": "^5.3.2",
+        "link-react": "^3.0.0",
+        "namirasoft-api-link": "^1.2.3",
+        "namirasoft-core": "^1.2.5",
+        "path-browserify": "^1.0.1",
+        "react": "^18.2.0",
+        "react-app-rewired": "^2.2.1",
+        "react-bootstrap": "^2.9.2",
+        "react-dom": "^18.2.0",
+        "react-phone-input-2": "^2.15.1",
+        "react-phone-number-input": "^3.3.9",
+        "react-router-dom": "^6.21.2",
+        "react-scripts": "5.0.1"
+    },
+    "scripts": {
+        "start": "react-app-rewired start",
+        "build": "npm run copy",
+        "test": "react-app-rewired test",
+        "eject": "react-app-rewired eject",
+        "copy": "copyfiles -u 1 src/**/*.html src/**/*.css src/**/*.svg src/**/*.png src/**/*.jpg dist/"
+    },
+    "eslintConfig": {
+        "extends": [
+            "react-app",
+            "react-app/jest"
+        ]
+    },
+    "browserslist": {
+        "production": [
+            ">0.2%",
+            "not dead",
+            "not op_mini all"
+        ],
+        "development": [
+            "last 1 chrome version",
+            "last 1 firefox version",
+            "last 1 safari version"
+        ]
+    },
+    "devDependencies": {
+        "copyfiles": "^2.4.1"
+    }
 }

package/src/App.css

@@ -1,2 +0,0 @@
-
-

package/src/App.tsx

@@ -17,6 +17,8 @@ import { NSInputPhone } from './components/NSInputPhone';
 import { NSButtonGreen } from './components/NSButtonGreen';
 import { NSButtonRed } from './components/NSButtonRed';
 import { NSSelectBox } from './components/NSSelectBox';
+import { NSLinkGreen } from './components/NSLinkGreen';
+import { NSLinkRed } from './components/NSLinkRed';
 import type { SelectProps } from 'antd';
 
 export function App()
@@ -63,6 +65,8 @@ export function App()
                 <NSSelectBox title="t" options={options} />
                 <NSButtonGreen title='Save' onClick={() => { }} />
                 <NSButtonRed title='Delete' onClick={() => { }} />
+                <NSLinkGreen title="Add +" href="/" />
+                <NSLinkRed title="Delete" href="/" />
             </div>
             <NSFooter scope='test' name='test' />
         </div>

package/src/components/NSButtonGreen.tsx

@@ -1,15 +1,30 @@
 import React from "react";
 import Style from "./NSButtonGreen.module.css";
 
-interface IProps {
+interface IProps
+{
+    title: string;
+    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}
+
+interface IState
+{
     title: string;
-    onClick: () => void;
 }
-interface IState { }
 
 export class NSButtonGreen extends React.Component<IProps, IState>
 {
-    override render() {
-        return <button onClick={this.props.onClick} className={Style.ns_button_green}>{this.props.title}</button>;
+    constructor(props: IProps)
+    {
+        super(props);
+        this.state = { title: props.title };
+    }
+    setTitle(title: string)
+    {
+        this.setState({ title });
+    }
+    override render()
+    {
+        return <button onClick={e => this.props.onClick(e)} className={Style.ns_button_green}>{this.state.title}</button>;
     }
 }

package/src/components/NSButtonRed.tsx

@@ -1,15 +1,32 @@
 import React from "react";
 import Style from "./NSButtonRed.module.css";
 
-interface IProps {
+interface IProps
+{
+    title: string;
+    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}
+
+interface IState
+{
     title: string;
-    onClick: () => void;
 }
+
 interface IState { }
 
 export class NSButtonRed extends React.Component<IProps, IState>
 {
-    override render() {
-        return <button onClick={this.props.onClick} className={Style.ns_button_red}>{this.props.title}</button>;
+    constructor(props: IProps)
+    {
+        super(props);
+        this.state = { title: props.title };
+    }
+    setTitle(title: string)
+    {
+        this.setState({ title });
+    }
+    override render()
+    {
+        return <button onClick={e => this.props.onClick(e)} className={Style.ns_button_red}>{this.state.title}</button>;
     }
 }

package/src/components/NSFooter.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-// import Namira from '../assets/images/namira.svg';
 import Styles from "./NSFooter.module.css";
 import { NamirasoftAPILinkServer, FilterLinkRow } from 'namirasoft-api-link';
 
@@ -15,7 +14,8 @@ interface IState
     selected: FilterLinkRow | null;
 }
 
-export class NSFooter extends React.Component<IProps, IState> {
+export class NSFooter extends React.Component<IProps, IState>
+{
     constructor(props: IProps)
     {
         super(props);
@@ -37,7 +37,7 @@ export class NSFooter extends React.Component<IProps, IState> {
     }
     private hasChild(id: number): boolean
     {
-        return this.state.filters.filter(f => f.parent_id === id).length > 0;
+        return this.state.filters.filter(f => f.parent_id == id).length > 0;
     }
     override render()
     {
@@ -82,7 +82,7 @@ export class NSFooter extends React.Component<IProps, IState> {
     }
     private render_menu(level: number, parent_id: number | null)
     {
-        let fs: FilterLinkRow[] = this.state.filters?.filter(f => f.parent_id === parent_id);
+        let fs: FilterLinkRow[] = this.state.filters?.filter(f => f.parent_id == parent_id);
         return (
             <>
                 {(fs?.map(f => this.render_menuItem(level, f)))}

package/src/components/NSInputFloat.tsx

@@ -54,10 +54,7 @@ export class NSInputFloat extends React.Component<IProps, IState> {
                     className={Styles.ns_input}
                     placeholder="1.2"
                 />
-
             </div>
         );
     }
-}
-
-
+}

package/src/components/NSInputString.tsx

@@ -5,6 +5,8 @@ import IconInputString from '../assets/images/icon-input-string.svg';
 interface IProps
 {
     title: string;
+    defaultValue?: string;
+    onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
 }
 
 interface IState
@@ -12,28 +14,31 @@ interface IState
     value: string;
 }
 
-export class NSInputString extends React.Component<IProps, IState> {
+export class NSInputString extends React.Component<IProps, IState>
+{
     constructor(props: IProps)
     {
         super(props);
         this.state = {
-            value: "",
+            value: props.defaultValue ?? "",
         };
-        this.setValue = this.setValue.bind(this);
         this.getValue = this.getValue.bind(this);
-        this.setDefaultValue = this.setDefaultValue.bind(this);
+        this.setValue = this.setValue.bind(this);
+        this.onChanged = this.onChanged.bind(this);
     }
-    setValue(e: React.ChangeEvent<HTMLInputElement>): void
+    getValue(): string
     {
-        this.setState({ value: e.target.value });
+        return this.state.value;
     }
-    setDefaultValue(value: string): void
+    setValue(value: string): void
     {
         this.setState({ value });
     }
-    getValue(): string
+    private onChanged(e: React.ChangeEvent<HTMLInputElement>): void
     {
-        return this.state.value;
+        this.setValue(e.target.value);
+        if (this.props.onChanged)
+            this.props.onChanged(e);
     }
     override render()
     {
@@ -49,7 +54,7 @@ export class NSInputString extends React.Component<IProps, IState> {
                 />
                 <input
                     value={this.state.value}
-                    onChange={this.setValue}
+                    onChange={this.onChanged}
                     type="text"
                     className={Styles.ns_input}
                     placeholder="12AB34cf"
@@ -57,6 +62,4 @@ export class NSInputString extends React.Component<IProps, IState> {
             </div>
         );
     }
-}
-
-
+}

package/src/components/NSLinkGreen.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+interface IProps {
+    title: string;
+    link: () => void;
+}
+interface IState {
+}
+export declare class NSLinkGreen extends React.Component<IProps, IState> {
+    render(): import("react/jsx-runtime").JSX.Element;
+}
+export {};

package/src/components/NSLinkGreen.module.css

@@ -0,0 +1,16 @@
+.ns_link_green {
+    display: flex;
+    border-radius: 8px;
+    background-color: #06D182;
+    color: #ffffff;
+    border: 0;
+    box-shadow: inset 0 -4px 4px 0px rgb(0 0 0 / 25%);
+    font-size: 16px;
+    text-decoration: none;
+    width: 128px;
+    height: 48px;
+    text-align: center;
+    align-items: center;
+    justify-content: center;
+    font-weight: 400;
+}

package/src/components/NSLinkGreen.tsx

@@ -0,0 +1,40 @@
+import Style from "./NSLinkGreen.module.css";
+import React from "react";
+import { Link } from "react-router-dom";
+
+interface IProps
+{
+    title: string;
+    href: string;
+}
+
+interface IState
+{
+    title: string;
+    href: string;
+}
+
+export class NSLinkGreen extends React.Component<IProps, IState>
+{
+    constructor(props: IProps)
+    {
+        super(props);
+        this.state = { title: props.title, href: props.href };
+    }
+    setTitle(title: string)
+    {
+        this.setState({ title });
+    }
+    setHRef(href: string)
+    {
+        this.setState({ href });
+    }
+    override render()
+    {
+        return (
+            <div className={Style.ns_link_green}>
+                <Link className="text-white text-decoration-none" to={this.state.href}>{this.state.title}</Link>
+            </div>
+        )
+    }
+}

package/src/components/NSLinkRed.module.css

@@ -0,0 +1,16 @@
+.ns_link_red {
+    display: flex;
+    border-radius: 8px;
+    background-color: rgb(265, 63, 63, 1);
+    color: #ffffff;
+    border: 0;
+    box-shadow: inset 0 -4px 4px 0px rgb(0 0 0 / 25%);
+    font-size: 16px;
+    text-decoration: none;
+    width: 128px;
+    height: 48px;
+    text-align: center;
+    align-items: center;
+    justify-content: center;
+    font-weight: 400;
+}

package/src/components/NSLinkRed.tsx

@@ -0,0 +1,38 @@
+import Style from "./NSLinkRed.module.css";
+import React from "react";
+import { Link } from "react-router-dom";
+
+interface IProps
+{
+    title: string;
+    href: string;
+}
+
+interface IState
+{
+    title: string;
+    href: string;
+}
+
+export class NSLinkRed extends React.Component<IProps, IState>
+{
+    constructor(props: IProps)
+    {
+        super(props);
+        this.state = { title: props.title, href: props.href };
+    }
+    setTitle(title: string)
+    {
+        this.setState({ title });
+    }
+    setHRef(href: string)
+    {
+        this.setState({ href });
+    }
+    override render()
+    {
+        return <div className={Style.ns_link_red}>
+            <Link className="text-white text-decoration-none" to={this.state.href}>{this.state.title}</Link>
+        </div>
+    }
+}

package/src/components/NSTable.modules.css

@@ -0,0 +1,77 @@
+.thead th {
+    background-color: rgb(0, 0, 0, 0.3);
+    color: rgba(255, 255, 255, 1);
+    border: none;
+}
+
+.tbody th {
+    background-color: rgb(0, 0, 0, 0.3);
+    color: rgba(255, 255, 255, 1);
+    border: none;
+}
+
+.tbody td {
+    background-color: rgb(0, 0, 0, 0.3);
+    color: rgba(255, 255, 255, 1);
+    border: none;
+}
+
+.project_list_container {
+    border: none;
+    text-align: left;
+}
+
+@media only screen and (max-width:600px) {
+    .project_list_container {
+        overflow: scroll;
+    }
+}
+
+/* table-satus */
+.inqueue_status {
+    color: white;
+    background-color: rgba(255, 148, 50, 1);
+    font-size: 12px;
+    width: 96px;
+    height: 24px;
+    border-radius: 24px;
+    border: none;
+    text-align: center;
+    padding-top: 2px;
+}
+
+.reserving_status {
+    color: white;
+    background-color: rgba(255, 79, 79, 1);
+    font-size: 12px;
+    width: 96px;
+    height: 24px;
+    border-radius: 24px;
+    border: none;
+    text-align: center;
+    padding-top: 2px;
+}
+
+.done-status {
+    color: white;
+    background-color: rgba(6, 209, 130, 1);
+    font-size: 12px;
+    width: 96px;
+    height: 24px;
+    border-radius: 24px;
+    border: none;
+    text-align: center;
+    padding-top: 2px;
+}
+
+.inprogress_status {
+    color: white;
+    background-color: rgba(230, 208, 19, 1);
+    font-size: 12px;
+    width: 96px;
+    height: 24px;
+    border-radius: 24px;
+    border: none;
+    text-align: center;
+    padding-top: 2px;
+}

package/src/components/NSTable.tsx

@@ -0,0 +1,59 @@
+import "./SOPProjectListTable.modules.css";
+import { Component } from 'react';
+
+interface IProps<RowType>
+{
+    columns: { [key: string]: string };
+    rows: RowType[];
+    getRowKey: (row: any, rowIndex: number) => string;
+    getColumnAttributes: (column: string, columnIndex: number) => { [key: string]: string };
+    getCell: (row: any, column: string, rowIndex: number, columnIndex: number) => any;
+}
+
+interface IState<RowType>
+{
+    columns: { [key: string]: string };
+    rows: RowType[];
+}
+
+export class NSTable<RowType> extends Component<IProps<RowType>, IState<RowType>>
+{
+    constructor(props: IProps<RowType>)
+    {
+        super(props);
+        this.state = { columns: props.columns, rows: props.rows };
+    }
+    setColumns(columns: { [key: string]: string })
+    {
+        this.setState({ columns });
+    }
+    override render()
+    {
+        let column_keys = Object.keys(this.state.columns);
+        return (
+            <div className="project_list_container">
+                <table className="table">
+                    <thead className="thead">
+                        <tr>
+                            {column_keys.map(column_key => <th key={column_key} scope="col">{this.state.columns[column_key]}</th>)}
+                        </tr>
+                    </thead>
+                    <tbody className="tbody">
+                        {
+                            this.state.rows.map((row, rowIndex) =>
+                                <tr key={this.props.getRowKey(row, rowIndex)}>
+                                    {
+                                        column_keys.map((column, columnIndex) => (
+                                            <td {...this.props.getColumnAttributes(column, columnIndex)}>
+                                                {this.props.getCell(row, column, rowIndex, columnIndex)}
+                                            </td>
+                                        ))
+                                    }
+                                </tr>)
+                        }
+                    </tbody >
+                </table>
+            </div >
+        )
+    }
+}

package/src/index.css

@@ -1,7 +1,7 @@
 body {
-  margin: 0;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  background-color: #ccc !important;
-  background-image: url(./assets/images/background.svg);
-}
+    margin: 0;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    background-color: #ccc !important;
+    background-image: url(./assets/images/background.svg);
+}

package/src/index.tsx

@@ -3,6 +3,6 @@ import './index.css';
 import { App } from './App';
 
 const root = ReactDOM.createRoot(
-  document.getElementById('root') as HTMLElement
+    document.getElementById('root') as HTMLElement
 );
 root.render(<App />);

package/src/main.ts

@@ -14,4 +14,7 @@ export * from "./components/NSInputSearch";
 export * from "./components/NSInputString";
 export * from "./components/NSInputText";
 export * from "./components/NSInputTime";
-export * from "./components/NSSelectBox";
+export * from "./components/NSSelectBox";
+export * from "./components/NSLinkGreen";
+export * from "./components/NSLinkRed";
+export * from "./components/NSTable";