namirasoft-site-react 1.3.270 → 1.3.273

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.
Files changed (7) hide show
  1. package/dist/components/NSBoxEmail.d.ts +5 -3
  2. package/dist/components/NSBoxEmail.js +28 -9
  3. package/dist/components/NSBoxEmail.js.map +1 -1
  4. package/dist/components/NSTable.module.css +1 -1
  5. package/package.json +2 -2
  6. package/src/components/NSBoxEmail.tsx +90 -18
  7. package/src/components/NSTable.module.css +1 -1
package/dist/components/NSBoxEmail.d.ts CHANGED
@@ -4,20 +4,22 @@ import { IValidationStringProps } from "../props/IValidationStringProps";
4
4
  import { IBaseComponentProps } from "../props/IBaseComponentProps";
5
5
  export interface INSBoxEmailProps extends IBaseComponentProps, IValidationProps, IValidationStringProps {
6
6
  title: string;
7
- placeholder?: string;
8
7
  defaultValue?: string;
9
- onChanged?: (e: NSBoxEmail) => void;
10
- onClicked?: (e: NSBoxEmail) => void;
8
+ onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
9
+ placeholder?: string;
11
10
  }
12
11
  export interface INSBoxEmailState {
13
12
  value: string;
14
13
  error?: string;
14
+ isFullScreen: boolean;
15
15
  }
16
16
  export declare class NSBoxEmail extends React.Component<INSBoxEmailProps, INSBoxEmailState> {
17
17
  constructor(props: INSBoxEmailProps);
18
18
  getError(): string | null;
19
+ getValue(): string;
19
20
  setValue(value: string): void;
20
21
  private onChanged;
22
+ private toggleFullScreen;
21
23
  render(): import("react/jsx-runtime").JSX.Element;
22
24
  }
23
25
  export default NSBoxEmail;
package/dist/components/NSBoxEmail.js CHANGED
@@ -1,35 +1,54 @@
1
1
  "use client";
2
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
3
  import React from "react";
4
4
  import Styles from "./NSBox.module.css";
5
+ import IconInputEmail from '../assets/images/icon-input-email.svg';
6
+ import IconFullScreen from '../assets/images/icon-fullscreen.png';
7
+ import IconCopy from '../assets/images/icon-copy.png';
5
8
  import { Validator } from "../Validator";
6
9
  import { NSBoxErrorNotifier } from "./NSBoxErrorNotifier";
