namirasoft-site-react 1.3.89 → 1.3.90

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/App.js CHANGED
@@ -1,13 +1,20 @@
1
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
1
+ import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
2
2
  import './App.css';
3
3
  import 'bootstrap/dist/css/bootstrap.min.css';
4
- import { NSFooter, NSHeader, NSTable, NSTabBar } from './main';
4
+ import { NSFooter, NSHeader, NSTable, NSTabPage } from './main';
5
5
  import { useRef } from 'react';
6
6
  export function App() {
7
+ function f(n) {
8
+ console.log(n);
9
+ return n;
10
+ }
11
+ let c1 = () => _jsxs("p", { children: ["Content for Tab ", f(1)] });
12
+ let c2 = () => _jsxs("p", { children: ["Content for Tab ", f(2)] });
13
+ let c3 = () => _jsxs("p", { children: ["Content for Tab ", f(3)] });
7
14
  const tabs = [
8
- { label: 'Information', content: _jsx("p", { children: "Content for Tab 1" }) },
9
- { label: 'Price History', content: _jsx("p", { children: "Content for Tab 2" }) },
10
- { label: 'Price Estimator', content: _jsx("p", { children: "Content for Tab 3" }) }
15
+ { title: 'Information', getContent: c1 },
16
+ { title: 'Price History', getContent: c2 },
17
+ { title: 'Price Estimator', getContent: c3 }
11
18
  ];
12
19
  let columns = {
13
20
  "id": "ID",
@@ -38,6 +45,6 @@ export function App() {
38
45
  return row[column];
39
46
  }
40
47
  let table = useRef(null);
41
- return (_jsxs(_Fragment, { children: [_jsx(NSHeader, { name: 'Header', scope: 'Namira Software Corporation', logo: 'https://static.namirasoft.com/image/namirasoft/site/logo/base.png', account: false, style: { backgroundColor: "transparent !important" } }), _jsx("div", { children: _jsx(NSTable, { ref: table, columns: columns, rows: rows, getCell: getCell, getColumnAttributes: () => { return {}; }, getRowKey: row => row.id.toString() }) }), _jsx(NSTabBar, { tabs: tabs }), _jsx(NSFooter, { name: 'Footer', scope: 'Namira Software Corporation', logo: 'https://static.namirasoft.com/image/namirasoft/site/logo/base.png' })] }));
48
+ return (_jsxs(_Fragment, { children: [_jsx(NSHeader, { name: 'Header', scope: 'Namira Software Corporation', logo: 'https://static.namirasoft.com/image/namirasoft/site/logo/base.png', account: false, style: { backgroundColor: "transparent !important" } }), _jsx("div", { children: _jsx(NSTable, { ref: table, columns: columns, rows: rows, getCell: getCell, getColumnAttributes: () => { return {}; }, getRowKey: row => row.id.toString() }) }), _jsx(NSTabPage, { tabs: tabs }), _jsx(NSFooter, { name: 'Footer', scope: 'Namira Software Corporation', logo: 'https://static.namirasoft.com/image/namirasoft/site/logo/base.png' })] }));
42
49
  }
43
50
  //# sourceMappingURL=App.js.map
package/dist/App.js.map CHANGED
@@ -1 +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,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAC/D,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/B,MAAM,UAAU,GAAG;IAElB,MAAM,IAAI,GAAG;QACZ,EAAE,KAAK,EAAE,aAAa,EAAE,OAAO,EAAE,4CAAwB,EAAE;QAC3D,EAAE,KAAK,EAAE,eAAe,EAAE,OAAO,EAAE,4CAAwB,EAAE;QAC7D,EAAE,KAAK,EAAE,iBAAiB,EAAE,OAAO,EAAE,4CAAwB,EAAE;KAC/D,CAAC;IACF,IAAI,OAAO,GAAG;QACb,IAAI,EAAE,IAAI;QACV,SAAS,EAAE,SAAS;QACpB,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,SAAS;QACpB,MAAM,EAAE,MAAM;QACd,QAAQ,EAAE,QAAQ;KAClB,CAAA;IACD,IAAI,IAAI,GAAG,CAAC;YACX,EAAE,EAAE,CAAC;YACL,OAAO,EAAE,oBAAoB;YAC7B,KAAK,EAAE,OAAO;YACd,OAAO,EAAE,yCAAyC;YAClD,IAAI,EAAE,IAAI;YACV,MAAM,EAAE,SAAS;SACjB;QACD;YACC,EAAE,EAAE,CAAC;YACL,OAAO,EAAE,oBAAoB;YAC7B,KAAK,EAAE,OAAO;YACd,OAAO,EAAE,yCAAyC;YAClD,IAAI,EAAE,IAAI;YACV,MAAM,EAAE,MAAM;SACd;KACA,CAAA;IAUD,SAAS,OAAO,CAAC,GAAQ,EAAE,MAAc;QAExC,OAAQ,GAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,CAAC;IACD,IAAI,KAAK,GAAG,MAAM,CAAe,IAAI,CAAC,CAAC;IACvC,OAAO,CACN,8BACC,KAAC,QAAQ,IACR,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,6BAA6B,EACnC,IAAI,EAAC,mEAAmE,EACxE,OAAO,EAAE,KAAK,EACd,KAAK,EAAE,EAAE,eAAe,EAAE,wBAAwB,EAAE,GACnD,EACF,wBACC,KAAC,OAAO,IACP,GAAG,EAAE,KAAK,EACV,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,mBAAmB,EAAE,GAAG,EAAE,GAAG,OAAO,EAAE,CAAA,CAAC,CAAC,EACxC,SAAS,EAAE,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,QAAQ,EAAE,GAClC,GACG,EACN,KAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,GAAI,EACxB,KAAC,QAAQ,IAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,6BAA6B,EAAC,IAAI,EAAC,mEAAmE,GAAG,IACrI,CACH,CAAC;AACH,CAAC"}
1
+ {"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":";AAAA,OAAO,WAAW,CAAC;AACnB,OAAO,sCAAsC,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/B,MAAM,UAAU,GAAG;IAElB,SAAS,CAAC,CAAC,CAAS;QAEnB,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;QACf,OAAO,CAAC,CAAC;IACV,CAAC;IACD,IAAI,EAAE,GAAG,GAAG,EAAE,CAAC,4CAAoB,CAAC,CAAC,CAAC,CAAC,IAAK,CAAC;IAC7C,IAAI,EAAE,GAAG,GAAG,EAAE,CAAC,4CAAoB,CAAC,CAAC,CAAC,CAAC,IAAK,CAAC;IAC7C,IAAI,EAAE,GAAG,GAAG,EAAE,CAAC,4CAAoB,CAAC,CAAC,CAAC,CAAC,IAAK,CAAC;IAC7C,MAAM,IAAI,GAAG;QACZ,EAAE,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,EAAE,EAAE;QACxC,EAAE,KAAK,EAAE,eAAe,EAAE,UAAU,EAAE,EAAE,EAAE;QAC1C,EAAE,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,EAAE,EAAE;KAC5C,CAAC;IACF,IAAI,OAAO,GAAG;QACb,IAAI,EAAE,IAAI;QACV,SAAS,EAAE,SAAS;QACpB,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,SAAS;QACpB,MAAM,EAAE,MAAM;QACd,QAAQ,EAAE,QAAQ;KAClB,CAAA;IACD,IAAI,IAAI,GAAG,CAAC;YACX,EAAE,EAAE,CAAC;YACL,OAAO,EAAE,oBAAoB;YAC7B,KAAK,EAAE,OAAO;YACd,OAAO,EAAE,yCAAyC;YAClD,IAAI,EAAE,IAAI;YACV,MAAM,EAAE,SAAS;SACjB;QACD;YACC,EAAE,EAAE,CAAC;YACL,OAAO,EAAE,oBAAoB;YAC7B,KAAK,EAAE,OAAO;YACd,OAAO,EAAE,yCAAyC;YAClD,IAAI,EAAE,IAAI;YACV,MAAM,EAAE,MAAM;SACd;KACA,CAAA;IAUD,SAAS,OAAO,CAAC,GAAQ,EAAE,MAAc;QAExC,OAAQ,GAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,CAAC;IACD,IAAI,KAAK,GAAG,MAAM,CAAe,IAAI,CAAC,CAAC;IACvC,OAAO,CACN,8BACC,KAAC,QAAQ,IACR,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,6BAA6B,EACnC,IAAI,EAAC,mEAAmE,EACxE,OAAO,EAAE,KAAK,EACd,KAAK,EAAE,EAAE,eAAe,EAAE,wBAAwB,EAAE,GACnD,EACF,wBACC,KAAC,OAAO,IACP,GAAG,EAAE,KAAK,EACV,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,mBAAmB,EAAE,GAAG,EAAE,GAAG,OAAO,EAAE,CAAA,CAAC,CAAC,EACxC,SAAS,EAAE,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,QAAQ,EAAE,GAClC,GACG,EACN,KAAC,SAAS,IAAC,IAAI,EAAE,IAAI,GAAI,EACzB,KAAC,QAAQ,IAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,6BAA6B,EAAC,IAAI,EAAC,mEAAmE,GAAG,IACrI,CACH,CAAC;AACH,CAAC"}
@@ -0,0 +1,13 @@
1
+ /// <reference types="react" />
2
+ import { IBaseComponentProps } from "../props/IBaseComponentProps";
3
+ export interface NSTabPageTab {
4
+ title: string;
5
+ getContent: () => React.ReactNode;
6
+ }
7
+ export interface NSTabPageProps extends IBaseComponentProps {
8
+ tabs: NSTabPageTab[];
9
+ }
10
+ export interface NSTabPageState {
11
+ activeTabIndex: number;
12
+ }
13
+ export declare function NSTabPage(props: NSTabPageProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,9 @@
1
+ "use client";
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import Styles from './NSTabPage.module.css';
4
+ import { useState } from "react";
5
+ export function NSTabPage(props) {
6
+ const [state, setState] = useState({ activeTabIndex: 0 });
7
+ return (_jsxs("div", { className: `container ${Styles.ns_tab_bar}`, children: [_jsx("ul", { children: props.tabs.map((tab, index) => (_jsx("li", { className: state.activeTabIndex === index ? Styles.active : '', onClick: () => setState({ activeTabIndex: index }), children: tab.title }, index))) }), _jsx("div", { className: Styles.ns_tab_content, children: props.tabs[state.activeTabIndex].getContent() })] }));
8
+ }
9
+ //# sourceMappingURL=NSTabPage.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"NSTabPage.js","sourceRoot":"","sources":["../../src/components/NSTabPage.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,MAAM,MAAM,wBAAwB,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAkBjC,MAAM,UAAU,SAAS,CAAC,KAAqB;IAE3C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAiB,EAAE,cAAc,EAAE,CAAC,EAAE,CAAC,CAAC;IAE1E,OAAO,CACH,eAAK,SAAS,EAAE,aAAa,MAAM,CAAC,UAAU,EAAE,aAC5C,uBAEQ,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,CAC3B,aAEI,SAAS,EAAE,KAAK,CAAC,cAAc,KAAK,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAC9D,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,cAAc,EAAE,KAAK,EAAE,CAAC,YAEjD,GAAG,CAAC,KAAK,IAJL,KAAK,CAKT,CACR,CAAC,GAEL,EACL,cAAK,SAAS,EAAE,MAAM,CAAC,cAAc,YAChC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,UAAU,EAAE,GAC5C,IACJ,CACT,CAAC;AACN,CAAC"}
package/dist/main.d.ts CHANGED
@@ -38,7 +38,7 @@ export * from "./components/NSLinkGreen";
38
38
  export * from "./components/NSLinkRed";
39
39
  export * from "./components/NSPagination";
40
40
  export * from "./components/NSTable";
41
- export * from "./components/NSTabBar";
41
+ export * from "./components/NSTabPage";
42
42
  export * from "./components/NSTitle";
43
43
  export * from "./pages/NSLoginPage";
44
44
  export * from "./pages/NSNotFoundPage";
package/dist/main.js CHANGED
@@ -38,7 +38,7 @@ export * from "./components/NSLinkGreen";
38
38
  export * from "./components/NSLinkRed";
39
39
  export * from "./components/NSPagination";
40
40
  export * from "./components/NSTable";
41
- export * from "./components/NSTabBar";
41
+ export * from "./components/NSTabPage";
42
42
  export * from "./components/NSTitle";
43
43
  export * from "./pages/NSLoginPage";
44
44
  export * from "./pages/NSNotFoundPage";
package/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qCAAqC,CAAC;AACpD,cAAc,0BAA0B,CAAC;AACzC,cAAc,mCAAmC,CAAC;AAClD,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,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,uBAAuB,CAAC;AACtC,cAAc,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC"}
1
+ {"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qCAAqC,CAAC;AACpD,cAAc,0BAA0B,CAAC;AACzC,cAAc,mCAAmC,CAAC;AAClD,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,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,uBAAuB,CAAC;AACtC,cAAc,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC"}
package/package.json CHANGED
@@ -8,7 +8,7 @@
8
8
  "framework": "npm",
9
9
  "application": "package",
10
10
  "private": false,
11
- "version": "1.3.89",
11
+ "version": "1.3.90",
12
12
  "author": "Amir Abolhasani, Alireza Esmaeeli, Sepideh Mazloumi, Hooman Shashaeh",
13
13
  "license": "MIT",
14
14
  "main": "./dist/main.js",
@@ -63,4 +63,4 @@
63
63
  "last 1 safari version"
64
64
  ]
65
65
  }
