hplx-react-elements-dev 1.0.0 → 1.0.8
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/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/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/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/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 +4 -14
- package/dist/esm/components/textAreaField/TextAreaField.js.map +1 -1
- package/dist/esm/components/types.d.ts +25 -19
- package/package.json +2 -4
package/README.md
CHANGED
|
@@ -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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"}
|
|
@@ -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 { 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 { 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":"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"}
|
|
@@ -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, }: 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
|
-
var _f = form || {}, setFieldValue = _f.setFieldValue, touched = _f.touched, errors = _f.errors, setFieldTouched = _f.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
|
-
setFieldValue && setFieldValue(name, event.target.value);
|
|
13
|
-
};
|
|
14
|
-
var handleBlur = function () {
|
|
15
|
-
setFieldTouched && setFieldTouched(name, true);
|
|
16
|
-
};
|
|
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;
|
|
6
|
+
var disabled = (inputProps || {}).disabled;
|
|
17
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 h-32 ").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,EAMF;QALnB,KAAK,WAAA,EACL,sBAAmB,EAAnB,cAAc,mBAAG,EAAE,KAAA,EACnB,SAAS,eAAA,EACT,gBAAa,EAAb,QAAQ,mBAAG,EAAE,KAAA,EACb,UAAU,gBAAA;IAEF,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,yCAEjD,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,45 @@ 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>;
|
|
47
50
|
}
|
|
48
51
|
declare type badgesizeType = "sm" | "md" | "lg";
|
|
49
52
|
declare type badgeiconType = "Left" | "Right" | "Only";
|
|
@@ -82,14 +85,12 @@ export interface ProgressCircleProps extends React.DetailedHTMLProps<React.HTMLA
|
|
|
82
85
|
declare type hierarchyType = "Primary" | "Secondary" | "Secondary-Grey" | "Tertiary" | "Tertiary-Grey" | "Link-Colour" | "Link-Grey";
|
|
83
86
|
declare type buttonSizeType = "sm" | "md" | "lg" | "xl" | "2xl";
|
|
84
87
|
declare type iconType = "No" | "Left" | "Right" | "Only";
|
|
85
|
-
export interface ButtonProps {
|
|
88
|
+
export interface ButtonProps extends React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> {
|
|
86
89
|
hierarchy: hierarchyType;
|
|
87
90
|
size: buttonSizeType;
|
|
88
91
|
icon?: iconType;
|
|
89
92
|
iconFile?: string;
|
|
90
93
|
textField: string;
|
|
91
|
-
disabled: boolean;
|
|
92
|
-
onClick?: () => void;
|
|
93
94
|
}
|
|
94
95
|
export declare type checkboxSizeType = "sm" | "md";
|
|
95
96
|
export interface CheckboxProps {
|
|
@@ -105,7 +106,9 @@ declare type ButtonGroupOptionType = {
|
|
|
105
106
|
start_icon?: string;
|
|
106
107
|
end_icon?: string;
|
|
107
108
|
};
|
|
108
|
-
export interface ButtonGroupsProps
|
|
109
|
+
export interface ButtonGroupsProps {
|
|
110
|
+
value?: string;
|
|
111
|
+
onChange?: (value: string) => void;
|
|
109
112
|
options: Array<ButtonGroupOptionType>;
|
|
110
113
|
disabled: boolean;
|
|
111
114
|
}
|
|
@@ -147,12 +150,15 @@ export interface DropdownItemsProps {
|
|
|
147
150
|
disabled?: boolean;
|
|
148
151
|
onSelect?: (value: any) => void;
|
|
149
152
|
}
|
|
150
|
-
export interface DropdownFieldProps
|
|
153
|
+
export interface DropdownFieldProps {
|
|
151
154
|
label?: string;
|
|
152
155
|
end_icon?: string;
|
|
153
156
|
hint_text?: string;
|
|
154
157
|
hint_text_icon?: string;
|
|
155
158
|
disabled?: boolean;
|
|
159
|
+
errorMsg?: string;
|
|
160
|
+
value?: DropdownItemsProps;
|
|
161
|
+
onChange?: (value: DropdownItemsProps) => void;
|
|
156
162
|
placeholder?: string;
|
|
157
163
|
empty_text?: string;
|
|
158
164
|
options?: Array<DropdownItemsProps>;
|
|
@@ -210,7 +216,7 @@ export interface CheckboxGroupItemProps {
|
|
|
210
216
|
limited?: boolean;
|
|
211
217
|
onClick?: () => void;
|
|
212
218
|
}
|
|
213
|
-
export interface CheckboxGroupProps
|
|
219
|
+
export interface CheckboxGroupProps {
|
|
214
220
|
variant?: CheckboxGroupType;
|
|
215
221
|
size?: CheckboxGroupSize;
|
|
216
222
|
options: Array<CheckboxGroupItemProps>;
|
package/package.json
CHANGED
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
"frontend",
|
|
10
10
|
"healthplix"
|
|
11
11
|
],
|
|
12
|
-
"version": "1.0.
|
|
12
|
+
"version": "1.0.8",
|
|
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",
|