namirasoft-site-react 1.3.113 → 1.3.115

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 (122) hide show
  1. package/dist/App.js +4 -3
  2. package/dist/App.js.map +1 -1
  3. package/dist/components/{NSInputDate.d.ts → NSBoxDate.d.ts} +4 -4
  4. package/dist/components/{NSInputDate.js → NSBoxDate.js} +5 -5
  5. package/dist/components/NSBoxDate.js.map +1 -0
  6. package/dist/components/NSBoxDateTime.d.ts +21 -0
  7. package/dist/components/NSBoxDateTime.js +41 -0
  8. package/dist/components/NSBoxDateTime.js.map +1 -0
  9. package/dist/components/{NSInputInteger.d.ts → NSBoxDouble.d.ts} +5 -5
  10. package/dist/components/{NSInputPrice.js → NSBoxDouble.js} +8 -8
  11. package/dist/components/NSBoxDouble.js.map +1 -0
  12. package/dist/components/{NSInputDuration.d.ts → NSBoxDuration.d.ts} +4 -4
  13. package/dist/components/{NSInputDuration.js → NSBoxDuration.js} +5 -5
  14. package/dist/components/NSBoxDuration.js.map +1 -0
  15. package/dist/components/{NSInputTime.d.ts → NSBoxEmail.d.ts} +5 -5
  16. package/dist/components/{NSInputEmail.js → NSBoxEmail.js} +5 -5
  17. package/dist/components/NSBoxEmail.js.map +1 -0
  18. package/dist/components/NSBoxEntity.d.ts +12 -0
  19. package/dist/components/NSBoxEntity.js +10 -0
  20. package/dist/components/NSBoxEntity.js.map +1 -0
  21. package/dist/components/NSBoxEnum.d.ts +7 -0
  22. package/dist/components/NSBoxEnum.js +38 -0
  23. package/dist/components/NSBoxEnum.js.map +1 -0
  24. package/dist/components/NSBoxErrorNotifier.d.ts +5 -0
  25. package/dist/components/{NSInputErrorNotifier.js → NSBoxErrorNotifier.js} +3 -3
  26. package/dist/components/NSBoxErrorNotifier.js.map +1 -0
  27. package/dist/components/{NSInputIP.d.ts → NSBoxIPV4.d.ts} +4 -4
  28. package/dist/components/{NSInputIP.js → NSBoxIPV4.js} +6 -5
  29. package/dist/components/NSBoxIPV4.js.map +1 -0
  30. package/dist/components/{NSInputEmail.d.ts → NSBoxIPV6.d.ts} +5 -5
  31. package/dist/components/NSBoxIPV6.js +44 -0
  32. package/dist/components/NSBoxIPV6.js.map +1 -0
  33. package/dist/components/{NSInputFloat.d.ts → NSBoxInteger.d.ts} +5 -5
  34. package/dist/components/{NSInputInteger.js → NSBoxInteger.js} +5 -5
  35. package/dist/components/NSBoxInteger.js.map +1 -0
  36. package/dist/components/{NSInputString.d.ts → NSBoxPassword.d.ts} +4 -4
  37. package/dist/components/{NSInputPassword.js → NSBoxPassword.js} +5 -5
  38. package/dist/components/NSBoxPassword.js.map +1 -0
  39. package/dist/components/{NSInputPhone.d.ts → NSBoxPhone.d.ts} +4 -4
  40. package/dist/components/{NSInputPhone.js → NSBoxPhone.js} +5 -5
  41. package/dist/components/NSBoxPhone.js.map +1 -0
  42. package/dist/components/{NSInputPrice.d.ts → NSBoxPrice.d.ts} +5 -5
  43. package/dist/components/{NSInputFloat.js → NSBoxPrice.js} +5 -5
  44. package/dist/components/NSBoxPrice.js.map +1 -0
  45. package/dist/components/{NSInputSearch.d.ts → NSBoxSearch.d.ts} +4 -4
  46. package/dist/components/{NSInputSearch.js → NSBoxSearch.js} +5 -5
  47. package/dist/components/NSBoxSearch.js.map +1 -0
  48. package/dist/components/{NSInputText.d.ts → NSBoxString.d.ts} +4 -4
  49. package/dist/components/{NSInputString.js → NSBoxString.js} +5 -5
  50. package/dist/components/NSBoxString.js.map +1 -0
  51. package/dist/components/NSBoxText.d.ts +22 -0
  52. package/dist/components/{NSInputText.js → NSBoxText.js} +5 -5
  53. package/dist/components/NSBoxText.js.map +1 -0
  54. package/dist/components/NSBoxTime.d.ts +22 -0
  55. package/dist/components/{NSInputTime.js → NSBoxTime.js} +5 -5
  56. package/dist/components/NSBoxTime.js.map +1 -0
  57. package/dist/components/NSSelectBox.d.ts +1 -0
  58. package/dist/components/NSSelectBox.js +3 -2
  59. package/dist/components/NSSelectBox.js.map +1 -1
  60. package/dist/components/NSTable.js +2 -2
  61. package/dist/components/NSTable.js.map +1 -1
  62. package/dist/main.d.ts +15 -14
  63. package/dist/main.js +15 -14
  64. package/dist/main.js.map +1 -1
  65. package/package.json +1 -1
  66. package/src/App.tsx +12 -1
  67. package/src/components/NSBoxDate.tsx +81 -0
  68. package/src/components/NSBoxDateTime.tsx +81 -0
  69. package/src/components/NSBoxDouble.tsx +92 -0
  70. package/src/components/NSBoxDuration.tsx +91 -0
  71. package/src/components/NSBoxEmail.tsx +90 -0
  72. package/src/components/NSBoxEntity.tsx +29 -0
  73. package/src/components/NSBoxEnum.tsx +54 -0
  74. package/src/components/NSBoxErrorNotifier.tsx +28 -0
  75. package/src/components/NSBoxIPV4.tsx +96 -0
  76. package/src/components/NSBoxIPV6.tsx +93 -0
  77. package/src/components/NSBoxInteger.tsx +89 -0
  78. package/src/components/NSBoxPassword.tsx +89 -0
  79. package/src/components/NSBoxPhone.tsx +83 -0
  80. package/src/components/NSBoxPrice.tsx +91 -0
  81. package/src/components/{NSInputSearch.tsx → NSBoxSearch.tsx} +9 -9
  82. package/src/components/NSBoxString.tsx +89 -0
  83. package/src/components/NSBoxText.tsx +89 -0
  84. package/src/components/NSBoxTime.tsx +91 -0
  85. package/src/components/NSSelectBox.tsx +94 -93
  86. package/src/components/NSTable.tsx +130 -130
  87. package/src/main.ts +15 -14
  88. package/dist/components/NSInputDate.js.map +0 -1
  89. package/dist/components/NSInputDuration.js.map +0 -1
  90. package/dist/components/NSInputEmail.js.map +0 -1
  91. package/dist/components/NSInputErrorNotifier.d.ts +0 -5
  92. package/dist/components/NSInputErrorNotifier.js.map +0 -1
  93. package/dist/components/NSInputFloat.js.map +0 -1
  94. package/dist/components/NSInputIP.js.map +0 -1
  95. package/dist/components/NSInputInteger.js.map +0 -1
  96. package/dist/components/NSInputPassword.d.ts +0 -22
  97. package/dist/components/NSInputPassword.js.map +0 -1
  98. package/dist/components/NSInputPhone.js.map +0 -1
  99. package/dist/components/NSInputPrice.js.map +0 -1
  100. package/dist/components/NSInputSearch.js.map +0 -1
  101. package/dist/components/NSInputString.js.map +0 -1
  102. package/dist/components/NSInputText.js.map +0 -1
  103. package/dist/components/NSInputTime.js.map +0 -1
  104. package/src/components/NSInputDate.tsx +0 -81
  105. package/src/components/NSInputDuration.tsx +0 -91
  106. package/src/components/NSInputEmail.tsx +0 -90
  107. package/src/components/NSInputErrorNotifier.tsx +0 -28
  108. package/src/components/NSInputFloat.tsx +0 -89
  109. package/src/components/NSInputIP.tsx +0 -90
  110. package/src/components/NSInputInteger.tsx +0 -89
  111. package/src/components/NSInputPassword.tsx +0 -89
  112. package/src/components/NSInputPhone.tsx +0 -83
  113. package/src/components/NSInputPrice.tsx +0 -90
  114. package/src/components/NSInputString.tsx +0 -89
  115. package/src/components/NSInputText.tsx +0 -89
  116. package/src/components/NSInputTime.tsx +0 -91
  117. /package/dist/components/{NSInput.module.css → NSBox.module.css} +0 -0
  118. /package/dist/components/{NSInputDate.module.css → NSBoxDate.module.css} +0 -0
  119. /package/dist/components/{NSInputErrorNotifier.module.css → NSBoxErrorNotifier.module.css} +0 -0
  120. /package/src/components/{NSInput.module.css → NSBox.module.css} +0 -0
  121. /package/src/components/{NSInputDate.module.css → NSBoxDate.module.css} +0 -0
  122. /package/src/components/{NSInputErrorNotifier.module.css → NSBoxErrorNotifier.module.css} +0 -0
