namirasoft-site-react 1.2.45 → 1.2.47

package/dist/App.js

@@ -3,7 +3,8 @@ import './App.css';
 import 'bootstrap/dist/css/bootstrap.min.css';
 import { NSButtonRed } from './components/NSButtonRed';
 import { NSLayout, NSPagination } from './main';
+import { NSBoxSection } from './components/NSBoxSection';
 export function App() {
-    return (_jsx("div", Object.assign({ className: "App" }, { children: _jsxs(NSLayout, Object.assign({ scope: 'Namirasoft SOP console', logo: '' }, { children: [_jsxs("div", Object.assign({ className: 'my-4 container' }, { children: [_jsx(NSButtonRed, { title: 'Delete', onClick: () => { } }), _jsx(NSPagination, { page: 1, size: 25 })] })), "asdasd"] })) })));
+    return (_jsx("div", Object.assign({ className: "App" }, { children: _jsxs(NSLayout, Object.assign({ scope: 'Namirasoft SOP console', logo: '' }, { children: [_jsxs("div", Object.assign({ className: 'my-4 container' }, { children: [_jsx(NSBoxSection, { image: 'src/assets/images/position-down-vector.png', description: "", detail: '#' }), _jsx(NSButtonRed, { title: 'Delete', onClick: () => { } }), _jsx(NSPagination, { page: 1, size: 25 })] })), "asdasd"] })) })));
 }
 //# sourceMappingURL=App.js.map

package/dist/App.js.map

@@ -1 +1 @@
-{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":";AAAA,OAAO,WAAW,CAAC;AACnB,OAAO,sCAAsC,CAAC;AAc9C,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAGvD,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAEhD,MAAM,UAAU,GAAG;IAyBf,OAAO,CACH,4BAAK,SAAS,EAAC,KAAK,gBAChB,MAAC,QAAQ,kBAAC,KAAK,EAAC,wBAAwB,EAAC,IAAI,EAAC,EAAE,iBAC5C,6BAAK,SAAS,EAAC,gBAAgB,iBAe3B,KAAC,WAAW,IAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,GAAG,CAAC,GAAI,EAClD,KAAC,YAAY,IAAC,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,GAAI,KACjC,eAEC,IACT,CACT,CAAC;AACN,CAAC"}
+{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":";AAAA,OAAO,WAAW,CAAC;AACnB,OAAO,sCAAsC,CAAC;AAc9C,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAGvD,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAEzD,MAAM,UAAU,GAAG;IAyBf,OAAO,CACH,4BAAK,SAAS,EAAC,KAAK,gBAChB,MAAC,QAAQ,kBAAC,KAAK,EAAC,wBAAwB,EAAC,IAAI,EAAC,EAAE,iBAC5C,6BAAK,SAAS,EAAC,gBAAgB,iBAC3B,KAAC,YAAY,IAAC,KAAK,EAAC,4CAA4C,EAAC,WAAW,EAAC,EAAE,EAAC,MAAM,EAAC,GAAG,GAAG,EAe7F,KAAC,WAAW,IAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,GAAG,CAAC,GAAI,EAClD,KAAC,YAAY,IAAC,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,GAAI,KACjC,eAEC,IACT,CACT,CAAC;AACN,CAAC"}

package/dist/components/NSBoxSection.d.ts

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

package/dist/components/NSBoxSection.js

@@ -0,0 +1,20 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Style from "./NSBoxSection.module.css";
+import React from "react";
+export class NSBoxSection extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = { detail: props.detail, image: props.image, description: props.description };
+    }
+    setTitle(description) {
+        this.setState({ description });
+    }
+    setHRef(detail) {
+        this.setState({ detail });
+    }
+    render() {
+        return (_jsxs("div", Object.assign({ className: Style.position__layout }, { children: [_jsx("img", { className: "rounded", src: this.state.image, alt: "wordpress", width: 326, height: 220 }), _jsx("h3", { children: this.state.description }), _jsxs("h4", { children: [this.state.detail, _jsx("img", { className: "mx-2", src: '/assets/images/position-down-vector.png', width: 16, height: 16 })] })] })));
+    }
+}
+//# sourceMappingURL=NSBoxSection.js.map

package/dist/components/NSBoxSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NSBoxSection.js","sourceRoot":"","sources":["../../src/components/NSBoxSection.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,KAAK,MAAM,2BAA2B,CAAC;AAC9C,OAAO,KAAK,MAAM,OAAO,CAAC;AAgB1B,MAAM,OAAO,YAAa,SAAQ,KAAK,CAAC,SAAyB;IAE7D,YAAY,KAAa;QAErB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC;IAC9F,CAAC;IACD,QAAQ,CAAC,WAAmB;QAExB,IAAI,CAAC,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC,CAAC;IACnC,CAAC;IACD,OAAO,CAAC,MAAc;QAElB,IAAI,CAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC;IAC9B,CAAC;IACQ,MAAM;QAEX,OAAO,CACH,6BAAK,SAAS,EAAE,KAAK,CAAC,gBAAgB,iBAClC,cAAK,SAAS,EAAC,SAAS,EAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,GAAG,EAAC,WAAW,EAAC,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,GAAQ,EAC/F,uBAAK,IAAI,CAAC,KAAK,CAAC,WAAW,GAAM,EACjC,yBAAK,IAAI,CAAC,KAAK,CAAC,MAAM,EAAC,cAAK,SAAS,EAAC,MAAM,EAAC,GAAG,EAAC,yCAAyC,EAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAQ,IAAK,KAC1H,CACV,CAAA;IACL,CAAC;CACJ"}

