oolib 2.42.4 → 2.44.0

package/dist/components/TextInputs/index.js

@@ -97,12 +97,13 @@ var DisplayIcon = function (_a) {
     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, _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, validateOnMount = props.validateOnMount, 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, validateOnMount = props.validateOnMount, actionBtn = props.actionBtn, clearBtn = props.clearBtn, 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 _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');
+    var clearBtnEnabled = !!value && (type !== 'url' ? true : inputStatus.type === 'success');
     var handleValidate = function (e) { return __awaiter(void 0, void 0, void 0, function () {
         var value, res;
         return __generator(this, function (_a) {
@@ -151,7 +152,8 @@ var TextInput = function (props) {
                     react_1.default.createElement(index_styled_1.InputStyled, { ref: inputRef, className: size === 'S' ? 'SANS_2' : 'SANS_3', id: id, type: type, name: type, placeholder: placeholder, value: value, onChange: handleOnChange, maxLength: maxLength || DEPRECATED_maxNumLimiter, onBlur: handleValidate, onFocus: onFocus, size: size, autoComplete: 'off' }),
                     inputStatus === 'loading' && (react_1.default.createElement("div", null,
                         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' } }))),
+                    clearBtn && (react_1.default.createElement(Buttons_1.ButtonGhost, { M: true, value: clearBtn.text, invert: clearBtn.invert, onClick: function () { return onChange(props.id, ''); }, disabled: !clearBtnEnabled, style: { marginRight: actionBtn ? '-1rem' : '-2rem' }, icon: clearBtn.icon })),
+                    actionBtn && (react_1.default.createElement(Buttons_1.ButtonPrimary, { M: true, value: actionBtn.text, invert: actionBtn.invert, onClick: actionBtnEnabaled && actionBtn.onClick, disabled: !actionBtnEnabaled, style: { marginRight: '-2rem' }, icon: actionBtn.icon }))),
                 (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,

package/dist/icons/custom/index.d.ts

@@ -2,6 +2,7 @@ export function IndexIcon({ color, size }: {
     color?: string;
     size?: number;
 }): any;
+export function MultipleImages(props: any): any;
 export function LanguageIcon({ color, size }: {
     color?: string;
     size?: number;

package/dist/icons/custom/index.js

@@ -14,7 +14,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ModalBulbIcon = exports.KenyaFlag = exports.NigeriaFlag = exports.IndiaFlag = exports.BadgeVetted = exports.BadgeMod = exports.BadgeSuperAdmin = exports.BadgeAdmin = exports.OkeGoogleIcon = exports.LetterH = exports.LanguageIcon = exports.IndexIcon = void 0;
+exports.ModalBulbIcon = exports.KenyaFlag = exports.NigeriaFlag = exports.IndiaFlag = exports.BadgeVetted = exports.BadgeMod = exports.BadgeSuperAdmin = exports.BadgeAdmin = exports.OkeGoogleIcon = exports.LetterH = exports.LanguageIcon = exports.MultipleImages = exports.IndexIcon = void 0;
 var react_1 = __importDefault(require("react"));
 var themes_1 = require("../../themes");
 var comps_1 = require("../../utils/comps");
@@ -27,6 +27,14 @@ var IndexIcon = function (_a) {
         react_1.default.createElement("path", { d: "M2.34375 11.25H8.90625", stroke: "#383838", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })));
 };
 exports.IndexIcon = IndexIcon;
+var MultipleImages = function (props) { return (react_1.default.createElement("svg", { width: "21", height: "20", viewBox: "0 0 21 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+    react_1.default.createElement("path", { d: "M8.33325 16.8333H15.3124C15.6001 16.8333 15.8333 16.5807 15.8333 16.2691V6.56423C15.8333 6.25262 15.6001 6 15.3124 6H3.85409C3.56644 6 3.33325 6.25262 3.33325 6.56423V11.8333", stroke: "#383838", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+    react_1.default.createElement("path", { d: "M16.3801 15.1667H17.8124C18.1001 15.1667 18.3333 14.8946 18.3333 14.559V4.10764C18.3333 3.77205 18.1001 3.5 17.8124 3.5H6.35409C6.06644 3.5 5.83325 3.77205 5.83325 4.10764V5.58333", stroke: "#383838", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+    react_1.default.createElement("path", { d: "M3.33325 11.8333L6.20167 9.7499C6.25924 9.69488 6.32786 9.65118 6.40353 9.62136C6.47921 9.59153 6.56043 9.57617 6.64248 9.57617C6.72452 9.57617 6.80574 9.59153 6.88142 9.62136C6.9571 9.65118 7.02571 9.69488 7.08328 9.7499L10.4423 12.7536C10.4999 12.8086 10.5685 12.8523 10.6442 12.8821C10.7199 12.912 10.8011 12.9273 10.8831 12.9273C10.9652 12.9273 11.0464 12.912 11.1221 12.8821C11.1977 12.8523 11.2664 12.8086 11.3239 12.7536L12.917 11.254C12.9746 11.199 13.0432 11.1553 13.1189 11.1255C13.1946 11.0956 13.2758 11.0803 13.3578 11.0803C13.4399 11.0803 13.5211 11.0956 13.5968 11.1255C13.6724 11.1553 13.7411 11.199 13.7986 11.254L15.6279 13.0833", stroke: "#383838", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+    react_1.default.createElement("path", { d: "M11.8547 9.33341C12.3101 9.33341 12.6793 8.96032 12.6793 8.50008C12.6793 8.03984 12.3101 7.66675 11.8547 7.66675C11.3992 7.66675 11.03 8.03984 11.03 8.50008C11.03 8.96032 11.3992 9.33341 11.8547 9.33341Z", fill: "#383838" }),
+    react_1.default.createElement("path", { d: "M4 14L4 19", stroke: "#383838", "stroke-width": "1.34998", "stroke-linecap": "round" }),
+    react_1.default.createElement("path", { d: "M1.5 16.5H6.5", stroke: "#383838", "stroke-width": "1.34998", "stroke-linecap": "round" }))); };
+exports.MultipleImages = MultipleImages;
 var LanguageIcon = function (_a) {
     var _b = _a.color, color = _b === void 0 ? greyColor100 : _b, _c = _a.size, size = _c === void 0 ? 20 : _c;
     return (react_1.default.createElement("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },

package/dist/icons/index.d.ts

@@ -98,6 +98,7 @@ export namespace icons {
     export { IndiaFlag };
     export { KenyaFlag };
     export { NigeriaFlag };
+    export { MultipleImages };
     export { LightbulbFilament };
     export { ModalBulbIcon };
     export { Keyboard };
@@ -202,6 +203,7 @@ import { BadgeVetted } from "./custom";
 import { IndiaFlag } from "./custom";
 import { KenyaFlag } from "./custom";
 import { NigeriaFlag } from "./custom";
+import { MultipleImages } from "./custom";
 import { LightbulbFilament } from "phosphor-react";
 import { ModalBulbIcon } from "./custom";
 import { Keyboard } from "phosphor-react";

package/dist/icons/index.js

@@ -104,6 +104,7 @@ exports.icons = {
     IndiaFlag: custom_1.IndiaFlag,
     KenyaFlag: custom_1.KenyaFlag,
     NigeriaFlag: custom_1.NigeriaFlag,
+    MultipleImages: custom_1.MultipleImages,
     LightbulbFilament: phosphor_react_1.LightbulbFilament,
     ModalBulbIcon: custom_1.ModalBulbIcon,
     Keyboard: phosphor_react_1.Keyboard,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oolib",
-  "version": "2.42.4",
+  "version": "2.44.0",
   "description": " OKE Component Library",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -49,11 +49,11 @@
     "semantic-release": "^18.0.0"
   },
   "peerDependencies": {
+    "framer-motion": "^4.1.17",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-router-dom": "^5.1.2",
-    "styled-components": "^5.3.3",
-    "framer-motion": "^4.1.17"
+    "styled-components": "^5.3.3"
   },
   "config": {
     "commitizen": {
@@ -70,6 +70,6 @@
     "immutable": "^3.7.6",
     "lodash": "^4.17.21",
     "modularscale-js": "^3.0.1",
-    "phosphor-react": "^1.3.1"
+    "phosphor-react": "^1.4.1"
   }
 }