@typeolymp/ui-components 1.16.0 → 1.16.2

package/build/index.js

@@ -5,9 +5,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var React$3 = require('react');
 var styled = require('styled-components');
-var parsers = require('@typeolymp/utils/parsers');
-var expressions = require('@typeolymp/utils/expressions');
-var enums = require('@typeolymp/utils/enums');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -3518,7 +3515,11 @@ var Button = React$3.forwardRef(function (_a, ref) {
     var buttonRef = React$3.useRef(null);
     var _b = React$3.useState(false), isLoading = _b[0], setIsLoading = _b[1];
     var as = href || asAnchor ? "a" : "button";
-    var onClick = function () {
+    var onClick = function (e) {
+        if (props.onClickAsync || props.onClick) {
+            e.stopPropagation();
+            e.preventDefault();
+        }
         if (props.onClickAsync) {
             setIsLoading(true);
             new Promise(function (resolve) {
@@ -3626,6 +3627,266 @@ var Wrapper$a = styled__default["default"].div(templateObject_1$Q || (templateOb
 });
 var templateObject_1$Q;
 
+var parsers = {};
+
+var getCountryByLocale$1 = {};
+
+var enums = {};
+
+var Color = {};
+
+(function (exports) {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Color = void 0;
+(function (Color) {
+    Color["RED"] = "red";
+    Color["YELLOW"] = "yellow";
+    Color["BLUE"] = "blue";
+    Color["GREEN"] = "green";
+    Color["PURPLE"] = "purple";
+    Color["PINK"] = "pink";
+    Color["ORANGE"] = "orange";
+    Color["DARK_GRAY"] = "darkGray";
+    Color["LIGHT_GRAY"] = "lightGray";
+})(exports.Color || (exports.Color = {}));
+
+}(Color));
+
+var Country = {};
+
+(function (exports) {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Country = void 0;
+(function (Country) {
+    Country["NL"] = "Nederland";
+    Country["BE"] = "Belgi\u00EB";
+})(exports.Country || (exports.Country = {}));
+
+}(Country));
+
+var CourseTranslation = {};
+
+(function (exports) {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CourseTranslation = void 0;
+(function (CourseTranslation) {
+    CourseTranslation["NL_NL"] = "nl-NL";
+    //   EN_GB = "en-GB",
+})(exports.CourseTranslation || (exports.CourseTranslation = {}));
+
+}(CourseTranslation));
+
+var KeyboardLayout = {};
+
+(function (exports) {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.KeyboardLayout = void 0;
+(function (KeyboardLayout) {
+    KeyboardLayout["QWERTY_NL"] = "qwerty-nl";
+    // QWERTY_UK = "qwerty-uk",
+    // QWERTY_US = "qwerty-us",
+    // QWERTY_TR = "qwerty-tr",
+    KeyboardLayout["AZERTY_BE"] = "azerty-be";
+    // AZERTY_FR = "azerty-fr",
+    // QWERTZ_DE = "qwertz-de",
+})(exports.KeyboardLayout || (exports.KeyboardLayout = {}));
+
+}(KeyboardLayout));
+
+var Locale = {};
+
+(function (exports) {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Locale = void 0;
+(function (Locale) {
+    Locale["NL_NL"] = "nl-NL";
+    Locale["NL_BE"] = "nl-BE";
+    // EN_GB = "en-GB",
+    // FR_FR = "fr-FR",
+    // FR_BE = "fr-BE",
+    // DE_DE = "de-DE",
+})(exports.Locale || (exports.Locale = {}));
+
+}(Locale));
+
+var Plan = {};
+
+(function (exports) {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Plan = void 0;
+(function (Plan) {
+    Plan["HOBBY"] = "hobby";
+    Plan["PROFESSIONAL"] = "professional";
+})(exports.Plan || (exports.Plan = {}));
+
+}(Plan));
+
+var TextTopic = {};
+
+(function (exports) {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TextTopic = void 0;
+(function (TextTopic) {
+    TextTopic["SPORT"] = "sport";
+    TextTopic["MUSIC"] = "music";
+    TextTopic["TECHNIC"] = "technic";
+    TextTopic["MOVIES"] = "movies";
+    TextTopic["NATURE"] = "nature";
+    TextTopic["HISTORY"] = "history";
+    TextTopic["ART"] = "art";
+    TextTopic["FASHION"] = "fashion";
+    TextTopic["OTHER"] = "other";
+})(exports.TextTopic || (exports.TextTopic = {}));
+
+}(TextTopic));
+
+var Medal$1 = {};
+
+(function (exports) {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Medal = void 0;
+(function (Medal) {
+    Medal["GOLD"] = "gold";
+    Medal["SILVER"] = "silver";
+    Medal["BRONZE"] = "bronze";
+})(exports.Medal || (exports.Medal = {}));
+
+}(Medal$1));
+
+(function (exports) {
+var __createBinding = (commonjsGlobal && commonjsGlobal.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (commonjsGlobal && commonjsGlobal.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(Color, exports);
+__exportStar(Country, exports);
+__exportStar(CourseTranslation, exports);
+__exportStar(KeyboardLayout, exports);
+__exportStar(Locale, exports);
+__exportStar(Plan, exports);
+__exportStar(TextTopic, exports);
+__exportStar(Medal$1, exports);
+
+}(enums));
+
+Object.defineProperty(getCountryByLocale$1, "__esModule", { value: true });
+getCountryByLocale$1.getCountryByLocale = void 0;
+var enums_1$2 = enums;
+var getCountryByLocale = function (locale) {
+    var countries = {
+        "nl-NL": enums_1$2.Country.NL,
+        "nl-BE": enums_1$2.Country.BE,
+    };
+    return countries[locale];
+};
+getCountryByLocale$1.getCountryByLocale = getCountryByLocale;
+
+var getCourseTranslationByLocale$1 = {};
+
+Object.defineProperty(getCourseTranslationByLocale$1, "__esModule", { value: true });
+getCourseTranslationByLocale$1.getCourseTranslationByLocale = void 0;
+var enums_1$1 = enums;
+var getCourseTranslationByLocale = function (locale) {
+    var courseTranslations = {
+        "nl-NL": enums_1$1.CourseTranslation.NL_NL,
+        "nl-BE": enums_1$1.CourseTranslation.NL_NL,
+        // "en-GB": KeyboardLayout.QWERTY_UK,
+        // "en-US": KeyboardLayout.QWERTY_US,
+        // "fr-BE": KeyboardLayout.AZERTY_FR,
+        // "fr-FR": KeyboardLayout.AZERTY_FR,
+        // "de-DE": KeyboardLayout.QWERTZ_DE,
+    };
+    return courseTranslations[locale];
+};
+getCourseTranslationByLocale$1.getCourseTranslationByLocale = getCourseTranslationByLocale;
+
+var getKeyboardLayoutByLocale$1 = {};
+
+Object.defineProperty(getKeyboardLayoutByLocale$1, "__esModule", { value: true });
+getKeyboardLayoutByLocale$1.getKeyboardLayoutByLocale = void 0;
+var enums_1 = enums;
+var getKeyboardLayoutByLocale = function (locale) {
+    var keyboardLayouts = {
+        "nl-NL": enums_1.KeyboardLayout.QWERTY_NL,
+        "nl-BE": enums_1.KeyboardLayout.AZERTY_BE,
+        // "en-GB": KeyboardLayout.QWERTY_UK,
+        // "en-US": KeyboardLayout.QWERTY_US,
+        // "fr-BE": KeyboardLayout.AZERTY_FR,
+        // "fr-FR": KeyboardLayout.AZERTY_FR,
+        // "de-DE": KeyboardLayout.QWERTZ_DE,
+    };
+    return keyboardLayouts[locale];
+};
+getKeyboardLayoutByLocale$1.getKeyboardLayoutByLocale = getKeyboardLayoutByLocale;
+
+var getLanguageCodeByLocale$1 = {};
+
+Object.defineProperty(getLanguageCodeByLocale$1, "__esModule", { value: true });
+getLanguageCodeByLocale$1.getLanguageCodeByLocale = void 0;
+var getLanguageCodeByLocale = function (locale) { return locale.split("-")[0]; };
+getLanguageCodeByLocale$1.getLanguageCodeByLocale = getLanguageCodeByLocale;
+
+var getCountryCodeByLocale$1 = {};
+
+Object.defineProperty(getCountryCodeByLocale$1, "__esModule", { value: true });
+getCountryCodeByLocale$1.getCountryCodeByLocale = void 0;
+var getCountryCodeByLocale = function (locale) { return locale.split("-")[1]; };
+getCountryCodeByLocale$1.getCountryCodeByLocale = getCountryCodeByLocale;
+
+var getNativeLanguageByLocale$1 = {};
+
+Object.defineProperty(getNativeLanguageByLocale$1, "__esModule", { value: true });
+getNativeLanguageByLocale$1.getNativeLanguageByLocale = void 0;
+var getNativeLanguageByLocale = function (locale) {
+    var nativeLanguages = {
+        "nl-NL": "Nederlands",
+        "nl-BE": "Nederlands (BE)",
+        // "en-GB": "English (UK)",
+        // "en-US": "English (US)",
+        // "fr-BE": "Français (BE)",
+        // "fr-FR": "Français",
+        // "de-DE": "Deutsch",
+    };
+    return nativeLanguages[locale];
+};
+getNativeLanguageByLocale$1.getNativeLanguageByLocale = getNativeLanguageByLocale;
+
+(function (exports) {
+var __createBinding = (commonjsGlobal && commonjsGlobal.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (commonjsGlobal && commonjsGlobal.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(getCountryByLocale$1, exports);
+__exportStar(getCourseTranslationByLocale$1, exports);
+__exportStar(getKeyboardLayoutByLocale$1, exports);
+__exportStar(getLanguageCodeByLocale$1, exports);
+__exportStar(getCountryCodeByLocale$1, exports);
+__exportStar(getNativeLanguageByLocale$1, exports);
+
+}(parsers));
+
 var flags = {
     NL: (jsxRuntime.jsxs("svg", __assign$2({ viewBox: "0 0 22 18", xmlSpace: "preserve" }, { children: [jsxRuntime.jsx("path", { d: "M0 1c0-.6.4-1 1-1h20c.6 0 1 .4 1 1v5H0V1z", fill: "#e62743" }), jsxRuntime.jsx("path", { fill: "#fff", d: "M0 6H22V12H0z" }), jsxRuntime.jsx("path", { d: "M0 12h22v5c0 .6-.4 1-1 1H1c-.6 0-1-.4-1-1v-5z", fill: "#148cc6" })] }))),
     BE: (jsxRuntime.jsxs("svg", __assign$2({ viewBox: "0 0 22 18", xmlSpace: "preserve" }, { children: [jsxRuntime.jsx("path", { d: "M15 0h6c.6 0 1 .4 1 1v16c0 .6-.4 1-1 1h-6V0z", fill: "#e62743" }), jsxRuntime.jsx("path", { fill: "#ffd800", d: "M7 0H15V18H7z" }), jsxRuntime.jsx("path", { d: "M0 1c0-.6.4-1 1-1h6v18H1c-.6 0-1-.4-1-1V1z", fill: "#23292f" })] }))),
@@ -3857,6 +4118,99 @@ var Helper = styled__default["default"](StyledParagraph)(templateObject_6$3 || (
 }, fadeIn);
 var templateObject_1$L, templateObject_2$x, templateObject_3$b, templateObject_4$7, templateObject_5$3, templateObject_6$3;
 
+var expressions = {};
+
+var hasCapitalLetter$1 = {};
+
+Object.defineProperty(hasCapitalLetter$1, "__esModule", { value: true });
+hasCapitalLetter$1.hasCapitalLetter = void 0;
+var hasCapitalLetter = function (input) {
+    var regex = new RegExp(/[A-Z]/g);
+    return regex.test(input);
+};
+hasCapitalLetter$1.hasCapitalLetter = hasCapitalLetter;
+
+var hasNumber$1 = {};
+
+Object.defineProperty(hasNumber$1, "__esModule", { value: true });
+hasNumber$1.hasNumber = void 0;
+var hasNumber = function (input) {
+    var regex = new RegExp(/\d/g);
+    return regex.test(input);
+};
+hasNumber$1.hasNumber = hasNumber;
+
+var hasSpecialCharacter$1 = {};
+
+Object.defineProperty(hasSpecialCharacter$1, "__esModule", { value: true });
+hasSpecialCharacter$1.hasSpecialCharacter = void 0;
+var hasSpecialCharacter = function (input) {
+    var regex = new RegExp(/`|~|!|"|-|_|@|#|\$|%|\^|&|\*|\(|\)|\+|=|\[|\{|\]|\}|\||\\|'|<|,|\.|>|\?|\/|""|;|:|\s/g);
+    return regex.test(input);
+};
+hasSpecialCharacter$1.hasSpecialCharacter = hasSpecialCharacter;
+
+var isValidEmail$1 = {};
+
+Object.defineProperty(isValidEmail$1, "__esModule", { value: true });
+isValidEmail$1.isValidEmail = void 0;
+var isValidEmail = function (email) {
+    var regex = new RegExp(/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/);
+    return regex.test(email);
+};
+isValidEmail$1.isValidEmail = isValidEmail;
+
+var isValidUsername$1 = {};
+
+Object.defineProperty(isValidUsername$1, "__esModule", { value: true });
+isValidUsername$1.isValidUsername = void 0;
+var isValidEmail_1 = isValidEmail$1;
+var isValidUsername = function (username) {
+    return username.length >= 5 &&
+        username.length <= 15 &&
+        username.indexOf(" ") < 0 &&
+        !(0, isValidEmail_1.isValidEmail)(username);
+};
+isValidUsername$1.isValidUsername = isValidUsername;
+
+var isStrongPassword$1 = {};
+
+Object.defineProperty(isStrongPassword$1, "__esModule", { value: true });
+isStrongPassword$1.isStrongPassword = void 0;
+var _1 = expressions;
+var isStrongPassword = function (password) {
+    return password.length >= 8 &&
+        (0, _1.hasNumber)(password) &&
+        (0, _1.hasSpecialCharacter)(password) &&
+        (0, _1.hasCapitalLetter)(password);
+};
+isStrongPassword$1.isStrongPassword = isStrongPassword;
+
+(function (exports) {
+var __createBinding = (commonjsGlobal && commonjsGlobal.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (commonjsGlobal && commonjsGlobal.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(hasCapitalLetter$1, exports);
+__exportStar(hasNumber$1, exports);
+__exportStar(hasSpecialCharacter$1, exports);
+__exportStar(isValidEmail$1, exports);
+__exportStar(isValidUsername$1, exports);
+__exportStar(isStrongPassword$1, exports);
+
+}(expressions));
+
 var password_helper_capital_letter = "Minimaal 1 hoofdletter";
 var password_helper_number = "Minimaal 1 getal";
 var password_helper_special_character = "Minimaal 1 leesteken";
@@ -10911,7 +11265,7 @@ var Checkboxes = function (props) {
 };
 
 var Container$i = styled__default["default"].div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject$1(["\n  width: 100%;\n  background-color: ", ";\n  box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n  border-radius: 6px;\n  padding: 10px 20px;\n"], ["\n  width: 100%;\n  background-color: ", ";\n  box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n  border-radius: 6px;\n  padding: 10px 20px;\n"])), theme.colors.lightGray.light);
-var Item = styled__default["default"].div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject$1(["\n  padding: 10px 0;\n  cursor: pointer;\n\n  > div:first-child {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 5px;\n  }\n\n  p {\n    display: ", ";\n  }\n\n  :not(:last-child) {\n    border-bottom: 1px solid ", ";\n  }\n"], ["\n  padding: 10px 0;\n  cursor: pointer;\n\n  > div:first-child {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 5px;\n  }\n\n  p {\n    display: ", ";\n  }\n\n  :not(:last-child) {\n    border-bottom: 1px solid ", ";\n  }\n"])), function (_a) {
+var Item = styled__default["default"].div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject$1(["\n  padding: 10px 0;\n  cursor: pointer;\n\n  > div:first-child {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 5px;\n  }\n\n  p, > div:last-child {\n    display: ", ";\n    margin: 0;\n  }\n\n  :not(:last-child) {\n    border-bottom: 1px solid ", ";\n  }\n"], ["\n  padding: 10px 0;\n  cursor: pointer;\n\n  > div:first-child {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 5px;\n  }\n\n  p, > div:last-child {\n    display: ", ";\n    margin: 0;\n  }\n\n  :not(:last-child) {\n    border-bottom: 1px solid ", ";\n  }\n"])), function (_a) {
     var isOpen = _a.isOpen;
     return (isOpen ? "" : "none");
 }, theme.colors.lightGray.dark);
@@ -10929,7 +11283,7 @@ var Collapse = function (props) {
     };
     return (jsxRuntime.jsx(Container$i, __assign$2({}, props, { children: props.items.map(function (item, index) {
             var isOpen = openItems.includes(index);
-            return (jsxRuntime.jsxs(Item, __assign$2({ isOpen: isOpen, onClick: function () { return onClickItem(index, isOpen); } }, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: item.title })), jsxRuntime.jsx(Icon, { type: isOpen ? "chevronUp" : "chevronDown", color: "blue" })] }), jsxRuntime.jsx(Paragraph, __assign$2({ weight: "regular" }, { children: item.content }))] }), "".concat(item.title, "-").concat(index)));
+            return (jsxRuntime.jsxs(Item, __assign$2({ isOpen: isOpen, onClick: function () { return onClickItem(index, isOpen); } }, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: item.title })), jsxRuntime.jsx(Icon, { type: isOpen ? "chevronUp" : "chevronDown", color: "blue" })] }), jsxRuntime.jsx(Paragraph, __assign$2({ weight: "regular", as: typeof item.content !== "string" ? "div" : undefined }, { children: item.content }))] }), "".concat(item.title, "-").concat(index)));
         }) })));
 };
 
@@ -11779,7 +12133,7 @@ var Form = React$3.forwardRef(function (props, ref) {
             props.onError(feedback);
         }
     };
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [props.title && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h4" }, { children: props.title })), jsxRuntime.jsx(Spacer, { vertical: 15 })] })), props.description && (jsxRuntime.jsx(DescriptionWrapper, { children: jsxRuntime.jsx(Paragraph, __assign$2({ color: "darkGray", weight: "regular" }, { children: htmlReactParser(props.description) })) })), jsxRuntime.jsx(FormWrapper, { children: props.fields.map(function (field, index) {
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [props.title && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h4" }, { children: props.title })), jsxRuntime.jsx(Spacer, { vertical: 15 })] })), props.description && (jsxRuntime.jsx(DescriptionWrapper, { children: typeof props.description === "string" ? (jsxRuntime.jsx(Paragraph, __assign$2({ color: "darkGray", weight: "regular" }, { children: htmlReactParser(props.description) }))) : (props.description) })), jsxRuntime.jsx(FormWrapper, { children: props.fields.map(function (field, index) {
                     switch (field.type) {
                         case "text":
                             return (React$3.createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),