coject 2.4.35 → 2.4.37
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/cjs/Components/Email/index.d.ts +4 -0
- package/dist/cjs/Components/Email/index.js +3 -3
- package/dist/cjs/Components/Email/index.js.map +1 -1
- package/dist/cjs/Components/Phone/index.d.ts +4 -0
- package/dist/cjs/Components/Phone/index.js +15 -6
- package/dist/cjs/Components/Phone/index.js.map +1 -1
- package/dist/esm/Components/Email/index.d.ts +4 -0
- package/dist/esm/Components/Email/index.js +3 -3
- package/dist/esm/Components/Email/index.js.map +1 -1
- package/dist/esm/Components/Phone/index.d.ts +4 -0
- package/dist/esm/Components/Phone/index.js +15 -6
- package/dist/esm/Components/Phone/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -27,14 +27,14 @@ exports.Email = void 0;
|
|
|
27
27
|
const react_1 = __importStar(require("react"));
|
|
28
28
|
// Coject
|
|
29
29
|
const Input_1 = require("../Input");
|
|
30
|
-
const Email = ({ name, label, helperText, value, validation, ...props }) => {
|
|
30
|
+
const Email = ({ name, label, helperText, value, validation, errorMessages, ...props }) => {
|
|
31
31
|
const validate = (0, react_1.useMemo)(() => {
|
|
32
32
|
return {
|
|
33
33
|
pattern: validation?.pattern ?? {
|
|
34
34
|
value: /^[^\s@]+@[^\s@]+\.[^\s@]+$/,
|
|
35
|
-
message: "Please enter a valid email address"
|
|
35
|
+
message: errorMessages?.pattern ?? "Please enter a valid email address"
|
|
36
36
|
},
|
|
37
|
-
required:
|
|
37
|
+
required: errorMessages?.required ?? "Email is required"
|
|
38
38
|
};
|
|
39
39
|
}, [validation]);
|
|
40
40
|
return (react_1.default.createElement(Input_1.Input, { name: name, label: label || "Email", type: "email", helperText: helperText, validation: validate, value: value, ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../resources/Components/Email/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA2C;AAK3C,SAAS;AACT,oCAAiC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../resources/Components/Email/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA2C;AAK3C,SAAS;AACT,oCAAiC;AAiB1B,MAAM,KAAK,GAAe,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACzG,MAAM,QAAQ,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC1B,OAAO;YACH,OAAO,EAAE,UAAU,EAAE,OAAO,IAAI;gBAC5B,KAAK,EAAE,4BAA4B;gBACnC,OAAO,EAAE,aAAa,EAAE,OAAO,IAAI,oCAAoC;aAC1E;YACD,QAAQ,EAAE,aAAa,EAAE,QAAQ,IAAI,mBAAmB;SAC3D,CAAC;IACN,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACH,8BAAC,aAAK,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,IAAI,OAAO,EAAE,IAAI,EAAC,OAAO,EAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK,GAAI,CACrI,CAAC;AACN,CAAC,CAAC;AAdW,QAAA,KAAK,SAchB"}
|
|
@@ -12,6 +12,10 @@ type iPhone = Omit<TextFieldProps, "type" | "validation" | "required" | "onChang
|
|
|
12
12
|
};
|
|
13
13
|
required?: string | boolean;
|
|
14
14
|
};
|
|
15
|
+
errorMessages?: {
|
|
16
|
+
required?: string;
|
|
17
|
+
pattern?: string;
|
|
18
|
+
};
|
|
15
19
|
onChange?: (value: string) => void;
|
|
16
20
|
};
|
|
17
21
|
export declare const Phone: FC<iPhone>;
|
|
@@ -29,24 +29,33 @@ const react_1 = __importStar(require("react"));
|
|
|
29
29
|
const material_1 = require("@mui/material");
|
|
30
30
|
// Coject
|
|
31
31
|
const Input_1 = require("../Input");
|
|
32
|
-
const Phone = ({ name, label, helperText, value, validation, onChange, ...props }) => {
|
|
32
|
+
const Phone = ({ name, label, helperText, value, validation, onChange, errorMessages, ...props }) => {
|
|
33
33
|
const validate = (0, react_1.useMemo)(() => {
|
|
34
34
|
return {
|
|
35
35
|
pattern: validation?.pattern ?? {
|
|
36
36
|
value: /^\d{9}$/,
|
|
37
|
-
message: "Please enter a valid Saudi phone number (9 digits only)",
|
|
37
|
+
message: errorMessages?.pattern ?? "Please enter a valid Saudi phone number (9 digits only)",
|
|
38
38
|
},
|
|
39
|
-
required:
|
|
39
|
+
required: errorMessages?.required ?? "Phone number is required",
|
|
40
40
|
};
|
|
41
41
|
}, [validation]);
|
|
42
|
+
// Handle KeyDown
|
|
43
|
+
const handleKeyDown = (e) => {
|
|
44
|
+
const allowedKeys = ["Backspace", "Delete", "ArrowLeft", "ArrowRight", "Tab"];
|
|
45
|
+
if (!/[0-9]/.test(e.key) && !allowedKeys.includes(e.key)) {
|
|
46
|
+
e.preventDefault();
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
// Handle Change
|
|
42
50
|
const handleChange = (e) => {
|
|
43
|
-
const numericValue = e.target.value.replace(
|
|
51
|
+
const numericValue = e.target.value.replace(/[^0-9]/g, "").slice(0, 9);
|
|
44
52
|
onChange?.(`966${numericValue}`);
|
|
45
53
|
};
|
|
54
|
+
// Handle Input Adorment
|
|
46
55
|
const displayValue = typeof value === "string" && value.startsWith("966") ? value.slice(3) : value || "";
|
|
47
|
-
return (react_1.default.createElement(Input_1.Input, { name: name, label: label || "Phone", helperText: helperText, validation: validate, value: displayValue, onChange: handleChange, InputProps: {
|
|
56
|
+
return (react_1.default.createElement(Input_1.Input, { name: name, label: label || "Phone", helperText: helperText, validation: validate, value: displayValue, onChange: handleChange, onKeyDown: handleKeyDown, inputProps: { maxLength: 9, inputMode: "numeric", pattern: "[0-9]*" }, InputProps: {
|
|
48
57
|
...props.InputProps,
|
|
49
|
-
endAdornment: (react_1.default.createElement(material_1.InputAdornment, { position: "end" }, "966+"))
|
|
58
|
+
endAdornment: (react_1.default.createElement(material_1.InputAdornment, { position: "end" }, "966+"))
|
|
50
59
|
}, ...props }));
|
|
51
60
|
};
|
|
52
61
|
exports.Phone = Phone;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../resources/Components/Phone/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAwD;AAExD,cAAc;AACd,4CAA+D;AAE/D,SAAS;AACT,oCAAiC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../resources/Components/Phone/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAwD;AAExD,cAAc;AACd,4CAA+D;AAE/D,SAAS;AACT,oCAAiC;AAkB1B,MAAM,KAAK,GAAe,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,aAAa,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACnH,MAAM,QAAQ,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC1B,OAAO;YACH,OAAO,EACH,UAAU,EAAE,OAAO,IAAI;gBACnB,KAAK,EAAE,SAAS;gBAChB,OAAO,EAAE,aAAa,EAAE,OAAO,IAAI,yDAAyD;aAC/F;YACL,QAAQ,EAAE,aAAa,EAAE,QAAQ,IAAI,0BAA0B;SAClE,CAAC;IACN,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,iBAAiB;IACjB,MAAM,aAAa,GAAG,CAAC,CAAwC,EAAE,EAAE;QAC/D,MAAM,WAAW,GAAG,CAAC,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC;QAC9E,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC;YACvD,CAAC,CAAC,cAAc,EAAE,CAAC;QACvB,CAAC;IACL,CAAC,CAAC;IAEF,gBAAgB;IAChB,MAAM,YAAY,GAAG,CAAC,CAAgC,EAAE,EAAE;QACtD,MAAM,YAAY,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACvE,QAAQ,EAAE,CAAC,MAAM,YAAY,EAAE,CAAC,CAAC;IACrC,CAAC,CAAC;IAEF,wBAAwB;IACxB,MAAM,YAAY,GAAG,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,EAAE,CAAC;IAEzG,OAAO,CACH,8BAAC,aAAK,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,IAAI,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,EAC3J,UAAU,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,EACrE,UAAU,EAAE;YACR,GAAG,KAAK,CAAC,UAAU;YACnB,YAAY,EAAE,CACV,8BAAC,yBAAc,IAAC,QAAQ,EAAC,KAAK,WAAsB,CACvD;SACJ,KACG,KAAK,GACX,CACL,CAAC;AACN,CAAC,CAAC;AAzCW,QAAA,KAAK,SAyChB"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import React, { useMemo } from "react";
|
|
2
2
|
// Coject
|
|
3
3
|
import { Input } from "../Input";
|
|
4
|
-
export const Email = ({ name, label, helperText, value, validation, ...props }) => {
|
|
4
|
+
export const Email = ({ name, label, helperText, value, validation, errorMessages, ...props }) => {
|
|
5
5
|
const validate = useMemo(() => {
|
|
6
6
|
return {
|
|
7
7
|
pattern: validation?.pattern ?? {
|
|
8
8
|
value: /^[^\s@]+@[^\s@]+\.[^\s@]+$/,
|
|
9
|
-
message: "Please enter a valid email address"
|
|
9
|
+
message: errorMessages?.pattern ?? "Please enter a valid email address"
|
|
10
10
|
},
|
|
11
|
-
required:
|
|
11
|
+
required: errorMessages?.required ?? "Email is required"
|
|
12
12
|
};
|
|
13
13
|
}, [validation]);
|
|
14
14
|
return (React.createElement(Input, { name: name, label: label || "Email", type: "email", helperText: helperText, validation: validate, value: value, ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../resources/Components/Email/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,OAAO,EAAE,MAAM,OAAO,CAAC;AAK3C,SAAS;AACT,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../resources/Components/Email/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,OAAO,EAAE,MAAM,OAAO,CAAC;AAK3C,SAAS;AACT,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAiBjC,MAAM,CAAC,MAAM,KAAK,GAAe,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACzG,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC1B,OAAO;YACH,OAAO,EAAE,UAAU,EAAE,OAAO,IAAI;gBAC5B,KAAK,EAAE,4BAA4B;gBACnC,OAAO,EAAE,aAAa,EAAE,OAAO,IAAI,oCAAoC;aAC1E;YACD,QAAQ,EAAE,aAAa,EAAE,QAAQ,IAAI,mBAAmB;SAC3D,CAAC;IACN,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACH,oBAAC,KAAK,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,IAAI,OAAO,EAAE,IAAI,EAAC,OAAO,EAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK,GAAI,CACrI,CAAC;AACN,CAAC,CAAC"}
|
|
@@ -12,6 +12,10 @@ type iPhone = Omit<TextFieldProps, "type" | "validation" | "required" | "onChang
|
|
|
12
12
|
};
|
|
13
13
|
required?: string | boolean;
|
|
14
14
|
};
|
|
15
|
+
errorMessages?: {
|
|
16
|
+
required?: string;
|
|
17
|
+
pattern?: string;
|
|
18
|
+
};
|
|
15
19
|
onChange?: (value: string) => void;
|
|
16
20
|
};
|
|
17
21
|
export declare const Phone: FC<iPhone>;
|
|
@@ -3,24 +3,33 @@ import React, { useMemo } from "react";
|
|
|
3
3
|
import { InputAdornment } from "@mui/material";
|
|
4
4
|
// Coject
|
|
5
5
|
import { Input } from "../Input";
|
|
6
|
-
export const Phone = ({ name, label, helperText, value, validation, onChange, ...props }) => {
|
|
6
|
+
export const Phone = ({ name, label, helperText, value, validation, onChange, errorMessages, ...props }) => {
|
|
7
7
|
const validate = useMemo(() => {
|
|
8
8
|
return {
|
|
9
9
|
pattern: validation?.pattern ?? {
|
|
10
10
|
value: /^\d{9}$/,
|
|
11
|
-
message: "Please enter a valid Saudi phone number (9 digits only)",
|
|
11
|
+
message: errorMessages?.pattern ?? "Please enter a valid Saudi phone number (9 digits only)",
|
|
12
12
|
},
|
|
13
|
-
required:
|
|
13
|
+
required: errorMessages?.required ?? "Phone number is required",
|
|
14
14
|
};
|
|
15
15
|
}, [validation]);
|
|
16
|
+
// Handle KeyDown
|
|
17
|
+
const handleKeyDown = (e) => {
|
|
18
|
+
const allowedKeys = ["Backspace", "Delete", "ArrowLeft", "ArrowRight", "Tab"];
|
|
19
|
+
if (!/[0-9]/.test(e.key) && !allowedKeys.includes(e.key)) {
|
|
20
|
+
e.preventDefault();
|
|
21
|
+
}
|
|
22
|
+
};
|
|
23
|
+
// Handle Change
|
|
16
24
|
const handleChange = (e) => {
|
|
17
|
-
const numericValue = e.target.value.replace(
|
|
25
|
+
const numericValue = e.target.value.replace(/[^0-9]/g, "").slice(0, 9);
|
|
18
26
|
onChange?.(`966${numericValue}`);
|
|
19
27
|
};
|
|
28
|
+
// Handle Input Adorment
|
|
20
29
|
const displayValue = typeof value === "string" && value.startsWith("966") ? value.slice(3) : value || "";
|
|
21
|
-
return (React.createElement(Input, { name: name, label: label || "Phone", helperText: helperText, validation: validate, value: displayValue, onChange: handleChange, InputProps: {
|
|
30
|
+
return (React.createElement(Input, { name: name, label: label || "Phone", helperText: helperText, validation: validate, value: displayValue, onChange: handleChange, onKeyDown: handleKeyDown, inputProps: { maxLength: 9, inputMode: "numeric", pattern: "[0-9]*" }, InputProps: {
|
|
22
31
|
...props.InputProps,
|
|
23
|
-
endAdornment: (React.createElement(InputAdornment, { position: "end" }, "966+"))
|
|
32
|
+
endAdornment: (React.createElement(InputAdornment, { position: "end" }, "966+"))
|
|
24
33
|
}, ...props }));
|
|
25
34
|
};
|
|
26
35
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../resources/Components/Phone/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,OAAO,EAAe,MAAM,OAAO,CAAC;AAExD,cAAc;AACd,OAAO,EAAkB,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/D,SAAS;AACT,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../resources/Components/Phone/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,OAAO,EAAe,MAAM,OAAO,CAAC;AAExD,cAAc;AACd,OAAO,EAAkB,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/D,SAAS;AACT,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAkBjC,MAAM,CAAC,MAAM,KAAK,GAAe,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,aAAa,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACnH,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC1B,OAAO;YACH,OAAO,EACH,UAAU,EAAE,OAAO,IAAI;gBACnB,KAAK,EAAE,SAAS;gBAChB,OAAO,EAAE,aAAa,EAAE,OAAO,IAAI,yDAAyD;aAC/F;YACL,QAAQ,EAAE,aAAa,EAAE,QAAQ,IAAI,0BAA0B;SAClE,CAAC;IACN,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,iBAAiB;IACjB,MAAM,aAAa,GAAG,CAAC,CAAwC,EAAE,EAAE;QAC/D,MAAM,WAAW,GAAG,CAAC,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC;QAC9E,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC;YACvD,CAAC,CAAC,cAAc,EAAE,CAAC;QACvB,CAAC;IACL,CAAC,CAAC;IAEF,gBAAgB;IAChB,MAAM,YAAY,GAAG,CAAC,CAAgC,EAAE,EAAE;QACtD,MAAM,YAAY,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACvE,QAAQ,EAAE,CAAC,MAAM,YAAY,EAAE,CAAC,CAAC;IACrC,CAAC,CAAC;IAEF,wBAAwB;IACxB,MAAM,YAAY,GAAG,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,EAAE,CAAC;IAEzG,OAAO,CACH,oBAAC,KAAK,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,IAAI,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,EAC3J,UAAU,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,EACrE,UAAU,EAAE;YACR,GAAG,KAAK,CAAC,UAAU;YACnB,YAAY,EAAE,CACV,oBAAC,cAAc,IAAC,QAAQ,EAAC,KAAK,WAAsB,CACvD;SACJ,KACG,KAAK,GACX,CACL,CAAC;AACN,CAAC,CAAC"}
|