66
- }
66
+ }
package/src/App.tsx CHANGED
@@ -1,14 +1,22 @@
1
1
  import './App.css';
2
2
  import 'bootstrap/dist/css/bootstrap.min.css';
3
- import { NSFooter, NSHeader, NSTable, NSTabBar } from './main';
3
+ import { NSFooter, NSHeader, NSTable, NSTabPage } from './main';
4
4
  import { useRef } from 'react';
5
5
 
6
6
  export function App()
7
7
  {
8
+ function f(n: number)
9
+ {
10
+ console.log(n);
11
+ return n;
12
+ }
13
+ let c1 = () => <p>Content for Tab {f(1)}</p>;
14
+ let c2 = () => <p>Content for Tab {f(2)}</p>;
15
+ let c3 = () => <p>Content for Tab {f(3)}</p>;
8
16
  const tabs = [
9
- { label: 'Information', content: <p>Content for Tab 1</p> },
10
- { label: 'Price History', content: <p>Content for Tab 2</p> },
11
- { label: 'Price Estimator', content: <p>Content for Tab 3</p> }
17
+ { title: 'Information', getContent: c1 },
18
+ { title: 'Price History', getContent: c2 },
19
+ { title: 'Price Estimator', getContent: c3 }
12
20
  ];
13
21
  let columns = {
14
22
  "id": "ID",
@@ -68,7 +76,7 @@ export function App()
68
76
  getRowKey={row => row.id.toString()}
69
77
  />
70
78
  </div>
71
- <NSTabBar tabs={tabs} />
79
+ <NSTabPage tabs={tabs} />
72
80
  <NSFooter name='Footer' scope='Namira Software Corporation' logo='https://static.namirasoft.com/image/namirasoft/site/logo/base.png' />
73
81
  </>
74
82
  );
@@ -0,0 +1,46 @@
1
+ "use client";
2
+ import Styles from './NSTabPage.module.css';
3
+ import { IBaseComponentProps } from "../props/IBaseComponentProps";
4
+ import { useState } from "react";
5
+
6
+ export interface NSTabPageTab
7
+ {
8
+ title: string;
9
+ getContent: () => React.ReactNode;
10
+ }
11
+
12
+ export interface NSTabPageProps extends IBaseComponentProps
13
+ {
14
+ tabs: NSTabPageTab[]
15
+ }
16
+
17
+ export interface NSTabPageState
18
+ {
19
+ activeTabIndex: number
20
+ }
21
+
22
+ export function NSTabPage(props: NSTabPageProps)
23
+ {
24
+ const [state, setState] = useState<NSTabPageState>({ activeTabIndex: 0 });
25
+
26
+ return (
27
+ <div className={`container ${Styles.ns_tab_bar}`}>
28
+ <ul>
29
+ {
30
+ props.tabs.map((tab, index) => (
31
+ <li
32
+ key={index}
33
+ className={state.activeTabIndex === index ? Styles.active : ''}
34
+ onClick={() => setState({ activeTabIndex: index })}
35
+ >
36
+ {tab.title}
37
+ </li>
38
+ ))
39
+ }
40
+ </ul>
41
+ <div className={Styles.ns_tab_content}>
42
+ {props.tabs[state.activeTabIndex].getContent()}
43
+ </div>
44
+ </div>
45
+ );
46
+ }
package/src/main.ts CHANGED
@@ -38,7 +38,7 @@ export * from "./components/NSLinkGreen";
38
38
  export * from "./components/NSLinkRed";
39
39
  export * from "./components/NSPagination";
40
40
  export * from "./components/NSTable";
41
- export * from "./components/NSTabBar";
41
+ export * from "./components/NSTabPage";
42
42
  export * from "./components/NSTitle";
43
43
  export * from "./pages/NSLoginPage";
44
44
  export * from "./pages/NSNotFoundPage";
@@ -1,11 +0,0 @@
1
- /// <reference types="react" />
2
- import { IBaseComponentProps } from "../props/IBaseComponentProps";
3
- interface TabRow {
4
- label: string;
5
- content: React.ReactNode;
6
- }
7
- export interface NSTabBarProps extends IBaseComponentProps {
8
- tabs: TabRow[];
9
- }
10
- export declare function NSTabBar(props: NSTabBarProps): import("react/jsx-runtime").JSX.Element;
11
- export {};
@@ -1,12 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import Styles from './NSTabBar.module.css';
4
- import { useState } from "react";
5
- export function NSTabBar(props) {
6
- const [activeTab, setActiveTab] = useState(1);
7
- const handleTabClick = (index) => {
8
- setActiveTab(index);
9
- };
10
- return (_jsxs("div", { className: `container ${Styles.ns_tab_bar}`, children: [_jsx("ul", { children: props.tabs.map((tab, index) => (_jsx("li", { className: activeTab === index ? Styles.active : '', onClick: () => handleTabClick(index), children: tab.label }, index))) }), _jsx("div", { className: Styles.ns_tab_content, children: props.tabs[activeTab].content })] }));
11
- }
12
- //# sourceMappingURL=NSTabBar.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"NSTabBar.js","sourceRoot":"","sources":["../../src/components/NSTabBar.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,MAAM,MAAM,uBAAuB,CAAC;AAE3C,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAYjC,MAAM,UAAU,QAAQ,CAAC,KAAoB;IAEzC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAE9C,MAAM,cAAc,GAAG,CAAC,KAAa,EAAE,EAAE;QAErC,YAAY,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,CAAC;IACF,OAAO,CACH,eAAK,SAAS,EAAE,aAAa,MAAM,CAAC,UAAU,EAAE,aAC5C,uBACK,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5B,aAEI,SAAS,EAAE,SAAS,KAAK,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAE,CAAC,CAAC,EAAE,EACpD,OAAO,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,YAEnC,GAAG,CAAC,KAAK,IAJL,KAAK,CAKT,CACR,CAAC,GACD,EACL,cAAK,SAAS,EAAE,MAAM,CAAC,cAAc,YAChC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,OAAO,GAC5B,IACJ,CACT,CAAC;AACN,CAAC"}
@@ -1,42 +0,0 @@
1
- "use client";
2
- import Styles from './NSTabBar.module.css';
3
- import { IBaseComponentProps } from "../props/IBaseComponentProps";
4
- import { useState } from "react";
5
-
6
- interface TabRow
7
- {
8
- label: string;
9
- content: React.ReactNode;
10
- }
11
- export interface NSTabBarProps extends IBaseComponentProps
12
- {
13
- tabs: TabRow[]
14
- }
15
-
16
- export function NSTabBar(props: NSTabBarProps)
17
- {
18
- const [activeTab, setActiveTab] = useState(1);
19
-
20
- const handleTabClick = (index: number) =>
21
- {
22
- setActiveTab(index);
23
- };
24
- return (
25
- <div className={`container ${Styles.ns_tab_bar}`}>
26
- <ul>
27
- {props.tabs.map((tab, index) => (
28
- <li
29
- key={index}
30
- className={activeTab === index ? Styles.active : ''}
31
- onClick={() => handleTabClick(index)}
32
- >
33
- {tab.label}
34
- </li>
35
- ))}
36
- </ul>
37
- <div className={Styles.ns_tab_content}>
38
- {props.tabs[activeTab].content}
39
- </div>
40
- </div>
41
- );
42
- }