oolib 2.28.4 → 2.29.0

package/dist/components/TextInputs/index.d.ts

@@ -5,8 +5,9 @@ export function PasswordInput({ enableValidation, ...props }: {
 }): any;
 export function EmailInput(props: any): any;
 export function PhoneInput(props: any): any;
-export function URLInput({ routesAreValidInputs, ...props }: {
+export function URLInput({ routesAreValidInputs, validationPlugin, ...props }: {
     [x: string]: any;
     routesAreValidInputs?: boolean;
+    validationPlugin: any;
 }): any;
 export function NumberInput(props: any): any;

package/dist/components/TextInputs/index.js

@@ -90,15 +90,16 @@ var Typo_1 = require("../Typo");
 var Buttons_1 = require("../Buttons");
 var _EXPORTS_1 = require("../../utils/_EXPORTS");
 var LoadersAndProgress_1 = require("../LoadersAndProgress");
+var OKELink_1 = require("../OKELink");
 var DisplayIcon = function (_a) {
     var icon = _a.icon, onClick = _a.onClick, size = _a.size;
     var IconComp = icons_1.icons[icon];
     return (react_1.default.createElement("div", { style: { cursor: onClick ? 'pointer' : '', display: 'flex' }, onMouseDown: onClick || null }, IconComp && react_1.default.createElement(IconComp, { size: size, weight: "bold" })));
 };
 var TextInput = function (props) {
-    var id = props.id, invert = props.invert, disabled = props.disabled, icon = props.icon, type = props.type, _a = props.placeholder, placeholder = _a === void 0 ? 'Enter Text...' : _a, value = props.value, onChange = props.onChange, onFocus = props.onFocus, readOnly = props.readOnly, iconOnClick = props.iconOnClick, eyeIcon = props.eyeIcon, S = props.S, validateOnBlur = props.validateOnBlur, actionBtn = props.actionBtn, className = props.className, maxLength = props.maxLength, DEPRECATED_maxNumLimiter = props.maxNumLimiter, forceFocus = props.forceFocus //sometimes, when some other elem is clicked, we wanna trigger focus on the textinput. eg. when on mobile, the search icon is clicked on the listingpage
+    var id = props.id, invert = props.invert, disabled = props.disabled, icon = props.icon, type = props.type, _a = props.placeholder, placeholder = _a === void 0 ? 'Enter Text...' : _a, _b = props.value, value = _b === void 0 ? '' : _b, onChange = props.onChange, onFocus = props.onFocus, readOnly = props.readOnly, iconOnClick = props.iconOnClick, eyeIcon = props.eyeIcon, S = props.S, validateOnBlur = props.validateOnBlur, actionBtn = props.actionBtn, className = props.className, maxLength = props.maxLength, DEPRECATED_maxNumLimiter = props.maxNumLimiter, forceFocus = props.forceFocus //sometimes, when some other elem is clicked, we wanna trigger focus on the textinput. eg. when on mobile, the search icon is clicked on the listingpage
     ;
-    var _b = (0, react_1.useState)(''), inputStatus = _b[0], setInputStatus = _b[1];
+    var _c = (0, react_1.useState)(''), inputStatus = _c[0], setInputStatus = _c[1];
     var composition = icon && !eyeIcon ? 'icon+text' : 'textOnly';
     var size = S ? 'S' : 'M';
     var actionBtnEnabaled = !!value && (type !== 'url' ? true : inputStatus.type === 'success');
@@ -147,7 +148,10 @@ var TextInput = function (props) {
                         react_1.default.createElement(LoadersAndProgress_1.LoaderCircle, { S: true, invert: invert }))),
                     actionBtn && (react_1.default.createElement(Buttons_1.ButtonPrimary, { value: actionBtn.text, invert: actionBtn.invert, onClick: actionBtnEnabaled && actionBtn.onClick, disabled: !actionBtnEnabaled, style: { marginRight: '-2rem' } }))),
                 (inputStatus === null || inputStatus === void 0 ? void 0 : inputStatus.msg) && (react_1.default.createElement(index_styled_1.MsgContainer, { invert: invert, status: inputStatus === null || inputStatus === void 0 ? void 0 : inputStatus.type },
-                    react_1.default.createElement(Typo_1.SANS_3, null, inputStatus.msg))))))));
+                    react_1.default.createElement(Typo_1.SANS_3, null,
+                        inputStatus.msg,
+                        inputStatus.link &&
+                            react_1.default.createElement(OKELink_1.OKELink, { style: { marginLeft: '1rem' }, to: inputStatus.link.to }, inputStatus.link.text)))))))));
 };
 exports.TextInput = TextInput;
 var PasswordInput = function (_a) {
@@ -211,12 +215,21 @@ var PhoneInput = function (props) {
 exports.PhoneInput = PhoneInput;
 var URLInput = function (_a) {
     var _b = _a.routesAreValidInputs, routesAreValidInputs = _b === void 0 ? false : _b, //if we want react route declarations to be considered as 'valid' then set this to true
-    props = __rest(_a, ["routesAreValidInputs"]);
+    validationPlugin = _a.validationPlugin, props = __rest(_a, ["routesAreValidInputs", "validationPlugin"]);
     var handleValidation = function (value) { return __awaiter(void 0, void 0, void 0, function () {
-        var response, err_1;
+        var pluginResponse, response, err_1;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
+                    if (!validationPlugin) return [3 /*break*/, 2];
+                    return [4 /*yield*/, validationPlugin()];
+                case 1:
+                    pluginResponse = _a.sent();
+                    if (pluginResponse)
+                        return [2 /*return*/, pluginResponse];
+                    _a.label = 2;
+                case 2:
+                    //else
                     //if routesAreValidInputs, then first validate for a route
                     if (routesAreValidInputs && value.substring(0, 1) === '/') {
                         return [2 /*return*/, { type: 'success', msg: 'valid route' }];
@@ -225,22 +238,22 @@ var URLInput = function (_a) {
                     if (!/^https?:\/\//i.test(value)) {
                         value = 'https://' + value;
                     }
-                    _a.label = 1;
-                case 1:
-                    _a.trys.push([1, 3, , 4]);
+                    _a.label = 3;
+                case 3:
+                    _a.trys.push([3, 5, , 6]);
                     return [4 /*yield*/, fetch(value)];
-                case 2:
+                case 4:
                     response = _a.sent();
                     if (response.status !== 200)
                         throw new Error('');
                     return [2 /*return*/, { type: 'success', msg: 'valid url' }];
-                case 3:
+                case 5:
                     err_1 = _a.sent();
                     if (/[(http(s)?):\/\/(www\.)?a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/ig.test(value)) {
                         return [2 /*return*/, { type: 'success', msg: 'valid url' }];
                     }
                     return [2 /*return*/, { type: 'error', msg: 'Enter a valid url...' }];
-                case 4: return [2 /*return*/];
+                case 6: return [2 /*return*/];
             }
         });
     }); };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oolib",
-  "version": "2.28.4",
+  "version": "2.29.0",
   "description": " OKE Component Library",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",