@agility/plenum-ui 1.3.13 → 1.3.16

package/lib/index.js

@@ -7075,10 +7075,10 @@ function Loader(_a) {
 /**
  * Primary UI component for user interaction
  */
-var Button = function (_a) {
+var Button = function (_a, ref) {
     var _b = _a.type, type = _b === void 0 ? "primary" : _b, _c = _a.size, size = _c === void 0 ? "base" : _c, onClick = _a.onClick, label = _a.label, isDisabled = _a.isDisabled, icon = _a.icon, _d = _a.isLoading, isLoading = _d === void 0 ? false : _d, _e = _a.isSubmit, isSubmit = _e === void 0 ? false : _e, _f = _a.isWidthFull, isWidthFull = _f === void 0 ? false : _f, className = _a.className;
     var iconStyles = cn("h-5 w-5", { "text-white": type === "primary" || type === "danger" }, { "text-purple-700": type === "secondary" }, { "text-gray-700": type === "alternative" });
-    return (React__default["default"].createElement("button", { type: isSubmit ? "submit" : "button", className: cn("inline-flex items-center justify-center space-x-2 rounded border transition-all", { "w-full": isWidthFull === true }, { "px-4 py-2 text-sm": size === "sm" }, { "px-5 py-2 text-base": size === "base" }, { "px-5 py-2 text-lg": size === "lg" }, { "cursor-auto opacity-50": isDisabled }, {
+    return (React__default["default"].createElement("button", { ref: ref, type: isSubmit ? "submit" : "button", className: cn("inline-flex items-center justify-center space-x-2 rounded border transition-all", { "w-full": isWidthFull === true }, { "px-4 py-2 text-sm": size === "sm" }, { "px-5 py-2 text-base": size === "base" }, { "px-5 py-2 text-lg": size === "lg" }, { "cursor-auto opacity-50": isDisabled }, {
             "border-purple-600 bg-purple-600 text-white hover:border-purple-700 hover:bg-purple-700 active:border-purple-800 active:bg-purple-800": type === "primary"
         }, {
             "border-purple-100 bg-purple-100 text-purple-700 hover:border-purple-200 hover:bg-purple-200 hover:text-purple-700 active:border-purple-300 active:bg-purple-300": type === "secondary"
@@ -7092,7 +7092,8 @@ var Button = function (_a) {
             } },
         icon ? (isLoading ? (React__default["default"].createElement(Loader, { classes: "h-5 w-5 border-2" })) : (React__default["default"].createElement(DynamicIcons, { icon: icon, className: iconStyles, outline: false }))) : (isLoading && React__default["default"].createElement(Loader, { classes: "h-5 w-5 border-2" })),
         React__default["default"].createElement("span", null, label)));
-};
+};
+var _Button = React.forwardRef(Button);
 
 let t$2=typeof window!="undefined"?React.useLayoutEffect:React.useEffect;
 
@@ -7329,7 +7330,7 @@ function __spreadArray$1(to, from, pack) {
 var ButtonDropDown = function (_a) {
     var button = _a.button, dropDown = _a.dropDown;
     return (React__default["default"].createElement("div", { className: "flex items-stretch" },
-        React__default["default"].createElement(Button, __assign$1({}, button, { className: "!rounded-r-none !border-r-0 hover:!border-r-0 " })),
+        React__default["default"].createElement(_Button, __assign$1({}, button, { className: "!rounded-r-none !border-r-0 hover:!border-r-0 " })),
         React__default["default"].createElement("div", { className: cn("w-[1px]", button.type === "primary" ? "bg-purple-700" : "", button.type === "secondary" ? "bg-purple-200" : "", button.type === "alternative" ? "bg-gray-300" : "") }),
         React__default["default"].createElement(Dropdown, __assign$1({}, dropDown, { className: cn("h-[calc(100%)] !rounded-l-none border !border-l-0  px-2 transition-all hover:!border-l-0", button.type === "primary"
                 ? "border-purple-600 bg-purple-600  !text-white  hover:border-purple-700 hover:bg-purple-700 active:!border-purple-800 active:!bg-purple-800"
@@ -12468,6 +12469,12 @@ var TextInput = function (_a, ref) {
     var _d = React.useState(false); _d[0]; var setIsActive = _d[1];
     var _e = React.useState(externalValue || defaultValue || ""), value = _e[0], setValue = _e[1];
     var inputRef = React.useRef(null);
+    React.useEffect(function () {
+        //if the external value is updated by the parent component, reset the value in here...
+        if (externalValue !== undefined && externalValue !== null) {
+            setValue(externalValue);
+        }
+    }, [externalValue]);
     // set force focus
     React.useEffect(function () {
         var input = inputRef.current;
@@ -12800,7 +12807,7 @@ var Checkbox = function (_a) {
 };
 
 exports.Avatar = Avatar;
-exports.Button = Button;
+exports.Button = _Button;
 exports.ButtonDropDown = ButtonDropDown;
 exports.Checkbox = Checkbox;
 exports.Combobox = Combobox;