@agility/plenum-ui 1.3.40 → 1.3.42

package/lib/components/Forms/TextInput/TextInput.d.ts

@@ -31,6 +31,8 @@ export interface TextInputProps {
     onChange?(value: string): void;
     /** input value */
     value?: string;
+    /**Placeholder input text*/
+    placeholder: string;
     className?: string;
 }
 declare const _TextInput: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;

package/lib/index.esm.js

@@ -12419,7 +12419,7 @@ var InputCounter = function (_a) {
 var defaultStyles = "border py-2 px-3 rounded text-sm leading-5 font-normal w-full border-gray-300 shadow-sm";
 /** Base input field component */
 var BaseField = function (_a, ref) {
-    var onFocus = _a.onFocus, onBlur = _a.onBlur, id = _a.id, name = _a.name, type = _a.type, value = _a.value, defaultValue = _a.defaultValue, isDisabled = _a.isDisabled, isReadonly = _a.isReadonly, _b = _a.maxLength, maxLength = _b === void 0 ? 100 : _b, placeholder = _a.placeholder, _c = _a.className, className = _c === void 0 ? defaultStyles : _c, onChange = _a.onChange, onValueChange = _a.onValueChange;
+    var onFocus = _a.onFocus, onBlur = _a.onBlur, id = _a.id, name = _a.name, type = _a.type, value = _a.value, defaultValue = _a.defaultValue, isDisabled = _a.isDisabled, isReadonly = _a.isReadonly, maxLength = _a.maxLength, placeholder = _a.placeholder, _b = _a.className, className = _b === void 0 ? defaultStyles : _b, onChange = _a.onChange, onValueChange = _a.onValueChange;
     var handleChange = function (e) {
         var targetValue = e.currentTarget.value;
         onChange && onChange(targetValue);
@@ -12451,11 +12451,10 @@ var useId = function () {
 };
 
 var TextInput = function (_a, ref) {
-    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;
+    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;
     var uniqueID = useId();
     var _b = useState(Boolean(isFocused)), isFocus = _b[0], setIsFocus = _b[1];
-    var _c = useState(false); _c[0]; var setIsActive = _c[1];
-    var _d = useState(externalValue || defaultValue || ""), value = _d[0], setValue = _d[1];
+    var _c = useState(externalValue || defaultValue || ""), value = _c[0], setValue = _c[1];
     var inputRef = useRef(null);
     useEffect(function () {
         //if the external value is updated by the parent component, reset the value in here...
@@ -12470,7 +12469,6 @@ var TextInput = function (_a, ref) {
             return;
         if (isFocus) {
             input.focus();
-            setIsActive(true);
         }
         else {
             input.blur();
@@ -12481,28 +12479,21 @@ var TextInput = function (_a, ref) {
         var input = inputRef.current;
         if (!input || defaultValue === undefined || defaultValue === "")
             return;
-        setIsActive(true);
     }, [defaultValue]);
-    var handleInputFocus = function () {
-        setIsFocus(true);
-        // add other focus effects here
-    };
-    var handleInputBlur = function () {
-        var input = inputRef.current;
-        setIsFocus(false);
-        setIsActive(!(input && input.value === ""));
-    };
+    var handleInputFocus = function () { return setIsFocus(true); };
+    // add other focus effects here
+    var handleInputBlur = function () { return setIsFocus(false); };
     if (!id)
         id = "input-".concat(uniqueID);
     if (!name)
         name = id;
-    return (React__default.createElement(React__default.Fragment, null,
+    return (React__default.createElement("div", { className: "relative" },
         React__default.createElement(InputLabel, { isPlaceholder: true, label: label, isRequired: isRequired, id: id, isError: isError, isActive: true, isDisabled: isDisabled }),
         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 }, {
-                "border-purple-500 shadow-none outline-purple-500 focus:ring-purple-500": isFocus && !isError
+                "!border-purple-500 shadow-none outline-purple-500 focus:!ring-purple-500": isFocus && !isError
             }, {
                 "!border-red-500 shadow-none focus:ring-red-500": isError
-            }, className), isDisabled: isDisabled, isReadonly: isReadonly, value: value, defaultValue: defaultValue, maxLength: maxLength }),
+            }, className), isDisabled: isDisabled, isReadonly: isReadonly, value: value, defaultValue: defaultValue, maxLength: maxLength, placeholder: placeholder }),
         React__default.createElement("div", { className: "flex flex-row space-x-3" },
             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))),
             isShowCounter && (React__default.createElement("div", { className: "shrink-0" },
@@ -12539,9 +12530,9 @@ var InputCta = function (_a) {
 };
 
 var TextInputAddon = function (_a, ref) {
-    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, message = _a.message, isShowCounter = _a.isShowCounter, _b = _a.maxLength, maxLength = _b === void 0 ? 100 : _b, placeholder = _a.placeholder, leadIcon = _a.leadIcon, trailIcon = _a.trailIcon, inlineIcon = _a.inlineIcon, inlineTrailingIcon = _a.inlineTrailingIcon, trailLabel = _a.trailLabel, leadLabel = _a.leadLabel, _c = _a.clearCta, clearCta = _c === void 0 ? "none" : _c, onChange = _a.onChange, onCtaClick = _a.onCtaClick, externalValue = _a.value, className = _a.className;
-    var _d = useState(Boolean(isFocused)), isFocus = _d[0], setIsFocus = _d[1];
-    var _e = useState(defaultValue || ""), value = _e[0], setValue = _e[1];
+    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, message = _a.message, isShowCounter = _a.isShowCounter, maxLength = _a.maxLength, placeholder = _a.placeholder, leadIcon = _a.leadIcon, trailIcon = _a.trailIcon, inlineIcon = _a.inlineIcon, inlineTrailingIcon = _a.inlineTrailingIcon, trailLabel = _a.trailLabel, leadLabel = _a.leadLabel, _b = _a.clearCta, clearCta = _b === void 0 ? "none" : _b, onChange = _a.onChange, onCtaClick = _a.onCtaClick, externalValue = _a.value, className = _a.className;
+    var _c = useState(Boolean(isFocused)), isFocus = _c[0], setIsFocus = _c[1];
+    var _d = useState(defaultValue || ""), value = _d[0], setValue = _d[1];
     var inputRef = useRef(null);
     var uniqueID = useId();
     if (!id)
@@ -12629,9 +12620,9 @@ var InputSelect = function (_a) {
 };
 
 var TextInputSelect = function (_a) {
-    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, message = _a.message, isShowCounter = _a.isShowCounter, _b = _a.maxLength, maxLength = _b === void 0 ? 100 : _b, placeholder = _a.placeholder, inputOptions = _a.inputOptions, _c = _a.selectLocation, selectLocation = _c === void 0 ? "right" : _c, prefix = _a.prefix, onChange = _a.onChange, onSelectOption = _a.onSelectOption, externalValue = _a.value;
-    var _d = useState(Boolean(isFocused)), isFocus = _d[0], setIsFocus = _d[1];
-    var _e = useState(defaultValue || ""), value = _e[0], setValue = _e[1];
+    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, message = _a.message, isShowCounter = _a.isShowCounter, maxLength = _a.maxLength, placeholder = _a.placeholder, inputOptions = _a.inputOptions, _b = _a.selectLocation, selectLocation = _b === void 0 ? "right" : _b, prefix = _a.prefix, onChange = _a.onChange, onSelectOption = _a.onSelectOption, externalValue = _a.value;
+    var _c = useState(Boolean(isFocused)), isFocus = _c[0], setIsFocus = _c[1];
+    var _d = useState(defaultValue || ""), value = _d[0], setValue = _d[1];
     var inputRef = useRef(null);
     var uniqueID = useId();
     if (!id)
@@ -12728,9 +12719,9 @@ var Radio = function (_a) {
 };
 
 var Textarea = function (_a, ref) {
-    var id = _a.id, name = _a.name, label = _a.label, isError = _a.isError, isRequired = _a.isRequired, isDisabled = _a.isDisabled, defaultValue = _a.defaultValue, message = _a.message, isShowCounter = _a.isShowCounter, _b = _a.maxLength, maxLength = _b === void 0 ? 500 : _b, _c = _a.rows, rows = _c === void 0 ? 4 : _c, onChange = _a.onChange, externalValue = _a.value, placeholder = _a.placeholder, className = _a.className;
+    var id = _a.id, name = _a.name, label = _a.label, isError = _a.isError, isRequired = _a.isRequired, isDisabled = _a.isDisabled, defaultValue = _a.defaultValue, message = _a.message, isShowCounter = _a.isShowCounter, maxLength = _a.maxLength, _b = _a.rows, rows = _b === void 0 ? 4 : _b, onChange = _a.onChange, externalValue = _a.value, placeholder = _a.placeholder, className = _a.className;
     var uniqueID = useId();
-    var _d = useState(externalValue || defaultValue || ""), value = _d[0], setValue = _d[1];
+    var _c = useState(externalValue || defaultValue || ""), value = _c[0], setValue = _c[1];
     var handleOnchange = function (e) {
         var targetValue = e.currentTarget.value;
         typeof onChange === "function" && onChange(targetValue);