@agility/plenum-ui 1.3.12 → 1.3.15

package/lib/components/Button/Button.d.ts

@@ -1,4 +1,4 @@
-import React, { FC } from "react";
+import React from "react";
 import { IconName } from "../../util/DynamicIcons";
 import "../../tailwind.css";
 export interface ButtonProps {
@@ -40,7 +40,5 @@ export interface ButtonProps {
      */
     className?: string;
 }
-/**
- * Primary UI component for user interaction
- */
-export declare const Button: FC<ButtonProps>;
+declare const _Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { _Button as Button };

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

@@ -26,6 +26,7 @@ export interface TextareaProps {
     /** Number of rows */
     rows?: number;
     placeholder?: string;
+    className?: string;
 }
 declare const _Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
 export { _Textarea as Textarea };

package/lib/index.esm.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import React__default, { useLayoutEffect, useEffect, useRef, useState, forwardRef, Fragment, isValidElement, cloneElement, createElement, useContext, createContext, useMemo, useReducer, createRef, useCallback, memo, useImperativeHandle } from 'react';
+import React__default, { forwardRef, useLayoutEffect, useEffect, useRef, useState, Fragment, isValidElement, cloneElement, createElement, useContext, createContext, useMemo, useReducer, createRef, useCallback, memo, useImperativeHandle } from 'react';
 import { jsx } from 'react/jsx-runtime';
 
 var classnames = {exports: {}};
@@ -7049,10 +7049,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.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.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"
@@ -7066,7 +7066,8 @@ var Button = function (_a) {
             } },
         icon ? (isLoading ? (React__default.createElement(Loader, { classes: "h-5 w-5 border-2" })) : (React__default.createElement(DynamicIcons, { icon: icon, className: iconStyles, outline: false }))) : (isLoading && React__default.createElement(Loader, { classes: "h-5 w-5 border-2" })),
         React__default.createElement("span", null, label)));
-};
+};
+var _Button = forwardRef(Button);
 
 let t$2=typeof window!="undefined"?useLayoutEffect:useEffect;
 
@@ -7303,7 +7304,7 @@ function __spreadArray$1(to, from, pack) {
 var ButtonDropDown = function (_a) {
     var button = _a.button, dropDown = _a.dropDown;
     return (React__default.createElement("div", { className: "flex items-stretch" },
-        React__default.createElement(Button, __assign$1({}, button, { className: "!rounded-r-none !border-r-0 hover:!border-r-0 " })),
+        React__default.createElement(_Button, __assign$1({}, button, { className: "!rounded-r-none !border-r-0 hover:!border-r-0 " })),
         React__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.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"
@@ -12704,7 +12705,7 @@ 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;
+    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 uniqueID = useId();
     var _d = useState(externalValue || defaultValue || ""), value = _d[0], setValue = _d[1];
     var handleOnchange = function (e) {
@@ -12712,14 +12713,15 @@ var Textarea = function (_a, ref) {
         typeof onChange === "function" && onChange(targetValue);
         setValue(targetValue);
     };
-    var className = cn("focus:ring-purple-500 focus:border-purple-500 block w-full sm:text-sm rounded", { "border-gray-300 ": !isError }, { "focus:ring-red-500 border-red-500 outline-red-500": isError });
     var discriptionStyles = cn("text-sm mt-1 block", { "text-gray-500": !isError }, { "text-red-500": isError });
     if (!id)
         id = "ta-".concat(uniqueID);
     return (React__default.createElement("div", { className: cn({ "opacity-50": isDisabled }) },
         label && (React__default.createElement(InputLabel, { isPlaceholder: true, isActive: true, label: label, isRequired: isRequired, id: id, isError: isError, isDisabled: isDisabled })),
         React__default.createElement("div", null,
-            React__default.createElement("textarea", { ref: ref, maxLength: maxLength, onChange: handleOnchange, rows: rows, name: name, id: id, className: className, defaultValue: defaultValue, value: value, placeholder: placeholder })),
+            React__default.createElement("textarea", { ref: ref, maxLength: maxLength, onChange: handleOnchange, rows: rows, name: name, id: id, className: cn("block w-full rounded focus:border-purple-500 focus:ring-purple-500 sm:text-sm", { "border-gray-300 ": !isError }, {
+                    "border-red-500 outline-red-500 focus:ring-red-500": isError
+                }, className), defaultValue: defaultValue, value: value, 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: discriptionStyles }, message))),
             isShowCounter && (React__default.createElement("div", { className: "shrink-0" },
@@ -12772,5 +12774,5 @@ var Checkbox = function (_a) {
             message && (React__default.createElement("p", { id: "".concat(id, "-description"), className: "text-gray-500" }, message)))));
 };
 
-export { Avatar, Button, ButtonDropDown, Checkbox, Combobox, Dropdown, Placeholder, Radio, Select, Switch, _TextInput as TextInput, _TextInputAddon as TextInputAddon, TextInputSelect, _Textarea as Textarea, _TreeView as TreeView };
+export { Avatar, _Button as Button, ButtonDropDown, Checkbox, Combobox, Dropdown, Placeholder, Radio, Select, Switch, _TextInput as TextInput, _TextInputAddon as TextInputAddon, TextInputSelect, _Textarea as Textarea, _TreeView as TreeView };
 //# sourceMappingURL=index.esm.js.map