oolib 2.25.5 → 2.25.7

package/dist/components/RadioAndCheckbox/comps/CheckboxList/comps/CheckboxInput/index.js

@@ -55,7 +55,7 @@ var CheckboxInput = function (_a) {
             margin: '-7px -2.8px -7px -3.2px',
             flexShrink: 0
         } })); };
-    return inputStyle === 'tagSelect' ? (react_1.default.createElement(Tags_1.TagSelect, __assign({}, { isSelected: isSelected, invert: invert, disabled: disabled }, { onClick: function () { return !disabled && onClick(option, isSelected); }, display: option.display, value: option.value, style: { alignSelf: 'flex-start' } }))) : (react_1.default.createElement(styled_1.StyledOption, __assign({}, { rightWrongResult: rightWrongResult, isSelected: isSelected, disabled: disabled, invert: invert, S: S }, { onClick: function () { return !rightWrongResult && !disabled && onClick && onClick(isSelected, option); } }),
+    return inputStyle === 'tagSelect' ? (react_1.default.createElement(Tags_1.TagSelect, __assign({}, { isSelected: isSelected, invert: invert, disabled: disabled }, { onClick: function () { return !disabled && onClick(isSelected, option); }, display: option.display, value: option.value, style: { alignSelf: 'flex-start' } }))) : (react_1.default.createElement(styled_1.StyledOption, __assign({}, { rightWrongResult: rightWrongResult, isSelected: isSelected, disabled: disabled, invert: invert, S: S }, { onClick: function () { return !rightWrongResult && !disabled && onClick && onClick(isSelected, option); } }),
         rightWrongResult
             ? ["markCorrect", "revealCorrect"].includes(markingCommand)
                 ? genCheckSquare()

package/dist/components/TextInputs/index.js

@@ -96,7 +96,8 @@ var DisplayIcon = function (_a) {
     return (react_1.default.createElement("div", { style: { cursor: onClick ? 'pointer' : '' }, 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;
+    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 _b = (0, react_1.useState)(''), inputStatus = _b[0], setInputStatus = _b[1];
     var composition = icon && !eyeIcon ? 'icon+text' : 'textOnly';
     var size = S ? 'S' : 'M';
@@ -129,13 +130,19 @@ var TextInput = function (props) {
             handleValidateOnBlur(e);
         }
     };
+    var inputRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(function () {
+        forceFocus &&
+            inputRef.current &&
+            inputRef.current.focus();
+    }, [forceFocus]);
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement("div", { className: className },
             react_1.default.createElement(BlockLabel_1.BlockLabel, __assign({}, (0, _EXPORTS_1.getBlockLabelProps)(props))),
             readOnly ? (react_1.default.createElement(Typo_1.SANS_3, { invert: invert }, type === 'password' ? '********' : value)) : (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement(index_styled_1.InputContainerStyled, { invert: invert, type: type, disabled: disabled, status: inputStatus === null || inputStatus === void 0 ? void 0 : inputStatus.type, eyeIcon: eyeIcon, composition: composition },
+                react_1.default.createElement(index_styled_1.InputContainerStyled, { invert: invert, type: type, disabled: disabled, status: inputStatus === null || inputStatus === void 0 ? void 0 : inputStatus.type, eyeIcon: eyeIcon, composition: composition, onClick: function () { return inputRef.current.focus(); } },
                     icon && (react_1.default.createElement(DisplayIcon, { icon: icon, size: S ? 15 : 20, onClick: iconOnClick || null })),
-                    react_1.default.createElement(index_styled_1.InputStyled, { className: size === 'S' ? 'SANS_2' : 'SANS_3', id: id, type: type, name: type, placeholder: placeholder, value: value, onChange: handleOnChange, maxLength: maxLength || DEPRECATED_maxNumLimiter, onBlur: handleValidateOnBlur, onFocus: onFocus, size: size, autoComplete: 'off' }),
+                    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: handleValidateOnBlur, 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' } }))),

package/dist/components/Typo/index.js

@@ -51,7 +51,9 @@ var GenComp = function (_a) {
     var invert = props.invert, value = props.value, suffix = props.suffix, color = props.color, children = props.children, theme = props.theme, style = props.style, className = props.className;
     var displayText = children || value;
     var localText = localize(displayText);
-    return (react_1.default.createElement(Comp, __assign({}, genFontStylingProps(props), { color: color, theme: theme, className: className, style: style, invert: invert }),
+    return (react_1.default.createElement(Comp, __assign({}, genFontStylingProps(props), { color: color, 
+        // theme={theme} // i dont think this needs to be passed no?
+        className: className, style: style, invert: invert }),
         localText,
         suffix || ''));
 };

package/dist/icons/index.d.ts

@@ -41,6 +41,7 @@ export namespace icons {
     export { ArrowsOut };
     export { MapPin };
     export { ArrowDown };
+    export { ArrowUp };
     export { GearSix };
     export { Wrench };
     export { CheckSquare };
@@ -134,6 +135,7 @@ import { ArrowsIn } from "phosphor-react";
 import { ArrowsOut } from "phosphor-react";
 import { MapPin } from "phosphor-react";
 import { ArrowDown } from "phosphor-react";
+import { ArrowUp } from "phosphor-react";
 import { GearSix } from "phosphor-react";
 import { Wrench } from "phosphor-react";
 import { CheckSquare } from "phosphor-react";

package/dist/icons/index.js

@@ -46,6 +46,7 @@ exports.icons = {
     ArrowsOut: phosphor_react_1.ArrowsOut,
     MapPin: phosphor_react_1.MapPin,
     ArrowDown: phosphor_react_1.ArrowDown,
+    ArrowUp: phosphor_react_1.ArrowUp,
     GearSix: phosphor_react_1.GearSix,
     Wrench: phosphor_react_1.Wrench,
     CheckSquare: phosphor_react_1.CheckSquare,

package/package.json

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