hplx-react-elements-dev 1.0.7 → 1.0.9
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/README.md +0 -1
- package/dist/esm/components/addSuggestion/AddSuggestion.d.ts +4 -0
- package/dist/esm/components/addSuggestion/AddSuggestion.js +62 -0
- package/dist/esm/components/addSuggestion/AddSuggestion.js.map +1 -0
- package/dist/esm/components/button/Button.d.ts +1 -1
- package/dist/esm/components/button/Button.js +2 -2
- package/dist/esm/components/button/Button.js.map +1 -1
- package/dist/esm/components/buttonGroups/ButtonGroups.d.ts +1 -1
- package/dist/esm/components/buttonGroups/ButtonGroups.js +3 -5
- package/dist/esm/components/buttonGroups/ButtonGroups.js.map +1 -1
- package/dist/esm/components/collapsibleCard/CollapsibleCard.js +11 -7
- package/dist/esm/components/collapsibleCard/CollapsibleCard.js.map +1 -1
- package/dist/esm/components/dropdownField/DropdownField.d.ts +1 -1
- package/dist/esm/components/dropdownField/DropdownField.js +5 -13
- package/dist/esm/components/dropdownField/DropdownField.js.map +1 -1
- package/dist/esm/components/dropdownField/DropdownItem.d.ts +1 -1
- package/dist/esm/components/dropdownField/DropdownItem.js +2 -2
- package/dist/esm/components/dropdownField/DropdownItem.js.map +1 -1
- package/dist/esm/components/index.d.ts +3 -0
- package/dist/esm/components/index.js +2 -0
- package/dist/esm/components/index.js.map +1 -1
- package/dist/esm/components/inputField/InputField.d.ts +1 -1
- package/dist/esm/components/inputField/InputField.js +4 -16
- package/dist/esm/components/inputField/InputField.js.map +1 -1
- package/dist/esm/components/inputFieldSplit/InputFieldSplit.d.ts +1 -1
- package/dist/esm/components/inputFieldSplit/InputFieldSplit.js +4 -12
- package/dist/esm/components/inputFieldSplit/InputFieldSplit.js.map +1 -1
- package/dist/esm/components/messageToast/MessageToast.d.ts +1 -1
- package/dist/esm/components/messageToast/MessageToast.js +19 -14
- package/dist/esm/components/messageToast/MessageToast.js.map +1 -1
- package/dist/esm/components/messageToast/Toast.d.ts +3 -0
- package/dist/esm/components/messageToast/Toast.js +19 -0
- package/dist/esm/components/messageToast/Toast.js.map +1 -0
- package/dist/esm/components/nestedDropdown/NestedDropdown.d.ts +4 -0
- package/dist/esm/components/nestedDropdown/NestedDropdown.js +105 -0
- package/dist/esm/components/nestedDropdown/NestedDropdown.js.map +1 -0
- package/dist/esm/components/nestedDropdown/NestedDropdownItem.d.ts +4 -0
- package/dist/esm/components/nestedDropdown/NestedDropdownItem.js +25 -0
- package/dist/esm/components/nestedDropdown/NestedDropdownItem.js.map +1 -0
- package/dist/esm/components/otpField/OtpField.d.ts +1 -1
- package/dist/esm/components/otpField/OtpField.js +4 -14
- package/dist/esm/components/otpField/OtpField.js.map +1 -1
- package/dist/esm/components/textAreaField/TextAreaField.d.ts +1 -1
- package/dist/esm/components/textAreaField/TextAreaField.js +5 -15
- package/dist/esm/components/textAreaField/TextAreaField.js.map +1 -1
- package/dist/esm/components/types.d.ts +67 -24
- package/package.json +2 -4
package/README.md
CHANGED
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { __assign, __rest } from "tslib";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState, useRef, useEffect } from "react";
|
|
4
|
+
import DropdownItem from "../dropdownField/DropdownItem";
|
|
5
|
+
import TextAreaField from "../textAreaField/TextAreaField";
|
|
6
|
+
var AddSuggestion = function (_a) {
|
|
7
|
+
var label = _a.label, _b = _a.hint_text_icon, hint_text_icon = _b === void 0 ? "" : _b, hint_text = _a.hint_text, _c = _a.errorMsg, errorMsg = _c === void 0 ? "" : _c, inputProps = _a.inputProps, options = _a.options;
|
|
8
|
+
var _d = useState(""), value = _d[0], setValue = _d[1];
|
|
9
|
+
var _e = useState(false), showDropdown = _e[0], setShowDropdown = _e[1];
|
|
10
|
+
var wrapperRef = useRef(null);
|
|
11
|
+
var _f = useState(), suggestionArr = _f[0], setSuggestionArr = _f[1];
|
|
12
|
+
var changeHandler = function (e) {
|
|
13
|
+
if (options && options.length > 0) {
|
|
14
|
+
var sug = options.filter(function (options) {
|
|
15
|
+
return options.label
|
|
16
|
+
.toLowerCase()
|
|
17
|
+
.includes(e.target.value.split(", ").pop().toLowerCase());
|
|
18
|
+
} // last keyboad input after ,
|
|
19
|
+
);
|
|
20
|
+
setValue(e.target.value);
|
|
21
|
+
setSuggestionArr(sug);
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
var handleClickOutside = function (e) {
|
|
25
|
+
if (wrapperRef.current && !wrapperRef.current.contains(e.target)) {
|
|
26
|
+
setShowDropdown(false);
|
|
27
|
+
}
|
|
28
|
+
};
|
|
29
|
+
var handleSuggestionClick = function (selectedValue) {
|
|
30
|
+
debugger;
|
|
31
|
+
var debris = value.split(", "); //explode string into array of strings indexed by /, |. |\s /
|
|
32
|
+
debris.pop(); //pop last element off the array (which we didn't want)
|
|
33
|
+
var result = debris.join(", ");
|
|
34
|
+
var res;
|
|
35
|
+
if (result.length > 0) {
|
|
36
|
+
res = result + ", " + selectedValue;
|
|
37
|
+
}
|
|
38
|
+
else {
|
|
39
|
+
res = selectedValue;
|
|
40
|
+
}
|
|
41
|
+
setValue(res);
|
|
42
|
+
};
|
|
43
|
+
// Attaching the previous event with UseEffect hook
|
|
44
|
+
useEffect(function () {
|
|
45
|
+
// Bind the event listener
|
|
46
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
47
|
+
return function () {
|
|
48
|
+
// Unbind the event listener on clean up
|
|
49
|
+
document.removeEventListener("mousedown", handleClickOutside);
|
|
50
|
+
};
|
|
51
|
+
});
|
|
52
|
+
return (_jsxs("div", __assign({ className: "input__wrapper relative" }, { children: [_jsx(TextAreaField, { label: label, hint_text: hint_text, hint_text_icon: hint_text_icon, errorMsg: errorMsg, inputProps: __assign(__assign({}, inputProps), { onChange: changeHandler, value: value, onFocus: function () { return setShowDropdown(true); } }) }), showDropdown && (_jsx("div", __assign({ ref: wrapperRef, className: "absolute mt-1 min-w-max rounded-lg bg-White overflow-y-auto shadow-md z-10 max-h-80 " }, { children: suggestionArr && suggestionArr.length > 0 && (_jsx("div", { children: (suggestionArr === null || suggestionArr === void 0 ? void 0 : suggestionArr.constructor) === Array && suggestionArr.length
|
|
53
|
+
? suggestionArr.map(function (option) {
|
|
54
|
+
var restOptions = __rest(option || {}, []);
|
|
55
|
+
return (_jsx(DropdownItem, __assign({ className: "text-Primary-700" }, restOptions, { onSelect: function () {
|
|
56
|
+
return handleSuggestionClick(restOptions.label);
|
|
57
|
+
} })));
|
|
58
|
+
})
|
|
59
|
+
: null })) })))] })));
|
|
60
|
+
};
|
|
61
|
+
export default AddSuggestion;
|
|
62
|
+
//# sourceMappingURL=AddSuggestion.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AddSuggestion.js","sourceRoot":"","sources":["../../../../src/components/addSuggestion/AddSuggestion.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { ButtonProps } from "../types";
|
|
3
|
-
declare const Button: ({ hierarchy, size, textField, icon, iconFile, disabled,
|
|
3
|
+
declare const Button: ({ hierarchy, size, textField, icon, iconFile, disabled, children, className, ...buttonProps }: ButtonProps) => JSX.Element;
|
|
4
4
|
export default Button;
|
|
@@ -83,8 +83,8 @@ var getPaddingClassName = function (size, icon, iconFile) {
|
|
|
83
83
|
}
|
|
84
84
|
};
|
|
85
85
|
var Button = function (_a) {
|
|
86
|
-
var hierarchy = _a.hierarchy, size = _a.size, textField = _a.textField, _b = _a.icon, icon = _b === void 0 ? "No" : _b, iconFile = _a.iconFile,
|
|
87
|
-
return (_jsxs("button", __assign({ className: "truncate text-center inline-flex items-center ".concat(getHierarchyClassName(hierarchy, disabled), " ").concat(getPaddingClassName(size, icon, iconFile), " rounded-lg")
|
|
86
|
+
var hierarchy = _a.hierarchy, size = _a.size, textField = _a.textField, _b = _a.icon, icon = _b === void 0 ? "No" : _b, iconFile = _a.iconFile, disabled = _a.disabled, children = _a.children, className = _a.className, buttonProps = __rest(_a, ["hierarchy", "size", "textField", "icon", "iconFile", "disabled", "children", "className"]);
|
|
87
|
+
return (_jsxs("button", __assign({ className: "truncate text-center inline-flex items-center ".concat(getHierarchyClassName(hierarchy, disabled), " ").concat(getPaddingClassName(size, icon, iconFile), " rounded-lg ").concat(className), disabled: disabled }, buttonProps, { children: [icon && iconFile && icon === "Left" && (_jsx("span", { className: iconFile.toString() })), textField && icon !== "Only" && (_jsx(Typography, __assign({ variant: "Medium", type: getSizeClassName(size) }, { children: textField }))), icon && iconFile && icon === "Only" && (_jsx("span", { className: iconFile.toString() })), icon && iconFile && icon === "Right" && (_jsx("span", { className: iconFile.toString() })), children] })));
|
|
88
88
|
};
|
|
89
89
|
export default Button;
|
|
90
90
|
//# sourceMappingURL=Button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":";;AACA,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAElD,8GAA8G;AAC9G,IAAM,qBAAqB,GAAG,UAC5B,SAAmC,EACnC,QAAiC;IAEjC,QAAQ,SAAS,EAAE;QACjB,KAAK,SAAS;YACZ,OAAO,QAAQ;gBACb,CAAC,CAAC,0CAA0C,CAAC,yBAAyB;gBACtE,CAAC,CAAC,wHAAwH,CAAC;QAC/H,KAAK,WAAW;YACd,OAAO,QAAQ;gBACb,CAAC,CAAC,gCAAgC,CAAC,2BAA2B;gBAC9D,CAAC,CAAC,4HAA4H,CAAC;QACnI,KAAK,gBAAgB;YACnB,OAAO,QAAQ;gBACb,CAAC,CAAC,4DAA4D,CAAC,gCAAgC;gBAC/F,CAAC,CAAC,6GAA6G,CAAC;QACpH,KAAK,UAAU;YACb,OAAO,QAAQ;gBACb,CAAC,CAAC,eAAe,CAAC,0BAA0B;gBAC5C,CAAC,CAAC,4DAA4D,CAAC;QACnE,KAAK,eAAe;YAClB,OAAO,QAAQ;gBACb,CAAC,CAAC,eAAe,CAAC,+BAA+B;gBACjD,CAAC,CAAC,sDAAsD,CAAC;QAC7D,KAAK,aAAa;YAChB,OAAO,QAAQ;gBACb,CAAC,CAAC,eAAe,CAAC,6BAA6B;gBAC/C,CAAC,CAAC,iFAAiF,CAAC;QACxF,KAAK,WAAW;YACd,OAAO,QAAQ;gBACb,CAAC,CAAC,eAAe,CAAC,2BAA2B;gBAC7C,CAAC,CAAC,mDAAmD,CAAC;QAC1D;YACE,OAAO,wHAAwH,CAAC;KACnI;AACH,CAAC,CAAC;AAEF,wDAAwD;AACxD,IAAM,gBAAgB,GAAG,UAAC,IAAyB;IACjD,QAAQ,IAAI,EAAE;QACZ,KAAK,IAAI;YACP,OAAO,SAAS,CAAC;QACnB,KAAK,IAAI;YACP,OAAO,SAAS,CAAC;QACnB,KAAK,IAAI;YACP,OAAO,SAAS,CAAC;QACnB,KAAK,IAAI;YACP,OAAO,SAAS,CAAC;QACnB,KAAK,KAAK;YACR,OAAO,SAAS,CAAC;QACnB;YACE,OAAO,SAAS,CAAC;KACpB;AACH,CAAC,CAAC;AAEF,sGAAsG;AACtG,IAAM,mBAAmB,GAAG,UAC1B,IAAyB,EACzB,IAAyB,EACzB,QAAiC;IAEjC,QAAQ,IAAI,EAAE;QACZ,KAAK,IAAI;YACP,OAAO,IAAI,IAAI,QAAQ,IAAI,IAAI,KAAK,MAAM;gBACxC,CAAC,CAAC,yBAAyB;gBAC3B,CAAC,CAAC,UAAU,CAAC;QACjB,KAAK,IAAI;YACP,OAAO,IAAI,IAAI,QAAQ,IAAI,IAAI,KAAK,MAAM;gBACxC,CAAC,CAAC,yBAAyB;gBAC3B,CAAC,CAAC,UAAU,CAAC;QACjB,KAAK,IAAI;YACP,OAAO,IAAI,IAAI,QAAQ,IAAI,IAAI,KAAK,MAAM;gBACxC,CAAC,CAAC,0BAA0B;gBAC5B,CAAC,CAAC,WAAW,CAAC;QAClB,KAAK,IAAI;YACP,OAAO,IAAI,IAAI,QAAQ,IAAI,IAAI,KAAK,MAAM;gBACxC,CAAC,CAAC,2BAA2B;gBAC7B,CAAC,CAAC,WAAW,CAAC;QAClB,KAAK,KAAK;YACR,OAAO,IAAI,IAAI,QAAQ,IAAI,IAAI,KAAK,MAAM;gBACxC,CAAC,CAAC,2BAA2B;gBAC7B,CAAC,CAAC,WAAW,CAAC;QAClB;YACE,OAAO,IAAI,IAAI,QAAQ,IAAI,IAAI,KAAK,MAAM;gBACxC,CAAC,CAAC,yBAAyB;gBAC3B,CAAC,CAAC,UAAU,CAAC;KAClB;AACH,CAAC,CAAC;AAEF,IAAM,MAAM,GAAG,UAAC,
|
|
1
|
+
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { ButtonGroupsProps } from "../types";
|
|
3
|
-
declare const ButtonGroups: ({
|
|
3
|
+
declare const ButtonGroups: ({ options, disabled, value, onChange, ...ButtonGroupsProps }: ButtonGroupsProps) => JSX.Element;
|
|
4
4
|
export default ButtonGroups;
|
|
@@ -3,16 +3,14 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { useState } from "react";
|
|
4
4
|
import Typography from "../typography/Typography";
|
|
5
5
|
var ButtonGroups = function (_a) {
|
|
6
|
-
var
|
|
7
|
-
var _c =
|
|
8
|
-
var _e = useState(-1), hovered = _e[0], setHovered = _e[1];
|
|
9
|
-
var setFieldValue = (form || {}).setFieldValue;
|
|
6
|
+
var options = _a.options, _b = _a.disabled, disabled = _b === void 0 ? false : _b, value = _a.value, onChange = _a.onChange, ButtonGroupsProps = __rest(_a, ["options", "disabled", "value", "onChange"]);
|
|
7
|
+
var _c = useState(-1), hovered = _c[0], setHovered = _c[1];
|
|
10
8
|
// const touch = touched && touched[name];
|
|
11
9
|
// const error = errors && errors[name];
|
|
12
10
|
// const errorMsg = touch && error ? error : undefined;
|
|
13
11
|
var handleChange = function (buttonValue) {
|
|
14
12
|
return function (_) {
|
|
15
|
-
buttonValue &&
|
|
13
|
+
buttonValue && onChange && onChange(buttonValue);
|
|
16
14
|
};
|
|
17
15
|
};
|
|
18
16
|
var onMouseEnterHandler = function (index) { return function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonGroups.js","sourceRoot":"","sources":["../../../../src/components/buttonGroups/ButtonGroups.tsx"],"names":[],"mappings":";;AAAA,OAAc,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAElD,IAAM,YAAY,GAAG,UAAC,EAMF;IALlB,IAAA,
|
|
1
|
+
{"version":3,"file":"ButtonGroups.js","sourceRoot":"","sources":["../../../../src/components/buttonGroups/ButtonGroups.tsx"],"names":[],"mappings":"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"}
|
|
@@ -7,17 +7,17 @@ var getPostionClassName = function (directionClass) {
|
|
|
7
7
|
case "lefttrue":
|
|
8
8
|
return "w-72 -mr-72";
|
|
9
9
|
case "leftfalse":
|
|
10
|
-
return "w-
|
|
10
|
+
return "w-16 -mr-16";
|
|
11
11
|
case "righttrue":
|
|
12
|
-
return "w-72 -ml-
|
|
12
|
+
return "w-72 -ml-36 left-full";
|
|
13
13
|
case "rightfalse":
|
|
14
|
-
return "w-
|
|
14
|
+
return "w-16 -ml-16 left-full";
|
|
15
15
|
default:
|
|
16
16
|
return "w-72 -ml-72 left-full";
|
|
17
17
|
}
|
|
18
18
|
};
|
|
19
19
|
var CollapsibleCard = function (props) {
|
|
20
|
-
var _a = props || {}, _b = _a.direction, direction = _b === void 0 ? "down" : _b, _c = _a.label, label = _c === void 0 ? "" : _c, header = _a.header, children = _a.children, footer = _a.footer, _d = _a.icon, icon = _d === void 0 ? "Left" : _d, _e = _a.openIcon, openIcon = _e === void 0 ? "hx_add" : _e, _f = _a.closeIcon, closeIcon = _f === void 0 ? "hx_remove" : _f, _g = _a.width, width = _g === void 0 ? "" : _g, _h = _a.height, height = _h === void 0 ? "" : _h, _j = _a.disabled, disabled = _j === void 0 ? false : _j;
|
|
20
|
+
var _a = props || {}, _b = _a.direction, direction = _b === void 0 ? "down" : _b, _c = _a.label, label = _c === void 0 ? "" : _c, header = _a.header, children = _a.children, footer = _a.footer, _d = _a.icon, icon = _d === void 0 ? "Left" : _d, _e = _a.openIcon, openIcon = _e === void 0 ? "hx_add" : _e, _f = _a.closeIcon, closeIcon = _f === void 0 ? "hx_remove" : _f, _g = _a.width, width = _g === void 0 ? "" : _g, _h = _a.height, height = _h === void 0 ? "" : _h, _j = _a.disabled, disabled = _j === void 0 ? false : _j, handleCollapsibleDisplay = _a.handleCollapsibleDisplay, headerRightChildren = _a.headerRightChildren;
|
|
21
21
|
var _k = useState(false), active = _k[0], setActive = _k[1];
|
|
22
22
|
var OnButtonClick = function () {
|
|
23
23
|
setActive(function (prevValue) { return !prevValue; });
|
|
@@ -28,13 +28,17 @@ var CollapsibleCard = function (props) {
|
|
|
28
28
|
var getHeight = function (h) {
|
|
29
29
|
return height !== "" ? "h-".concat(h) : "";
|
|
30
30
|
};
|
|
31
|
+
var handleArrowClick = function () {
|
|
32
|
+
setActive(!active);
|
|
33
|
+
handleCollapsibleDisplay && handleCollapsibleDisplay(!active);
|
|
34
|
+
};
|
|
31
35
|
if (direction === "up" || direction === "down") {
|
|
32
|
-
return (_jsxs("div", __assign({ className: "flex m-5 ".concat(direction === "down" ? "flex-col" : "flex-col-reverse") }, { children: [
|
|
36
|
+
return (_jsxs("div", __assign({ className: "flex m-5 ".concat(direction === "down" ? "flex-col" : "flex-col-reverse") }, { children: [_jsxs("div", __assign({ className: "flex flex-1 flex-row items-center" }, { children: [_jsx(Button, { onClick: OnButtonClick, hierarchy: "Secondary", size: "lg", icon: icon, iconFile: active ? closeIcon : openIcon, textField: label, disabled: false }), active && headerRightChildren] })), _jsxs("div", __assign({ "data-testid": "animationDiv", onAnimationEnd: function () {
|
|
33
37
|
console.log('onAnimationEnd called');
|
|
34
|
-
}, className: "".concat(active ? "max-h-[1000px]" : "max-h-0", " ").concat(active ? "p-5" : "p-0", " transition-all duration-500 ease-in-out overflow-hidden mt-5 ").concat(getWidth(width), " ").concat(getHeight(height), " text-ellipsis") }, { children: [_jsx("div", __assign({ className: "flex flex-1 m-1 p-4" }, { children: header })), children, _jsx("div", __assign({ className: "flex flex-1 m-1 p-4" }, { children: footer }))] }))] })));
|
|
38
|
+
}, className: "".concat(active ? "max-h-[1000px]" : "max-h-0", " ").concat(active ? "p-5" : "p-0", " transition-all duration-500 ease-in-out overflow-hidden mt-5 ").concat(getWidth(width), " ").concat(getHeight(height), " text-ellipsis") }, { children: [header && _jsx("div", __assign({ className: "flex flex-1 m-1 p-4" }, { children: header })), children, footer && _jsx("div", __assign({ className: "flex flex-1 m-1 p-4" }, { children: footer }))] }))] })));
|
|
35
39
|
}
|
|
36
40
|
else {
|
|
37
|
-
return (_jsx("div", __assign({ className: "flex" }, { children: _jsxs("div", __assign({ className: "".concat(getPostionClassName(direction + active), " duration-300 h-screen bg-Gray-100 relative") }, { children: [_jsx("div", { "data-testid": "CollapseIcon", className: "".concat(disabled ? "hidden" : "", " ").concat(direction === "right" ? "hx_right" : "hx_left", " mt-2 absolute cursor-pointer items-center text-center right-
|
|
41
|
+
return (_jsx("div", __assign({ className: "flex" }, { children: _jsxs("div", __assign({ className: "".concat(getPostionClassName(direction + active), " duration-300 h-screen bg-Gray-100 relative") }, { children: [_jsx("div", { "data-testid": "CollapseIcon", className: "".concat(disabled ? "hidden" : "", " ").concat(direction === "right" ? "hx_right" : "hx_left", " mt-2 absolute cursor-pointer items-center text-center right-[10px] top-0 ").concat(!active && "rotate-180 overflow-hidden"), onClick: function () { return handleArrowClick(); }, style: { fontSize: 30,
|
|
38
42
|
fontWeight: 1000 } }), active && (_jsxs(_Fragment, { children: [_jsx("div", __assign({ className: "flex flex-1 m-1 p-4" }, { children: header })), children, _jsx("div", __assign({ className: "flex flex-1 m-1 p-4" }, { children: footer }))] }))] })) })));
|
|
39
43
|
}
|
|
40
44
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CollapsibleCard.js","sourceRoot":"","sources":["../../../../src/components/collapsibleCard/CollapsibleCard.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,MAAM,MAAM,kBAAkB,CAAC;AAEtC,IAAM,mBAAmB,GAAG,UAAC,cAAqB;IAChD,QAAQ,cAAc,EAAE;QACpB,KAAK,UAAU;YACX,OAAO,aAAa,CAAC;QACzB,KAAK,WAAW;YACZ,OAAO,aAAa,CAAC;QACzB,KAAK,WAAW;YACZ,OAAO,uBAAuB,CAAC;QACnC,KAAK,YAAY;YACb,OAAO,uBAAuB,CAAC;QACnC;YACI,OAAO,uBAAuB,CAAC;KACtC;AACH,CAAC,CAAC;AAEF,IAAM,eAAe,GAAG,UAAC,KAA2B;IAC5C,IAAA,
|
|
1
|
+
{"version":3,"file":"CollapsibleCard.js","sourceRoot":"","sources":["../../../../src/components/collapsibleCard/CollapsibleCard.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { DropdownFieldProps } from "../types";
|
|
3
|
-
declare const DropdownField: ({
|
|
3
|
+
declare const DropdownField: ({ label, end_icon, hint_text_icon, empty_text, hint_text, value, onChange, disabled, placeholder, errorMsg, options, }: DropdownFieldProps) => JSX.Element;
|
|
4
4
|
export default DropdownField;
|
|
@@ -4,30 +4,22 @@ import { useState } from "react";
|
|
|
4
4
|
import Typography from "../typography/Typography";
|
|
5
5
|
import DropdownItem from "./DropdownItem";
|
|
6
6
|
var DropdownField = function (_a) {
|
|
7
|
-
var
|
|
8
|
-
var
|
|
9
|
-
var _h = form || {}, setFieldValue = _h.setFieldValue, touched = _h.touched, errors = _h.errors, setFieldTouched = _h.setFieldTouched;
|
|
10
|
-
var _j = useState(false), openDropdown = _j[0], setOpenDropdown = _j[1];
|
|
11
|
-
var touch = touched && touched[name];
|
|
12
|
-
var error = errors && errors[name];
|
|
13
|
-
var errorMsg = touch && error ? error : undefined;
|
|
7
|
+
var label = _a.label, _b = _a.end_icon, end_icon = _b === void 0 ? "hx_down" : _b, _c = _a.hint_text_icon, hint_text_icon = _c === void 0 ? "" : _c, _d = _a.empty_text, empty_text = _d === void 0 ? "Items Not found" : _d, hint_text = _a.hint_text, value = _a.value, onChange = _a.onChange, _e = _a.disabled, disabled = _e === void 0 ? false : _e, placeholder = _a.placeholder, _f = _a.errorMsg, errorMsg = _f === void 0 ? "" : _f, options = _a.options;
|
|
8
|
+
var _g = useState(false), openDropdown = _g[0], setOpenDropdown = _g[1];
|
|
14
9
|
var handleFieldClick = function (_) {
|
|
15
10
|
!disabled && setOpenDropdown(function (prevValue) { return !prevValue; });
|
|
16
11
|
};
|
|
17
|
-
|
|
18
|
-
setFieldTouched && setFieldTouched(name, true);
|
|
19
|
-
};
|
|
20
|
-
return (_jsxs("div", { children: [_jsx("div", __assign({ className: "flex justify-between" }, { children: Boolean(label) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: label })) }))) })), _jsxs("div", __assign({ className: "relative block" }, { children: [_jsxs("div", __assign({ onBlur: handleBlur, onClick: handleFieldClick, className: "flex-1 flex items-center pl-2 placeholder:text-Gray-500 justify-between border-1 ".concat(errorMsg ? "border-Error-300" : "border-Gray-300", " shadow-xs rounded-lg h-10 ").concat(disabled
|
|
12
|
+
return (_jsxs("div", { children: [_jsx("div", __assign({ className: "flex justify-between" }, { children: Boolean(label) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: label })) }))) })), _jsxs("div", __assign({ className: "relative block" }, { children: [_jsxs("div", __assign({ onClick: handleFieldClick, className: "flex-1 flex items-center pl-2 placeholder:text-Gray-500 justify-between border-1 ".concat(errorMsg ? "border-Error-300" : "border-Gray-300", " shadow-xs rounded-lg h-10 ").concat(disabled
|
|
21
13
|
? "bg-Gray-50 cursor-not-allowed"
|
|
22
14
|
: "bg-White cursor-pointer ".concat(errorMsg
|
|
23
15
|
? "hover:shadow-xs-error"
|
|
24
16
|
: "".concat(openDropdown
|
|
25
17
|
? "border-Primary-300 shadow-xs-primary"
|
|
26
|
-
: "", " hover:border-Primary-300 hover:shadow-xs-primary"))) }, { children: [
|
|
18
|
+
: "", " hover:border-Primary-300 hover:shadow-xs-primary"))) }, { children: [!!value ? (_jsx("div", __assign({ className: "text-Gray-900" }, { children: _jsx(Typography, __assign({ "data-testid": "dropdown-selected-value", variant: "Regular", type: "Text md" }, { children: value["label"] || value["value"] })) }))) : (_jsx("div", __assign({ className: "text-Gray-500" }, { children: _jsx(Typography, __assign({ variant: "Regular", type: "Text md" }, { children: placeholder })) }))), Boolean(end_icon) && (_jsx("div", __assign({ className: "text-Gray-500 flex items-center mr-2 ease-linear duration-300 ".concat(end_icon === "hx_down" && openDropdown && "rotate-180"), "data-testid": "dropdown-selected-icon" }, { children: _jsx("span", { className: end_icon }) })))] })), _jsx("div", __assign({ className: "absolute mt-1 left-0 right-0 min-w-max rounded-lg bg-White overflow-y-scroll shadow-md z-10 max-h-80 ".concat(openDropdown ? "block" : "hidden") }, { children: (options === null || options === void 0 ? void 0 : options.constructor) === Array && options.length ? (options.map(function (option) {
|
|
27
19
|
var _a = option || {}, onSelect = _a.onSelect, restOptions = __rest(_a, ["onSelect"]);
|
|
28
20
|
var isActive = restOptions.value === (value && value["value"]);
|
|
29
21
|
return (_jsx(DropdownItem, __assign({}, restOptions, { active: isActive, onSelect: function (value) {
|
|
30
|
-
|
|
22
|
+
onChange && onChange(__assign({}, restOptions));
|
|
31
23
|
setOpenDropdown(false);
|
|
32
24
|
onSelect && onSelect(value);
|
|
33
25
|
} })));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownField.js","sourceRoot":"","sources":["../../../../src/components/dropdownField/DropdownField.tsx"],"names":[],"mappings":";;AAAA,OAAc,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAClD,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAE1C,IAAM,aAAa,GAAG,UAAC,
|
|
1
|
+
{"version":3,"file":"DropdownField.js","sourceRoot":"","sources":["../../../../src/components/dropdownField/DropdownField.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { DropdownItemsProps } from "../types";
|
|
3
|
-
declare const DropdownItems: ({ label, value, disabled, start_icon, active, end_icon, onSelect, }: DropdownItemsProps) => JSX.Element;
|
|
3
|
+
declare const DropdownItems: ({ className, label, value, disabled, start_icon, active, end_icon, onSelect, }: DropdownItemsProps) => JSX.Element;
|
|
4
4
|
export default DropdownItems;
|
|
@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { useState } from "react";
|
|
4
4
|
import Typography from "../typography/Typography";
|
|
5
5
|
var DropdownItems = function (_a) {
|
|
6
|
-
var label = _a.label, value = _a.value, disabled = _a.disabled, start_icon = _a.start_icon, _b = _a.active, active = _b === void 0 ? false : _b, end_icon = _a.end_icon, onSelect = _a.onSelect;
|
|
6
|
+
var className = _a.className, label = _a.label, value = _a.value, disabled = _a.disabled, start_icon = _a.start_icon, _b = _a.active, active = _b === void 0 ? false : _b, end_icon = _a.end_icon, onSelect = _a.onSelect;
|
|
7
7
|
var _c = useState(false), hover = _c[0], setHover = _c[1];
|
|
8
8
|
var onMouseEnterHandler = function () {
|
|
9
9
|
setHover(true);
|
|
@@ -17,7 +17,7 @@ var DropdownItems = function (_a) {
|
|
|
17
17
|
? "text-Gray-200"
|
|
18
18
|
: hover
|
|
19
19
|
? "text-Gray-700"
|
|
20
|
-
: "text-Gray-500") }, { children: _jsx("span", { className: start_icon }) }))), _jsx("div", __assign({ className: "flex-1 ".concat(disabled ? "text-Gray-200" : "text-Gray-700") }, { children: _jsx(Typography, __assign({ variant: hover && !disabled ? "Medium" : "Regular", type: "Text md" }, { children: label })) })), Boolean(end_icon) && (_jsx("div", __assign({ className: "ml-2 ".concat(!disabled && (hover || active)
|
|
20
|
+
: "text-Gray-500") }, { children: _jsx("span", { className: start_icon }) }))), _jsx("div", __assign({ className: "flex-1 ".concat(disabled ? "text-Gray-200" : "text-Gray-700", " ").concat(className) }, { children: _jsx(Typography, __assign({ variant: hover && !disabled ? "Medium" : "Regular", type: "Text md" }, { children: label })) })), Boolean(end_icon) && (_jsx("div", __assign({ className: "ml-2 ".concat(!disabled && (hover || active)
|
|
21
21
|
? "text-Primary-700"
|
|
22
22
|
: "text-Gray-200") }, { children: _jsx("span", { className: end_icon }) })))] })));
|
|
23
23
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownItem.js","sourceRoot":"","sources":["../../../../src/components/dropdownField/DropdownItem.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAElD,IAAM,aAAa,GAAG,UAAC,
|
|
1
|
+
{"version":3,"file":"DropdownItem.js","sourceRoot":"","sources":["../../../../src/components/dropdownField/DropdownItem.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAElD,IAAM,aAAa,GAAG,UAAC,EASF;QARnB,SAAS,eAAA,EACT,KAAK,WAAA,EACL,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,cAAc,EAAd,MAAM,mBAAG,KAAK,KAAA,EACd,QAAQ,cAAA,EACR,QAAQ,cAAA;IAEF,IAAA,KAAoB,QAAQ,CAAU,KAAK,CAAC,EAA3C,KAAK,QAAA,EAAE,QAAQ,QAA4B,CAAC;IAEnD,IAAM,mBAAmB,GAAG;QAC1B,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjB,CAAC,CAAC;IACF,IAAM,mBAAmB,GAAG;QAC1B,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClB,CAAC,CAAC;IAEF,OAAO,CACL,wBACE,OAAO,EAAE;YACP,CAAC,QAAQ,IAAI,QAAQ,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC3C,CAAC,EACD,SAAS,EAAE,uCACT,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,iCAAiC,CACnE,EACF,YAAY,EAAE,mBAAmB,EACjC,YAAY,EAAE,mBAAmB,iBAEhC,OAAO,CAAC,UAAU,CAAC,IAAI,CACtB,uBACE,SAAS,EAAE,eACT,QAAQ;oBACN,CAAC,CAAC,eAAe;oBACjB,CAAC,CAAC,KAAK;wBACP,CAAC,CAAC,eAAe;wBACjB,CAAC,CAAC,eAAe,CACnB,gBAEF,eAAM,SAAS,EAAE,UAAU,GAAS,IAChC,CACP,EACD,uBAAK,SAAS,EAAE,iBAAU,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,cAAI,SAAS,CAAE,gBACnF,KAAC,UAAU,aACT,OAAO,EAAE,KAAK,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAClD,IAAI,EAAC,SAAS,gBAEb,KAAK,IACK,IACT,EACL,OAAO,CAAC,QAAQ,CAAC,IAAI,CACpB,uBACE,SAAS,EAAE,eACT,CAAC,QAAQ,IAAI,CAAC,KAAK,IAAI,MAAM,CAAC;oBAC5B,CAAC,CAAC,kBAAkB;oBACpB,CAAC,CAAC,eAAe,CACnB,gBAEF,eAAM,SAAS,EAAE,QAAQ,GAAS,IAC9B,CACP,KACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
export type { AddSuggestionProps, AvatarGroupProps, AvatarProps, BadgeGroupProps, BadgeType, ButtonGroupsProps, ButtonProps, CardType, CheckboxGroupItemProps, CheckboxGroupProps, CheckboxProps, CollapsibleCardProps, DropdownFieldProps, DropdownItemsProps, InputFieldProps, InputFieldSplitProps, NestedDropdownFieldProps, NestedDropdownItemsProps, OtpFieldProps, ProgressBarProps, ProgressCircleProps, RadioBtnProps, RadioBtnSizeType, RadioBtnType, SliderLabelType, SliderProgressType, SliderProps, SliderType, TextAreaFieldProps, ToggleSwitchProps, ToggleSwitchSizeType, ToggleSwitchThemeType, TooltipProps, TypographyProps, checkboxSizeType, messageToastProps, messageToastType, } from "./types";
|
|
1
2
|
export { default as InputField } from "./inputField/InputField";
|
|
2
3
|
export { default as InputFieldSplit } from "./inputFieldSplit/InputFieldSplit";
|
|
3
4
|
export { default as Typography } from "./typography/Typography";
|
|
@@ -21,4 +22,6 @@ export { default as CheckboxGroupItem } from "./checkboxGroup/CheckboxGroupItem"
|
|
|
21
22
|
export { default as CheckboxGroup } from "./checkboxGroup/CheckboxGroup";
|
|
22
23
|
export { default as Slider } from "./slider/Slider";
|
|
23
24
|
export { default as BadgeGroup } from "./badgeGroup/BadgeGroup";
|
|
25
|
+
export { default as AddSuggestion } from "./addSuggestion/AddSuggestion";
|
|
24
26
|
export { default as MessageToast } from "./messageToast/MessageToast";
|
|
27
|
+
export { default as NestedDropdown } from "./nestedDropdown/NestedDropdown";
|
|
@@ -21,5 +21,7 @@ export { default as CheckboxGroupItem } from "./checkboxGroup/CheckboxGroupItem"
|
|
|
21
21
|
export { default as CheckboxGroup } from "./checkboxGroup/CheckboxGroup";
|
|
22
22
|
export { default as Slider } from "./slider/Slider";
|
|
23
23
|
export { default as BadgeGroup } from "./badgeGroup/BadgeGroup";
|
|
24
|
+
export { default as AddSuggestion } from "./addSuggestion/AddSuggestion";
|
|
24
25
|
export { default as MessageToast } from "./messageToast/MessageToast";
|
|
26
|
+
export { default as NestedDropdown } from "./nestedDropdown/NestedDropdown";
|
|
25
27
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/index.tsx"],"names":[],"mappings":"AAwCA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAEtE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAE1D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEpD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,8BAA8B,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAEtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACjF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEpD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,6BAA6B,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,iCAAiC,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { InputFieldProps } from "../types";
|
|
3
|
-
declare const InputField: ({
|
|
3
|
+
declare const InputField: ({ label, start_icon, end_icon, hint_text_icon, prefix, suffix, hint_text, char_count, errorMsg, inputProps, }: InputFieldProps) => JSX.Element;
|
|
4
4
|
export default InputField;
|
|
@@ -1,26 +1,14 @@
|
|
|
1
|
-
import { __assign
|
|
1
|
+
import { __assign } from "tslib";
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
3
|
import Typography from "../typography/Typography";
|
|
4
4
|
var InputField = function (_a) {
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var _h = form || {}, setFieldValue = _h.setFieldValue, touched = _h.touched, errors = _h.errors, setFieldTouched = _h.setFieldTouched;
|
|
8
|
-
var touch = touched && touched[name];
|
|
9
|
-
var error = errors && errors[name];
|
|
10
|
-
var errorMsg = touch && error ? error : undefined;
|
|
11
|
-
var handleChange = function (event) {
|
|
12
|
-
var changedValue = event.target.value;
|
|
13
|
-
setFieldValue && setFieldValue(name, changedValue);
|
|
14
|
-
onChange && onChange(changedValue);
|
|
15
|
-
};
|
|
16
|
-
var handleBlur = function () {
|
|
17
|
-
setFieldTouched && setFieldTouched(name, true);
|
|
18
|
-
};
|
|
5
|
+
var label = _a.label, _b = _a.start_icon, start_icon = _b === void 0 ? "" : _b, _c = _a.end_icon, end_icon = _c === void 0 ? "" : _c, _d = _a.hint_text_icon, hint_text_icon = _d === void 0 ? "" : _d, prefix = _a.prefix, suffix = _a.suffix, hint_text = _a.hint_text, char_count = _a.char_count, _e = _a.errorMsg, errorMsg = _e === void 0 ? "" : _e, inputProps = _a.inputProps;
|
|
6
|
+
var disabled = (inputProps || {}).disabled;
|
|
19
7
|
return (_jsxs("div", { children: [_jsxs("div", __assign({ className: "flex justify-between" }, { children: [Boolean(label) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: label })) }))), Boolean(char_count) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: char_count })) })))] })), _jsx(Typography, __assign({ variant: "Regular", type: "Text md" }, { children: _jsxs("div", __assign({ "data-setid": "error-msg", className: "flex border-1 overflow-hidden placeholder:text-Gray-500 ".concat(errorMsg ? "border-Error-300" : "border-Gray-300", " shadow-xs rounded-lg h-10 ").concat(disabled
|
|
20
8
|
? "bg-Gray-50"
|
|
21
9
|
: "bg-White ".concat(errorMsg
|
|
22
10
|
? "hover:shadow-xs-error"
|
|
23
|
-
: "hover:border-Primary-300 hover:shadow-xs-primary")) }, { children: [Boolean(prefix) && (_jsx("div", __assign({ "data-testid": "input-prefix", className: "bg-Gray-50 border-r-1 border-r-Gray-300 text-Gray-500 flex items-center px-2" }, { children: _jsx(Typography, __assign({ type: "Text md", variant: "Regular" }, { children: prefix })) }))), Boolean(start_icon) && (_jsx("div", __assign({ className: "text-Gray-500 flex items-center pl-2" }, { children: _jsx("span", { className: start_icon }) }))), _jsx("input", __assign({
|
|
11
|
+
: "hover:border-Primary-300 hover:shadow-xs-primary")) }, { children: [Boolean(prefix) && (_jsx("div", __assign({ "data-testid": "input-prefix", className: "bg-Gray-50 border-r-1 border-r-Gray-300 text-Gray-500 flex items-center px-2" }, { children: _jsx(Typography, __assign({ type: "Text md", variant: "Regular" }, { children: prefix })) }))), Boolean(start_icon) && (_jsx("div", __assign({ className: "text-Gray-500 flex items-center pl-2" }, { children: _jsx("span", { className: start_icon }) }))), _jsx("input", __assign({ type: "text", className: "flex-1 px-2 py-2 focus-visible:outline-0", "data-testid": "text-input" }, inputProps)), Boolean(end_icon) && (_jsx("div", __assign({ className: "text-Gray-500 flex items-center pr-2" }, { children: _jsx("span", { className: end_icon }) }))), Boolean(suffix) && (_jsx("div", __assign({ "data-testid": "input-suffix", className: "bg-Gray-50 border-l-1 border-l-Gray-300 text-Gray-500 flex items-center px-2" }, { children: _jsx(Typography, __assign({ type: "Text md", variant: "Regular" }, { children: suffix })) })))] })) })), (Boolean(hint_text) || Boolean(errorMsg)) && (_jsx("div", __assign({ className: "".concat(errorMsg ? "text-Error-500" : "text-Gray-500 mt-1") }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Regular" }, { children: errorMsg ? (String(errorMsg)) : (_jsxs(_Fragment, { children: [Boolean(hint_text_icon) && (_jsx("span", { className: hint_text_icon })), hint_text] })) })) })))] }));
|
|
24
12
|
};
|
|
25
13
|
export default InputField;
|
|
26
14
|
//# sourceMappingURL=InputField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputField.js","sourceRoot":"","sources":["../../../../src/components/inputField/InputField.tsx"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"InputField.js","sourceRoot":"","sources":["../../../../src/components/inputField/InputField.tsx"],"names":[],"mappings":";;AACA,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAElD,IAAM,UAAU,GAAG,UAAC,EAWF;QAVhB,KAAK,WAAA,EACL,kBAAe,EAAf,UAAU,mBAAG,EAAE,KAAA,EACf,gBAAa,EAAb,QAAQ,mBAAG,EAAE,KAAA,EACb,sBAAmB,EAAnB,cAAc,mBAAG,EAAE,KAAA,EACnB,MAAM,YAAA,EACN,MAAM,YAAA,EACN,SAAS,eAAA,EACT,UAAU,gBAAA,EACV,gBAAa,EAAb,QAAQ,mBAAG,EAAE,KAAA,EACb,UAAU,gBAAA;IAEF,IAAA,QAAQ,GAAK,CAAA,UAAU,IAAI,EAAE,CAAA,SAArB,CAAsB;IACtC,OAAO,CACL,0BACE,wBAAK,SAAS,EAAC,sBAAsB,iBAClC,OAAO,CAAC,KAAK,CAAC,IAAI,CACjB,uBAAK,SAAS,EAAC,oBAAoB,gBACjC,KAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,QAAQ,gBACxC,KAAK,IACK,IACT,CACP,EACA,OAAO,CAAC,UAAU,CAAC,IAAI,CACtB,uBAAK,SAAS,EAAC,oBAAoB,gBACjC,KAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,QAAQ,gBACxC,UAAU,IACA,IACT,CACP,KACG,EACN,KAAC,UAAU,aAAC,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS,gBAC1C,sCACc,WAAW,EACvB,SAAS,EAAE,kEACT,QAAQ,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,iBAAiB,yCAEjD,QAAQ;wBACN,CAAC,CAAC,YAAY;wBACd,CAAC,CAAC,mBACE,QAAQ;4BACN,CAAC,CAAC,uBAAuB;4BACzB,CAAC,CAAC,kDAAkD,CACtD,CACN,iBAED,OAAO,CAAC,MAAM,CAAC,IAAI,CAClB,sCACc,cAAc,EAC1B,SAAS,EAAC,8EAA8E,gBAExF,KAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,SAAS,gBACzC,MAAM,IACI,IACT,CACP,EACA,OAAO,CAAC,UAAU,CAAC,IAAI,CACtB,uBAAK,SAAS,EAAC,sCAAsC,gBACnD,eAAM,SAAS,EAAE,UAAU,GAAS,IAChC,CACP,EACD,yBACE,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,0CAA0C,iBACvC,YAAY,IACrB,UAAU,EACd,EACD,OAAO,CAAC,QAAQ,CAAC,IAAI,CACpB,uBAAK,SAAS,EAAC,sCAAsC,gBACnD,eAAM,SAAS,EAAE,QAAQ,GAAS,IAC9B,CACP,EACA,OAAO,CAAC,MAAM,CAAC,IAAI,CAClB,sCACc,cAAc,EAC1B,SAAS,EAAC,8EAA8E,gBAExF,KAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,SAAS,gBACzC,MAAM,IACI,IACT,CACP,KACG,IACK,EACZ,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAC5C,uBACE,SAAS,EAAE,UAAG,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,oBAAoB,CAAE,gBAElE,KAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,SAAS,gBACzC,QAAQ,CAAC,CAAC,CAAC,CACV,MAAM,CAAC,QAAQ,CAAC,CACjB,CAAC,CAAC,CAAC,CACF,8BACG,OAAO,CAAC,cAAc,CAAC,IAAI,CAC1B,eAAM,SAAS,EAAE,cAAc,GAAS,CACzC,EACA,SAAS,IACT,CACJ,IACU,IACT,CACP,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { InputFieldSplitProps } from "../types";
|
|
3
|
-
declare const InputFieldSplit: ({
|
|
3
|
+
declare const InputFieldSplit: ({ label, start_icon, end_icon, hint_text_icon, prefix, suffix, hint_text, fieldNames, char_count, errorMsg, onChange, value, inputProps, }: InputFieldSplitProps) => JSX.Element;
|
|
4
4
|
export default InputFieldSplit;
|
|
@@ -1,27 +1,19 @@
|
|
|
1
|
-
import { __assign
|
|
1
|
+
import { __assign } from "tslib";
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
3
|
import Typography from "../typography/Typography";
|
|
4
4
|
var InputFieldSplit = function (_a) {
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var _k = form || {}, setFieldValue = _k.setFieldValue, touched = _k.touched, errors = _k.errors, setFieldTouched = _k.setFieldTouched;
|
|
8
|
-
var touch = touched && touched[name];
|
|
9
|
-
var error = errors && errors[name];
|
|
10
|
-
var errorMsg = touch && error ? error : undefined;
|
|
5
|
+
var label = _a.label, _b = _a.start_icon, start_icon = _b === void 0 ? "" : _b, _c = _a.end_icon, end_icon = _c === void 0 ? "" : _c, _d = _a.hint_text_icon, hint_text_icon = _d === void 0 ? "" : _d, prefix = _a.prefix, suffix = _a.suffix, hint_text = _a.hint_text, fieldNames = _a.fieldNames, char_count = _a.char_count, errorMsg = _a.errorMsg, onChange = _a.onChange, value = _a.value, inputProps = _a.inputProps;
|
|
6
|
+
var disabled = (inputProps || {}).disabled;
|
|
11
7
|
var handleChange = function (fieldName) { return function (event) {
|
|
12
8
|
var _a;
|
|
13
9
|
var changedValue = __assign(__assign({}, value), (_a = {}, _a[fieldName] = event.target.value, _a));
|
|
14
|
-
setFieldValue && setFieldValue(name, changedValue);
|
|
15
10
|
onChange && onChange(changedValue);
|
|
16
11
|
}; };
|
|
17
|
-
var handleBlur = function () {
|
|
18
|
-
setFieldTouched && setFieldTouched(name, true);
|
|
19
|
-
};
|
|
20
12
|
return (_jsxs("div", { children: [_jsxs("div", __assign({ className: "flex justify-between" }, { children: [Boolean(label) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: label })) }))), Boolean(char_count) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: char_count })) })))] })), _jsx(Typography, __assign({ variant: "Regular", type: "Text md" }, { children: _jsxs("div", __assign({ className: "flex border-1 overflow-hidden placeholder:text-Gray-500 ".concat(errorMsg ? "border-Error-300" : "border-Gray-300", " shadow-xs rounded-lg h-10 ").concat(disabled
|
|
21
13
|
? "bg-Gray-50"
|
|
22
14
|
: "bg-White ".concat(errorMsg
|
|
23
15
|
? "hover:shadow-xs-error"
|
|
24
|
-
: "hover:border-Primary-300 hover:shadow-xs-primary")) }, { children: [Boolean(prefix) && (_jsx("div", __assign({ "data-testid": "input-prefix", className: "bg-Gray-50 border-r-1 border-r-Gray-300 text-Gray-500 flex items-center px-2" }, { children: _jsx(Typography, __assign({ type: "Text md", variant: "Regular" }, { children: prefix })) }))), Boolean(start_icon) && (_jsx("div", __assign({ className: "text-Gray-500 flex items-center pl-2" }, { children: _jsx("span", { className: start_icon }) }))), _jsxs("div", __assign({ className: "flex-1 relative flex min-w-[196px]" }, { children: [_jsx("input", __assign({
|
|
16
|
+
: "hover:border-Primary-300 hover:shadow-xs-primary")) }, { children: [Boolean(prefix) && (_jsx("div", __assign({ "data-testid": "input-prefix", className: "bg-Gray-50 border-r-1 border-r-Gray-300 text-Gray-500 flex items-center px-2" }, { children: _jsx(Typography, __assign({ type: "Text md", variant: "Regular" }, { children: prefix })) }))), Boolean(start_icon) && (_jsx("div", __assign({ className: "text-Gray-500 flex items-center pl-2" }, { children: _jsx("span", { className: start_icon }) }))), _jsxs("div", __assign({ className: "flex-1 relative flex min-w-[196px]" }, { children: [_jsx("input", __assign({ type: "text", className: "px-2 py-2 focus-visible:outline-0 absolute top-0 bottom-0 left-0 right-1/2 mr-1.5" }, inputProps, { value: value && value[fieldNames[0]], onChange: handleChange(fieldNames[0]), "data-testid": "text1-input" })), _jsx("div", __assign({ className: "flex-1 flex justify-center items-center" }, { children: _jsx(Typography, __assign({ type: "Text md", variant: "Regular", className: "text-Gray-300" }, { children: "/" })) })), _jsx("input", __assign({ type: "text", className: "px-2 py-2 focus-visible:outline-0 absolute top-0 bottom-0 left-1/2 right-0 ml-1.5" }, inputProps, { value: value && value[fieldNames[1]], onChange: handleChange(fieldNames[1]), "data-testid": "text2-input" }))] })), Boolean(end_icon) && (_jsx("div", __assign({ className: "text-Gray-500 flex items-center pr-2" }, { children: _jsx("span", { className: end_icon }) }))), Boolean(suffix) && (_jsx("div", __assign({ "data-testid": "input-suffix", className: "bg-Gray-50 border-l-1 border-l-Gray-300 text-Gray-500 flex items-center px-2" }, { children: _jsx(Typography, __assign({ type: "Text md", variant: "Regular" }, { children: suffix })) })))] })) })), (Boolean(hint_text) || Boolean(errorMsg)) && (_jsx("div", __assign({ className: "".concat(errorMsg ? "text-Error-500" : "text-Gray-500 mt-1") }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Regular" }, { children: errorMsg ? (String(errorMsg)) : (_jsxs(_Fragment, { children: [Boolean(hint_text_icon) && (_jsx("span", { className: hint_text_icon })), hint_text] })) })) })))] }));
|
|
25
17
|
};
|
|
26
18
|
export default InputFieldSplit;
|
|
27
19
|
//# sourceMappingURL=InputFieldSplit.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputFieldSplit.js","sourceRoot":"","sources":["../../../../src/components/inputFieldSplit/InputFieldSplit.tsx"],"names":[],"mappings":";;AAEA,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAElD,IAAM,eAAe,GAAG,UAAC,
|
|
1
|
+
{"version":3,"file":"InputFieldSplit.js","sourceRoot":"","sources":["../../../../src/components/inputFieldSplit/InputFieldSplit.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { messageToastProps } from "../types";
|
|
3
|
-
declare const MessageToast: ({
|
|
3
|
+
declare const MessageToast: ({ toastList }: messageToastProps) => JSX.Element;
|
|
4
4
|
export default MessageToast;
|
|
@@ -1,19 +1,24 @@
|
|
|
1
1
|
import { __assign } from "tslib";
|
|
2
|
-
import { jsx as _jsx
|
|
3
|
-
import
|
|
4
|
-
|
|
5
|
-
switch (color) {
|
|
6
|
-
case "Success":
|
|
7
|
-
return "text-Gray-700 bg-Success-100";
|
|
8
|
-
case "Error":
|
|
9
|
-
return "text-Error-600 bg-Error-100";
|
|
10
|
-
default:
|
|
11
|
-
return "text-Gray-700 bg-Error-100";
|
|
12
|
-
}
|
|
13
|
-
};
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { useEffect, useState } from "react";
|
|
4
|
+
import Toast from "./Toast";
|
|
14
5
|
var MessageToast = function (_a) {
|
|
15
|
-
var
|
|
16
|
-
|
|
6
|
+
var toastList = _a.toastList;
|
|
7
|
+
useEffect(function () {
|
|
8
|
+
var _a;
|
|
9
|
+
setList(toastList);
|
|
10
|
+
var timeout = setTimeout(function () {
|
|
11
|
+
setList([]);
|
|
12
|
+
}, (_a = toastList[0]) === null || _a === void 0 ? void 0 : _a.duration);
|
|
13
|
+
return function () {
|
|
14
|
+
clearTimeout(timeout);
|
|
15
|
+
};
|
|
16
|
+
}, [toastList]);
|
|
17
|
+
var clearToast = function () {
|
|
18
|
+
setList([]);
|
|
19
|
+
};
|
|
20
|
+
var _b = useState(toastList), list = _b[0], setList = _b[1];
|
|
21
|
+
return (_jsx("div", __assign({ className: "fixed z-90 bottom-10 right-8 flex flex-col justify-center items-center" }, { children: list.map(function (item) { return (_jsx(Toast, { toastDetails: item, clearToast: clearToast })); }) })));
|
|
17
22
|
};
|
|
18
23
|
export default MessageToast;
|
|
19
24
|
//# sourceMappingURL=MessageToast.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MessageToast.js","sourceRoot":"","sources":["../../../../src/components/messageToast/MessageToast.tsx"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"MessageToast.js","sourceRoot":"","sources":["../../../../src/components/messageToast/MessageToast.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,MAAM,SAAS,CAAC;AAE5B,IAAM,YAAY,GAAG,UAAC,EAAgC;QAA9B,SAAS,eAAA;IAC/B,SAAS,CAAC;;QACR,OAAO,CAAC,SAAS,CAAC,CAAC;QACnB,IAAM,OAAO,GAAG,UAAU,CAAC;YACzB,OAAO,CAAC,EAAE,CAAC,CAAC;QACd,CAAC,EAAE,MAAA,SAAS,CAAC,CAAC,CAAC,0CAAE,QAAQ,CAAC,CAAC;QAC3B,OAAO;YACL,YAAY,CAAC,OAAO,CAAC,CAAC;QACxB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,IAAM,UAAU,GAAG;QACjB,OAAO,CAAC,EAAE,CAAC,CAAC;IACd,CAAC,CAAC;IAEI,IAAA,KAAkB,QAAQ,CAAC,SAAS,CAAC,EAApC,IAAI,QAAA,EAAE,OAAO,QAAuB,CAAC;IAE5C,OAAO,CACL,uBAAK,SAAS,EAAC,wEAAwE,gBACpF,IAAI,CAAC,GAAG,CAAC,UAAC,IAAS,IAAK,OAAA,CACvB,KAAC,KAAK,IAAC,YAAY,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,GAAI,CACtD,EAFwB,CAExB,CAAC,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { __assign } from "tslib";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
+
import Typography from "../typography/Typography";
|
|
4
|
+
var Toast = function (props) {
|
|
5
|
+
var toastDetails = props.toastDetails, clearToast = props.clearToast;
|
|
6
|
+
var getTypeColor = function (color) {
|
|
7
|
+
switch (color) {
|
|
8
|
+
case "Success":
|
|
9
|
+
return "text-Gray-700 bg-Success-100";
|
|
10
|
+
case "Error":
|
|
11
|
+
return "text-Error-600 bg-Error-100";
|
|
12
|
+
default:
|
|
13
|
+
return "text-Gray-700 bg-Error-100";
|
|
14
|
+
}
|
|
15
|
+
};
|
|
16
|
+
return (_jsx(_Fragment, { children: _jsxs("div", __assign({ className: "px-2 py-1.5 w-72 h-15 rounded ".concat(getTypeColor(toastDetails === null || toastDetails === void 0 ? void 0 : toastDetails.type)) }, { children: [_jsxs("div", __assign({ className: "flex flex-row items-center justify-between" }, { children: [_jsx("div", __assign({ className: "" }, { children: toastDetails === null || toastDetails === void 0 ? void 0 : toastDetails.title })), _jsx("div", { className: "hx_close-circle cursor-pointer", onClick: clearToast })] })), _jsx("div", __assign({ className: "" }, { children: _jsx(Typography, __assign({ variant: "Regular", type: "Text sm", className: "text-Gray-500" }, { children: toastDetails === null || toastDetails === void 0 ? void 0 : toastDetails.description })) }))] }), toastDetails === null || toastDetails === void 0 ? void 0 : toastDetails.id) }));
|
|
17
|
+
};
|
|
18
|
+
export default Toast;
|
|
19
|
+
//# sourceMappingURL=Toast.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Toast.js","sourceRoot":"","sources":["../../../../src/components/messageToast/Toast.tsx"],"names":[],"mappings":";;AACA,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAElD,IAAM,KAAK,GAAG,UAAC,KAAU;IACf,IAAA,YAAY,GAAiB,KAAK,aAAtB,EAAE,UAAU,GAAK,KAAK,WAAV,CAAW;IAC3C,IAAM,YAAY,GAAG,UAAC,KAAuB;QAC3C,QAAQ,KAAK,EAAE;YACb,KAAK,SAAS;gBACZ,OAAO,8BAA8B,CAAC;YACxC,KAAK,OAAO;gBACV,OAAO,6BAA6B,CAAC;YACvC;gBACE,OAAO,4BAA4B,CAAC;SACvC;IACH,CAAC,CAAC;IACF,OAAO,CACL,4BACE,wBACE,SAAS,EAAE,wCAAiC,YAAY,CACtD,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,CACnB,CAAE,iBAGH,wBAAK,SAAS,EAAC,4CAA4C,iBACzD,uBAAK,SAAS,EAAC,EAAE,gBAAE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,KAAK,IAAO,EAC7C,cACE,SAAS,EAAC,gCAAgC,EAC1C,OAAO,EAAE,UAAU,GACnB,KACE,EACN,uBAAK,SAAS,EAAC,EAAE,gBACf,KAAC,UAAU,aACT,OAAO,EAAE,SAAS,EAClB,IAAI,EAAE,SAAS,EACf,SAAS,EAAC,eAAe,gBAExB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,WAAW,IACf,IACT,MAjBD,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,EAAE,CAkBjB,GACL,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { NestedDropdownFieldProps } from "../types";
|
|
3
|
+
declare const NestedDropdown: ({ label, hint_text_icon, empty_text, hint_text, value, onChange, placeholder, errorMsg, className, medicineAdData, nestDropdownOption, end_icon, selectedOption, handleNestedDropdownVal }: NestedDropdownFieldProps) => JSX.Element;
|
|
4
|
+
export default NestedDropdown;
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import { __assign, __rest } from "tslib";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
+
import { useState, useRef } from "react";
|
|
4
|
+
import InputField from "../inputField/InputField";
|
|
5
|
+
import Typography from "../typography/Typography";
|
|
6
|
+
import NestedDropdownItem from "./NestedDropdownItem";
|
|
7
|
+
var NestedDropdown = function (_a) {
|
|
8
|
+
var _b;
|
|
9
|
+
var label = _a.label, _c = _a.hint_text_icon, hint_text_icon = _c === void 0 ? "" : _c, _d = _a.empty_text, empty_text = _d === void 0 ? "Items Not found" : _d, hint_text = _a.hint_text, value = _a.value, onChange = _a.onChange, placeholder = _a.placeholder, _e = _a.errorMsg, errorMsg = _e === void 0 ? "" : _e, className = _a.className, medicineAdData = _a.medicineAdData, nestDropdownOption = _a.nestDropdownOption, end_icon = _a.end_icon, selectedOption = _a.selectedOption, handleNestedDropdownVal = _a.handleNestedDropdownVal;
|
|
10
|
+
var _f = useState(false), openDropdown = _f[0], setOpenDropdown = _f[1];
|
|
11
|
+
var _g = useState(false), isShowMedAd = _g[0], setShowmMedAd = _g[1];
|
|
12
|
+
var dropdownRef = useRef(null);
|
|
13
|
+
var _h = useState([]), filterList = _h[0], setFilterList = _h[1];
|
|
14
|
+
var getNestedDropdownPos = function () {
|
|
15
|
+
var _a;
|
|
16
|
+
var topPosVal = 0;
|
|
17
|
+
var leftPosVal = 0;
|
|
18
|
+
if (filterList && filterList.length) {
|
|
19
|
+
var findMedcineAdIndex = filterList.findIndex(function (item) { return item.nestedOptionData && item.nestedOptionData.length > 0; });
|
|
20
|
+
if (findMedcineAdIndex !== 0) {
|
|
21
|
+
topPosVal = 40 * (findMedcineAdIndex - 1); // top position calculated from -> option item height
|
|
22
|
+
}
|
|
23
|
+
if ((_a = dropdownRef === null || dropdownRef === void 0 ? void 0 : dropdownRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) {
|
|
24
|
+
var dropdownWidth = dropdownRef.current.offsetWidth;
|
|
25
|
+
leftPosVal = dropdownWidth + 5;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
return { topPosVal: topPosVal, leftPosVal: leftPosVal };
|
|
29
|
+
};
|
|
30
|
+
var handleNestedDropdownSelect = function (restOptions) {
|
|
31
|
+
var _a;
|
|
32
|
+
if ((_a = restOptions === null || restOptions === void 0 ? void 0 : restOptions.nestedOptionData) === null || _a === void 0 ? void 0 : _a.length) {
|
|
33
|
+
setShowmMedAd(true); // display nested dropdown
|
|
34
|
+
}
|
|
35
|
+
else {
|
|
36
|
+
onChange && onChange(__assign({}, restOptions));
|
|
37
|
+
setShowmMedAd(false);
|
|
38
|
+
setOpenDropdown(false);
|
|
39
|
+
handleNestedDropdownVal && handleNestedDropdownVal(restOptions);
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
var handleDropdownScroll = function () {
|
|
43
|
+
setShowmMedAd(false);
|
|
44
|
+
};
|
|
45
|
+
var handleInputValue = function (e) {
|
|
46
|
+
var value = e.target.value;
|
|
47
|
+
var dropdownOption = JSON.parse(JSON.stringify(nestDropdownOption));
|
|
48
|
+
if (value && value.length) {
|
|
49
|
+
// filter list
|
|
50
|
+
var filteredCharacters = dropdownOption
|
|
51
|
+
.map(function (item) {
|
|
52
|
+
if (item.label.toLowerCase().includes(value.toLowerCase())) {
|
|
53
|
+
console.log(item, value);
|
|
54
|
+
return item;
|
|
55
|
+
}
|
|
56
|
+
return undefined;
|
|
57
|
+
})
|
|
58
|
+
.filter(function (item) { return item !== undefined; });
|
|
59
|
+
setFilterList(filteredCharacters);
|
|
60
|
+
}
|
|
61
|
+
else {
|
|
62
|
+
setFilterList(dropdownOption); //for empty value display all list
|
|
63
|
+
}
|
|
64
|
+
setOpenDropdown(true);
|
|
65
|
+
};
|
|
66
|
+
var renderNestedDropdown = function () {
|
|
67
|
+
var nestedDropdown = [];
|
|
68
|
+
if (medicineAdData === null || medicineAdData === void 0 ? void 0 : medicineAdData.nestedOptionData) {
|
|
69
|
+
medicineAdData.nestedOptionData.map(function (item) {
|
|
70
|
+
nestedDropdown.push(_jsx(NestedDropdownItem, __assign({}, item, { onSelect: function () {
|
|
71
|
+
handleNestedDropdownSelect(item);
|
|
72
|
+
} })));
|
|
73
|
+
});
|
|
74
|
+
var res = getNestedDropdownPos();
|
|
75
|
+
return (_jsx("div", __assign({ style: { top: "".concat(res.topPosVal, "px"), left: "".concat(res.leftPosVal, "px") }, className: "absolute pr-16 pl-6 py-2 z-10 bg-White border-1 border-Gray-200 shadow-lg whitespace-nowrap\t left-[400px]" }, { children: nestedDropdown })));
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
var renderDropdownOption = function () {
|
|
79
|
+
if (filterList && filterList.length) {
|
|
80
|
+
var dropdownDom_1 = [];
|
|
81
|
+
var dropdownOption = JSON.parse(JSON.stringify(filterList));
|
|
82
|
+
dropdownOption.map(function (option) {
|
|
83
|
+
var restOptions = __rest(option || {}, []);
|
|
84
|
+
var isActive = restOptions.value === (value && value["value"]);
|
|
85
|
+
var isNestItem = restOptions.nestedOptionData && restOptions.nestedOptionData.length;
|
|
86
|
+
dropdownDom_1.push(_jsx(NestedDropdownItem, __assign({}, restOptions, { active: isActive, onSelect: function () {
|
|
87
|
+
handleNestedDropdownSelect(restOptions);
|
|
88
|
+
}, end_icon: isNestItem ? end_icon : "" })));
|
|
89
|
+
});
|
|
90
|
+
return dropdownDom_1;
|
|
91
|
+
}
|
|
92
|
+
return null;
|
|
93
|
+
};
|
|
94
|
+
return (_jsxs("div", { children: [_jsx("div", __assign({ className: "relative flex justify-between" }, { children: Boolean(label) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: label })) }))) })), _jsxs("div", __assign({ className: "relative block" }, { children: [_jsxs("div", __assign({ className: "".concat(className) }, { children: [!!value ? (_jsx("div", __assign({ className: "text-Gray-900" }, { children: _jsx(Typography, __assign({ "data-testid": "nested-dropdown-selected-value", variant: "Regular", type: "Text md" }, { children: value["label"] || value["value"] })) }))) : (_jsx("div", __assign({ className: "text-Gray-500" }, { children: _jsx(Typography, __assign({ variant: "Regular", type: "Text md" }, { children: placeholder })) }))), _jsx(InputField, { inputProps: {
|
|
95
|
+
value: selectedOption && selectedOption.label,
|
|
96
|
+
onChange: function (e) {
|
|
97
|
+
handleInputValue(e);
|
|
98
|
+
},
|
|
99
|
+
} })] })), _jsxs("div", __assign({ className: "relative ".concat(className) }, { children: [_jsx("div", __assign({ ref: dropdownRef, className: "".concat(className, " absolute mt-1 left-0 right-0 min-w-max rounded-lg bg-White overflow-y-scroll shadow-md z-10 max-h-80 ").concat(openDropdown ? "block" : "hidden"), onScroll: handleDropdownScroll }, { children: _jsx("div", { children: (nestDropdownOption === null || nestDropdownOption === void 0 ? void 0 : nestDropdownOption.constructor) === Array && nestDropdownOption.length ? (renderDropdownOption()) : (_jsx("div", __assign({ className: "h-10 flex items-center px-2" }, { children: _jsx("div", __assign({ className: "flex-1 text-Gray-700" }, { children: _jsx(Typography, __assign({ variant: "Regular", type: "Text md" }, { children: empty_text })) })) }))) }) })), isShowMedAd &&
|
|
100
|
+
openDropdown &&
|
|
101
|
+
((_b = medicineAdData === null || medicineAdData === void 0 ? void 0 : medicineAdData.nestedOptionData) === null || _b === void 0 ? void 0 : _b.length) > 0 &&
|
|
102
|
+
renderNestedDropdown()] }))] })), (Boolean(hint_text) || Boolean(errorMsg)) && (_jsx("div", __assign({ className: "".concat(errorMsg ? "text-Error-500" : "text-Gray-500 mt-1") }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Regular" }, { children: errorMsg ? (String(errorMsg)) : (_jsxs(_Fragment, { children: [Boolean(hint_text_icon) && (_jsx("span", { className: hint_text_icon })), hint_text] })) })) })))] }));
|
|
103
|
+
};
|
|
104
|
+
export default NestedDropdown;
|
|
105
|
+
//# sourceMappingURL=NestedDropdown.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NestedDropdown.js","sourceRoot":"","sources":["../../../../src/components/nestedDropdown/NestedDropdown.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { __assign } from "tslib";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState } from "react";
|
|
4
|
+
import Typography from "../typography/Typography";
|
|
5
|
+
var NestedDropdownItem = function (_a) {
|
|
6
|
+
var label = _a.label, value = _a.value, disabled = _a.disabled, start_icon = _a.start_icon, _b = _a.active, active = _b === void 0 ? false : _b, end_icon = _a.end_icon, onSelect = _a.onSelect;
|
|
7
|
+
var _c = useState(false), hover = _c[0], setHover = _c[1];
|
|
8
|
+
var onMouseEnterHandler = function () {
|
|
9
|
+
setHover(true);
|
|
10
|
+
};
|
|
11
|
+
var onMouseLeaveHandler = function () {
|
|
12
|
+
setHover(false);
|
|
13
|
+
};
|
|
14
|
+
return (_jsxs("div", __assign({ onClick: function () {
|
|
15
|
+
!disabled && onSelect && onSelect(value);
|
|
16
|
+
}, className: "relative h-10 flex items-center px-2 ".concat(disabled ? "cursor-not-allowed" : "hover:bg-Gray-50 cursor-pointer"), onMouseEnter: onMouseEnterHandler, onMouseLeave: onMouseLeaveHandler }, { children: [Boolean(start_icon) && (_jsx("div", __assign({ className: "mr-2 ".concat(disabled
|
|
17
|
+
? "text-Gray-200"
|
|
18
|
+
: hover
|
|
19
|
+
? "text-Gray-700"
|
|
20
|
+
: "text-Gray-500") }, { children: _jsx("span", { className: start_icon }) }))), _jsx("div", __assign({ className: "flex-1 ".concat(disabled ? "text-Gray-200" : "text-Gray-700") }, { children: _jsx(Typography, __assign({ variant: hover && !disabled ? "Medium" : "Regular", type: "Text md" }, { children: label })) })), Boolean(end_icon) && (_jsx("div", __assign({ className: "ml-2 ".concat(!disabled && (hover || active)
|
|
21
|
+
? "text-Primary-700"
|
|
22
|
+
: "text-Gray-200") }, { children: _jsx("span", { className: end_icon }) })))] })));
|
|
23
|
+
};
|
|
24
|
+
export default NestedDropdownItem;
|
|
25
|
+
//# sourceMappingURL=NestedDropdownItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NestedDropdownItem.js","sourceRoot":"","sources":["../../../../src/components/nestedDropdown/NestedDropdownItem.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAElD,IAAM,kBAAkB,GAAG,UAAC,EAQD;QAPzB,KAAK,WAAA,EACL,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,cAAc,EAAd,MAAM,mBAAG,KAAK,KAAA,EACd,QAAQ,cAAA,EACR,QAAQ,cAAA;IAEF,IAAA,KAAoB,QAAQ,CAAU,KAAK,CAAC,EAA3C,KAAK,QAAA,EAAE,QAAQ,QAA4B,CAAC;IAEnD,IAAM,mBAAmB,GAAG;QAC1B,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjB,CAAC,CAAC;IACF,IAAM,mBAAmB,GAAG;QAC1B,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClB,CAAC,CAAC;IAEF,OAAO,CACL,wBACE,OAAO,EAAE;YACP,CAAC,QAAQ,IAAI,QAAQ,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC3C,CAAC,EACD,SAAS,EAAE,gDACT,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,iCAAiC,CACnE,EACF,YAAY,EAAE,mBAAmB,EACjC,YAAY,EAAE,mBAAmB,iBAEhC,OAAO,CAAC,UAAU,CAAC,IAAI,CACtB,uBACE,SAAS,EAAE,eACT,QAAQ;oBACN,CAAC,CAAC,eAAe;oBACjB,CAAC,CAAC,KAAK;wBACP,CAAC,CAAC,eAAe;wBACjB,CAAC,CAAC,eAAe,CACnB,gBAEF,eAAM,SAAS,EAAE,UAAU,GAAS,IAChC,CACP,EACD,uBAAK,SAAS,EAAE,iBAAU,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,CAAE,gBACtE,KAAC,UAAU,aACT,OAAO,EAAE,KAAK,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAClD,IAAI,EAAC,SAAS,gBAEb,KAAK,IACK,IACT,EACL,OAAO,CAAC,QAAQ,CAAC,IAAI,CACpB,uBACE,SAAS,EAAE,eACT,CAAC,QAAQ,IAAI,CAAC,KAAK,IAAI,MAAM,CAAC;oBAC5B,CAAC,CAAC,kBAAkB;oBACpB,CAAC,CAAC,eAAe,CACnB,gBAEF,eAAM,SAAS,EAAE,QAAQ,GAAS,IAC9B,CACP,KACG,CACP,CAAC;AACH,CAAC,CAAA;AAEF,eAAe,kBAAkB,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { OtpFieldProps } from "../types";
|
|
3
|
-
declare const OtpField: ({
|
|
3
|
+
declare const OtpField: ({ label, hint_text_icon, hint_text, digits, size, errorMsg, inputProps, }: OtpFieldProps) => JSX.Element;
|
|
4
4
|
export default OtpField;
|
|
@@ -20,22 +20,12 @@ var getSizeClassName = function (size) {
|
|
|
20
20
|
return className;
|
|
21
21
|
};
|
|
22
22
|
var OtpField = function (_a) {
|
|
23
|
-
var
|
|
24
|
-
var
|
|
25
|
-
|
|
26
|
-
var touch = touched && touched[name];
|
|
27
|
-
var error = errors && errors[name];
|
|
28
|
-
var errorMsg = touch && error ? error : undefined;
|
|
29
|
-
var handleChange = function (event) {
|
|
30
|
-
setFieldValue && setFieldValue(name, event.target.value);
|
|
31
|
-
};
|
|
32
|
-
var handleBlur = function () {
|
|
33
|
-
setFieldTouched && setFieldTouched(name, true);
|
|
34
|
-
};
|
|
35
|
-
return (_jsxs("div", { children: [Boolean(label) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: label })) }))), _jsxs("div", __assign({ className: "relative inline-block" }, { children: [_jsx("input", { onBlur: handleBlur, disabled: disabled, type: "text", className: "absolute top-0 bottom-0 left-0 right-0 opacity-0", value: value, maxLength: digits, onChange: handleChange }), _jsx("div", __assign({ className: "flex pointer-events-none" }, { children: Array(digits)
|
|
23
|
+
var label = _a.label, _b = _a.hint_text_icon, hint_text_icon = _b === void 0 ? "" : _b, hint_text = _a.hint_text, _c = _a.digits, digits = _c === void 0 ? 6 : _c, _d = _a.size, size = _d === void 0 ? "md" : _d, _e = _a.errorMsg, errorMsg = _e === void 0 ? "" : _e, inputProps = _a.inputProps;
|
|
24
|
+
var value = (inputProps || {}).value;
|
|
25
|
+
return (_jsxs("div", { children: [Boolean(label) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: label })) }))), _jsxs("div", __assign({ className: "relative inline-block" }, { children: [_jsx("input", __assign({ type: "text", className: "absolute top-0 bottom-0 left-0 right-0 opacity-0", maxLength: digits }, inputProps)), _jsx("div", __assign({ className: "flex pointer-events-none" }, { children: Array(digits)
|
|
36
26
|
.fill("")
|
|
37
27
|
.map(function (_, index) {
|
|
38
|
-
return (_jsxs("div", __assign({ className: "flex items-center justify-center" }, { children: [digits === 6 && index === 3 && (_jsx("div", __assign({ className: "text-Gray-300" }, { children: _jsx(Typography, __assign({ type: "Display xl", variant: "Medium" }, { children: "-" })) }))), _jsx("div", __assign({ className: "flex items-center justify-center border-1 border-Gray-300 rounded-lg mx-1 ".concat(getSizeClassName(size)) }, { children:
|
|
28
|
+
return (_jsxs("div", __assign({ className: "flex items-center justify-center" }, { children: [digits === 6 && index === 3 && (_jsx("div", __assign({ className: "text-Gray-300" }, { children: _jsx(Typography, __assign({ type: "Display xl", variant: "Medium" }, { children: "-" })) }))), _jsx("div", __assign({ className: "flex items-center justify-center border-1 border-Gray-300 rounded-lg mx-1 ".concat(getSizeClassName(size)) }, { children: typeof value === "string" && !!value[index] ? (_jsx(Typography, __assign({ type: size === "lg" ? "Display xl" : "Display lg", variant: "Medium" }, { children: value[index] }))) : (_jsx("div", __assign({ className: "text-Gray-300" }, { children: _jsx(Typography, __assign({ type: size === "lg" ? "Display xl" : "Display lg", variant: "Medium" }, { children: "0" })) }))) }))] }), index));
|
|
39
29
|
}) }))] })), (Boolean(hint_text) || Boolean(errorMsg)) && (_jsx("div", __assign({ className: "".concat(errorMsg ? "text-Error-500" : "text-Gray-500 mt-1") }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Regular" }, { children: errorMsg ? (String(errorMsg)) : (_jsxs(_Fragment, { children: [Boolean(hint_text_icon) && (_jsx("span", { className: hint_text_icon })), hint_text] })) })) })))] }));
|
|
40
30
|
};
|
|
41
31
|
export default OtpField;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OtpField.js","sourceRoot":"","sources":["../../../../src/components/otpField/OtpField.tsx"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"OtpField.js","sourceRoot":"","sources":["../../../../src/components/otpField/OtpField.tsx"],"names":[],"mappings":";;AAAA,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAIlD,IAAM,gBAAgB,GAAG,UAAC,IAAY;IACpC,IAAI,SAAiB,CAAC;IACtB,QAAQ,IAAI,EAAE;QACZ,KAAK,IAAI;YACP,SAAS,GAAG,WAAW,CAAC;YACxB,MAAM;QACR,KAAK,IAAI;YACP,SAAS,GAAG,WAAW,CAAC;YACxB,MAAM;QACR,KAAK,IAAI;YACP,SAAS,GAAG,WAAW,CAAC;YACxB,MAAM;QACR;YACE,SAAS,GAAG,EAAE,CAAC;YACf,MAAM;KACT;IACD,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,IAAM,QAAQ,GAAG,UAAC,EAQF;QAPd,KAAK,WAAA,EACL,sBAAmB,EAAnB,cAAc,mBAAG,EAAE,KAAA,EACnB,SAAS,eAAA,EACT,cAAU,EAAV,MAAM,mBAAG,CAAC,KAAA,EACV,YAAW,EAAX,IAAI,mBAAG,IAAI,KAAA,EACX,gBAAa,EAAb,QAAQ,mBAAG,EAAE,KAAA,EACb,UAAU,gBAAA;IAEF,IAAA,KAAK,GAAK,CAAA,UAAU,IAAI,EAAE,CAAA,MAArB,CAAsB;IACnC,OAAO,CACL,0BACG,OAAO,CAAC,KAAK,CAAC,IAAI,CACjB,uBAAK,SAAS,EAAC,oBAAoB,gBACjC,KAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,QAAQ,gBACxC,KAAK,IACK,IACT,CACP,EACD,wBAAK,SAAS,EAAC,uBAAuB,iBACpC,yBACE,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,kDAAkD,EAC5D,SAAS,EAAE,MAAM,IACb,UAAU,EACd,EACF,uBAAK,SAAS,EAAC,0BAA0B,gBACtC,KAAK,CAAC,MAAM,CAAC;6BACX,IAAI,CAAC,EAAE,CAAC;6BACR,GAAG,CAAC,UAAC,CAAC,EAAE,KAAK;4BACZ,OAAO,CACL,wBAAiB,SAAS,EAAE,kCAAkC,iBAC3D,MAAM,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,IAAI,CAC9B,uBAAK,SAAS,EAAC,eAAe,gBAC5B,KAAC,UAAU,aAAC,IAAI,EAAC,YAAY,EAAC,OAAO,EAAC,QAAQ,uBAEjC,IACT,CACP,EACD,uBACE,SAAS,EAAE,oFAA6E,gBAAgB,CACtG,IAAI,CACL,CAAE,gBAEF,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAC7C,KAAC,UAAU,aACT,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,EACjD,OAAO,EAAC,QAAQ,gBAEf,KAAK,CAAC,KAAK,CAAC,IACF,CACd,CAAC,CAAC,CAAC,CACF,uBAAK,SAAS,EAAC,eAAe,gBAC5B,KAAC,UAAU,aACT,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,EACjD,OAAO,EAAC,QAAQ,uBAGL,IACT,CACP,IACG,MA9BE,KAAK,CA+BT,CACP,CAAC;wBACJ,CAAC,CAAC,IACA,KACF,EACL,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAC5C,uBACE,SAAS,EAAE,UAAG,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,oBAAoB,CAAE,gBAElE,KAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,SAAS,gBACzC,QAAQ,CAAC,CAAC,CAAC,CACV,MAAM,CAAC,QAAQ,CAAC,CACjB,CAAC,CAAC,CAAC,CACF,8BACG,OAAO,CAAC,cAAc,CAAC,IAAI,CAC1B,eAAM,SAAS,EAAE,cAAc,GAAS,CACzC,EACA,SAAS,IACT,CACJ,IACU,IACT,CACP,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { TextAreaFieldProps } from "../types";
|
|
3
|
-
declare const TextAreaField: ({
|
|
3
|
+
declare const TextAreaField: ({ label, hint_text_icon, hint_text, errorMsg, inputProps, height }: TextAreaFieldProps) => JSX.Element;
|
|
4
4
|
export default TextAreaField;
|
|
@@ -1,24 +1,14 @@
|
|
|
1
|
-
import { __assign
|
|
1
|
+
import { __assign } from "tslib";
|
|
2
2
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import Typography from "../typography/Typography";
|
|
4
4
|
var TextAreaField = function (_a) {
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
var touch = touched && touched[name];
|
|
9
|
-
var error = errors && errors[name];
|
|
10
|
-
var errorMsg = touch && error ? error : undefined;
|
|
11
|
-
var handleChange = function (event) {
|
|
12
|
-
setFieldValue && setFieldValue(name, event.target.value);
|
|
13
|
-
};
|
|
14
|
-
var handleBlur = function () {
|
|
15
|
-
setFieldTouched && setFieldTouched(name, true);
|
|
16
|
-
};
|
|
17
|
-
return (_jsxs("div", { children: [Boolean(label) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: label })) }))), _jsx(Typography, __assign({ variant: "Regular", type: "Text md" }, { children: _jsx("div", __assign({ className: "flex border-1 overflow-hidden placeholder:text-Gray-500 ".concat(errorMsg ? "border-Error-300" : "border-Gray-300", " shadow-xs rounded-lg h-32 ").concat(disabled
|
|
5
|
+
var label = _a.label, _b = _a.hint_text_icon, hint_text_icon = _b === void 0 ? "" : _b, hint_text = _a.hint_text, _c = _a.errorMsg, errorMsg = _c === void 0 ? "" : _c, inputProps = _a.inputProps, _d = _a.height, height = _d === void 0 ? 'h-32' : _d;
|
|
6
|
+
var disabled = (inputProps || {}).disabled;
|
|
7
|
+
return (_jsxs("div", { children: [Boolean(label) && (_jsx("div", __assign({ className: "text-Gray-700 mb-1" }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: label })) }))), _jsx(Typography, __assign({ variant: "Regular", type: "Text md" }, { children: _jsx("div", __assign({ className: "flex border-1 overflow-hidden placeholder:text-Gray-500 ".concat(errorMsg ? "border-Error-300" : "border-Gray-300", " shadow-xs rounded-lg ").concat(height, " ").concat(disabled
|
|
18
8
|
? "bg-Gray-50"
|
|
19
9
|
: "bg-White ".concat(errorMsg
|
|
20
10
|
? "hover:shadow-xs-error"
|
|
21
|
-
: "hover:border-Primary-300 hover:shadow-xs-primary")) }, { children: _jsx("textarea", __assign({
|
|
11
|
+
: "hover:border-Primary-300 hover:shadow-xs-primary")) }, { children: _jsx("textarea", __assign({ className: "flex-1 px-2 py-2 focus-visible:outline-0" }, inputProps)) })) })), (Boolean(hint_text) || Boolean(errorMsg)) && (_jsx("div", __assign({ className: "".concat(errorMsg ? "text-Error-500" : "text-Gray-500 mt-1") }, { children: _jsx(Typography, __assign({ type: "Text sm", variant: "Regular" }, { children: errorMsg ? (String(errorMsg)) : (_jsxs(_Fragment, { children: [Boolean(hint_text_icon) && (_jsx("span", { className: hint_text_icon })), hint_text] })) })) })))] }));
|
|
22
12
|
};
|
|
23
13
|
export default TextAreaField;
|
|
24
14
|
//# sourceMappingURL=TextAreaField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextAreaField.js","sourceRoot":"","sources":["../../../../src/components/textAreaField/TextAreaField.tsx"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"TextAreaField.js","sourceRoot":"","sources":["../../../../src/components/textAreaField/TextAreaField.tsx"],"names":[],"mappings":";;AAAA,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAIlD,IAAM,aAAa,GAAG,UAAC,EAOH;QANlB,KAAK,WAAA,EACL,sBAAmB,EAAnB,cAAc,mBAAG,EAAE,KAAA,EACnB,SAAS,eAAA,EACT,gBAAa,EAAb,QAAQ,mBAAG,EAAE,KAAA,EACb,UAAU,gBAAA,EACV,cAAe,EAAf,MAAM,mBAAG,MAAM,KAAA;IAGP,IAAA,QAAQ,GAAK,CAAA,UAAU,IAAI,EAAE,CAAA,SAArB,CAAsB;IACtC,OAAO,CACL,0BACG,OAAO,CAAC,KAAK,CAAC,IAAI,CACjB,uBAAK,SAAS,EAAC,oBAAoB,gBACjC,KAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,QAAQ,gBACxC,KAAK,IACK,IACT,CACP,EACD,KAAC,UAAU,aAAC,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS,gBAC1C,uBACE,SAAS,EAAE,kEACT,QAAQ,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,iBAAiB,mCAC1B,MAAM,cAC7B,QAAQ;wBACN,CAAC,CAAC,YAAY;wBACd,CAAC,CAAC,mBACE,QAAQ;4BACN,CAAC,CAAC,uBAAuB;4BACzB,CAAC,CAAC,kDAAkD,CACtD,CACN,gBAEF,4BACE,SAAS,EAAC,0CAA0C,IAChD,UAAU,EACd,IACE,IACK,EACZ,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAC5C,uBACE,SAAS,EAAE,UAAG,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,oBAAoB,CAAE,gBAElE,KAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,SAAS,gBACzC,QAAQ,CAAC,CAAC,CAAC,CACV,MAAM,CAAC,QAAQ,CAAC,CACjB,CAAC,CAAC,CAAC,CACF,8BACG,OAAO,CAAC,cAAc,CAAC,IAAI,CAC1B,eAAM,SAAS,EAAE,cAAc,GAAS,CACzC,EACA,SAAS,IACT,CACJ,IACU,IACT,CACP,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { FieldProps } from "formik";
|
|
2
1
|
import { ReactNode } from "react";
|
|
3
|
-
export interface InputFieldProps
|
|
2
|
+
export interface InputFieldProps {
|
|
4
3
|
label?: string;
|
|
5
4
|
prefix?: ReactNode;
|
|
6
5
|
suffix?: ReactNode;
|
|
@@ -9,41 +8,46 @@ export interface InputFieldProps extends Partial<FieldProps> {
|
|
|
9
8
|
hint_text?: string;
|
|
10
9
|
hint_text_icon?: string;
|
|
11
10
|
char_count?: string;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
onChange?: (val: string) => void;
|
|
11
|
+
errorMsg?: string;
|
|
12
|
+
inputProps: React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
|
|
15
13
|
}
|
|
16
|
-
export interface InputFieldSplitProps
|
|
14
|
+
export interface InputFieldSplitProps {
|
|
17
15
|
label?: string;
|
|
18
16
|
prefix?: ReactNode;
|
|
19
17
|
suffix?: ReactNode;
|
|
20
18
|
start_icon?: string;
|
|
21
19
|
end_icon?: string;
|
|
22
|
-
fieldNames
|
|
20
|
+
fieldNames: [string, string];
|
|
23
21
|
hint_text?: string;
|
|
24
22
|
hint_text_icon?: string;
|
|
25
23
|
char_count?: string;
|
|
26
|
-
|
|
27
|
-
placeholder?: string;
|
|
24
|
+
errorMsg?: string;
|
|
28
25
|
onChange?: (val: {
|
|
29
26
|
[key: string]: string;
|
|
30
27
|
}) => void;
|
|
28
|
+
value?: {
|
|
29
|
+
[key: string]: string;
|
|
30
|
+
};
|
|
31
|
+
inputProps: React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
|
|
31
32
|
}
|
|
32
33
|
declare type otpSizeType = "lg" | "md" | "sm";
|
|
33
|
-
export interface OtpFieldProps
|
|
34
|
+
export interface OtpFieldProps {
|
|
34
35
|
label?: string;
|
|
35
36
|
hint_text?: string;
|
|
36
37
|
hint_text_icon?: string;
|
|
37
38
|
disabled?: boolean;
|
|
38
39
|
size?: otpSizeType;
|
|
39
40
|
digits?: number;
|
|
41
|
+
errorMsg?: string;
|
|
42
|
+
inputProps: React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
|
|
40
43
|
}
|
|
41
|
-
export interface TextAreaFieldProps
|
|
44
|
+
export interface TextAreaFieldProps {
|
|
42
45
|
label?: string;
|
|
43
46
|
hint_text?: string;
|
|
44
47
|
hint_text_icon?: string;
|
|
45
|
-
|
|
46
|
-
|
|
48
|
+
errorMsg?: string;
|
|
49
|
+
inputProps: React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>;
|
|
50
|
+
height?: string;
|
|
47
51
|
}
|
|
48
52
|
declare type badgesizeType = "sm" | "md" | "lg";
|
|
49
53
|
declare type badgeiconType = "Left" | "Right" | "Only";
|
|
@@ -82,14 +86,12 @@ export interface ProgressCircleProps extends React.DetailedHTMLProps<React.HTMLA
|
|
|
82
86
|
declare type hierarchyType = "Primary" | "Secondary" | "Secondary-Grey" | "Tertiary" | "Tertiary-Grey" | "Link-Colour" | "Link-Grey";
|
|
83
87
|
declare type buttonSizeType = "sm" | "md" | "lg" | "xl" | "2xl";
|
|
84
88
|
declare type iconType = "No" | "Left" | "Right" | "Only";
|
|
85
|
-
export interface ButtonProps {
|
|
89
|
+
export interface ButtonProps extends React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> {
|
|
86
90
|
hierarchy: hierarchyType;
|
|
87
91
|
size: buttonSizeType;
|
|
88
92
|
icon?: iconType;
|
|
89
93
|
iconFile?: string;
|
|
90
94
|
textField: string;
|
|
91
|
-
disabled: boolean;
|
|
92
|
-
onClick?: () => void;
|
|
93
95
|
}
|
|
94
96
|
export declare type checkboxSizeType = "sm" | "md";
|
|
95
97
|
export interface CheckboxProps {
|
|
@@ -105,7 +107,9 @@ declare type ButtonGroupOptionType = {
|
|
|
105
107
|
start_icon?: string;
|
|
106
108
|
end_icon?: string;
|
|
107
109
|
};
|
|
108
|
-
export interface ButtonGroupsProps
|
|
110
|
+
export interface ButtonGroupsProps {
|
|
111
|
+
value?: string;
|
|
112
|
+
onChange?: (value: string) => void;
|
|
109
113
|
options: Array<ButtonGroupOptionType>;
|
|
110
114
|
disabled: boolean;
|
|
111
115
|
}
|
|
@@ -139,7 +143,8 @@ export interface AvatarGroupProps {
|
|
|
139
143
|
moreUser?: boolean;
|
|
140
144
|
}
|
|
141
145
|
export interface DropdownItemsProps {
|
|
142
|
-
|
|
146
|
+
className?: string;
|
|
147
|
+
label: string;
|
|
143
148
|
start_icon?: string;
|
|
144
149
|
end_icon?: string;
|
|
145
150
|
value?: any;
|
|
@@ -147,12 +152,15 @@ export interface DropdownItemsProps {
|
|
|
147
152
|
disabled?: boolean;
|
|
148
153
|
onSelect?: (value: any) => void;
|
|
149
154
|
}
|
|
150
|
-
export interface DropdownFieldProps
|
|
155
|
+
export interface DropdownFieldProps {
|
|
151
156
|
label?: string;
|
|
152
157
|
end_icon?: string;
|
|
153
158
|
hint_text?: string;
|
|
154
159
|
hint_text_icon?: string;
|
|
155
160
|
disabled?: boolean;
|
|
161
|
+
errorMsg?: string;
|
|
162
|
+
value?: DropdownItemsProps;
|
|
163
|
+
onChange?: (value: DropdownItemsProps) => void;
|
|
156
164
|
placeholder?: string;
|
|
157
165
|
empty_text?: string;
|
|
158
166
|
options?: Array<DropdownItemsProps>;
|
|
@@ -173,6 +181,8 @@ export interface CollapsibleCardProps {
|
|
|
173
181
|
height?: string;
|
|
174
182
|
icon?: iconType;
|
|
175
183
|
disabled?: boolean;
|
|
184
|
+
handleCollapsibleDisplay?: Function;
|
|
185
|
+
headerRightChildren?: ReactNode;
|
|
176
186
|
}
|
|
177
187
|
export declare type RadioBtnSizeType = "sm" | "md";
|
|
178
188
|
export declare type RadioBtnType = "checkmark" | "dot";
|
|
@@ -210,7 +220,7 @@ export interface CheckboxGroupItemProps {
|
|
|
210
220
|
limited?: boolean;
|
|
211
221
|
onClick?: () => void;
|
|
212
222
|
}
|
|
213
|
-
export interface CheckboxGroupProps
|
|
223
|
+
export interface CheckboxGroupProps {
|
|
214
224
|
variant?: CheckboxGroupType;
|
|
215
225
|
size?: CheckboxGroupSize;
|
|
216
226
|
options: Array<CheckboxGroupItemProps>;
|
|
@@ -242,9 +252,42 @@ export interface BadgeGroupProps {
|
|
|
242
252
|
}
|
|
243
253
|
export declare type messageToastType = "Error" | "Success";
|
|
244
254
|
export interface messageToastProps {
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
255
|
+
toastList: any;
|
|
256
|
+
}
|
|
257
|
+
export interface NestedDropdownFieldProps {
|
|
258
|
+
label?: string;
|
|
259
|
+
end_icon?: string;
|
|
260
|
+
hint_text?: string;
|
|
261
|
+
hint_text_icon?: string;
|
|
262
|
+
disabled?: boolean;
|
|
263
|
+
errorMsg?: string;
|
|
264
|
+
value?: DropdownItemsProps;
|
|
265
|
+
onChange?: (value: DropdownItemsProps) => void;
|
|
266
|
+
placeholder?: string;
|
|
267
|
+
empty_text?: string;
|
|
268
|
+
options?: Array<DropdownItemsProps>;
|
|
269
|
+
className?: string;
|
|
270
|
+
nestedDropdownOption?: any;
|
|
271
|
+
medicineAdData?: any;
|
|
272
|
+
nestDropdownOption?: any;
|
|
273
|
+
handleNestedDropdownVal?: Function;
|
|
274
|
+
selectedOption?: any;
|
|
275
|
+
}
|
|
276
|
+
export interface NestedDropdownItemsProps {
|
|
277
|
+
label?: string;
|
|
278
|
+
start_icon?: string;
|
|
279
|
+
end_icon?: string;
|
|
280
|
+
value?: any;
|
|
281
|
+
active?: boolean;
|
|
282
|
+
disabled?: boolean;
|
|
283
|
+
onSelect?: (value: any) => void;
|
|
284
|
+
}
|
|
285
|
+
export interface AddSuggestionProps {
|
|
286
|
+
label?: string;
|
|
287
|
+
hint_text?: string;
|
|
288
|
+
hint_text_icon?: string;
|
|
289
|
+
errorMsg?: string;
|
|
290
|
+
inputProps?: React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>;
|
|
291
|
+
options?: Array<DropdownItemsProps>;
|
|
249
292
|
}
|
|
250
293
|
export {};
|
package/package.json
CHANGED
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
"frontend",
|
|
10
10
|
"healthplix"
|
|
11
11
|
],
|
|
12
|
-
"version": "1.0.
|
|
12
|
+
"version": "1.0.9",
|
|
13
13
|
"main": "dist/esm/components/index.js",
|
|
14
14
|
"module": "dist/esm/components/index.d.ts",
|
|
15
15
|
"files": [
|
|
@@ -29,15 +29,13 @@
|
|
|
29
29
|
"@types/node": "^16.11.46",
|
|
30
30
|
"@types/react": "^18.0.15",
|
|
31
31
|
"@types/react-dom": "^18.0.6",
|
|
32
|
-
"formik": "^2.2.9",
|
|
33
32
|
"hplx-ui-icons": "^2.2.6",
|
|
34
33
|
"react": "^18.2.0",
|
|
35
34
|
"react-dom": "^18.2.0",
|
|
36
35
|
"react-scripts": "5.0.1",
|
|
37
36
|
"typescript": "^4.7.4",
|
|
38
37
|
"web-vitals": "^2.1.4",
|
|
39
|
-
"webfontloader": "^1.6.28"
|
|
40
|
-
"yup": "^0.32.11"
|
|
38
|
+
"webfontloader": "^1.6.28"
|
|
41
39
|
},
|
|
42
40
|
"scripts": {
|
|
43
41
|
"start": "react-scripts start",
|