7
- import NSAssitantButton from "./NSAssistantButton";
10
+ import CopyToClipboard from '../CopyToClipboard';
8
11
  export class NSBoxEmail extends React.Component {
9
12
  constructor(props) {
10
13
  var _a;
11
14
  super(props);
12
- this.state = { value: (_a = props.defaultValue) !== null && _a !== void 0 ? _a : "" };
15
+ this.state = { value: (_a = props.defaultValue) !== null && _a !== void 0 ? _a : "", isFullScreen: false };
16
+ this.setValue = this.setValue.bind(this);
17
+ this.getValue = this.getValue.bind(this);
13
18
  this.onChanged = this.onChanged.bind(this);
19
+ this.toggleFullScreen = this.toggleFullScreen.bind(this);
14
20
  }
15
21
  getError() {
16
22
  return (Validator.getError(this.props.title, this.state.value, this.props) ||
17
23
  Validator.getErrorString(this.props.title, this.state.value, this.props) ||
18
24
  Validator.getErrorEmail(this.props.title, this.state.value));
19
25
  }
26
+ getValue() {
27
+ let error = this.getError();
28
+ if (error) {
29
+ this.setState({ error });
30
+ setTimeout(() => {
31
+ this.setState({ error: "" });
32
+ }, 7000);
33
+ throw new Error(error);
34
+ }
35
+ return this.state.value;
36
+ }
20
37
  setValue(value) {
21
- this.setState({ value }, () => {
22
- if (this.props.onChanged) {
23
- this.props.onChanged(this);
24
- }
25
- });
38
+ this.setState({ value });
26
39
  }
27
40
  onChanged(e) {
28
41
  this.setValue(e.target.value);
42
+ if (this.props.onChanged) {
43
+ this.props.onChanged(e);
44
+ }
45
+ }
46
+ toggleFullScreen() {
47
+ this.setState(prevState => ({ isFullScreen: !prevState.isFullScreen }));
29
48
  }
30
49
  render() {
31
50
  var _a;
32
- return (_jsxs(_Fragment, { children: [_jsx("div", { id: this.props.id, className: `${Styles.ns_input_parent} ${(_a = this.props.classList) === null || _a === void 0 ? void 0 : _a.join(" ")}`, style: this.props.style, children: _jsx("span", { className: Styles.ns_input_title, children: _jsx(NSAssitantButton, { title: this.props.title, required: true }) }) }), _jsx(NSBoxErrorNotifier, { error: this.state.error, clearError: () => this.setState({ error: "" }) })] }));
51
+ return (_jsxs(_Fragment, { children: [_jsxs("div", { className: `${Styles.ns_input_parent} ${(_a = this.props.classList) === null || _a === void 0 ? void 0 : _a.join(" ")}`, style: this.props.style, children: [_jsxs("div", { className: "d-flex justify-content-between align-items-center", children: [_jsxs("span", { className: Styles.ns_input_title, children: [this.props.required && _jsx("span", { style: { color: "red" }, children: "*" }), " ", this.props.title] }), _jsxs("div", { className: "d-flex gap-1", children: [_jsx("button", { className: Styles.ns_btn_box, onClick: () => CopyToClipboard.copyToClipboard(this.getValue()), children: _jsx("img", { src: IconCopy, alt: "Copy", width: 14, height: 14 }) }), _jsx("button", { className: Styles.ns_btn_box, onClick: this.toggleFullScreen, children: _jsx("img", { src: IconFullScreen, alt: "FullScreen", width: 14, height: 14 }) })] })] }), _jsx("input", { id: this.props.id, value: this.state.value, onChange: this.onChanged, type: "email", className: Styles.ns_input, placeholder: this.props.placeholder, style: { background: `url(${IconInputEmail}) white no-repeat scroll center right 16px` } }), _jsxs("div", { className: Styles.ns_input_modal_full_screen, style: { display: this.state.isFullScreen === false ? "none" : "block" }, children: [_jsx("div", { children: _jsx("img", { className: Styles.ns_modal_icon_close, src: "https://static.namirasoft.com/image/concept/close/info.svg", alt: "Close Button", width: 24, height: 24, onClick: this.toggleFullScreen }) }), _jsx("div", { className: Styles.ns_input_modal_full, onClick: this.toggleFullScreen, children: "\t\t\t\t\t\t" }), _jsx("textarea", { value: this.state.value, onChange: (e) => this.setValue(e.target.value) })] })] }), _jsx(NSBoxErrorNotifier, { error: this.state.error, clearError: () => this.setState({ error: "" }) })] }));
33
52
  }
34
53
  }
35
54
  export default NSBoxEmail;