package/dist/components/NSBoxSection.module.css

@@ -0,0 +1,26 @@
+.position__layout {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    background-color: rgba(20, 27, 92, 0.3);
+    width: 358px;
+    height: 349px;
+    border-radius: 8px;
+    text-align: center;
+    gap: 16px;
+    margin: 12px 0;
+}
+
+.position__layout h3 {
+    color: rgba(20, 27, 92, 1);
+    font-weight: 700;
+    font-size: 24px;
+}
+
+.position__layout h4 {
+    color: rgba(20, 27, 92, 1);
+    font-weight: 300;
+    font-size: 16px;
+    color: rgba(20, 27, 92, 1)
+}

package/dist/pages/NSLoginPage.js

@@ -12,7 +12,7 @@ export class NSLoginPage extends Component {
             button = _jsx(NSLinkGreen, { title: "Login", href: (_a = this.props.href) !== null && _a !== void 0 ? _a : "" });
         else if (this.props.onClick)
             button = _jsx(NSButtonGreen, { title: "Login", onClick: this.props.onClick });
-        return (_jsx("div", Object.assign({ style: { backgroundImage: this.props.background } }, { children: _jsxs("div", Object.assign({ className: "d-flex flex-column align-items-center justify-content-center", style: { marginTop: "100px" } }, { children: [_jsx("div", Object.assign({ className: "m-auto" }, { children: _jsx("img", { width: 256, height: 256, src: this.props.logo, alt: "logo" }) })), _jsx("div", { children: _jsx("h1", Object.assign({ className: "text-center mb-3" }, { children: this.props.title })) }), _jsx("div", Object.assign({ className: "m-auto" }, { children: button }))] })) })));
+        return (_jsx("div", Object.assign({ style: { backgroundImage: this.props.background, width: "100%", backgroundSize: "cover" } }, { children: _jsxs("div", Object.assign({ className: "d-flex flex-column align-items-center justify-content-center", style: { marginTop: "100px" } }, { children: [_jsx("div", Object.assign({ className: "m-auto" }, { children: _jsx("img", { width: 256, height: 256, src: this.props.logo, alt: "logo" }) })), _jsx("div", { children: _jsx("h1", Object.assign({ className: "text-center mb-3" }, { children: this.props.title })) }), _jsx("div", Object.assign({ className: "m-auto" }, { children: button }))] })) })));
     }
 }
 //# sourceMappingURL=NSLoginPage.js.map

