@agility/plenum-ui 1.3.13 → 1.3.16
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/Button/Button.d.ts +3 -5
- package/lib/index.esm.js +13 -6
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +12 -5
- package/lib/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React
|
|
1
|
+
import React from "react";
|
|
2
2
|
import { IconName } from "../../util/DynamicIcons";
|
|
3
3
|
import "../../tailwind.css";
|
|
4
4
|
export interface ButtonProps {
|
|
@@ -40,7 +40,5 @@ export interface ButtonProps {
|
|
|
40
40
|
*/
|
|
41
41
|
className?: string;
|
|
42
42
|
}
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
*/
|
|
46
|
-
export declare const Button: FC<ButtonProps>;
|
|
43
|
+
declare const _Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
44
|
+
export { _Button as Button };
|
package/lib/index.esm.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import React__default, { useLayoutEffect, useEffect, useRef, useState,
|
|
2
|
+
import React__default, { forwardRef, useLayoutEffect, useEffect, useRef, useState, Fragment, isValidElement, cloneElement, createElement, useContext, createContext, useMemo, useReducer, createRef, useCallback, memo, useImperativeHandle } from 'react';
|
|
3
3
|
import { jsx } from 'react/jsx-runtime';
|
|
4
4
|
|
|
5
5
|
var classnames = {exports: {}};
|
|
@@ -7049,10 +7049,10 @@ function Loader(_a) {
|
|
|
7049
7049
|
/**
|
|
7050
7050
|
* Primary UI component for user interaction
|
|
7051
7051
|
*/
|
|
7052
|
-
var Button = function (_a) {
|
|
7052
|
+
var Button = function (_a, ref) {
|
|
7053
7053
|
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;
|
|
7054
7054
|
var iconStyles = cn("h-5 w-5", { "text-white": type === "primary" || type === "danger" }, { "text-purple-700": type === "secondary" }, { "text-gray-700": type === "alternative" });
|
|
7055
|
-
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 }, {
|
|
7055
|
+
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 }, {
|
|
7056
7056
|
"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"
|
|
7057
7057
|
}, {
|
|
7058
7058
|
"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) {
|
|
|
7066
7066
|
} },
|
|
7067
7067
|
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" })),
|
|
7068
7068
|
React__default.createElement("span", null, label)));
|
|
7069
|
-
};
|
|
7069
|
+
};
|
|
7070
|
+
var _Button = forwardRef(Button);
|
|
7070
7071
|
|
|
7071
7072
|
let t$2=typeof window!="undefined"?useLayoutEffect:useEffect;
|
|
7072
7073
|
|
|
@@ -7303,7 +7304,7 @@ function __spreadArray$1(to, from, pack) {
|
|
|
7303
7304
|
var ButtonDropDown = function (_a) {
|
|
7304
7305
|
var button = _a.button, dropDown = _a.dropDown;
|
|
7305
7306
|
return (React__default.createElement("div", { className: "flex items-stretch" },
|
|
7306
|
-
React__default.createElement(
|
|
7307
|
+
React__default.createElement(_Button, __assign$1({}, button, { className: "!rounded-r-none !border-r-0 hover:!border-r-0 " })),
|
|
7307
7308
|
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" : "") }),
|
|
7308
7309
|
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"
|
|
7309
7310
|
? "border-purple-600 bg-purple-600 !text-white hover:border-purple-700 hover:bg-purple-700 active:!border-purple-800 active:!bg-purple-800"
|
|
@@ -12442,6 +12443,12 @@ var TextInput = function (_a, ref) {
|
|
|
12442
12443
|
var _d = useState(false); _d[0]; var setIsActive = _d[1];
|
|
12443
12444
|
var _e = useState(externalValue || defaultValue || ""), value = _e[0], setValue = _e[1];
|
|
12444
12445
|
var inputRef = useRef(null);
|
|
12446
|
+
useEffect(function () {
|
|
12447
|
+
//if the external value is updated by the parent component, reset the value in here...
|
|
12448
|
+
if (externalValue !== undefined && externalValue !== null) {
|
|
12449
|
+
setValue(externalValue);
|
|
12450
|
+
}
|
|
12451
|
+
}, [externalValue]);
|
|
12445
12452
|
// set force focus
|
|
12446
12453
|
useEffect(function () {
|
|
12447
12454
|
var input = inputRef.current;
|
|
@@ -12773,5 +12780,5 @@ var Checkbox = function (_a) {
|
|
|
12773
12780
|
message && (React__default.createElement("p", { id: "".concat(id, "-description"), className: "text-gray-500" }, message)))));
|
|
12774
12781
|
};
|
|
12775
12782
|
|
|
12776
|
-
export { Avatar, Button, ButtonDropDown, Checkbox, Combobox, Dropdown, Placeholder, Radio, Select, Switch, _TextInput as TextInput, _TextInputAddon as TextInputAddon, TextInputSelect, _Textarea as Textarea, _TreeView as TreeView };
|
|
12783
|
+
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 };
|
|
12777
12784
|
//# sourceMappingURL=index.esm.js.map
|