@typeolymp/ui-components 1.10.1 → 1.11.0

package/build/components/molecules/Card/index.d.ts

@@ -3,6 +3,7 @@ import { Color } from "@typeolymp/utility/build/enums";
 export declare type PropsType = {
     ellipse?: Color;
     id?: string;
+    bordered?: boolean;
     children: ReactNode;
 };
 declare const Card: FC<PropsType>;

package/build/index.es.js

@@ -4603,7 +4603,10 @@ var templateObject_1$w;
 
 var Alert = function (props) { return (jsxs(Container$i, __assign$2({}, props, { children: [jsx$1(Icon, { size: "small", type: props.type === "success" ? "check" : "warning", color: props.type === "success" ? "green" : "red" }), jsx$1(Spacer, { horizontal: 10 }), jsx$1(Paragraph, { children: props.message })] }))); };
 
-var StyledCard = styled.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject$1(["\n  background-color: ", ";\n  box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n  border-radius: 6px;\n  overflow: hidden;\n  position: relative;\n\n  ", "\n"], ["\n  background-color: ", ";\n  box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n  border-radius: 6px;\n  overflow: hidden;\n  position: relative;\n\n  ", "\n"])), theme.colors.lightGray.light, function (_a) {
+var StyledCard = styled.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject$1(["\n  background-color: ", ";\n  border: ", ";\n  box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n  border-radius: 6px;\n  overflow: hidden;\n  position: relative;\n\n  ", "\n"], ["\n  background-color: ", ";\n  border: ", ";\n  box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n  border-radius: 6px;\n  overflow: hidden;\n  position: relative;\n\n  ", "\n"])), theme.colors.lightGray.light, function (_a) {
+    var bordered = _a.bordered;
+    return bordered ? "1px solid ".concat(theme.colors.lightGray.dark) : "none";
+}, function (_a) {
     var ellipse = _a.ellipse;
     return ellipse
         ? ":hover {\n        box-shadow: 0px 4px 0px ".concat(function (_a) {
@@ -11493,12 +11496,12 @@ var Result = function (props) {
     return (jsxs(Container$1, __assign$2({ passed: isPassed }, { children: [jsx$1(Icon, { type: isPassed ? "check" : "warning", color: isPassed ? "green" : "red", size: "large" }), jsx$1(Spacer, { horizontal: 15 }), jsxs("div", { children: [jsx$1(Heading, __assign$2({ type: "h5" }, { children: props.title })), jsx$1(Paragraph, { children: props.subtitle })] }), props.progressBar && (jsxs(ProgressBarWrapper, { children: [jsx$1(Indicator, { value: (props.target / props.progressBar.max) * 100 }), jsx$1(Target, __assign$2({ value: (props.target / props.progressBar.max) * 100, width: targetWidth, ref: ref }, { children: jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.target, props.progressBar.unit] })) })), jsx$1(ProgressBar, { percent: (props.value / props.progressBar.max) * 100, color: isPassed ? "green" : "red" }), jsxs("div", { children: [jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.progressBar.min, props.progressBar.unit] })), jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.progressBar.max, props.progressBar.unit] }))] })] }))] })));
 };
 
-var Container = styled.table(templateObject_1 || (templateObject_1 = __makeTemplateObject$1(["\n  width: 100%;\n  border-collapse: collapse;\n  border-radius: 6px;\n  border-style: hidden;\n  box-shadow: 0 0 0 1px ", ";\n  overflow: hidden;\n"], ["\n  width: 100%;\n  border-collapse: collapse;\n  border-radius: 6px;\n  border-style: hidden;\n  box-shadow: 0 0 0 1px ", ";\n  overflow: hidden;\n"])), theme.colors.lightGray.dark);
-var TableHead = styled.thead(templateObject_2 || (templateObject_2 = __makeTemplateObject$1(["\n  border-bottom: 1px solid ", ";\n"], ["\n  border-bottom: 1px solid ", ";\n"])), theme.colors.lightGray.dark);
+var Container = styled.table(templateObject_1 || (templateObject_1 = __makeTemplateObject$1(["\n  width: 100%;\n  border-collapse: collapse;\n  border-radius: 6px;\n  border-style: hidden;\n  overflow: hidden;\n  box-shadow: 0 0 0 1px ", ";\n"], ["\n  width: 100%;\n  border-collapse: collapse;\n  border-radius: 6px;\n  border-style: hidden;\n  overflow: hidden;\n  box-shadow: 0 0 0 1px ", ";\n"])), theme.colors.lightGray.dark);
+var TableHead = styled.thead(templateObject_2 || (templateObject_2 = __makeTemplateObject$1([""], [""])));
 var TableBody = styled.tbody(templateObject_3 || (templateObject_3 = __makeTemplateObject$1([""], [""])));
 styled.tfoot(templateObject_4 || (templateObject_4 = __makeTemplateObject$1([""], [""])));
 var ColumnTitle = styled.th(templateObject_5 || (templateObject_5 = __makeTemplateObject$1(["\n  text-align: left;\n  padding-left: 15px;\n"], ["\n  text-align: left;\n  padding-left: 15px;\n"])));
-var TableRow = styled.tr(templateObject_6 || (templateObject_6 = __makeTemplateObject$1(["\n  height: 50px;\n  border-bottom: 1px solid ", ";\n\n  :nth-child(even) {\n    background: ", ";\n  }\n"], ["\n  height: 50px;\n  border-bottom: 1px solid ", ";\n\n  :nth-child(even) {\n    background: ", ";\n  }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.base);
+var TableRow = styled.tr(templateObject_6 || (templateObject_6 = __makeTemplateObject$1(["\n  height: 50px;\n  border-bottom: 1px solid ", ";\n\n  :nth-child(odd) {\n    background: ", ";\n  }\n  :nth-child(even) {\n    background: ", ";\n  }\n"], ["\n  height: 50px;\n  border-bottom: 1px solid ", ";\n\n  :nth-child(odd) {\n    background: ", ";\n  }\n  :nth-child(even) {\n    background: ", ";\n  }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.light, theme.colors.lightGray.base);
 var TableCell = styled.td(templateObject_7 || (templateObject_7 = __makeTemplateObject$1(["\n  padding: 0 15px;\n  font-family: ", ";\n  font-size: ", ";\n  font-weight: 400;\n  font-style: normal;\n  line-height: ", ";\n  color: ", ";\n"], ["\n  padding: 0 15px;\n  font-family: ", ";\n  font-size: ", ";\n  font-weight: 400;\n  font-style: normal;\n  line-height: ", ";\n  color: ", ";\n"])), theme.fonts.paragraph, theme.paragraph.medium.fontSize, theme.paragraph.medium.lineHeight, theme.colors.darkGray.light);
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;