@typeolymp/ui-components 3.0.17 → 3.0.19

package/build/components/atoms/Button/index.d.ts

@@ -2,7 +2,7 @@ import React from "react";
 import { PropsType as IconPropsType } from "../Icon";
 export declare type PropsType = {
     label: string | JSX.Element;
-    color?: "blue" | "green" | "red" | "white";
+    color?: "blue" | "green" | "darkGreen" | "red" | "purple" | "white";
     size?: "small" | "medium";
     fluid?: boolean;
     disabled?: boolean;

package/build/components/atoms/Icon/index.d.ts

@@ -2,7 +2,7 @@ import { FC } from "react";
 export declare type PropsType = {
     type: "check" | "chevronUp" | "chevronRight" | "chevronDown" | "chevronLeft" | "eye" | "eyeInvisible" | "warning" | "questionCircle" | "play" | "lock" | "unlock" | "cross" | "bulb" | "star" | "setting" | "reload" | "expand" | "calendar" | "plus" | "envelope" | "facebook" | "instagram" | "menuAlt" | "link" | "heart" | "thunder" | "fire" | "control" | "fileAdd" | "fileCheck" | "fileError" | "fileArrow" | "download" | "upload" | "dotsVertical" | "dotsHorizontal" | "bell" | "bin" | "user" | "search" | "infoCircle" | "swap" | "login" | "logout" | "edit" | "archive" | "unarchive" | "keyboard";
     size?: "tiny" | "small" | "medium" | "large";
-    color?: "blue" | "green" | "orange" | "red" | "purple" | "gray" | "darkGray" | "lightGray" | "white";
+    color?: "blue" | "green" | "darkGreen" | "orange" | "red" | "purple" | "gray" | "darkGray" | "lightGray" | "white";
     onClick?(e?: MouseEvent): void;
 };
 declare const Icon: FC<PropsType>;

package/build/index.es.js

@@ -37,15 +37,21 @@ var theme = {
             // darker: "#126994",
         },
         green: {
-            light: "#2FD8A5",
-            base: "#00906C",
-            dark: "#007C60",
-            darker: "#045041",
+            light: "#CBFF95",
+            base: "#89F625",
+            dark: "#4FB100",
+            darker: "#32690B",
             // light: "#8BDCAE",
             // base: "#3DC478",
             // dark: "#319D60",
             // darker: "#257648",
         },
+        darkGreen: {
+            light: "#6AEBC0",
+            base: "#00906C",
+            dark: "#007C60",
+            darker: "#045041",
+        },
         purple: {
             light: "#9870ff",
             base: "#6f0fff",
@@ -3514,6 +3520,8 @@ var Wrapper$a = styled.div(templateObject_1$W || (templateObject_1$W = __makeTem
             return theme.colors.blue.base;
         case "green":
             return theme.colors.green.base;
+        case "darkGreen":
+            return theme.colors.green.darker;
         case "orange":
             return theme.colors.orange.base;
         case "red":
@@ -3542,6 +3550,8 @@ var Wrapper$a = styled.div(templateObject_1$W || (templateObject_1$W = __makeTem
             return theme.colors.blue.dark;
         case "green":
             return theme.colors.green.dark;
+        case "darkGreen":
+            return theme.colors.green.darker;
         case "orange":
             return theme.colors.orange.dark;
         case "red":
@@ -3607,7 +3617,7 @@ var icons = {
 };
 var Icon = function (props) { return (jsx$1(Wrapper$a, __assign$2({}, props, { children: jsx$1("svg", __assign$2({ viewBox: "0 0 24 24", fill: "none" }, { children: icons[props.type] })) }))); };
 
-var StyledButton = styled.button(templateObject_1$V || (templateObject_1$V = __makeTemplateObject$1(["\n  width: ", ";\n  height: ", ";\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  padding: 13px 20px 16px;\n  background-color: ", ";\n  box-shadow: ", ";\n\n  border: ", ";\n  border-radius: 6px;\n  box-sizing: border-box;\n  text-decoration: none;\n  cursor: pointer;\n\n  svg {\n    pointer-events: none;\n  }\n\n  span {\n    color: ", ";\n    font-family: ", ";\n    font-style: normal;\n    font-weight: bold;\n    font-size: ", ";\n  }\n\n  :hover {\n    opacity: ", ";\n    background-color: ", ";\n  }\n\n  :active {\n    position: relative;\n    top: 3px;\n    margin-bottom: 3px;\n    box-shadow: none;\n    height: ", "\n"], ["\n  width: ", ";\n  height: ", ";\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  padding: 13px 20px 16px;\n  background-color: ", ";\n  box-shadow: ", ";\n\n  border: ", ";\n  border-radius: 6px;\n  box-sizing: border-box;\n  text-decoration: none;\n  cursor: pointer;\n\n  svg {\n    pointer-events: none;\n  }\n\n  span {\n    color: ", ";\n    font-family: ", ";\n    font-style: normal;\n    font-weight: bold;\n    font-size: ", ";\n  }\n\n  :hover {\n    opacity: ", ";\n    background-color: ", ";\n  }\n\n  :active {\n    position: relative;\n    top: 3px;\n    margin-bottom: 3px;\n    box-shadow: none;\n    height: ", "\n"])), function (_a) {
+var StyledButton = styled.button(templateObject_1$V || (templateObject_1$V = __makeTemplateObject$1(["\n  width: ", ";\n  height: ", ";\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  padding: 13px 20px 16px;\n  background-color: ", ";\n  box-shadow: ", ";\n\n  border: ", ";\n  border-radius: 14px;\n  box-sizing: border-box;\n  text-decoration: none;\n  cursor: pointer;\n\n  svg {\n    pointer-events: none;\n  }\n\n  span {\n    color: ", ";\n    font-family: ", ";\n    font-style: normal;\n    font-weight: bold;\n    font-size: ", ";\n  }\n\n  :hover {\n    opacity: ", ";\n    background-color: ", ";\n  }\n\n  :active {\n    position: relative;\n    top: 3px;\n    margin-bottom: 3px;\n    box-shadow: none;\n    height: ", "\n"], ["\n  width: ", ";\n  height: ", ";\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  padding: 13px 20px 16px;\n  background-color: ", ";\n  box-shadow: ", ";\n\n  border: ", ";\n  border-radius: 14px;\n  box-sizing: border-box;\n  text-decoration: none;\n  cursor: pointer;\n\n  svg {\n    pointer-events: none;\n  }\n\n  span {\n    color: ", ";\n    font-family: ", ";\n    font-style: normal;\n    font-weight: bold;\n    font-size: ", ";\n  }\n\n  :hover {\n    opacity: ", ";\n    background-color: ", ";\n  }\n\n  :active {\n    position: relative;\n    top: 3px;\n    margin-bottom: 3px;\n    box-shadow: none;\n    height: ", "\n"])), function (_a) {
     var fluid = _a.fluid;
     return (fluid ? "100%" : "fit-content");
 }, function (_a) {
@@ -3621,6 +3631,10 @@ var StyledButton = styled.button(templateObject_1$V || (templateObject_1$V = __m
             return theme.colors.blue.base;
         case "green":
             return theme.colors.green.base;
+        case "darkGreen":
+            return theme.colors.darkGreen.base;
+        case "purple":
+            return theme.colors.purple.base;
         case "red":
             return theme.colors.red.base;
         case "white":
@@ -3634,6 +3648,10 @@ var StyledButton = styled.button(templateObject_1$V || (templateObject_1$V = __m
             return "inset 0 -3px 0 ".concat(theme.colors.blue.dark);
         case "green":
             return "inset 0 -3px 0 ".concat(theme.colors.green.dark);
+        case "darkGreen":
+            return "inset 0 -3px 0 ".concat(theme.colors.darkGreen.darker);
+        case "purple":
+            return "inset 0 -3px 0 ".concat(theme.colors.purple.darker);
         case "red":
             return "inset 0 -3px 0 ".concat(theme.colors.red.dark);
         case "white":
@@ -3644,9 +3662,17 @@ var StyledButton = styled.button(templateObject_1$V || (templateObject_1$V = __m
     return color === "white" ? "1px solid #e4e4e4" : "none";
 }, function (_a) {
     var color = _a.color;
-    return color === "white"
-        ? theme.colors.darkGray.light
-        : theme.colors.lightGray.light;
+    switch (color) {
+        default:
+        case "blue":
+        case "red":
+        case "darkGreen":
+            return theme.colors.lightGray.light;
+        case "green":
+            return theme.colors.green.darker;
+        case "white":
+            return theme.colors.darkGray.light;
+    }
 }, theme.fonts.heading, function (_a) {
     var size = _a.size;
     return !size ? theme.button.medium.fontSize : theme.button[size].fontSize;
@@ -3726,7 +3752,13 @@ var Button$1 = forwardRef(function (_a, ref) {
         return (jsx$1(DisabledButton, __assign$2({ color: color, size: size, fluid: fluid, type: type, tabIndex: tabIndex, as: as, href: href, ref: ref ? ref : buttonRef }, { children: jsxs(Fragment$1, { children: [icon && renderIcon({ color: "lightGray" }), jsx$1("span", { children: label })] }) })));
     }
     return (jsx$1(StyledButton, __assign$2({ color: color, size: size, fluid: fluid, type: type, tabIndex: tabIndex, as: as, href: href, ref: ref ? ref : buttonRef, onClick: onClick }, { children: isLoading ? (jsx$1(Loader, { dark: color === "white" })) : (jsxs(Fragment$1, { children: [icon &&
-                    renderIcon({ color: color === "white" ? "gray" : "white" }), jsx$1("span", { children: label })] })) })));
+                    renderIcon({
+                        color: color === "white"
+                            ? "gray"
+                            : color === "green"
+                                ? "darkGreen"
+                                : "white",
+                    }), jsx$1("span", { children: label })] })) })));
 });
 
 var StyledCheckbox = styled.div(templateObject_1$T || (templateObject_1$T = __makeTemplateObject$1(["\n  min-height: 25px;\n  max-height: 25px;\n  min-width: 25px;\n  max-width: 25px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 4px;\n  border-width: 1px;\n  border-style: solid;\n  border-color: ", ";\n  cursor: ", ";\n  background-color: ", ";\n\n  svg {\n    margin-left: -1px;\n    fill: ", ";\n  }\n\n  input {\n    display: none;\n  }\n\n  :focus {\n    outline: 0;\n    border-color: ", ";\n    box-shadow: ", ";\n  }\n"], ["\n  min-height: 25px;\n  max-height: 25px;\n  min-width: 25px;\n  max-width: 25px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 4px;\n  border-width: 1px;\n  border-style: solid;\n  border-color: ", ";\n  cursor: ", ";\n  background-color: ", ";\n\n  svg {\n    margin-left: -1px;\n    fill: ", ";\n  }\n\n  input {\n    display: none;\n  }\n\n  :focus {\n    outline: 0;\n    border-color: ", ";\n    box-shadow: ", ";\n  }\n"])), function (_a) {
@@ -3821,6 +3853,7 @@ exports.Color = void 0;
     Color["YELLOW"] = "yellow";
     Color["BLUE"] = "blue";
     Color["GREEN"] = "green";
+    Color["DARK_GREEN"] = "darkGreen";
     Color["PURPLE"] = "purple";
     Color["PINK"] = "pink";
     Color["ORANGE"] = "orange";
@@ -4009,6 +4042,8 @@ exports.NotificationType = void 0;
 (function (NotificationType) {
     NotificationType["STUDENT_UPGRADE_REQUEST"] = "studentUpgradeRequest";
     NotificationType["STUDENT_RESET_PASSWORD_REQUEST"] = "studentResetPasswordRequest";
+    NotificationType["STUDENT_COMPLETED_CHAPTER"] = "studentCompletedChapter";
+    NotificationType["STUDENT_EXAM_RESULT"] = "studentExamResult";
     NotificationType["TUTOR_INVITE"] = "tutorInvite";
 })(exports.NotificationType || (exports.NotificationType = {}));
 
@@ -4045,6 +4080,21 @@ exports.TextTopic = void 0;
 
 }(TextTopic));
 
+var TutorEmailPreference = {};
+
+(function (exports) {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TutorEmailPreference = void 0;
+(function (TutorEmailPreference) {
+    TutorEmailPreference["STUDENT_UPGRADE_REQUEST"] = "studentUpgradeRequest";
+    TutorEmailPreference["STUDENT_RESET_PASSWORD_REQUEST"] = "studentResetPasswordRequest";
+    TutorEmailPreference["STUDENT_COMPLETED_CHAPTER"] = "studentCompletedChapter";
+    TutorEmailPreference["STUDENT_EXAM_RESULT"] = "studentExamResult";
+    TutorEmailPreference["CLASSROOM_INVITATION"] = "classroomInvitation";
+})(exports.TutorEmailPreference || (exports.TutorEmailPreference = {}));
+
+}(TutorEmailPreference));
+
 (function (exports) {
 var __createBinding = (commonjsGlobal && commonjsGlobal.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
@@ -4077,6 +4127,7 @@ __exportStar(NodeEnv, exports);
 __exportStar(NotificationType, exports);
 __exportStar(Plan, exports);
 __exportStar(TextTopic, exports);
+__exportStar(TutorEmailPreference, exports);
 
 }(enums));