@@ -1,89 +0,0 @@
1
- "use client";
2
-
3
- import React from "react";
4
- import Styles from "./NSInput.module.css";
5
- import IconInputInteger from '../assets/images/icon-input-integer.svg';
6
- import { IBaseComponentProps } from "../props/IBaseComponentProps";
7
- import { IValidationNumberProps } from "../props/IValidationNumberProps";
8
- import { IValidationProps } from "../props/IValidationProps";
9
- import { Validator } from "../Validator";
10
- import { NSInputErrorNotifier } from "./NSInputErrorNotifier";
11
-
12
- export interface INSInputIntegerProps extends IBaseComponentProps, IValidationProps, IValidationNumberProps
13
- {
14
- title: string;
15
- defaultValue?: number;
16
- onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
17
- placeholder?: string;
18
- }
19
-
20
- export interface NSInputIntegerState
21
- {
22
- value?: number;
23
- error?: string;
24
- }
25
-
26
- export class NSInputInteger extends React.Component<INSInputIntegerProps, NSInputIntegerState>
27
- {
28
- constructor(props: INSInputIntegerProps)
29
- {
30
- super(props);
31
- this.state = { value: props.defaultValue };
32
- this.getValue = this.getValue.bind(this);
33
- this.setValue = this.setValue.bind(this);
34
- this.onChanged = this.onChanged.bind(this);
35
- }
36
- getError(): string | null
37
- {
38
- return (
39
- Validator.getError(this.props.title, this.state.value, this.props) &&
40
- Validator.getErrorNumber(this.props.title, this.state.value, this.props)
41
- );
42
- }
43
- getValue(): number | undefined
44
- {
45
- let error = this.getError();
46
- if (error)
47
- {
48
- this.setState({ error });
49
- throw new Error(error);
50
- }
51
- return this.state.value;
52
- }
53
- setValue(value: number | undefined): void
54
- {
55
- this.setState({ value });
56
- }
57
- private onChanged(e: React.ChangeEvent<HTMLInputElement>): void
58
- {
59
- this.setValue(parseInt(e.target.value));
60
- if (this.props.onChanged)
61
- this.props.onChanged(e);
62
- }
63
- override render()
64
- {
65
- return (
66
- <>
67
- <div className={`${Styles.ns_input_parent} p-2 ${this.props.classList?.join(" ")}`} style={this.props.style}>
68
- <span className={Styles.ns_input_title}> {this.props.required && <span style={{ color: "red" }} >*</span>} {this.props.title} </span>
69
- <img
70
- className={Styles.ns_input_icon}
71
- src={IconInputInteger}
72
- alt="Integer Icon"
73
- width={24}
74
- height={24}
75
- />
76
- <input
77
- id={this.props.id}
78
- value={this.state.value}
79
- onChange={this.onChanged}
80
- type="number"
81
- className={Styles.ns_input}
82
- placeholder={this.props.placeholder}
83
- />
84
- </div>
85
- <NSInputErrorNotifier error={this.state.error} />
86
- </>
87
- );
88
- }
89
- }
@@ -1,89 +0,0 @@
1
- "use client";
2
-
3
- import React from "react";
4
- import Styles from "./NSInput.module.css";
5
- import IconInputString from '../assets/images/icon-input-string.svg';
6
- import { IBaseComponentProps } from "../props/IBaseComponentProps";
7
- import { IValidationProps } from "../props/IValidationProps";
8
- import { IValidationStringProps } from "../props/IValidationStringProps";
9
- import { Validator } from "../Validator";
10
- import { NSInputErrorNotifier } from "./NSInputErrorNotifier";
11
-
12
- export interface INSInputPasswordProps extends IBaseComponentProps, IValidationProps, IValidationStringProps
13
- {
14
- title: string;
15
- defaultValue?: string;
16
- onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
17
- placeholder?: string;
18
- }
19
-
20
- export interface NSInputPasswordState
21
- {
22
- value: string;
23
- error?: string;
24
- }
25
-
26
- export class NSInputPassword extends React.Component<INSInputPasswordProps, NSInputPasswordState>
27
- {
28
- constructor(props: INSInputPasswordProps)
29
- {
30
- super(props);
31
- this.state = { value: props.defaultValue ?? "" };
32
- this.getValue = this.getValue.bind(this);
33
- this.setValue = this.setValue.bind(this);
34
- this.onChanged = this.onChanged.bind(this);
35
- }
36
- getError(): string | null
37
- {
38
- return (
39
- Validator.getError(this.props.title, this.state.value, this.props) &&
40
- Validator.getErrorString(this.props.title, this.state.value, this.props)
41
- );
42
- }
43
- getValue(): string
44
- {
45
- let error = this.getError();
46
- if (error)
47
- {
48
- this.setState({ error });
49
- throw new Error(error);
50
- }
51
- return this.state.value;
52
- }
53
- setValue(value: string): void
54
- {
55
- this.setState({ value });
56
- }
57
- private onChanged(e: React.ChangeEvent<HTMLInputElement>): void
58
- {
59
- this.setValue(e.target.value);
60
- if (this.props.onChanged)
61
- this.props.onChanged(e);
62
- }
63
- override render()
64
- {
65
- return (
66
- <>
67
- <div className={`${Styles.ns_input_parent} ${this.props.classList?.join(" ")}`} style={this.props.style}>
68
- <span className={Styles.ns_input_title}> {this.props.required && <span style={{ color: "red" }} >*</span>} {this.props.title} </span>
69
- <img
70
- className={Styles.ns_input_icon}
71
- src={IconInputString}
72
- alt="Password Icon"
73
- width={24}
74
- height={24}
75
- />
76
- <input
77
- id={this.props.id}
78
- value={this.state.value}
79
- onChange={this.onChanged}
80
- type="password"
81
- className={Styles.ns_input}
82
- placeholder={this.props.placeholder}
83
- />
84
- </div>
85
- <NSInputErrorNotifier error={this.state.error} />
86
- </>
87
- );
88
- }
89
- }
@@ -1,83 +0,0 @@
1
- "use client";
2
-
3
- import React from "react";
4
- import Styles from "./NSInput.module.css";
5
- import IconInputPhone from '../assets/images/icon-input-phone.svg';
6
- import PhoneInput from 'react-phone-input-2'
7
- import 'react-phone-input-2/lib/style.css'
8
- import { IBaseComponentProps } from "../props/IBaseComponentProps";
9
- import { IValidationProps } from "../props/IValidationProps";
10
- import { IValidationStringProps } from "../props/IValidationStringProps";
11
- import { Validator } from "../Validator";
12
- import { NSInputErrorNotifier } from "./NSInputErrorNotifier";
13
-
14
- export interface INSInputPhoneProps extends IBaseComponentProps, IValidationProps, IValidationStringProps
15
- {
16
- title: string;
17
- defaultValue?: string;
18
- onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
19
- placeholder?: string;
20
- }
21
-
22
- export interface NSInputPhoneState
23
- {
24
- value: string;
25
- error?: string;
26
- }
27
-
28
- export class NSInputPhone extends React.Component<INSInputPhoneProps, NSInputPhoneState>
29
- {
30
- constructor(props: INSInputPhoneProps)
31
- {
32
- super(props);
33
- this.state = { value: props.defaultValue ?? "" };
34
- this.setValue = this.setValue.bind(this);
35
- this.getValue = this.getValue.bind(this);
36
- }
37
- getError(): string | null
38
- {
39
- return (
40
- Validator.getError(this.props.title, this.state.value, this.props) &&
41
- Validator.getErrorString(this.props.title, this.state.value, this.props)
42
- );
43
- }
44
- getValue(): string
45
- {
46
- let error = this.getError();
47
- if (error)
48
- {
49
- this.setState({ error });
50
- throw new Error(error);
51
- }
52
- return this.state.value;
53
- }
54
- setValue(value: string): void
55
- {
56
- this.setState({ value });
57
- }
58
- override render()
59
- {
60
- return (
61
- <>
62
- <div id={this.props.id} className={`${Styles.ns_input_parent} ${this.props.classList?.join(" ")}`} style={this.props.style}>
63
- <span className={Styles.ns_input_title}> {this.props.required && <span style={{ color: "red" }} >*</span>} {this.props.title} </span>
64
- <img
65
- className={Styles.ns_input_icon}
66
- src={IconInputPhone}
67
- alt="Phone Icon"
68
- width={24}
69
- height={24}
70
- />
71
- <PhoneInput
72
- value={this.state.value}
73
- onChange={this.setValue}
74
- country={'us'}
75
- inputClass={Styles.ns_input}
76
- placeholder={this.props.placeholder}
77
- />
78
- </div >
79
- <NSInputErrorNotifier error={this.state.error} />
80
- </>
81
- );
82
- }
83
- }
@@ -1,90 +0,0 @@
1
- "use client";
2
-
3
- import React from "react";
4
- import Styles from "./NSInput.module.css";
5
- import IconInputPrice from '../assets/images/icon-input-price.svg';
6
- import { IBaseComponentProps } from "../props/IBaseComponentProps";
7
- import { IValidationProps } from "../props/IValidationProps";
8
- import { IValidationNumberProps } from "../props/IValidationNumberProps";
9
- import { Validator } from "../Validator";
10
- import { NSInputErrorNotifier } from "./NSInputErrorNotifier";
11
-
12
- export interface INSInputPriceProps extends IBaseComponentProps, IValidationProps, IValidationNumberProps
13
- {
14
- title: string;
15
- defaultValue?: number;
16
- onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
17
- placeholder?: string;
18
- }
19
-
20
- export interface NSInputPriceState
21
- {
22
- value?: number;
23
- error?: string;
24
- }
25
-
26
- export class NSInputPrice extends React.Component<INSInputPriceProps, NSInputPriceState>
27
- {
28
- constructor(props: INSInputPriceProps)
29
- {
30
- super(props);
31
- this.state = { value: props.defaultValue };
32
- this.getValue = this.getValue.bind(this);
33
- this.setValue = this.setValue.bind(this);
34
- this.onChanged = this.onChanged.bind(this);
35
- }
36
- getError(): string | null
37
- {
38
- return (
39
- Validator.getError(this.props.title, this.state.value, this.props) &&
40
- Validator.getErrorNumber(this.props.title, this.state.value, this.props)
41
- );
42
- }
43
- getValue(): number | undefined
44
- {
45
- let error = this.getError();
46
- if (error)
47
- {
48
- this.setState({ error });
49
- throw new Error(error);
50
- }
51
- return this.state.value;
52
- }
53
- setValue(value: number): void
54
- {
55
- this.setState({ value });
56
- }
57
- private onChanged(e: React.ChangeEvent<HTMLInputElement>): void
58
- {
59
- this.setValue(parseInt(e.target.value));
60
- if (this.props.onChanged)
61
- this.props.onChanged(e);
62
- }
63
- override render()
64
- {
65
- return (
66
- <>
67
- <div className={`${Styles.ns_input_parent} p-2 ${this.props.classList?.join(" ")}`} style={this.props.style}>
68
- <span className={Styles.ns_input_title}> {this.props.required && <span style={{ color: "red" }} >*</span>} {this.props.title} </span>
69
- <img
70
- className={Styles.ns_input_icon}
71
- src={IconInputPrice}
72
- alt="Price Icon"
73
- width={24}
74
- height={24}
75
- />
76
- <input
77
- id={this.props.id}
78
- value={this.state.value}
79
- onChange={this.onChanged}
80
- type="number"
81
- step="20"
82
- className={Styles.ns_input}
83
- placeholder={this.props.placeholder}
84
- />
85
- </div>
86
- <NSInputErrorNotifier error={this.state.error} />
87
- </>
88
- );
89
- }
90
- }
@@ -1,89 +0,0 @@
1
- "use client";
2
-
3
- import React from "react";
4
- import Styles from "./NSInput.module.css";
5
- import IconInputString from '../assets/images/icon-input-string.svg';
6
- import { IBaseComponentProps } from "../props/IBaseComponentProps";
7
- import { IValidationProps } from "../props/IValidationProps";
8
- import { IValidationStringProps } from "../props/IValidationStringProps";
9
- import { Validator } from "../Validator";
10
- import { NSInputErrorNotifier } from "./NSInputErrorNotifier";
11
-
12
- export interface INSInputStringProps extends IBaseComponentProps, IValidationProps, IValidationStringProps
13
- {
14
- title: string;
15
- defaultValue?: string;
16
- onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
17
- placeholder?: string;
18
- }
19
-
20
- export interface NSInputStringState
21
- {
22
- value: string;
23
- error?: string;
24
- }
25
-
26
- export class NSInputString extends React.Component<INSInputStringProps, NSInputStringState>
27
- {
28
- constructor(props: INSInputStringProps)
29
- {
30
- super(props);
31
- this.state = { value: props.defaultValue ?? "" };
32
- this.getValue = this.getValue.bind(this);
33
- this.setValue = this.setValue.bind(this);
34
- this.onChanged = this.onChanged.bind(this);
35
- }
36
- getError(): string | null
37
- {
38
- return (
39
- Validator.getError(this.props.title, this.state.value, this.props) &&
40
- Validator.getErrorString(this.props.title, this.state.value, this.props)
41
- );
42
- }
43
- getValue(): string
44
- {
45
- let error = this.getError();
46
- if (error)
47
- {
48
- this.setState({ error });
49
- throw new Error(error);
50
- }
51
- return this.state.value;
52
- }
53
- setValue(value: string): void
54
- {
55
- this.setState({ value });
56
- }
57
- private onChanged(e: React.ChangeEvent<HTMLInputElement>): void
58
- {
59
- this.setValue(e.target.value);
60
- if (this.props.onChanged)
61
- this.props.onChanged(e);
62
- }
63
- override render()
64
- {
65
- return (
66
- <>
67
- <div className={`${Styles.ns_input_parent} p-2 ${this.props.classList?.join(" ")}`} style={this.props.style}>
68
- <span className={Styles.ns_input_title}> {this.props.required && <span style={{ color: "red" }} >*</span>} {this.props.title} </span>
69
- <img
70
- className={Styles.ns_input_icon}
71
- src={IconInputString}
72
- alt="String Icon"
73
- width={24}
74
- height={24}
75
- />
76
- <input
77
- id={this.props.id}
78
- value={this.state.value}
79
- onChange={this.onChanged}
80
- type="text"
81
- className={Styles.ns_input}
82
- placeholder={this.props.placeholder}
83
- />
84
- </div>
85
- <NSInputErrorNotifier error={this.state.error} />
86
- </>
87
- );
88
- }
89
- }
@@ -1,89 +0,0 @@
1
- "use client";
2
-
3
- import React from "react";
4
- import Styles from "./NSInput.module.css";
5
- import IconInputText from '../assets/images/icon-input-text.svg';
6
- import { IBaseComponentProps } from "../props/IBaseComponentProps";
7
- import { IValidationProps } from "../props/IValidationProps";
8
- import { IValidationStringProps } from "../props/IValidationStringProps";
9
- import { Validator } from "../Validator";
10
- import { NSInputErrorNotifier } from "./NSInputErrorNotifier";
11
-
12
- export interface INSInputTextProps extends IBaseComponentProps, IValidationProps, IValidationStringProps
13
- {
14
- title: string;
15
- defaultValue?: string;
16
- onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
17
- placeholder?: string;
18
- }
19
-
20
- export interface NSInputTextState
21
- {
22
- value: string;
23
- error?: string;
24
- }
25
-
26
- export class NSInputText extends React.Component<INSInputTextProps, NSInputTextState>
27
- {
28
- constructor(props: INSInputTextProps)
29
- {
30
- super(props);
31
- this.state = { value: props.defaultValue ?? "" };
32
- this.getValue = this.getValue.bind(this);
33
- this.setValue = this.setValue.bind(this);
34
- this.onChanged = this.onChanged.bind(this);
35
- }
36
- getError(): string | null
37
- {
38
- return (
39
- Validator.getError(this.props.title, this.state.value, this.props) &&
40
- Validator.getErrorString(this.props.title, this.state.value, this.props)
41
- );
42
- }
43
- getValue(): string
44
- {
45
- let error = this.getError();
46
- if (error)
47
- {
48
- this.setState({ error });
49
- throw new Error(error);
50
- }
51
- return this.state.value;
52
- }
53
- setValue(value: string): void
54
- {
55
- this.setState({ value });
56
- }
57
- private onChanged(e: React.ChangeEvent<HTMLInputElement>): void
58
- {
59
- this.setValue(e.target.value);
60
- if (this.props.onChanged)
61
- this.props.onChanged(e);
62
- }
63
- override render()
64
- {
65
- return (
66
- <>
67
- <div className={`${Styles.ns_input_parent} ${this.props.classList?.join(" ")}`} style={this.props.style}>
68
- <span className={Styles.ns_input_title}> {this.props.required && <span style={{ color: "red" }} >*</span>} {this.props.title} </span>
69
- <img
70
- className={Styles.ns_input_icon}
71
- src={IconInputText}
72
- alt="Text Icon"
73
- width={24}
74
- height={24}
75
- />
76
- <input
77
- id={this.props.id}
78
- value={this.state.value}
79
- onChange={this.onChanged}
80
- type="text"
81
- className={Styles.ns_input}
82
- placeholder={this.props.placeholder}
83
- />
84
- </div>
85
- <NSInputErrorNotifier error={this.state.error} />
86
- </>
87
- );
88
- }
89
- }
@@ -1,91 +0,0 @@
1
- "use client";
2
-
3
- import React from "react";
4
- import Styles from "./NSInput.module.css";
5
- import IconInputTime from '../assets/images/icon-input-time.svg';
6
- import { IBaseComponentProps } from "../props/IBaseComponentProps";
7
- import { IValidationProps } from "../props/IValidationProps";
8
- import { IValidationStringProps } from "../props/IValidationStringProps";
9
- import { Validator } from "../Validator";
10
- import { NSInputErrorNotifier } from "./NSInputErrorNotifier";
11
-
12
- export interface INSInputTimeProps extends IBaseComponentProps, IValidationProps, IValidationStringProps
13
- {
14
- title: string;
15
- defaultValue?: string;
16
- onChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
17
- placeholder?: string;
18
- }
19
-
20
- export interface NSInputTimeState
21
- {
22
- value: string;
23
- error?: string;
24
- }
25
-
26
- export class NSInputTime extends React.Component<INSInputTimeProps, NSInputTimeState>
27
- {
28
- constructor(props: INSInputTimeProps)
29
- {
30
- super(props);
31
- this.state = { value: props.defaultValue ?? "" };
32
- this.getValue = this.getValue.bind(this);
33
- this.setValue = this.setValue.bind(this);
34
- this.onChanged = this.onChanged.bind(this);
35
- }
36
- getError(): string | null
37
- {
38
- return (
39
- Validator.getError(this.props.title, this.state.value, this.props) &&
40
- Validator.getErrorString(this.props.title, this.state.value, this.props) &&
41
- Validator.getErrorTime(this.props.title, this.state.value)
42
- );
43
- }
44
- getValue(): string
45
- {
46
- let error = this.getError();
47
- if (error)
48
- {
49
- this.setState({ error });
50
- throw new Error(error);
51
- }
52
- return this.state.value;
53
- }
54
- setValue(value: string): void
55
- {
56
- this.setState({ value });
57
- }
58
- private onChanged(e: React.ChangeEvent<HTMLInputElement>): void
59
- {
60
- this.setValue(e.target.value);
61
- if (this.props.onChanged)
62
- this.props.onChanged(e);
63
- }
64
- override render()
65
- {
66
- return (
67
- <>
68
- <div className={`${Styles.ns_input_parent} p-2 ${this.props.classList?.join(" ")}`} style={this.props.style}>
69
- <span className={Styles.ns_input_title}> {this.props.required && <span style={{ color: "red" }} >*</span>} {this.props.title} </span>
70
- <img
71
- className={Styles.ns_input_icon}
72
- src={IconInputTime}
73
- alt="Time Icon"
74
- width={24}
75
- height={24}
76
- />
77
- <input
78
- id={this.props.id}
79
- value={this.state.value}
80
- onChange={this.onChanged}
81
- type="time"
82
- className={Styles.ns_input}
83
- placeholder={this.props.placeholder}
84
- step="2"
85
- />
86
- </div>
87
- <NSInputErrorNotifier error={this.state.error} />
88
- </>
89
- );
90
- }
91
- }