package/dist/components/NSBoxEmail.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"NSBoxEmail.js","sourceRoot":"","sources":["../../src/components/NSBoxEmail.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,gBAAgB,MAAM,qBAAqB,CAAC;AAiBnD,MAAM,OAAO,UAAW,SAAQ,KAAK,CAAC,SAA6C;IAElF,YAAY,KAAuB;;QAElC,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,EAAE,KAAK,EAAE,MAAA,KAAK,CAAC,YAAY,mCAAI,EAAE,EAAE,CAAC;QACjD,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5C,CAAC;IAED,QAAQ;QAEP,OAAO,CACN,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC;YAClE,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC;YACxE,SAAS,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAC3D,CAAC;IACH,CAAC;IAGD,QAAQ,CAAC,KAAa;QAErB,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,EAAE,GAAG,EAAE;YAE7B,IAAI,IAAI,CAAC,KAAK,CAAC,SAAS,EACxB;gBACC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;aAC3B;QACF,CAAC,CAAC,CAAC;IACJ,CAAC;IAEO,SAAS,CAAC,CAAsC;QAEvD,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAEQ,MAAM;;QAEd,OAAO,CACN,8BACC,cAAK,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,eAAe,IAAI,MAAA,IAAI,CAAC,KAAK,CAAC,SAAS,0CAAE,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,YACzH,eAAM,SAAS,EAAE,MAAM,CAAC,cAAc,YACrC,KAAC,gBAAgB,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,SAAG,GAC/C,GACF,EACP,KAAC,kBAAkB,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,GAAI,IAC7F,CACH,CAAC;IACH,CAAC;CACD;AAED,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"NSBoxEmail.js","sourceRoot":"","sources":["../../src/components/NSBoxEmail.tsx"],"names":[],"mappings":"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"}
package/dist/components/NSTable.module.css CHANGED
@@ -101,7 +101,7 @@
101
101
 
102
102
  .ns_checkbox {
103
103
  display: flex;
104
- justify-content: center;
104
+ justify-content: left;
105
105
  align-items: center;
106
106
  }
107
107
 
package/package.json CHANGED
@@ -8,7 +8,7 @@
8
8
  "framework": "npm",
9
9
  "application": "package",
10
10
  "private": false,
11
- "version": "1.3.270",
11
+ "version": "1.3.273",
12
12
  "author": "Amir Abolhasani, Alireza Esmaeeli, Sepideh Mazloumi, Hooman Shashaeh",
13
13
  "license": "MIT",
14
14
  "main": "./dist/main.js",
@@ -21,7 +21,7 @@
21
21
  "copy": "copyfiles -u 1 src/**/*.html src/**/*.css src/**/*.svg src/**/*.png src/**/*.jpg dist/"
22
22
  },
23
23
  "dependencies": {
24
- "@types/node": "^20.14.8",
24
+ "@types/node": "^20.14.9",
25
25
  "@types/react": "^18.3.3",
26
26
  "@types/react-dom": "^18.3.0",
27
27
  "antd": "^5.18.3",
package/src/components/NSBoxEmail.tsx CHANGED
@@ -2,35 +2,41 @@
2
2
 
3
3
  import React from "react";
4
4
  import Styles from "./NSBox.module.css";
5
+ import IconInputEmail from '../assets/images/icon-input-email.svg';
6
+ import IconFullScreen from '../assets/images/icon-fullscreen.png';
7
+ import IconCopy from '../assets/images/icon-copy.png';
5
8
  import { Validator } from "../Validator";
6
9
  import { IValidationProps } from "../props/IValidationProps";
7
10
  import { IValidationStringProps } from "../props/IValidationStringProps";
8
11
  import { IBaseComponentProps } from "../props/IBaseComponentProps";
9
12
  import { NSBoxErrorNotifier } from "./NSBoxErrorNotifier";
10
- import NSAssitantButton from "./NSAssistantButton";
11
- // import CopyToClipboard from "../CopyToClipboard";
13
+ import CopyToClipboard from '../CopyToClipboard';
12
14
 
13
15
  export interface INSBoxEmailProps extends IBaseComponentProps, IValidationProps, IValidationStringProps
14
16
  {
15
17
  title: string;
16
- placeholder?: string;
17
18
  defaultValue?: string;
18
- onChanged?: (e: NSBoxEmail) => void;
19
- onClicked?: (e: NSBoxEmail) => void;
19
+ onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
20
+ placeholder?: string;
20
21
  }
21
22
 
22
23
  export interface INSBoxEmailState
23
24
  {
24
25
  value: string;
25
26
  error?: string;
27
+ isFullScreen: boolean;
26
28
  }
29
+
27
30
  export class NSBoxEmail extends React.Component<INSBoxEmailProps, INSBoxEmailState>
28
31
  {
29
32
  constructor(props: INSBoxEmailProps)
30
33
  {
31
34
  super(props);
32
- this.state = { value: props.defaultValue ?? "" };
35
+ this.state = { value: props.defaultValue ?? "", isFullScreen: false };
36
+ this.setValue = this.setValue.bind(this);
37
+ this.getValue = this.getValue.bind(this);
33
38
  this.onChanged = this.onChanged.bind(this);
39
+ this.toggleFullScreen = this.toggleFullScreen.bind(this);
34
40
  }
35
41
 
36
42
  getError(): string | null
@@ -42,32 +48,98 @@ export class NSBoxEmail extends React.Component<INSBoxEmailProps, INSBoxEmailSta
42
48
  );
43
49
  }
