react-core-ts 1.3.13 → 1.3.15
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/ReactTextArea.d.ts +2 -2
- package/dist/ReactTextArea.js +26 -24
- package/dist/ReactTextArea.js.map +1 -1
- package/package.json +1 -1
- package/src/ReactTextArea.tsx +40 -38
package/dist/ReactTextArea.d.ts
CHANGED
package/dist/ReactTextArea.js
CHANGED
|
@@ -66,7 +66,7 @@ var ModernTextArea = function (_a) {
|
|
|
66
66
|
setIsDisabled(disabled);
|
|
67
67
|
}, [disabled]);
|
|
68
68
|
var getErrors = function (err) {
|
|
69
|
-
var errMsg =
|
|
69
|
+
var errMsg = "";
|
|
70
70
|
if (err.message) {
|
|
71
71
|
errMsg = err === null || err === void 0 ? void 0 : err.message;
|
|
72
72
|
}
|
|
@@ -75,15 +75,15 @@ var ModernTextArea = function (_a) {
|
|
|
75
75
|
var generateClassName = function (type) {
|
|
76
76
|
var className = "resize-none ".concat(propsClassName);
|
|
77
77
|
switch (type) {
|
|
78
|
-
case
|
|
79
|
-
className += " block text-common text-input-text font-normal px-3.5 py-2 w-full text-sm text-gray-900 bg-transparent border appearance-none focus:outline-none focus:ring-0 peer rounded-[4px] disabled:text-input-disabled disabled:bg-disabled ".concat(hideLabel ?
|
|
78
|
+
case "input":
|
|
79
|
+
className += " block text-common text-input-text font-normal px-3.5 py-2 w-full text-sm text-gray-900 bg-transparent border appearance-none focus:outline-none focus:ring-0 peer rounded-[4px] disabled:text-input-disabled disabled:bg-disabled ".concat(hideLabel ? "" : "placeholder-transparent", " focus:placeholder-grey-secondary");
|
|
80
80
|
if (errors && errors[name]) {
|
|
81
81
|
className +=
|
|
82
|
-
|
|
82
|
+
" border-[#FDA29B] focus:border-error-[#FDA29B] focus:ring-[#FDA29B] focus:ring-3 ";
|
|
83
83
|
}
|
|
84
84
|
else {
|
|
85
85
|
className +=
|
|
86
|
-
|
|
86
|
+
" text-grey-dark border-input-light focus:border-blue-navy focus:outline-none focus:ring-0";
|
|
87
87
|
}
|
|
88
88
|
break;
|
|
89
89
|
// case 'label': // changes made for remove bg-white from placeolder is field disable and or with data
|
|
@@ -108,27 +108,29 @@ var ModernTextArea = function (_a) {
|
|
|
108
108
|
// className += ' text-grey-dark peer-focus:text-blue-navy';
|
|
109
109
|
// }
|
|
110
110
|
// break;
|
|
111
|
-
case
|
|
112
|
-
className += "
|
|
113
|
-
?
|
|
111
|
+
case "label": // changes made for remove bg-white from placeolder is field disable and or with data
|
|
112
|
+
className += "modern-input-label peer-focus:modern-input-peer-focus-label-size absolute duration-300 transform -translate-y-4 top-1.5 z-1 origin-[0] px-0 \n peer-focus:-translate-y-4 start-[14px] rtl:peer-focus:translate-x-1/6 rtl:peer-focus:left-auto \n peer-placeholder-shown:translate-y-2 peer-placeholder-shown:top-[2px] peer-focus:top-1.5 peer-focus:-translate-y-4\" ".concat(isDisabled
|
|
113
|
+
? "cursor-pointer"
|
|
114
|
+
: "cursor-text peer-focus:cursor-pointer", " ").concat(!isDisabled || !checkIsEmptyField()
|
|
115
|
+
? "active-input-label-bg"
|
|
114
116
|
: isDisabled && !checkIsEmptyField()
|
|
115
|
-
?
|
|
116
|
-
:
|
|
117
|
-
?
|
|
118
|
-
:
|
|
117
|
+
? "disabled-input-label-bg"
|
|
118
|
+
: "", " ").concat(checkIsEmptyField()
|
|
119
|
+
? "modern-input-label-size"
|
|
120
|
+
: "modern-input-peer-focus-label-size");
|
|
119
121
|
if (errors && errors[name]) {
|
|
120
|
-
className +=
|
|
122
|
+
className += " text-error-light ";
|
|
121
123
|
}
|
|
122
124
|
else {
|
|
123
|
-
className +=
|
|
125
|
+
className += " text-grey-dark peer-focus:text-blue-navy";
|
|
124
126
|
}
|
|
125
127
|
break;
|
|
126
|
-
case
|
|
127
|
-
className =
|
|
128
|
+
case "message":
|
|
129
|
+
className = " text-error-icon ";
|
|
128
130
|
break;
|
|
129
|
-
case
|
|
131
|
+
case "adorement":
|
|
130
132
|
className +=
|
|
131
|
-
|
|
133
|
+
" absolute right-0 py-4 adorement gap-1 flex items-center ";
|
|
132
134
|
break;
|
|
133
135
|
default:
|
|
134
136
|
break;
|
|
@@ -145,25 +147,25 @@ var ModernTextArea = function (_a) {
|
|
|
145
147
|
// }
|
|
146
148
|
var handleError = function (data) {
|
|
147
149
|
var _a;
|
|
148
|
-
if (getErrors(data[name]) ===
|
|
149
|
-
getErrors(data[name]) ===
|
|
150
|
+
if (getErrors(data[name]) === "required" ||
|
|
151
|
+
getErrors(data[name]) === "Required") {
|
|
150
152
|
return "".concat(label, " is ").concat(getErrors(data[name]));
|
|
151
153
|
}
|
|
152
154
|
else {
|
|
153
|
-
return (_a = getErrors(data[name])) !== null && _a !== void 0 ? _a :
|
|
155
|
+
return (_a = getErrors(data[name])) !== null && _a !== void 0 ? _a : "";
|
|
154
156
|
}
|
|
155
157
|
};
|
|
156
158
|
var textFieldRef = (0, react_1.useRef)(null); // Ref for the text field div
|
|
157
159
|
(0, react_1.useEffect)(function () {
|
|
158
160
|
(0, getPosition_1.applyPositionClass)(textFieldRef, isHovered);
|
|
159
161
|
}, [isHovered]);
|
|
160
|
-
return ((0, jsx_runtime_1.jsx)("div", __assign({ ref: textFieldRef, className: " ".concat(fullwidth ?
|
|
162
|
+
return ((0, jsx_runtime_1.jsx)("div", __assign({ ref: textFieldRef, className: " ".concat(fullwidth ? "w-full" : "w-auto") }, { children: (0, jsx_runtime_1.jsxs)("div", __assign({ className: "tooltip-container" }, { children: [isHovered && errors && errors[name] && ((0, jsx_runtime_1.jsx)("span", __assign({ className: "tooltip" }, { children: errors && handleError(errors) }))), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "flex relative ".concat(fullwidth ? "w-full" : "w-auto") }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "relative w-full" }, { children: [(0, jsx_runtime_1.jsx)("textarea", __assign({ id: id, ref: inputRef, disabled: isDisabled, "data-testid": "textarea" }, register === null || register === void 0 ? void 0 : register(name, { required: required }), { placeholder: placeholder || label, rows: rows || 5, onChange: onChange, value: value, style: {
|
|
161
163
|
paddingRight: (0, generateInnerWidth_1.getInnerWidth)(adorementRef, 11),
|
|
162
164
|
height: boxHeight !== null && boxHeight !== void 0 ? boxHeight : undefined,
|
|
163
165
|
minHeight: boxMinHeight !== null && boxMinHeight !== void 0 ? boxMinHeight : undefined,
|
|
164
|
-
}, autoComplete: autoComplete ?
|
|
166
|
+
}, autoComplete: autoComplete ? "on" : "off",
|
|
165
167
|
// autoFocus={autoFocus}
|
|
166
|
-
className: generateClassName(
|
|
168
|
+
className: generateClassName("input") })), !hideLabel && ((0, jsx_runtime_1.jsxs)("label", __assign({ htmlFor: id, onClick: function () { return onLabelClick(); }, className: generateClassName("label") }, { children: [label, required ? (0, jsx_runtime_1.jsx)("span", __assign({ className: "text-error" }, { children: " *" })) : (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})] })))] })), (0, jsx_runtime_1.jsx)("div", __assign({ className: generateClassName("adorement"), ref: adorementRef }, { children: errors && errors[name] && ((0, jsx_runtime_1.jsx)("div", __assign({ className: " text-error-label text-error-icon cursor-pointer relative ".concat(generateClassName("message")), onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: (0, jsx_runtime_1.jsx)(customIcons_1.default, { name: "alert", type: "medium" }) }))) }))] }))] })) })));
|
|
167
169
|
};
|
|
168
170
|
exports.default = ModernTextArea;
|
|
169
171
|
//# sourceMappingURL=ReactTextArea.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactTextArea.js","sourceRoot":"","sources":["../src/ReactTextArea.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"ReactTextArea.js","sourceRoot":"","sources":["../src/ReactTextArea.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
package/src/ReactTextArea.tsx
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import React, { useEffect, useRef, useState } from
|
|
1
|
+
import React, { useEffect, useRef, useState } from "react";
|
|
2
2
|
|
|
3
|
-
import { TextAreaProps } from
|
|
4
|
-
import CustomIcons from
|
|
5
|
-
import { getInnerWidth } from
|
|
6
|
-
import { applyPositionClass } from
|
|
3
|
+
import { TextAreaProps } from "./commontypes";
|
|
4
|
+
import CustomIcons from "./components/customIcons";
|
|
5
|
+
import { getInnerWidth } from "./utilities/generateInnerWidth";
|
|
6
|
+
import { applyPositionClass } from "./utilities/getPosition";
|
|
7
7
|
|
|
8
8
|
const ModernTextArea: React.FC<TextAreaProps> = ({
|
|
9
9
|
name,
|
|
@@ -70,27 +70,27 @@ const ModernTextArea: React.FC<TextAreaProps> = ({
|
|
|
70
70
|
setIsDisabled(disabled);
|
|
71
71
|
}, [disabled]);
|
|
72
72
|
const getErrors = (err: any) => {
|
|
73
|
-
let errMsg =
|
|
73
|
+
let errMsg = "";
|
|
74
74
|
if (err.message) {
|
|
75
75
|
errMsg = err?.message;
|
|
76
76
|
}
|
|
77
77
|
return errMsg;
|
|
78
78
|
};
|
|
79
79
|
const generateClassName = (
|
|
80
|
-
type:
|
|
80
|
+
type: "input" | "label" | "message" | "adorement"
|
|
81
81
|
): string => {
|
|
82
82
|
let className = `resize-none ${propsClassName}`;
|
|
83
83
|
switch (type) {
|
|
84
|
-
case
|
|
84
|
+
case "input":
|
|
85
85
|
className += ` block text-common text-input-text font-normal px-3.5 py-2 w-full text-sm text-gray-900 bg-transparent border appearance-none focus:outline-none focus:ring-0 peer rounded-[4px] disabled:text-input-disabled disabled:bg-disabled ${
|
|
86
|
-
hideLabel ?
|
|
86
|
+
hideLabel ? "" : "placeholder-transparent"
|
|
87
87
|
} focus:placeholder-grey-secondary`;
|
|
88
88
|
if (errors && errors[name]) {
|
|
89
89
|
className +=
|
|
90
|
-
|
|
90
|
+
" border-[#FDA29B] focus:border-error-[#FDA29B] focus:ring-[#FDA29B] focus:ring-3 ";
|
|
91
91
|
} else {
|
|
92
92
|
className +=
|
|
93
|
-
|
|
93
|
+
" text-grey-dark border-input-light focus:border-blue-navy focus:outline-none focus:ring-0";
|
|
94
94
|
}
|
|
95
95
|
break;
|
|
96
96
|
// case 'label': // changes made for remove bg-white from placeolder is field disable and or with data
|
|
@@ -116,36 +116,38 @@ const ModernTextArea: React.FC<TextAreaProps> = ({
|
|
|
116
116
|
// className += ' text-grey-dark peer-focus:text-blue-navy';
|
|
117
117
|
// }
|
|
118
118
|
// break;
|
|
119
|
-
case
|
|
120
|
-
className += `
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
119
|
+
case "label": // changes made for remove bg-white from placeolder is field disable and or with data
|
|
120
|
+
className += `modern-input-label peer-focus:modern-input-peer-focus-label-size absolute duration-300 transform -translate-y-4 top-1.5 z-1 origin-[0] px-0
|
|
121
|
+
peer-focus:-translate-y-4 start-[14px] rtl:peer-focus:translate-x-1/6 rtl:peer-focus:left-auto
|
|
122
|
+
peer-placeholder-shown:translate-y-2 peer-placeholder-shown:top-[2px] peer-focus:top-1.5 peer-focus:-translate-y-4" ${
|
|
123
|
+
isDisabled
|
|
124
|
+
? "cursor-pointer"
|
|
125
|
+
: "cursor-text peer-focus:cursor-pointer"
|
|
126
|
+
} ${
|
|
125
127
|
!isDisabled || !checkIsEmptyField()
|
|
126
|
-
?
|
|
128
|
+
? "active-input-label-bg"
|
|
127
129
|
: isDisabled && !checkIsEmptyField()
|
|
128
|
-
?
|
|
129
|
-
:
|
|
130
|
+
? "disabled-input-label-bg"
|
|
131
|
+
: ""
|
|
130
132
|
} ${
|
|
131
133
|
checkIsEmptyField()
|
|
132
|
-
?
|
|
133
|
-
:
|
|
134
|
+
? "modern-input-label-size"
|
|
135
|
+
: "modern-input-peer-focus-label-size"
|
|
134
136
|
}`;
|
|
135
137
|
|
|
136
138
|
if (errors && errors[name]) {
|
|
137
|
-
className +=
|
|
139
|
+
className += " text-error-light ";
|
|
138
140
|
} else {
|
|
139
|
-
className +=
|
|
141
|
+
className += " text-grey-dark peer-focus:text-blue-navy";
|
|
140
142
|
}
|
|
141
143
|
break;
|
|
142
144
|
|
|
143
|
-
case
|
|
144
|
-
className =
|
|
145
|
+
case "message":
|
|
146
|
+
className = " text-error-icon ";
|
|
145
147
|
break;
|
|
146
|
-
case
|
|
148
|
+
case "adorement":
|
|
147
149
|
className +=
|
|
148
|
-
|
|
150
|
+
" absolute right-0 py-4 adorement gap-1 flex items-center ";
|
|
149
151
|
break;
|
|
150
152
|
default:
|
|
151
153
|
break;
|
|
@@ -162,12 +164,12 @@ const ModernTextArea: React.FC<TextAreaProps> = ({
|
|
|
162
164
|
// }
|
|
163
165
|
const handleError = (data: any) => {
|
|
164
166
|
if (
|
|
165
|
-
getErrors(data[name]) ===
|
|
166
|
-
getErrors(data[name]) ===
|
|
167
|
+
getErrors(data[name]) === "required" ||
|
|
168
|
+
getErrors(data[name]) === "Required"
|
|
167
169
|
) {
|
|
168
170
|
return `${label} is ${getErrors(data[name])}`;
|
|
169
171
|
} else {
|
|
170
|
-
return getErrors(data[name]) ??
|
|
172
|
+
return getErrors(data[name]) ?? "";
|
|
171
173
|
}
|
|
172
174
|
};
|
|
173
175
|
const textFieldRef = useRef<HTMLDivElement>(null); // Ref for the text field div
|
|
@@ -176,13 +178,13 @@ const ModernTextArea: React.FC<TextAreaProps> = ({
|
|
|
176
178
|
applyPositionClass(textFieldRef, isHovered);
|
|
177
179
|
}, [isHovered]);
|
|
178
180
|
return (
|
|
179
|
-
<div ref={textFieldRef} className={` ${fullwidth ?
|
|
181
|
+
<div ref={textFieldRef} className={` ${fullwidth ? "w-full" : "w-auto"}`}>
|
|
180
182
|
<div className="tooltip-container">
|
|
181
183
|
{isHovered && errors && errors[name] && (
|
|
182
184
|
<span className="tooltip">{errors && handleError(errors)}</span>
|
|
183
185
|
)}
|
|
184
186
|
|
|
185
|
-
<div className={`flex relative ${fullwidth ?
|
|
187
|
+
<div className={`flex relative ${fullwidth ? "w-full" : "w-auto"}`}>
|
|
186
188
|
<div className="relative w-full">
|
|
187
189
|
<textarea
|
|
188
190
|
id={id}
|
|
@@ -199,26 +201,26 @@ const ModernTextArea: React.FC<TextAreaProps> = ({
|
|
|
199
201
|
height: boxHeight ?? undefined,
|
|
200
202
|
minHeight: boxMinHeight ?? undefined,
|
|
201
203
|
}}
|
|
202
|
-
autoComplete={autoComplete ?
|
|
204
|
+
autoComplete={autoComplete ? "on" : "off"}
|
|
203
205
|
// autoFocus={autoFocus}
|
|
204
|
-
className={generateClassName(
|
|
206
|
+
className={generateClassName("input")}
|
|
205
207
|
/>
|
|
206
208
|
{!hideLabel && (
|
|
207
209
|
<label
|
|
208
210
|
htmlFor={id}
|
|
209
211
|
onClick={() => onLabelClick()}
|
|
210
|
-
className={generateClassName(
|
|
212
|
+
className={generateClassName("label")}
|
|
211
213
|
>
|
|
212
214
|
{label}
|
|
213
215
|
{required ? <span className="text-error"> *</span> : <></>}
|
|
214
216
|
</label>
|
|
215
217
|
)}
|
|
216
218
|
</div>
|
|
217
|
-
<div className={generateClassName(
|
|
219
|
+
<div className={generateClassName("adorement")} ref={adorementRef}>
|
|
218
220
|
{errors && errors[name] && (
|
|
219
221
|
<div
|
|
220
222
|
className={` text-error-label text-error-icon cursor-pointer relative ${generateClassName(
|
|
221
|
-
|
|
223
|
+
"message"
|
|
222
224
|
)}`}
|
|
223
225
|
onMouseEnter={() => setIsHovered(true)}
|
|
224
226
|
onMouseLeave={() => setIsHovered(false)}
|