package/dist/pages/NSLoginPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"NSLoginPage.js","sourceRoot":"","sources":["../../src/pages/NSLoginPage.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAWtC,MAAM,OAAO,WAAY,SAAQ,SAAiB;IAErC,MAAM;;QAEX,IAAI,MAAM,GAAG,mBAAK,CAAC;QACnB,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI;YACf,MAAM,GAAG,KAAC,WAAW,IAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAE,MAAA,IAAI,CAAC,KAAK,CAAC,IAAI,mCAAI,EAAE,GAAI,CAAC;aACnE,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO;YACvB,MAAM,GAAG,KAAC,aAAa,IAAC,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAI,CAAC;QAC1E,OAAO,CACH,4BAAK,KAAK,EAAE,EAAE,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,gBAClD,6BAAK,SAAS,EAAC,8DAA8D,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,iBACvG,4BAAK,SAAS,EAAC,QAAQ,gBACnB,cAAK,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,GAAG,EAAC,MAAM,GAAO,IACnE,EACN,wBAAK,2BAAI,SAAS,EAAC,kBAAkB,gBAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IAAM,GAAM,EACnE,4BAAK,SAAS,EAAC,QAAQ,gBAClB,MAAM,IACL,KACJ,IACJ,CACT,CAAC;IACN,CAAC;CACJ"}
+{"version":3,"file":"NSLoginPage.js","sourceRoot":"","sources":["../../src/pages/NSLoginPage.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAWtC,MAAM,OAAO,WAAY,SAAQ,SAAiB;IAErC,MAAM;;QAEX,IAAI,MAAM,GAAG,mBAAK,CAAC;QACnB,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI;YACf,MAAM,GAAG,KAAC,WAAW,IAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAE,MAAA,IAAI,CAAC,KAAK,CAAC,IAAI,mCAAI,EAAE,GAAI,CAAC;aACnE,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO;YACvB,MAAM,GAAG,KAAC,aAAa,IAAC,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAI,CAAC;QAC1E,OAAO,CACH,4BAAK,KAAK,EAAE,EAAE,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,cAAc,EAAE,OAAO,EAAE,gBAC1F,6BAAK,SAAS,EAAC,8DAA8D,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,iBACvG,4BAAK,SAAS,EAAC,QAAQ,gBACnB,cAAK,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,GAAG,EAAC,MAAM,GAAO,IACnE,EACN,wBAAK,2BAAI,SAAS,EAAC,kBAAkB,gBAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IAAM,GAAM,EACnE,4BAAK,SAAS,EAAC,QAAQ,gBAClB,MAAM,IACL,KACJ,IACJ,CACT,CAAC;IACN,CAAC;CACJ"}

package/package.json

@@ -1,13 +1,13 @@
 {
     "name": "namirasoft-site-react",
-    "version": "1.2.45",
+    "version": "1.2.47",
     "main": "./dist/main.js",
     "types": "./dist/main.d.ts",
     "dependencies": {
-        "@types/node": "^20.11.20",
-        "@types/react": "^18.2.59",
+        "@types/node": "^20.11.24",
+        "@types/react": "^18.2.61",
         "@types/react-dom": "^18.2.19",
-        "antd": "^5.14.2",
+        "antd": "^5.15.0",
         "bootstrap": "^5.3.3",
         "link-react": "^3.0.0",
         "namirasoft-api-link": "^1.2.3",
@@ -19,7 +19,7 @@
         "react-dom": "^18.2.0",
         "react-phone-input-2": "^2.15.1",
         "react-phone-number-input": "^3.3.9",
-        "react-router-dom": "^6.22.1",
+        "react-router-dom": "^6.22.2",
         "react-scripts": "5.0.1"
     },
     "scripts": {

package/src/App.tsx

@@ -17,6 +17,7 @@ import { NSButtonRed } from './components/NSButtonRed';
 // import { NSSelectBox } from './components/NSSelectBox';
 // import { type SelectProps } from 'antd';
 import { NSLayout, NSPagination } from './main';
+import { NSBoxSection } from './components/NSBoxSection';
 
 export function App()
 {
@@ -47,6 +48,7 @@ export function App()
         <div className="App">
             <NSLayout scope='Namirasoft SOP console' logo=''>
                 <div className='my-4 container'>
+                    <NSBoxSection image='src/assets/images/position-down-vector.png' description="" detail='#' />
                     {/* <NSInputText title='Text' />
                     <NSInputInteger title='Integer' />
                     <NSInputFloat title='Floating Point' />

package/src/components/NSBoxSection.module.css

@@ -0,0 +1,26 @@
+.position__layout {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    background-color: rgba(20, 27, 92, 0.3);
+    width: 358px;
+    height: 349px;
+    border-radius: 8px;
+    text-align: center;
+    gap: 16px;
+    margin: 12px 0;
+}
+
+.position__layout h3 {
+    color: rgba(20, 27, 92, 1);
+    font-weight: 700;
+    font-size: 24px;
+}
+
+.position__layout h4 {
+    color: rgba(20, 27, 92, 1);
+    font-weight: 300;
+    font-size: 16px;
+    color: rgba(20, 27, 92, 1)
+}

package/src/components/NSBoxSection.tsx

@@ -0,0 +1,44 @@
+"use client";
+import Style from "./NSBoxSection.module.css";
+import React from "react";
+
+interface IProps
+{
+    detail: string;
+    image: string;
+    description: string;
+}
+
+interface IState
+{
+    detail: string;
+    image: string;
+    description: string;
+}
+
+export class NSBoxSection extends React.Component<IProps, IState>
+{
+    constructor(props: IProps)
+    {
+        super(props);
+        this.state = { detail: props.detail, image: props.image, description: props.description };
+    }
+    setTitle(description: string)
+    {
+        this.setState({ description });
+    }
+    setHRef(detail: string)
+    {
+        this.setState({ detail });
+    }
+    override render()
+    {
+        return (
+            <div className={Style.position__layout}>
+                <img className="rounded" src={this.state.image} alt="wordpress" width={326} height={220}></img>
+                <h3>{this.state.description}</h3>
+                <h4>{this.state.detail}<img className="mx-2" src='/assets/images/position-down-vector.png' width={16} height={16}></img></h4>
+            </div >
+        )
+    }
+}

package/src/pages/NSLoginPage.tsx

@@ -24,7 +24,7 @@ export class NSLoginPage extends Component<IProps>
         else if (this.props.onClick)
             button = <NSButtonGreen title="Login" onClick={this.props.onClick} />;
         return (
-            <div style={{ backgroundImage: this.props.background }}>
+            <div style={{ backgroundImage: this.props.background, width: "100%", backgroundSize: "cover" }}>
                 <div className="d-flex flex-column align-items-center justify-content-center" style={{ marginTop: "100px" }}>
                     <div className="m-auto">
                         <img width={256} height={256} src={this.props.logo} alt="logo"></img>