@typeolymp/ui-components 2.1.1 → 2.1.3
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.
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export declare const Container: any;
|
|
2
|
-
export declare const
|
|
2
|
+
export declare const Dot: any;
|
package/build/index.es.js
CHANGED
|
@@ -17894,10 +17894,10 @@ var templateObject_1$i, templateObject_2$i, templateObject_3$8;
|
|
|
17894
17894
|
|
|
17895
17895
|
var ProgressBar = function (props) { return (jsxs(Wrapper, { children: [jsx$1(StyledProgressBar, __assign$2({}, props, { children: jsx$1(Indicator$1, __assign$2({}, props)) })), props.showInfo && (jsx$1(Paragraph, __assign$2({ size: "small" }, { children: props.info ? props.info : "".concat(props.percent, "%") })))] })); };
|
|
17896
17896
|
|
|
17897
|
-
var Container$a = styled.ol(templateObject_1$h || (templateObject_1$h = __makeTemplateObject$1(["\n display: flex;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"])));
|
|
17898
|
-
var
|
|
17897
|
+
var Container$a = styled.ol(templateObject_1$h || (templateObject_1$h = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n gap: 20px;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n list-style-type: none;\n position: relative;\n\n :after {\n content: \"\";\n height: 4px;\n width: 100%;\n background-color: ", ";\n position: absolute;\n top: 24px;\n z-index: -1;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n gap: 20px;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n list-style-type: none;\n position: relative;\n\n :after {\n content: \"\";\n height: 4px;\n width: 100%;\n background-color: ", ";\n position: absolute;\n top: 24px;\n z-index: -1;\n }\n"])), theme.colors.lightGray.dark);
|
|
17898
|
+
var Dot$2 = styled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject$1(["\n width: 32px;\n height: 32px;\n border-radius: 50%;\n border: 10px solid ", ";\n cursor: ", ";\n\n background-color: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n :hover {\n background-color: ", ";\n }\n\n > div {\n pointer-events: none;\n }\n"], ["\n width: 32px;\n height: 32px;\n border-radius: 50%;\n border: 10px solid ", ";\n cursor: ", ";\n\n background-color: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n :hover {\n background-color: ", ";\n }\n\n > div {\n pointer-events: none;\n }\n"])), theme.colors.lightGray.light, function (_a) {
|
|
17899
17899
|
var status = _a.status;
|
|
17900
|
-
return
|
|
17900
|
+
return status === "passed" ? "pointer" : "not-allowed";
|
|
17901
17901
|
}, function (_a) {
|
|
17902
17902
|
var status = _a.status;
|
|
17903
17903
|
switch (status) {
|
|
@@ -17905,18 +17905,20 @@ var Step$2 = styled.li(templateObject_2$h || (templateObject_2$h = __makeTemplat
|
|
|
17905
17905
|
return theme.colors.green.base;
|
|
17906
17906
|
case "active":
|
|
17907
17907
|
return theme.colors.blue.base;
|
|
17908
|
-
|
|
17908
|
+
case "waiting":
|
|
17909
17909
|
return theme.colors.lightGray.dark;
|
|
17910
17910
|
}
|
|
17911
|
-
},
|
|
17911
|
+
}, function (_a) {
|
|
17912
17912
|
var status = _a.status;
|
|
17913
|
-
|
|
17914
|
-
|
|
17915
|
-
|
|
17916
|
-
|
|
17917
|
-
|
|
17918
|
-
|
|
17919
|
-
|
|
17913
|
+
switch (status) {
|
|
17914
|
+
case "passed":
|
|
17915
|
+
return theme.colors.green.light;
|
|
17916
|
+
case "active":
|
|
17917
|
+
return theme.colors.blue.light;
|
|
17918
|
+
case "waiting":
|
|
17919
|
+
return theme.colors.lightGray.base;
|
|
17920
|
+
}
|
|
17921
|
+
});
|
|
17920
17922
|
var templateObject_1$h, templateObject_2$h;
|
|
17921
17923
|
|
|
17922
17924
|
var Steps$2 = function (props) { return (jsx$1(Container$a, { children: props.steps.map(function (_a, index) {
|
|
@@ -17926,16 +17928,16 @@ var Steps$2 = function (props) { return (jsx$1(Container$a, { children: props.st
|
|
|
17926
17928
|
? "passed"
|
|
17927
17929
|
: props.current === step
|
|
17928
17930
|
? "active"
|
|
17929
|
-
: "";
|
|
17931
|
+
: "waiting";
|
|
17930
17932
|
var onClickStep = function () {
|
|
17931
17933
|
if (onClick && props.current >= step)
|
|
17932
17934
|
onClick(step);
|
|
17933
17935
|
};
|
|
17934
|
-
return (jsxs(
|
|
17936
|
+
return (jsxs("li", { children: [jsx$1(Dot$2, __assign$2({ status: status, onClick: onClickStep }, { children: status === "passed" ? (jsx$1(Icon, { type: "check", size: "small", color: "white" })) : (jsx$1(Heading, __assign$2({ type: "h6", color: status === "active" ? "white" : "gray" }, { children: step }))) })), title && jsx$1(Paragraph, { children: title })] }, "step-".concat(step)));
|
|
17935
17937
|
}) })); };
|
|
17936
17938
|
|
|
17937
17939
|
var Container$9 = styled.ol(templateObject_1$g || (templateObject_1$g = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"])));
|
|
17938
|
-
var Step$1 = styled.li(templateObject_2$g || (templateObject_2$g = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n box-shadow: inset 0px -1px 0px ", ";\n padding: 20px 0 20px 20px;\n cursor: ", ";\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin-right: 10px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n }\n\n
|
|
17940
|
+
var Step$1 = styled.li(templateObject_2$g || (templateObject_2$g = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n box-shadow: inset 0px -1px 0px ", ";\n padding: 20px 0 20px 20px;\n cursor: ", ";\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin-right: 10px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :hover {\n background-color: ", ";\n }\n"], ["\n display: flex;\n align-items: center;\n box-shadow: inset 0px -1px 0px ", ";\n padding: 20px 0 20px 20px;\n cursor: ", ";\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin-right: 10px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :hover {\n background-color: ", ";\n }\n"])), theme.colors.lightGray.dark, function (_a) {
|
|
17939
17941
|
var status = _a.status;
|
|
17940
17942
|
return (!!status ? "pointer" : "not-allowed");
|
|
17941
17943
|
}, function (_a) {
|
|
@@ -17948,11 +17950,6 @@ var Step$1 = styled.li(templateObject_2$g || (templateObject_2$g = __makeTemplat
|
|
|
17948
17950
|
default:
|
|
17949
17951
|
return theme.colors.lightGray.dark;
|
|
17950
17952
|
}
|
|
17951
|
-
}, function (_a) {
|
|
17952
|
-
var status = _a.status;
|
|
17953
|
-
return status === "active"
|
|
17954
|
-
? theme.colors.lightGray.light
|
|
17955
|
-
: theme.colors.darkGray.light;
|
|
17956
17953
|
}, theme.colors.darkGray.base, theme.colors.lightGray.base);
|
|
17957
17954
|
var templateObject_1$g, templateObject_2$g;
|
|
17958
17955
|
|
|
@@ -17968,7 +17965,7 @@ var Steps$1 = function (props) { return (jsx$1(Container$9, { children: props.st
|
|
|
17968
17965
|
if (onClick && props.current >= step)
|
|
17969
17966
|
onClick(step);
|
|
17970
17967
|
};
|
|
17971
|
-
return (jsxs(Step$1, __assign$2({ status: status, onClick: onClickStep }, { children: [jsx$1("div", { children: status === "passed" ? (jsx$1(Icon, { type: "check", size: "small", color: "white" })) : (jsx$1(Heading, __assign$2({ type: "h6" }, { children: step }))) }), title && jsx$1(Paragraph, { children: title })] }), "".concat(title, "-").concat(step)));
|
|
17968
|
+
return (jsxs(Step$1, __assign$2({ status: status, onClick: onClickStep }, { children: [jsx$1("div", { children: status === "passed" ? (jsx$1(Icon, { type: "check", size: "small", color: "white" })) : (jsx$1(Heading, __assign$2({ type: "h6", color: status === "active" ? "white" : "gray" }, { children: step }))) }), title && jsx$1(Paragraph, { children: title })] }), "".concat(title, "-").concat(step)));
|
|
17972
17969
|
}) })); };
|
|
17973
17970
|
|
|
17974
17971
|
var Steps = function (props) {
|
|
@@ -48824,9 +48821,11 @@ var Table = function (_a) {
|
|
|
48824
48821
|
display: "flex",
|
|
48825
48822
|
justifyContent: "center",
|
|
48826
48823
|
marginTop: 10,
|
|
48827
|
-
} }, { children: jsx$1(Checkbox, { id: "selectAll", name: "selectAll", value: "selectAll", checked: selectedRowKeys.length > 0 &&
|
|
48824
|
+
} }, { children: jsx$1(Checkbox, { id: "selectAll", name: "selectAll", value: "selectAll", checked: selectedRowKeys.length > 0 &&
|
|
48825
|
+
selectedRowKeys.length === data.length, onChange: onSelectAllRows }) }))), columns.map(function (_a, index) {
|
|
48828
48826
|
var title = _a.title, titlePopup = _a.titlePopup, dataIndex = _a.dataIndex;
|
|
48829
|
-
return (jsx$1(ColumnTitle, { children: jsxs("div", __assign$2({ style: { display: "flex", alignItems: "center", gap: 5 } }, { children: [title &&
|
|
48827
|
+
return (jsx$1(ColumnTitle, { children: jsxs("div", __assign$2({ style: { display: "flex", alignItems: "center", gap: 5 } }, { children: [title &&
|
|
48828
|
+
(typeof title === "string" ? (jsx$1(Heading, __assign$2({ type: "h6", as: "span" }, { children: title }))) : (title)), titlePopup && (jsx$1(Popup, __assign$2({ content: titlePopup }, { children: jsx$1(Icon, { type: "questionCircle", size: "tiny", color: "lightGray" }) })))] })) }, "".concat(dataIndex, "-").concat(index)));
|
|
48830
48829
|
})] }) }), jsx$1(TableBody, { children: data.length === 0 ? (jsx$1(TableRow, { children: jsx$1(EmptyTableCell, __assign$2({ colSpan: rowSelection ? columns.length + 1 : columns.length }, { children: jsx$1(Paragraph, __assign$2({ align: "center", size: "small", weight: "regular" }, { children: emptyText || "No data" })) })) })) : (data.map(function (row, rowIndex) { return (jsxs(TableRow, { children: [rowSelection && (jsx$1(TableCell, { children: jsx$1(Checkbox, { id: rowIndex.toString(), name: rowIndex.toString(), value: row.key, checked: selectedRowKeys.includes(row.key), onChange: onSelectRow }) }, "row-select-".concat(rowIndex))), columns.map(function (_a, colIndex) {
|
|
48831
48830
|
var dataIndex = _a.dataIndex, render = _a.render, align = _a.align;
|
|
48832
48831
|
var data = row[dataIndex];
|