@agility/plenum-ui 1.3.41 → 1.3.42
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/lib/components/Forms/TextInput/TextInput.d.ts +2 -0
- package/lib/index.esm.js +8 -17
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +8 -17
- package/lib/index.js.map +1 -1
- package/lib/tailwind.css +8 -3
- package/package.json +1 -1
|
@@ -31,6 +31,8 @@ export interface TextInputProps {
|
|
|
31
31
|
onChange?(value: string): void;
|
|
32
32
|
/** input value */
|
|
33
33
|
value?: string;
|
|
34
|
+
/**Placeholder input text*/
|
|
35
|
+
placeholder: string;
|
|
34
36
|
className?: string;
|
|
35
37
|
}
|
|
36
38
|
declare const _TextInput: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
|
package/lib/index.esm.js
CHANGED
|
@@ -12451,11 +12451,10 @@ var useId = function () {
|
|
|
12451
12451
|
};
|
|
12452
12452
|
|
|
12453
12453
|
var TextInput = function (_a, ref) {
|
|
12454
|
-
var label = _a.label, isFocused = _a.isFocused, isError = _a.isError, id = _a.id, name = _a.name, isRequired = _a.isRequired, type = _a.type, defaultValue = _a.defaultValue, isDisabled = _a.isDisabled, isReadonly = _a.isReadonly, message = _a.message, isShowCounter = _a.isShowCounter, maxLength = _a.maxLength, onChange = _a.onChange, externalValue = _a.value, className = _a.className;
|
|
12454
|
+
var label = _a.label, isFocused = _a.isFocused, isError = _a.isError, id = _a.id, name = _a.name, isRequired = _a.isRequired, type = _a.type, defaultValue = _a.defaultValue, isDisabled = _a.isDisabled, isReadonly = _a.isReadonly, message = _a.message, isShowCounter = _a.isShowCounter, maxLength = _a.maxLength, onChange = _a.onChange, placeholder = _a.placeholder, externalValue = _a.value, className = _a.className;
|
|
12455
12455
|
var uniqueID = useId();
|
|
12456
12456
|
var _b = useState(Boolean(isFocused)), isFocus = _b[0], setIsFocus = _b[1];
|
|
12457
|
-
var _c = useState(
|
|
12458
|
-
var _d = useState(externalValue || defaultValue || ""), value = _d[0], setValue = _d[1];
|
|
12457
|
+
var _c = useState(externalValue || defaultValue || ""), value = _c[0], setValue = _c[1];
|
|
12459
12458
|
var inputRef = useRef(null);
|
|
12460
12459
|
useEffect(function () {
|
|
12461
12460
|
//if the external value is updated by the parent component, reset the value in here...
|
|
@@ -12470,7 +12469,6 @@ var TextInput = function (_a, ref) {
|
|
|
12470
12469
|
return;
|
|
12471
12470
|
if (isFocus) {
|
|
12472
12471
|
input.focus();
|
|
12473
|
-
setIsActive(true);
|
|
12474
12472
|
}
|
|
12475
12473
|
else {
|
|
12476
12474
|
input.blur();
|
|
@@ -12481,28 +12479,21 @@ var TextInput = function (_a, ref) {
|
|
|
12481
12479
|
var input = inputRef.current;
|
|
12482
12480
|
if (!input || defaultValue === undefined || defaultValue === "")
|
|
12483
12481
|
return;
|
|
12484
|
-
setIsActive(true);
|
|
12485
12482
|
}, [defaultValue]);
|
|
12486
|
-
var handleInputFocus = function () {
|
|
12487
|
-
|
|
12488
|
-
|
|
12489
|
-
};
|
|
12490
|
-
var handleInputBlur = function () {
|
|
12491
|
-
var input = inputRef.current;
|
|
12492
|
-
setIsFocus(false);
|
|
12493
|
-
setIsActive(!(input && input.value === ""));
|
|
12494
|
-
};
|
|
12483
|
+
var handleInputFocus = function () { return setIsFocus(true); };
|
|
12484
|
+
// add other focus effects here
|
|
12485
|
+
var handleInputBlur = function () { return setIsFocus(false); };
|
|
12495
12486
|
if (!id)
|
|
12496
12487
|
id = "input-".concat(uniqueID);
|
|
12497
12488
|
if (!name)
|
|
12498
12489
|
name = id;
|
|
12499
|
-
return (React__default.createElement(
|
|
12490
|
+
return (React__default.createElement("div", { className: "relative" },
|
|
12500
12491
|
React__default.createElement(InputLabel, { isPlaceholder: true, label: label, isRequired: isRequired, id: id, isError: isError, isActive: true, isDisabled: isDisabled }),
|
|
12501
12492
|
React__default.createElement(_BaseField, { onFocus: handleInputFocus, onBlur: handleInputBlur, onChange: onChange, onValueChange: setValue, ref: ref, type: type, name: name, id: id, className: cn("w-full rounded border py-2 px-3 text-sm font-normal leading-5", { "border-gray-300": !isFocus && !isError }, {
|
|
12502
|
-
"border-purple-500 shadow-none outline-purple-500 focus
|
|
12493
|
+
"!border-purple-500 shadow-none outline-purple-500 focus:!ring-purple-500": isFocus && !isError
|
|
12503
12494
|
}, {
|
|
12504
12495
|
"!border-red-500 shadow-none focus:ring-red-500": isError
|
|
12505
|
-
}, className), isDisabled: isDisabled, isReadonly: isReadonly, value: value, defaultValue: defaultValue, maxLength: maxLength }),
|
|
12496
|
+
}, className), isDisabled: isDisabled, isReadonly: isReadonly, value: value, defaultValue: defaultValue, maxLength: maxLength, placeholder: placeholder }),
|
|
12506
12497
|
React__default.createElement("div", { className: "flex flex-row space-x-3" },
|
|
12507
12498
|
React__default.createElement("div", { className: "grow" }, message && (React__default.createElement("span", { className: cn("mt-1 block text-sm", isError ? "text-red-500" : "text-gray-500") }, message))),
|
|
12508
12499
|
isShowCounter && (React__default.createElement("div", { className: "shrink-0" },
|