44
50
 
45
-
46
- setValue(value: string): void
51
+ getValue(): string
47
52
  {
48
- this.setState({ value }, () =>
53
+ let error = this.getError();
54
+ if (error)
49
55
  {
50
- if (this.props.onChanged)
56
+ this.setState({ error });
57
+ setTimeout(() =>
51
58
  {
52
- this.props.onChanged(this);
53
- }
54
- });
59
+ this.setState({ error: "" });
60
+ }, 7000);
61
+ throw new Error(error);
62
+ }
63
+ return this.state.value;
64
+ }
65
+
66
+ setValue(value: string): void
67
+ {
68
+ this.setState({ value });
55
69
  }
56
70
 
57
71
  private onChanged(e: React.ChangeEvent<HTMLInputElement>): void
58
72
  {
59
73
  this.setValue(e.target.value);
74
+ if (this.props.onChanged)
75
+ {
76
+ this.props.onChanged(e);
77
+ }
60
78
  }
61
79
 
80
+ private toggleFullScreen(): void
81
+ {
82
+ this.setState(prevState => ({ isFullScreen: !prevState.isFullScreen }));
83
+ }
62
84
  override render()
63
85
  {
64
86
  return (
65
87
  <>
66
- <div id={this.props.id} className={`${Styles.ns_input_parent} ${this.props.classList?.join(" ")}`} style={this.props.style}>
67
- <span className={Styles.ns_input_title}>
68
- <NSAssitantButton title={this.props.title} required />
69
- </span >
70
- </div >
88
+ <div className={`${Styles.ns_input_parent} ${this.props.classList?.join(" ")}`} style={this.props.style}>
89
+ <div className="d-flex justify-content-between align-items-center">
90
+ <span className={Styles.ns_input_title}>
91
+ {this.props.required && <span style={{ color: "red" }}>*</span>} {this.props.title}
92
+ </span>
93
+ <div className="d-flex gap-1">
94
+ <button className={Styles.ns_btn_box} onClick={() => CopyToClipboard.copyToClipboard(this.getValue())}>
95
+ <img
96
+ src={IconCopy}
97
+ alt="Copy"
98
+ width={14}
99
+ height={14}
100
+ />
101
+ </button>
102
+ <button className={Styles.ns_btn_box}
103
+ onClick={this.toggleFullScreen}
104
+ >
105
+ <img
106
+ src={IconFullScreen}
107
+ alt="FullScreen"
108
+ width={14}
109
+ height={14}
110
+ />
111
+ </button>
112
+ </div>
113
+ </div>
114
+ <input
115
+ id={this.props.id}
116
+ value={this.state.value}
117
+ onChange={this.onChanged}
118
+ type="email"
119
+ className={Styles.ns_input}
120
+ placeholder={this.props.placeholder}
121
+ style={{ background: `url(${IconInputEmail}) white no-repeat scroll center right 16px` }}
122
+ />
123
+ <div className={Styles.ns_input_modal_full_screen} style={{ display: this.state.isFullScreen === false ? "none" : "block" }} >
124
+ <div>
125
+ <img
126
+ className={Styles.ns_modal_icon_close}
127
+ src="https://static.namirasoft.com/image/concept/close/info.svg"
128
+ alt="Close Button"
129
+ width={24}
130
+ height={24}
131
+ onClick={this.toggleFullScreen}
132
+ />
133
+ </div>
134
+ <div className={Styles.ns_input_modal_full} onClick={this.toggleFullScreen}> </div>
135
+ <textarea
136
+ value={this.state.value}
137
+ onChange={(e) => this.setValue(e.target.value)}
138
+ >
139
+
140
+ </textarea>
141
+ </div>
142
+ </div>
71
143
  <NSBoxErrorNotifier error={this.state.error} clearError={() => this.setState({ error: "" })} />
72
144
  </>
73
145
  );
package/src/components/NSTable.module.css CHANGED
@@ -101,7 +101,7 @@
101
101
 
102
102
  .ns_checkbox {
103
103
  display: flex;
104
- justify-content: center;
104
+ justify-content: left;
105
105
  align-items: center;
106
106
  }
107
107