hplx-react-elements-dev 1.0.14 → 1.0.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/{components/Badges → Badges}/Badge.d.ts +0 -0
- package/dist/esm/addSuggestion/AddSuggestion.d.ts +4 -0
- package/dist/esm/{components/avatar → avatar}/Avatar.d.ts +0 -0
- package/dist/esm/{components/badgeGroup → badgeGroup}/BadgeGroup.d.ts +0 -0
- package/dist/esm/{components/button → button}/Button.d.ts +0 -0
- package/dist/esm/{components/button → button}/index.d.ts +0 -0
- package/dist/esm/{components/buttonGroups → buttonGroups}/ButtonGroups.d.ts +0 -0
- package/dist/esm/{components/card → card}/Card.d.ts +0 -0
- package/dist/esm/{components/checkbox → checkbox}/Checkbox.d.ts +0 -0
- package/dist/esm/{components/checkbox → checkbox}/index.d.ts +0 -0
- package/dist/esm/{components/checkboxGroup → checkboxGroup}/CheckboxGroup.d.ts +0 -0
- package/dist/esm/{components/checkboxGroup → checkboxGroup}/CheckboxGroupItem.d.ts +0 -0
- package/dist/esm/{components/collapsibleCard → collapsibleCard}/CollapsibleCard.d.ts +0 -0
- package/dist/esm/{components/common.d.ts → common.d.ts} +0 -0
- package/dist/esm/{components/datePicker → datePicker}/DatePicker.d.ts +1 -0
- package/dist/esm/{components/dropdownField → dropdownField}/DropdownField.d.ts +0 -0
- package/dist/esm/{components/dropdownField → dropdownField}/DropdownItem.d.ts +0 -0
- package/dist/esm/index.css +1060 -0
- package/dist/esm/{components/index.d.ts → index.d.ts} +0 -0
- package/dist/esm/index.js +16665 -0
- package/dist/esm/{components/inputField → inputField}/InputField.d.ts +0 -0
- package/dist/esm/{components/inputFieldSplit → inputFieldSplit}/InputFieldSplit.d.ts +0 -0
- package/dist/esm/{components/messageToast → messageToast}/MessageToast.d.ts +0 -0
- package/dist/esm/{components/messageToast → messageToast}/Toast.d.ts +0 -0
- package/dist/esm/{components/nestedDropdown → nestedDropdown}/NestedDropdown.d.ts +0 -0
- package/dist/esm/{components/nestedDropdown → nestedDropdown}/NestedDropdownItem.d.ts +0 -0
- package/dist/esm/{components/otpField → otpField}/OtpField.d.ts +0 -0
- package/dist/esm/{components/progressBar → progressBar}/ProgressBar.d.ts +0 -0
- package/dist/esm/{components/progressCircle → progressCircle}/ProgressCircle.d.ts +0 -0
- package/dist/esm/{components/radioBtn → radioBtn}/RadioBtn.d.ts +0 -0
- package/dist/esm/{components/slider → slider}/Slider.d.ts +0 -0
- package/dist/esm/{components/textAreaField → textAreaField}/TextAreaField.d.ts +0 -0
- package/dist/esm/{components/toggleSwitch → toggleSwitch}/ToggleSwitch.d.ts +0 -0
- package/dist/esm/{components/tooltip → tooltip}/Tooltip.d.ts +0 -0
- package/dist/esm/{components/types.d.ts → types.d.ts} +47 -37
- package/dist/esm/{components/typography → typography}/Typography.d.ts +0 -0
- package/package.json +31 -23
- package/dist/esm/components/Badges/Badge.js +0 -60
- package/dist/esm/components/Badges/Badge.js.map +0 -1
- package/dist/esm/components/addSuggestion/AddSuggestion.d.ts +0 -4
- package/dist/esm/components/addSuggestion/AddSuggestion.js +0 -61
- package/dist/esm/components/addSuggestion/AddSuggestion.js.map +0 -1
- package/dist/esm/components/avatar/Avatar.js +0 -141
- package/dist/esm/components/avatar/Avatar.js.map +0 -1
- package/dist/esm/components/badgeGroup/BadgeGroup.js +0 -82
- package/dist/esm/components/badgeGroup/BadgeGroup.js.map +0 -1
- package/dist/esm/components/button/Button.js +0 -90
- package/dist/esm/components/button/Button.js.map +0 -1
- package/dist/esm/components/button/index.js +0 -3
- package/dist/esm/components/button/index.js.map +0 -1
- package/dist/esm/components/buttonGroups/ButtonGroups.js +0 -51
- package/dist/esm/components/buttonGroups/ButtonGroups.js.map +0 -1
- package/dist/esm/components/card/Card.js +0 -12
- package/dist/esm/components/card/Card.js.map +0 -1
- package/dist/esm/components/checkbox/Checkbox.js +0 -42
- package/dist/esm/components/checkbox/Checkbox.js.map +0 -1
- package/dist/esm/components/checkbox/index.js +0 -3
- package/dist/esm/components/checkbox/index.js.map +0 -1
- package/dist/esm/components/checkboxGroup/CheckboxGroup.js +0 -23
- package/dist/esm/components/checkboxGroup/CheckboxGroup.js.map +0 -1
- package/dist/esm/components/checkboxGroup/CheckboxGroupItem.js +0 -34
- package/dist/esm/components/checkboxGroup/CheckboxGroupItem.js.map +0 -1
- package/dist/esm/components/collapsibleCard/CollapsibleCard.js +0 -67
- package/dist/esm/components/collapsibleCard/CollapsibleCard.js.map +0 -1
- package/dist/esm/components/common.js +0 -172
- package/dist/esm/components/common.js.map +0 -1
- package/dist/esm/components/datePicker/DatePicker.js +0 -30
- package/dist/esm/components/datePicker/DatePicker.js.map +0 -1
- package/dist/esm/components/dropdownField/DropdownField.js +0 -29
- package/dist/esm/components/dropdownField/DropdownField.js.map +0 -1
- package/dist/esm/components/dropdownField/DropdownItem.js +0 -25
- package/dist/esm/components/dropdownField/DropdownItem.js.map +0 -1
- package/dist/esm/components/index.js +0 -28
- package/dist/esm/components/index.js.map +0 -1
- package/dist/esm/components/inputField/InputField.js +0 -14
- package/dist/esm/components/inputField/InputField.js.map +0 -1
- package/dist/esm/components/inputFieldSplit/InputFieldSplit.js +0 -19
- package/dist/esm/components/inputFieldSplit/InputFieldSplit.js.map +0 -1
- package/dist/esm/components/messageToast/MessageToast.js +0 -24
- package/dist/esm/components/messageToast/MessageToast.js.map +0 -1
- package/dist/esm/components/messageToast/Toast.js +0 -19
- package/dist/esm/components/messageToast/Toast.js.map +0 -1
- package/dist/esm/components/nestedDropdown/NestedDropdown.js +0 -111
- package/dist/esm/components/nestedDropdown/NestedDropdown.js.map +0 -1
- package/dist/esm/components/nestedDropdown/NestedDropdownItem.js +0 -25
- package/dist/esm/components/nestedDropdown/NestedDropdownItem.js.map +0 -1
- package/dist/esm/components/otpField/OtpField.js +0 -32
- package/dist/esm/components/otpField/OtpField.js.map +0 -1
- package/dist/esm/components/progressBar/ProgressBar.js +0 -28
- package/dist/esm/components/progressBar/ProgressBar.js.map +0 -1
- package/dist/esm/components/progressCircle/ProgressCircle.js +0 -78
- package/dist/esm/components/progressCircle/ProgressCircle.js.map +0 -1
- package/dist/esm/components/radioBtn/RadioBtn.js +0 -62
- package/dist/esm/components/radioBtn/RadioBtn.js.map +0 -1
- package/dist/esm/components/slider/Slider.js +0 -64
- package/dist/esm/components/slider/Slider.js.map +0 -1
- package/dist/esm/components/textAreaField/TextAreaField.js +0 -14
- package/dist/esm/components/textAreaField/TextAreaField.js.map +0 -1
- package/dist/esm/components/toggleSwitch/ToggleSwitch.js +0 -55
- package/dist/esm/components/toggleSwitch/ToggleSwitch.js.map +0 -1
- package/dist/esm/components/tooltip/Tooltip.js +0 -112
- package/dist/esm/components/tooltip/Tooltip.js.map +0 -1
- package/dist/esm/components/types.js +0 -2
- package/dist/esm/components/types.js.map +0 -1
- package/dist/esm/components/typography/Typography.js +0 -70
- package/dist/esm/components/typography/Typography.js.map +0 -1
|
@@ -1,32 +0,0 @@
|
|
|
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 getSizeClassName = function (size) {
|
|
5
|
-
var className;
|
|
6
|
-
switch (size) {
|
|
7
|
-
case "sm":
|
|
8
|
-
className = "w-16 h-16";
|
|
9
|
-
break;
|
|
10
|
-
case "md":
|
|
11
|
-
className = "w-20 h-20";
|
|
12
|
-
break;
|
|
13
|
-
case "lg":
|
|
14
|
-
className = "w-24 h-24";
|
|
15
|
-
break;
|
|
16
|
-
default:
|
|
17
|
-
className = "";
|
|
18
|
-
break;
|
|
19
|
-
}
|
|
20
|
-
return className;
|
|
21
|
-
};
|
|
22
|
-
var OtpField = function (_a) {
|
|
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)
|
|
26
|
-
.fill("")
|
|
27
|
-
.map(function (_, index) {
|
|
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));
|
|
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] })) })) })))] }));
|
|
30
|
-
};
|
|
31
|
-
export default OtpField;
|
|
32
|
-
//# sourceMappingURL=OtpField.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"OtpField.js","sourceRoot":"","sources":["../../../../src/components/otpField/OtpField.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import { __assign, __rest } from "tslib";
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { useEffect, useRef, useState } from "react";
|
|
4
|
-
import Tooltip from "../tooltip/Tooltip";
|
|
5
|
-
import Typography from "../typography/Typography";
|
|
6
|
-
var mouseoverEvent = new MouseEvent("mouseover", {
|
|
7
|
-
view: window,
|
|
8
|
-
bubbles: true,
|
|
9
|
-
cancelable: true,
|
|
10
|
-
});
|
|
11
|
-
var mouseoutEvent = new MouseEvent("mouseout", {
|
|
12
|
-
view: window,
|
|
13
|
-
bubbles: true,
|
|
14
|
-
cancelable: true,
|
|
15
|
-
});
|
|
16
|
-
var ProgressBar = function (_a) {
|
|
17
|
-
var _b = _a.progress, progress = _b === void 0 ? 0 : _b, _c = _a.label, label = _c === void 0 ? "Right" : _c, ProgressBarProps = __rest(_a, ["progress", "label"]);
|
|
18
|
-
var _d = useState(false), hovered = _d[0], setHovered = _d[1];
|
|
19
|
-
var tooltipRef = useRef(null);
|
|
20
|
-
useEffect(function () {
|
|
21
|
-
if (tooltipRef.current) {
|
|
22
|
-
tooltipRef.current.dispatchEvent(hovered ? mouseoverEvent : mouseoutEvent);
|
|
23
|
-
}
|
|
24
|
-
}, [hovered]);
|
|
25
|
-
return (_jsxs("div", __assign({ className: "flex ".concat(label === "Bottom" ? "flex-col" : "flex-row items-center") }, { children: [_jsxs("div", __assign({}, ProgressBarProps, { className: "w-full h-2 rounded relative" }, { children: [_jsx("div", { className: "absolute top-0 left-0 right-0 bg-Primary-50 bottom-0" }), _jsx("div", __assign({ "data-testid": "progressbar", onMouseEnter: function () { return setHovered(true); }, onMouseLeave: function () { return setHovered(false); }, style: { right: "".concat(100 - progress, "%") }, className: "absolute top-0 left-0 bottom-0 bg-Primary-600 ease-linear duration-200 rounded flex justify-end" }, { children: (label === "Top floating" || label === "Bottom floating") && (_jsx(Tooltip, __assign({ "data-testid": "tooltip", variant: label === "Top floating" ? "Top" : "Bottom", text: "".concat(progress, "%") }, { children: _jsx("div", { className: "w-2 h-2", ref: tooltipRef }) }))) }))] })), label === "Right" && (_jsx("div", __assign({ className: "ml-2 w-10" }, { children: _jsxs(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: [progress, "%"] })) }))), label === "Bottom" && (_jsx("div", __assign({ className: "ml-auto" }, { children: _jsxs(Typography, __assign({ type: "Text sm", variant: "Medium" }, { children: [progress, "%"] })) })))] })));
|
|
26
|
-
};
|
|
27
|
-
export default ProgressBar;
|
|
28
|
-
//# sourceMappingURL=ProgressBar.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../../../src/components/progressBar/ProgressBar.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,OAAO,MAAM,oBAAoB,CAAC;AAEzC,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAElD,IAAM,cAAc,GAAG,IAAI,UAAU,CAAC,WAAW,EAAE;IACjD,IAAI,EAAE,MAAM;IACZ,OAAO,EAAE,IAAI;IACb,UAAU,EAAE,IAAI;CACjB,CAAC,CAAC;AAEH,IAAM,aAAa,GAAG,IAAI,UAAU,CAAC,UAAU,EAAE;IAC/C,IAAI,EAAE,MAAM;IACZ,OAAO,EAAE,IAAI;IACb,UAAU,EAAE,IAAI;CACjB,CAAC,CAAC;AAEH,IAAM,WAAW,GAAG,UAAC,EAIF;IAHjB,IAAA,gBAAY,EAAZ,QAAQ,mBAAG,CAAC,KAAA,EACZ,aAAe,EAAf,KAAK,mBAAG,OAAO,KAAA,EACZ,gBAAgB,cAHA,qBAIpB,CADoB;IAEb,IAAA,KAAwB,QAAQ,CAAU,KAAK,CAAC,EAA/C,OAAO,QAAA,EAAE,UAAU,QAA4B,CAAC;IACvD,IAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEhD,SAAS,CAAC;QACR,IAAI,UAAU,CAAC,OAAO,EAAE;YACtB,UAAU,CAAC,OAAO,CAAC,aAAa,CAC9B,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,CACzC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,CACL,wBACE,SAAS,EAAE,eACT,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,uBAAuB,CACzD,iBAEF,0BAAS,gBAAgB,IAAE,SAAS,EAAE,6BAA6B,iBACjE,cAAK,SAAS,EAAC,sDAAsD,GAAG,EACxE,sCAAiB,aAAa,EAC5B,YAAY,EAAE,cAAM,OAAA,UAAU,CAAC,IAAI,CAAC,EAAhB,CAAgB,EACpC,YAAY,EAAE,cAAM,OAAA,UAAU,CAAC,KAAK,CAAC,EAAjB,CAAiB,EACrC,KAAK,EAAE,EAAE,KAAK,EAAE,UAAG,GAAG,GAAG,QAAQ,MAAG,EAAE,EACtC,SAAS,EACP,iGAAiG,gBAGlG,CAAC,KAAK,KAAK,cAAc,IAAI,KAAK,KAAK,iBAAiB,CAAC,IAAI,CAC5D,KAAC,OAAO,4BAAa,SAAS,EAC5B,OAAO,EAAE,KAAK,KAAK,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,EACpD,IAAI,EAAE,UAAG,QAAQ,MAAG,gBAEpB,cAAK,SAAS,EAAC,SAAS,EAAC,GAAG,EAAE,UAAU,GAAI,IACpC,CACX,IACG,KACF,EAEL,KAAK,KAAK,OAAO,IAAI,CACpB,uBAAK,SAAS,EAAC,WAAW,gBACxB,MAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,QAAQ,iBACxC,QAAQ,UACE,IACT,CACP,EACA,KAAK,KAAK,QAAQ,IAAI,CACrB,uBAAK,SAAS,EAAC,SAAS,gBACtB,MAAC,UAAU,aAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAC,QAAQ,iBACxC,QAAQ,UACE,IACT,CACP,KACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -1,78 +0,0 @@
|
|
|
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 getSizeNumber = function (size) {
|
|
5
|
-
var dimensions = {
|
|
6
|
-
sizeNumber: 64,
|
|
7
|
-
trackWidth: 8,
|
|
8
|
-
textType: "Text sm",
|
|
9
|
-
};
|
|
10
|
-
switch (size) {
|
|
11
|
-
case "xxs":
|
|
12
|
-
dimensions = {
|
|
13
|
-
sizeNumber: 64,
|
|
14
|
-
trackWidth: 4,
|
|
15
|
-
textType: "Text sm",
|
|
16
|
-
};
|
|
17
|
-
break;
|
|
18
|
-
case "xs":
|
|
19
|
-
dimensions = {
|
|
20
|
-
sizeNumber: 152,
|
|
21
|
-
trackWidth: 8,
|
|
22
|
-
textType: "Display xs",
|
|
23
|
-
};
|
|
24
|
-
break;
|
|
25
|
-
case "sm":
|
|
26
|
-
dimensions = {
|
|
27
|
-
sizeNumber: 184,
|
|
28
|
-
trackWidth: 10,
|
|
29
|
-
textType: "Display sm",
|
|
30
|
-
};
|
|
31
|
-
break;
|
|
32
|
-
case "md":
|
|
33
|
-
dimensions = {
|
|
34
|
-
sizeNumber: 224,
|
|
35
|
-
trackWidth: 12,
|
|
36
|
-
textType: "Display md",
|
|
37
|
-
};
|
|
38
|
-
break;
|
|
39
|
-
case "lg":
|
|
40
|
-
dimensions = {
|
|
41
|
-
sizeNumber: 256,
|
|
42
|
-
trackWidth: 14,
|
|
43
|
-
textType: "Display lg",
|
|
44
|
-
};
|
|
45
|
-
break;
|
|
46
|
-
default:
|
|
47
|
-
dimensions = {
|
|
48
|
-
sizeNumber: 64,
|
|
49
|
-
trackWidth: 4,
|
|
50
|
-
textType: "Text sm",
|
|
51
|
-
};
|
|
52
|
-
break;
|
|
53
|
-
}
|
|
54
|
-
return dimensions;
|
|
55
|
-
};
|
|
56
|
-
var ProgressCircle = function (_a) {
|
|
57
|
-
var _b = _a.size, size = _b === void 0 ? "xxs" : _b, _c = _a.progress, progress = _c === void 0 ? 0 : _c, _d = _a.shape, shape = _d === void 0 ? "Circle" : _d, _e = _a.label, label = _e === void 0 ? "" : _e, _f = _a.spinnerMode, spinnerMode = _f === void 0 ? false : _f;
|
|
58
|
-
var _g = getSizeNumber(size), sizeNumber = _g.sizeNumber, trackWidth = _g.trackWidth, textType = _g.textType;
|
|
59
|
-
var center = sizeNumber / 2, radius = center - trackWidth, dashArray = 2 * Math.PI * radius, dashOffset = dashArray *
|
|
60
|
-
((100 - (shape === "Half circle" ? progress / 2 : progress)) / 100);
|
|
61
|
-
return (_jsx(_Fragment, { children: _jsxs("div", __assign({ className: "relative", style: {
|
|
62
|
-
width: sizeNumber,
|
|
63
|
-
height: shape === "Half circle"
|
|
64
|
-
? sizeNumber / 2 + trackWidth / 2
|
|
65
|
-
: sizeNumber,
|
|
66
|
-
} }, { children: [_jsxs("svg", __assign({ className: shape === "Half circle" ? "-rotate-180" : "-rotate-90", style: {
|
|
67
|
-
width: sizeNumber,
|
|
68
|
-
height: shape === "Half circle"
|
|
69
|
-
? sizeNumber / 2 + trackWidth / 2
|
|
70
|
-
: sizeNumber,
|
|
71
|
-
} }, { children: [_jsx("circle", { className: "stroke-Primary-50", cx: center, cy: shape === "Half circle" ? trackWidth / 2 : center, fill: "transparent", r: radius, strokeWidth: trackWidth, strokeDasharray: dashArray, strokeDashoffset: shape === "Half circle" ? dashArray / 2 : dashArray * 2, strokeLinecap: "round" }), _jsx("circle", { className: "".concat(spinnerMode && shape !== "Half circle"
|
|
72
|
-
? "animate-spin origin-center"
|
|
73
|
-
: "ease-linear duration-200", " stroke-Primary-600"), cx: center, cy: shape === "Half circle" ? trackWidth / 2 : center, fill: "transparent", r: radius, strokeWidth: trackWidth, strokeDasharray: dashArray, strokeDashoffset: dashOffset, strokeLinecap: "round" })] })), _jsxs("div", __assign({ className: "absolute ".concat(shape === "Half circle"
|
|
74
|
-
? "bottom-0"
|
|
75
|
-
: "top-1/2 translate-y-[-50%]", " left-1/2 translate-x-[-50%] text-center") }, { children: [Boolean(label) && size !== "xxs" && (_jsx("div", __assign({ className: "text-Gray-500" }, { children: _jsx(Typography, __assign({ variant: "Medium", type: "Text sm" }, { children: label })) }))), (!spinnerMode || shape === "Half circle") && (_jsx("div", __assign({ className: "text-Gray-900" }, { children: _jsx(Typography, __assign({ type: textType, variant: "Medium" }, { children: "".concat(progress > 100 ? 100 : progress, "%") })) })))] }))] })) }));
|
|
76
|
-
};
|
|
77
|
-
export default ProgressCircle;
|
|
78
|
-
//# sourceMappingURL=ProgressCircle.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressCircle.js","sourceRoot":"","sources":["../../../../src/components/progressCircle/ProgressCircle.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
import { __assign } from "tslib";
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import Typography from "../typography/Typography";
|
|
4
|
-
var getSizeClassName = function (size) {
|
|
5
|
-
switch (size) {
|
|
6
|
-
case "sm":
|
|
7
|
-
return "Text xs";
|
|
8
|
-
case "md":
|
|
9
|
-
return "Text sm";
|
|
10
|
-
default:
|
|
11
|
-
return "Text md";
|
|
12
|
-
}
|
|
13
|
-
};
|
|
14
|
-
var getPaddingClassName = function (size, disabled) {
|
|
15
|
-
switch (size) {
|
|
16
|
-
case "sm":
|
|
17
|
-
return disabled
|
|
18
|
-
? "flex w-4 h-4 bg-white border border-Gray-300 border-Gray-300 rounded-full cursor-pointer focus:outline-none bg-Gray-200 p-2 "
|
|
19
|
-
: "flex w-4 h-4 bg-white border border-Gray-300 hover:border-Primary-600 peer-checked:border-Primary-600 rounded-full cursor-pointer focus:outline-none hover:bg-Primary-50 peer-checked:bg-Primary-600 p-2 peer-checked:ring-2 ring-Primary-300 peer-checked:border-transparent ";
|
|
20
|
-
case "md":
|
|
21
|
-
return disabled
|
|
22
|
-
? "flex w-5 h-5 bg-white border border-Gray-300 border-Gray-300 rounded-full cursor-pointer focus:outline-none bg-Gray-200 p-2 "
|
|
23
|
-
: "flex w-5 h-5 bg-white border border-Gray-300 hover:border-Primary-600 peer-checked:border-Primary-600 rounded-full cursor-pointer focus:outline-none hover:bg-Primary-50 peer-checked:bg-Primary-600 p-2 peer-checked:ring-2 peer-checked:border-transparent ";
|
|
24
|
-
default:
|
|
25
|
-
return "flex w-4 h-4 bg-white border border-Gray-300 hover:border-Primary-600 peer-checked:border-Primary-600 rounded-full cursor-pointer focus:outline-none hover:bg-Primary-50 peer-checked:bg-Primary-600 p-2 peer-checked:ring-2 ring-Primary-300 peer-checked:border-transparent ";
|
|
26
|
-
}
|
|
27
|
-
};
|
|
28
|
-
var getLabelStyle = function (disabled) {
|
|
29
|
-
return disabled
|
|
30
|
-
? "flex flex-col text-Gray-300"
|
|
31
|
-
: "flex flex-col text-Gray-700";
|
|
32
|
-
};
|
|
33
|
-
var getIconTypeClassName = function (iconfile, size, disabled) {
|
|
34
|
-
switch (iconfile) {
|
|
35
|
-
case "dot":
|
|
36
|
-
return size === "sm"
|
|
37
|
-
? disabled
|
|
38
|
-
? "ring-4 p-1 ring-Gray-50 bg-Gray-300 -ml-[13px] mt-[4.95px] w-2 h-2 rounded-full peer-checked:block"
|
|
39
|
-
: "hidden ring-4 p-1 ring-Primary-50 -ml-[13px] mt-[4.95px] w-2 h-2 rounded-full peer-checked:block"
|
|
40
|
-
: disabled
|
|
41
|
-
? "ring-4 p-1 ring-Gray-50 bg-Gray-300 -ml-[14px] mt-[6px] w-2 h-2 rounded-full peer-checked:block"
|
|
42
|
-
: "hidden ring-4 p-1 ring-Primary-50 -ml-[14px] mt-[6px] w-2 h-2 rounded-full peer-checked:block";
|
|
43
|
-
case "checkmark":
|
|
44
|
-
return size === "sm"
|
|
45
|
-
? disabled
|
|
46
|
-
? "hx_checkmark text-[12px] -ml-[17px] mt-[3px] text-White peer-checked:block "
|
|
47
|
-
: "hidden hx_checkmark text-[12px] -ml-[17px] mt-[3px] text-White peer-checked:block"
|
|
48
|
-
: disabled
|
|
49
|
-
? "hx_checkmark -ml-[21px] mt-[2px] text-White peer-checked:block "
|
|
50
|
-
: "hidden hx_checkmark -ml-[21px] mt-[2px] text-White peer-checked:block";
|
|
51
|
-
default:
|
|
52
|
-
return size === "sm"
|
|
53
|
-
? "hidden ring-4 p-1 ring-Primary-50 -ml-[13px] mt-[4.95px] w-2 h-2 rounded-full peer-checked:block"
|
|
54
|
-
: "hidden ring-4 p-1 ring-Primary-50 -ml-[14px] mt-[6px] w-2 h-2 rounded-full peer-checked:block";
|
|
55
|
-
}
|
|
56
|
-
};
|
|
57
|
-
var RadioBtn = function (_a) {
|
|
58
|
-
var size = _a.size, disabled = _a.disabled, iconfile = _a.iconfile, id = _a.id, text = _a.text, secondaryText = _a.secondaryText;
|
|
59
|
-
return (_jsx("div", { children: _jsxs("div", __assign({ className: "p-4 flex flex-row flex-1 " }, { children: [_jsx("input", { className: "sr-only peer ", type: "radio", value: "first", name: "radioBtn", id: id, "data-testid": id, disabled: disabled }), _jsx("label", { className: "".concat(getPaddingClassName(size, disabled)), htmlFor: id }), _jsx("div", { className: "".concat(getIconTypeClassName(iconfile, size, disabled)) }), _jsxs("label", __assign({ className: " mx-4 ".concat(getLabelStyle(disabled), " "), htmlFor: id }, { children: [_jsx(Typography, __assign({ variant: "Medium", type: getSizeClassName(size) }, { children: text })), _jsx(Typography, __assign({ variant: "Regular", type: getSizeClassName(size) }, { children: secondaryText }))] }))] })) }));
|
|
60
|
-
};
|
|
61
|
-
export default RadioBtn;
|
|
62
|
-
//# sourceMappingURL=RadioBtn.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RadioBtn.js","sourceRoot":"","sources":["../../../../src/components/radioBtn/RadioBtn.tsx"],"names":[],"mappings":";;AACA,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAElD,IAAM,gBAAgB,GAAG,UAAC,IAAsB;IAC9C,QAAQ,IAAI,EAAE;QACZ,KAAK,IAAI;YACP,OAAO,SAAS,CAAC;QACnB,KAAK,IAAI;YACP,OAAO,SAAS,CAAC;QACnB;YACE,OAAO,SAAS,CAAC;KACpB;AACH,CAAC,CAAC;AACF,IAAM,mBAAmB,GAAG,UAAC,IAAsB,EAAE,QAAiB;IACpE,QAAQ,IAAI,EAAE;QACZ,KAAK,IAAI;YACP,OAAO,QAAQ;gBACb,CAAC,CAAC,+HAA+H;gBACjI,CAAC,CAAC,iRAAiR,CAAC;QACxR,KAAK,IAAI;YACP,OAAO,QAAQ;gBACb,CAAC,CAAC,8HAA8H;gBAChI,CAAC,CAAC,iQAAiQ,CAAC;QACxQ;YACE,OAAO,gRAAgR,CAAC;KAC3R;AACH,CAAC,CAAC;AACF,IAAM,aAAa,GAAG,UAAC,QAAiB;IACtC,OAAO,QAAQ;QACb,CAAC,CAAC,6BAA6B;QAC/B,CAAC,CAAC,6BAA6B,CAAC;AACpC,CAAC,CAAC;AACF,IAAM,oBAAoB,GAAG,UAC3B,QAAsB,EACtB,IAAsB,EACtB,QAAiB;IAEjB,QAAQ,QAAQ,EAAE;QAChB,KAAK,KAAK;YACR,OAAO,IAAI,KAAK,IAAI;gBAClB,CAAC,CAAC,QAAQ;oBACR,CAAC,CAAC,oGAAoG;oBACtG,CAAC,CAAC,kGAAkG;gBACtG,CAAC,CAAC,QAAQ;oBACV,CAAC,CAAC,iGAAiG;oBACnG,CAAC,CAAC,+FAA+F,CAAC;QAEtG,KAAK,WAAW;YACd,OAAO,IAAI,KAAK,IAAI;gBAClB,CAAC,CAAC,QAAQ;oBACR,CAAC,CAAC,6EAA6E;oBAC/E,CAAC,CAAC,mFAAmF;gBACvF,CAAC,CAAC,QAAQ;oBACV,CAAC,CAAC,iEAAiE;oBACnE,CAAC,CAAC,uEAAuE,CAAC;QAC9E;YACE,OAAO,IAAI,KAAK,IAAI;gBAClB,CAAC,CAAC,kGAAkG;gBACpG,CAAC,CAAC,+FAA+F,CAAC;KACvG;AACH,CAAC,CAAC;AACF,IAAM,QAAQ,GAAG,UAAC,EAAmE;QAAjE,IAAI,UAAA,EAAE,QAAQ,cAAA,EAAE,QAAQ,cAAA,EAAE,EAAE,QAAA,EAAE,IAAI,UAAA,EAAC,aAAa,mBAAA;IAClE,OAAO,CACL,wBACE,wBAAK,SAAS,EAAE,2BAA2B,iBACzC,gBACE,SAAS,EAAC,eAAe,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,EAAE,iBACO,EAAE,EACf,QAAQ,EAAE,QAAQ,GAClB,EACF,gBACE,SAAS,EAAE,UAAG,mBAAmB,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAE,EACnD,OAAO,EAAE,EAAE,GACJ,EAET,cACE,SAAS,EAAE,UAAG,oBAAoB,CAAC,QAAQ,EAAE,IAAI,EAAE,QAAQ,CAAC,CAAE,GACzD,EACP,0BAAO,SAAS,EAAE,iBAAU,aAAa,CAAC,QAAQ,CAAC,MAAG,EAAE,OAAO,EAAE,EAAE,iBACjE,KAAC,UAAU,aAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC,gBACtD,IAAI,IACM,EAEb,KAAC,UAAU,aAAC,OAAO,EAAC,SAAS,EAAC,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC,gBACzD,aAAa,IACD,KACP,KACJ,GACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
import { __assign } from "tslib";
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { useState, useEffect, useRef } from "react";
|
|
4
|
-
var getLeftPositionClassName = function (minValue) {
|
|
5
|
-
switch (minValue) {
|
|
6
|
-
case "0":
|
|
7
|
-
return "flex ml-0";
|
|
8
|
-
case "25":
|
|
9
|
-
return "flex ml-[65px]";
|
|
10
|
-
case "50":
|
|
11
|
-
return "flex ml-[140px]";
|
|
12
|
-
case "75":
|
|
13
|
-
return "flex ml-[215px]";
|
|
14
|
-
default:
|
|
15
|
-
return "flex ml-0";
|
|
16
|
-
}
|
|
17
|
-
};
|
|
18
|
-
var getRightPositionClassName = function (maxValue) {
|
|
19
|
-
switch (maxValue) {
|
|
20
|
-
case "25":
|
|
21
|
-
return "flex ml-[65px]";
|
|
22
|
-
case "50":
|
|
23
|
-
return "flex ml-[140px]";
|
|
24
|
-
case "75":
|
|
25
|
-
return "flex ml-[215px]";
|
|
26
|
-
case "100":
|
|
27
|
-
return "flex ml-[290px]";
|
|
28
|
-
default:
|
|
29
|
-
return "flex ml-[65px]";
|
|
30
|
-
}
|
|
31
|
-
};
|
|
32
|
-
var getLabelClassName = function (position) {
|
|
33
|
-
switch (position) {
|
|
34
|
-
case "topFloating":
|
|
35
|
-
return "absolute -mt-6 py-1 px-2 text-[12px] text-Gray-700 bg-White shadow-xl rounded-lg";
|
|
36
|
-
case "bottomFloating":
|
|
37
|
-
return "absolute mt-8 py-1 px-2 text-[12px] text-Gray-700 bg-White shadow-xl rounded-lg";
|
|
38
|
-
case "labelBottom":
|
|
39
|
-
return "absolute mt-8 py-1 px-2 text-[16px] text-Gray-700 ";
|
|
40
|
-
case "noLabel":
|
|
41
|
-
return "hidden";
|
|
42
|
-
default:
|
|
43
|
-
return "absolute mt-8 py-1 px-2 text-[12px] text-Gray-700 bg-White shadow-xl rounded-lg";
|
|
44
|
-
}
|
|
45
|
-
};
|
|
46
|
-
var Slider = function (_a) {
|
|
47
|
-
var initialMin = _a.initialMin, initialMax = _a.initialMax, min = _a.min, max = _a.max, step = _a.step, label = _a.label;
|
|
48
|
-
var progressRef = useRef(null);
|
|
49
|
-
var _b = useState(initialMin), minValue = _b[0], setMinValue = _b[1];
|
|
50
|
-
var _c = useState(initialMax), maxValue = _c[0], setMaxValue = _c[1];
|
|
51
|
-
useEffect(function () {
|
|
52
|
-
if (progressRef.current != null) {
|
|
53
|
-
progressRef.current.style.left = minValue + "%";
|
|
54
|
-
progressRef.current.style.right = 100 - maxValue + "%";
|
|
55
|
-
}
|
|
56
|
-
}, [minValue, maxValue, max, step]);
|
|
57
|
-
return (_jsx("div", { children: _jsxs("div", __assign({ className: "flex flex-col w-96 px-8 py-4" }, { children: [_jsxs("div", __assign({ className: "relative my-4 " }, { children: [_jsx("div", __assign({ className: "".concat(getLeftPositionClassName(minValue), " ") }, { children: _jsx("span", __assign({ className: "".concat(getLabelClassName(label)) }, { children: minValue + "%" })) })), _jsx("div", __assign({ className: "".concat(getRightPositionClassName(maxValue)) }, { children: _jsxs("span", __assign({ className: "".concat(getLabelClassName(label)) }, { children: [" ", maxValue + "%"] })) }))] })), _jsxs("div", __assign({ className: "mb-4" }, { children: [_jsx("div", __assign({ className: "slider relative h-2 rounded-md bg-Gray-200" }, { children: _jsx("div", { className: "progress absolute h-2 bg-Primary-600 rounded", ref: progressRef }) })), _jsxs("div", __assign({ "data-testid": "Slider", className: "range-input relative" }, { children: [_jsx("input", { onChange: function (e) {
|
|
58
|
-
setMinValue(e.target.value);
|
|
59
|
-
}, type: "range", min: min, step: 25, max: max, value: minValue, className: "range-min absolute w-full -top-2 h-2 bg-transparent appearance-none bg-Black/0 accent-White" }), _jsx("input", { onChange: function (e) {
|
|
60
|
-
setMaxValue(e.target.value);
|
|
61
|
-
}, type: "range", min: min, step: 25, max: max, value: maxValue, className: "range-max absolute w-full -top-2 h-2 bg-transparent appearance-none bg-Black/0 accent-White " })] }))] }))] })) }));
|
|
62
|
-
};
|
|
63
|
-
export default Slider;
|
|
64
|
-
//# sourceMappingURL=Slider.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../../src/components/slider/Slider.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { __assign } from "tslib";
|
|
2
|
-
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import Typography from "../typography/Typography";
|
|
4
|
-
var TextAreaField = function (_a) {
|
|
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
|
|
8
|
-
? "bg-Gray-50"
|
|
9
|
-
: "bg-White ".concat(errorMsg
|
|
10
|
-
? "hover:shadow-xs-error"
|
|
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] })) })) })))] }));
|
|
12
|
-
};
|
|
13
|
-
export default TextAreaField;
|
|
14
|
-
//# sourceMappingURL=TextAreaField.js.map
|
|
@@ -1 +0,0 @@
|
|
|
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,55 +0,0 @@
|
|
|
1
|
-
import { __assign } from "tslib";
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import Typography from "../typography/Typography";
|
|
4
|
-
var getSizeClassName = function (size) {
|
|
5
|
-
switch (size) {
|
|
6
|
-
case "sm":
|
|
7
|
-
return "Text xs";
|
|
8
|
-
case "md":
|
|
9
|
-
return "Text sm";
|
|
10
|
-
default:
|
|
11
|
-
return "Text xs";
|
|
12
|
-
}
|
|
13
|
-
};
|
|
14
|
-
var getToggleSizeClassName = function (size, disabled) {
|
|
15
|
-
switch (size) {
|
|
16
|
-
case "sm":
|
|
17
|
-
return disabled
|
|
18
|
-
? "bg-Gray-200 md:w-9 md:h-5 w-5 h-4"
|
|
19
|
-
: "md:w-9 md:h-5 w-5 h-4";
|
|
20
|
-
case "md":
|
|
21
|
-
return disabled
|
|
22
|
-
? "md:w-11 md:h-6 w-6 h-5 bg-Gray-200"
|
|
23
|
-
: "md:w-11 md:h-6 w-6 h-5";
|
|
24
|
-
default:
|
|
25
|
-
return "md:w-9 md:h-5 w-5 h-4";
|
|
26
|
-
}
|
|
27
|
-
};
|
|
28
|
-
var getThemeClassName = function (theme, toggled, disabled) {
|
|
29
|
-
switch (theme) {
|
|
30
|
-
case "Dark":
|
|
31
|
-
return (disabled)
|
|
32
|
-
? (toggled ? "bg-Gray-200" : "bg-Gray-200")
|
|
33
|
-
: (toggled ? "bg-Primary-600" : "bg-Gray-200");
|
|
34
|
-
case "Light":
|
|
35
|
-
return (disabled)
|
|
36
|
-
? (toggled ? "bg-Gray-200" : "bg-Gray-50")
|
|
37
|
-
: (toggled ? "bg-Primary-200" : "bg-Primary-50");
|
|
38
|
-
default:
|
|
39
|
-
return toggled
|
|
40
|
-
? "bg-Primary-600"
|
|
41
|
-
: "bg-Gray-200";
|
|
42
|
-
}
|
|
43
|
-
};
|
|
44
|
-
var getLabelStyle = function (disabled) {
|
|
45
|
-
return disabled
|
|
46
|
-
? "flex flex-col text-Gray-300 "
|
|
47
|
-
: "flex flex-col text-Gray-700";
|
|
48
|
-
};
|
|
49
|
-
var ToggleSwitch = function (_a) {
|
|
50
|
-
var size = _a.size, theme = _a.theme, disabled = _a.disabled, text = _a.text, secondaryText = _a.secondaryText, id = _a.id, _b = _a.onClick, onClick = _b === void 0 ? function () { } : _b, isToggled = _a.isToggled;
|
|
51
|
-
var toggleClass = size === "sm" ? "transform translate-x-[14px]" : "transform translate-x-[18px]";
|
|
52
|
-
return (_jsxs("div", __assign({ className: "flex flex-row items-center p-2" }, { children: [_jsx("button", __assign({ onClick: onClick, disabled: disabled, id: id, "data-testid": id, defaultChecked: isToggled, className: "".concat(getToggleSizeClassName(size, disabled), " flex items-center ").concat(getThemeClassName(theme, isToggled, disabled), " rounded-full p-1 cursor-pointer focus:ring-4 ring-Primary-100") }, { children: _jsx("div", { className: "bg-White\n ".concat(size === "sm" ? "md: w-4 md:h-4" : "md: w-5 md:h-5", " rounded-full shadow-md transition transform\n ").concat(isToggled ? toggleClass : null) }) })), _jsxs("label", __assign({ className: " mx-5 ".concat(getLabelStyle(disabled), " "), htmlFor: id }, { children: [_jsx(Typography, __assign({ variant: "Medium", type: getSizeClassName(size) }, { children: text })), secondaryText && (_jsx(Typography, __assign({ variant: "Regular", type: getSizeClassName(size) }, { children: secondaryText })))] }))] })));
|
|
53
|
-
};
|
|
54
|
-
export default ToggleSwitch;
|
|
55
|
-
//# sourceMappingURL=ToggleSwitch.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleSwitch.js","sourceRoot":"","sources":["../../../../src/components/toggleSwitch/ToggleSwitch.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,112 +0,0 @@
|
|
|
1
|
-
import { __assign } from "tslib";
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { Typography } from "../../components";
|
|
4
|
-
import { useState } from "react";
|
|
5
|
-
var getVariantPlacement = function (variant) {
|
|
6
|
-
var placement;
|
|
7
|
-
switch (variant) {
|
|
8
|
-
case "Bottom":
|
|
9
|
-
placement = "absolute block z-10 top-full left-1/2 translate-x-[-50%]";
|
|
10
|
-
break;
|
|
11
|
-
case "Left":
|
|
12
|
-
placement = "absolute block z-10 right-full top-1/2 translate-y-[-50%]";
|
|
13
|
-
break;
|
|
14
|
-
case "Right":
|
|
15
|
-
placement = "absolute block z-10 left-full top-1/2 translate-y-[-50%]";
|
|
16
|
-
break;
|
|
17
|
-
case "Top":
|
|
18
|
-
placement = "absolute block z-10 bottom-full left-1/2 translate-x-[-50%]";
|
|
19
|
-
break;
|
|
20
|
-
case "Top end":
|
|
21
|
-
placement = "absolute block z-10 bottom-full left-full";
|
|
22
|
-
break;
|
|
23
|
-
case "Top start":
|
|
24
|
-
placement = "absolute block z-10 bottom-full left-0";
|
|
25
|
-
break;
|
|
26
|
-
default:
|
|
27
|
-
placement = "absolute block z-10 bottom-full left-1/2 translate-x-[-50%]";
|
|
28
|
-
break;
|
|
29
|
-
}
|
|
30
|
-
return placement;
|
|
31
|
-
};
|
|
32
|
-
var getVariantMessagePlacement = function (variant) {
|
|
33
|
-
var placement;
|
|
34
|
-
switch (variant) {
|
|
35
|
-
case "Bottom":
|
|
36
|
-
placement = "mt-3 ";
|
|
37
|
-
break;
|
|
38
|
-
case "Left":
|
|
39
|
-
placement = "mr-3";
|
|
40
|
-
break;
|
|
41
|
-
case "Right":
|
|
42
|
-
placement = "ml-3";
|
|
43
|
-
break;
|
|
44
|
-
case "Top":
|
|
45
|
-
placement = "mb-3";
|
|
46
|
-
break;
|
|
47
|
-
case "Top end":
|
|
48
|
-
placement = "mb-3 -ml-4";
|
|
49
|
-
break;
|
|
50
|
-
case "Top start":
|
|
51
|
-
placement = "mb-3 -ml-4";
|
|
52
|
-
break;
|
|
53
|
-
default:
|
|
54
|
-
placement = "mb-3";
|
|
55
|
-
break;
|
|
56
|
-
}
|
|
57
|
-
return placement;
|
|
58
|
-
};
|
|
59
|
-
var getVariantArrowPlacement = function (variant) {
|
|
60
|
-
var placement;
|
|
61
|
-
switch (variant) {
|
|
62
|
-
case "Bottom":
|
|
63
|
-
placement = "top-2 left-1/2 translate-x-[-50%]";
|
|
64
|
-
break;
|
|
65
|
-
case "Left":
|
|
66
|
-
placement = "right-2 top-1/2 translate-y-[-50%]";
|
|
67
|
-
break;
|
|
68
|
-
case "Right":
|
|
69
|
-
placement = "left-2 top-1/2 translate-y-[-50%]";
|
|
70
|
-
break;
|
|
71
|
-
case "Top":
|
|
72
|
-
placement = "bottom-2 left-1/2 translate-x-[-50%]";
|
|
73
|
-
break;
|
|
74
|
-
case "Top start":
|
|
75
|
-
placement = "bottom-2 -left-1.5";
|
|
76
|
-
break;
|
|
77
|
-
case "Top end":
|
|
78
|
-
placement = "bottom-2 -left-1.5";
|
|
79
|
-
break;
|
|
80
|
-
default:
|
|
81
|
-
placement = "hidden";
|
|
82
|
-
break;
|
|
83
|
-
}
|
|
84
|
-
return placement;
|
|
85
|
-
};
|
|
86
|
-
var getTheme = function (theme) {
|
|
87
|
-
var t;
|
|
88
|
-
switch (theme) {
|
|
89
|
-
case "dark":
|
|
90
|
-
t = "text-White bg-Gray-900";
|
|
91
|
-
break;
|
|
92
|
-
case "light":
|
|
93
|
-
t = "bg-White text:Gray-700";
|
|
94
|
-
break;
|
|
95
|
-
default:
|
|
96
|
-
t = "bg-White text:Gray-700";
|
|
97
|
-
break;
|
|
98
|
-
}
|
|
99
|
-
return t;
|
|
100
|
-
};
|
|
101
|
-
var Tooltip = function (props) {
|
|
102
|
-
var _a = useState(false), active = _a[0], setActive = _a[1];
|
|
103
|
-
var _b = props || {}, _c = _b.variant, variant = _c === void 0 ? "Bottom" : _c, children = _b.children, _d = _b.theme, theme = _d === void 0 ? "dark" : _d, text = _b.text, supportingText = _b.supportingText;
|
|
104
|
-
return (_jsxs("div", __assign({ className: "relative inline-block", onMouseEnter: function () { return setActive(true); }, onMouseLeave: function () { return setActive(false); } }, { children: [children, _jsxs("div", __assign({ className: "w-max text-left max-w-xs ".concat(getVariantPlacement(variant)) }, { children: [
|
|
105
|
-
// using short circuit operator to show the tooltip //{`${getVariantMessagePlacement(variant)}`}
|
|
106
|
-
active && (text || supportingText) && (_jsxs("div", __assign({ className: "px-3 py-2 shadow-lg rounded-lg ".concat(getTheme(theme), " ").concat(getVariantMessagePlacement(variant)) }, { children: [_jsx(Typography, __assign({ variant: "Medium", type: "Text xs" }, { children: text })), Boolean(supportingText) &&
|
|
107
|
-
_jsx(Typography, __assign({ variant: "Regular", type: "Text xs" }, { children: supportingText }))] }))),
|
|
108
|
-
// using short circuit operator to show the tooltip arrow
|
|
109
|
-
active && variant && (text || supportingText) && (_jsx("div", { className: "absolute w-3 h-3 rotate-45 ".concat(getTheme(theme), " ").concat(getVariantArrowPlacement(variant)) }))] }))] })));
|
|
110
|
-
};
|
|
111
|
-
export default Tooltip;
|
|
112
|
-
//# sourceMappingURL=Tooltip.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../../src/components/tooltip/Tooltip.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/types.tsx"],"names":[],"mappings":""}
|
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
import { __assign, __rest } from "tslib";
|
|
2
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
-
var getVariantClassName = function (variant) {
|
|
4
|
-
var className;
|
|
5
|
-
switch (variant) {
|
|
6
|
-
case "Regular":
|
|
7
|
-
className = "font-inter-0";
|
|
8
|
-
break;
|
|
9
|
-
case "Medium":
|
|
10
|
-
className = "font-inter-1";
|
|
11
|
-
break;
|
|
12
|
-
case "Semibold":
|
|
13
|
-
className = "font-inter-2";
|
|
14
|
-
break;
|
|
15
|
-
case "Bold":
|
|
16
|
-
className = "font-inter-3";
|
|
17
|
-
break;
|
|
18
|
-
default:
|
|
19
|
-
className = "";
|
|
20
|
-
break;
|
|
21
|
-
}
|
|
22
|
-
return className;
|
|
23
|
-
};
|
|
24
|
-
var getTypeClassName = function (type) {
|
|
25
|
-
var className;
|
|
26
|
-
switch (type) {
|
|
27
|
-
case "Display 2xl":
|
|
28
|
-
className = "font-inter leading-0 text-10 tracking-0";
|
|
29
|
-
break;
|
|
30
|
-
case "Display xl":
|
|
31
|
-
className = "font-inter leading-1 text-9 tracking-0";
|
|
32
|
-
break;
|
|
33
|
-
case "Display lg":
|
|
34
|
-
className = "font-inter leading-2 text-8 tracking-0";
|
|
35
|
-
break;
|
|
36
|
-
case "Display md":
|
|
37
|
-
className = "font-inter leading-3 text-7 tracking-0";
|
|
38
|
-
break;
|
|
39
|
-
case "Display sm":
|
|
40
|
-
className = "font-inter leading-4 text-6 tracking-1";
|
|
41
|
-
break;
|
|
42
|
-
case "Display xs":
|
|
43
|
-
className = "font-inter leading-5 text-5 tracking-1";
|
|
44
|
-
break;
|
|
45
|
-
case "Text xl":
|
|
46
|
-
className = "font-inter leading-7 text-4 tracking-1";
|
|
47
|
-
break;
|
|
48
|
-
case "Text lg":
|
|
49
|
-
className = "font-inter leading-8 text-3 tracking-1";
|
|
50
|
-
break;
|
|
51
|
-
case "Text md":
|
|
52
|
-
className = "font-inter leading-9 text-2 tracking-1";
|
|
53
|
-
break;
|
|
54
|
-
case "Text sm":
|
|
55
|
-
className = "font-inter leading-10 text-1 tracking-1";
|
|
56
|
-
break;
|
|
57
|
-
case "Text xs":
|
|
58
|
-
className = "font-inter leading-11 text-0 tracking-1";
|
|
59
|
-
break;
|
|
60
|
-
default:
|
|
61
|
-
className = "font-inter";
|
|
62
|
-
}
|
|
63
|
-
return className;
|
|
64
|
-
};
|
|
65
|
-
var Typography = function (_a) {
|
|
66
|
-
var _b = _a.variant, variant = _b === void 0 ? "Regular" : _b, _c = _a.type, type = _c === void 0 ? "Text md" : _c, _d = _a.className, className = _d === void 0 ? "" : _d, children = _a.children, textProps = __rest(_a, ["variant", "type", "className", "children"]);
|
|
67
|
-
return (_jsx("div", __assign({}, textProps, { className: "".concat(getTypeClassName(type), " ").concat(getVariantClassName(variant), " ").concat(className) }, { children: children })));
|
|
68
|
-
};
|
|
69
|
-
export default Typography;
|
|
70
|
-
//# sourceMappingURL=Typography.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Typography.js","sourceRoot":"","sources":["../../../../src/components/typography/Typography.tsx"],"names":[],"mappings":";;AAEA,IAAM,mBAAmB,GAAG,UAAC,OAAe;IAC1C,IAAI,SAAiB,CAAC;IACtB,QAAQ,OAAO,EAAE;QACf,KAAK,SAAS;YACZ,SAAS,GAAG,cAAc,CAAC;YAC3B,MAAM;QACR,KAAK,QAAQ;YACX,SAAS,GAAG,cAAc,CAAC;YAC3B,MAAM;QACR,KAAK,UAAU;YACb,SAAS,GAAG,cAAc,CAAC;YAC3B,MAAM;QACR,KAAK,MAAM;YACT,SAAS,GAAG,cAAc,CAAC;YAC3B,MAAM;QACR;YACE,SAAS,GAAG,EAAE,CAAC;YACf,MAAM;KACT;IACD,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,IAAM,gBAAgB,GAAG,UAAC,IAAY;IACpC,IAAI,SAAiB,CAAC;IACtB,QAAQ,IAAI,EAAE;QACZ,KAAK,aAAa;YAChB,SAAS,GAAG,yCAAyC,CAAC;YACtD,MAAM;QACR,KAAK,YAAY;YACf,SAAS,GAAG,wCAAwC,CAAC;YACrD,MAAM;QACR,KAAK,YAAY;YACf,SAAS,GAAG,wCAAwC,CAAC;YACrD,MAAM;QACR,KAAK,YAAY;YACf,SAAS,GAAG,wCAAwC,CAAC;YACrD,MAAM;QACR,KAAK,YAAY;YACf,SAAS,GAAG,wCAAwC,CAAC;YACrD,MAAM;QACR,KAAK,YAAY;YACf,SAAS,GAAG,wCAAwC,CAAC;YACrD,MAAM;QACR,KAAK,SAAS;YACZ,SAAS,GAAG,wCAAwC,CAAC;YACrD,MAAM;QACR,KAAK,SAAS;YACZ,SAAS,GAAG,wCAAwC,CAAC;YACrD,MAAM;QACR,KAAK,SAAS;YACZ,SAAS,GAAG,wCAAwC,CAAC;YACrD,MAAM;QACR,KAAK,SAAS;YACZ,SAAS,GAAG,yCAAyC,CAAC;YACtD,MAAM;QACR,KAAK,SAAS;YACZ,SAAS,GAAG,0CAA0C,CAAC;YACvD,MAAM;QACR;YACE,SAAS,GAAG,YAAY,CAAC;KAC5B;IACD,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,IAAM,UAAU,GAAG,UAAC,EAMF;IALhB,IAAA,eAAmB,EAAnB,OAAO,mBAAG,SAAS,KAAA,EACnB,YAAgB,EAAhB,IAAI,mBAAG,SAAS,KAAA,EAChB,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,QAAQ,cAAA,EACL,SAAS,cALM,4CAMnB,CADa;IAEZ,OAAO,CACL,yBACM,SAAS,IACb,SAAS,EAAE,UAAG,gBAAgB,CAAC,IAAI,CAAC,cAAI,mBAAmB,CACzD,OAAO,CACR,cAAI,SAAS,CAAE,gBAEf,QAAQ,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC"}
|