oolib 2.24.0 → 2.24.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -32,7 +32,8 @@ var CheckboxInput = function (_a) {
|
|
|
32
32
|
var SuitableTypo = S ? Typo_1.SANS_2 : Typo_1.SANS_3;
|
|
33
33
|
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(option, isSelected); } }),
|
|
34
34
|
!rightWrongResult || markingCommand === undefined ?
|
|
35
|
-
react_1.default.createElement(styled_2.StyledCheckbox, __assign({ className: "btn" }, { isSelected: isSelected, disabled: disabled, invert: invert, S: S }), isSelected &&
|
|
35
|
+
react_1.default.createElement(styled_2.StyledCheckbox, __assign({ className: "btn" }, { isSelected: isSelected, disabled: disabled, invert: invert, S: S }), isSelected &&
|
|
36
|
+
react_1.default.createElement(Check, { weight: "bold", color: invert ? greyColor100 : white, size: 16, style: { flexShrink: 0 } }))
|
|
36
37
|
:
|
|
37
38
|
["markCorrect", "revealCorrect"].includes(markingCommand) ?
|
|
38
39
|
react_1.default.createElement(CheckSquare, { size: S ? 22.5 : 26, color: green, style: {
|
|
@@ -51,7 +51,7 @@ exports.StyledRadioInput = styled_components_1.default.button(templateObject_2 |
|
|
|
51
51
|
invert ? (0, utilsOolib_1.getPrimaryColor40)(colors) : (0, utilsOolib_1.getPrimaryColor100)(colors);
|
|
52
52
|
});
|
|
53
53
|
});
|
|
54
|
-
exports.StyledRadioInputFill = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width:", ";\n height:", ";\n border-radius: 50%;\n background-color: ", ";\n"], ["\n width:", ";\n height:", ";\n border-radius: 50%;\n background-color: ", ";\n"])), function (_a) {
|
|
54
|
+
exports.StyledRadioInputFill = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width:", ";\n height:", ";\n flex-shrink: 0;\n border-radius: 50%;\n background-color: ", ";\n"], ["\n width:", ";\n height:", ";\n flex-shrink: 0;\n border-radius: 50%;\n background-color: ", ";\n"])), function (_a) {
|
|
55
55
|
var S = _a.S;
|
|
56
56
|
return S ? '0.7rem' : '0.8rem';
|
|
57
57
|
}, function (_a) {
|
|
@@ -96,7 +96,7 @@ var DisplayIcon = function (_a) {
|
|
|
96
96
|
return (react_1.default.createElement("div", { style: { cursor: onClick ? 'pointer' : '' }, onMouseDown: onClick || null }, IconComp && react_1.default.createElement(IconComp, { size: size, weight: "bold" })));
|
|
97
97
|
};
|
|
98
98
|
var TextInput = function (props) {
|
|
99
|
-
var id = props.id, invert = props.invert, disabled = props.disabled, icon = props.icon, type = props.type,
|
|
99
|
+
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;
|
|
100
100
|
var _b = (0, react_1.useState)(''), inputStatus = _b[0], setInputStatus = _b[1];
|
|
101
101
|
var composition = icon && !eyeIcon ? 'icon+text' : 'textOnly';
|
|
102
102
|
var size = S ? 'S' : 'M';
|
|
@@ -135,7 +135,7 @@ var TextInput = function (props) {
|
|
|
135
135
|
readOnly ? (react_1.default.createElement(Typo_1.SANS_3, { invert: invert }, type === 'password' ? '********' : value)) : (react_1.default.createElement(react_1.default.Fragment, null,
|
|
136
136
|
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 },
|
|
137
137
|
icon && (react_1.default.createElement(DisplayIcon, { icon: icon, size: S ? 15 : 20, onClick: iconOnClick || null })),
|
|
138
|
-
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:
|
|
138
|
+
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' }),
|
|
139
139
|
inputStatus === 'loading' && (react_1.default.createElement("div", null,
|
|
140
140
|
react_1.default.createElement(LoadersAndProgress_1.LoaderCircle, { S: true, invert: invert }))),
|
|
141
141
|
actionBtn && (react_1.default.createElement(Buttons_1.ButtonPrimary, { value: actionBtn.text, invert: actionBtn.invert, onClick: actionBtnEnabaled && actionBtn.onClick, disabled: !actionBtnEnabaled, style: { marginRight: '-2rem' } }))),
|
|
@@ -198,7 +198,7 @@ var PhoneInput = function (props) {
|
|
|
198
198
|
return { type: 'error', msg: 'Enter a valid phone number' };
|
|
199
199
|
}
|
|
200
200
|
};
|
|
201
|
-
return (react_1.default.createElement(exports.TextInput, __assign({ type: "tel", placeholder: 'Enter Phone...', validateOnBlur: handleValidation,
|
|
201
|
+
return (react_1.default.createElement(exports.TextInput, __assign({ type: "tel", placeholder: 'Enter Phone...', validateOnBlur: handleValidation, maxLength: 10 }, props)));
|
|
202
202
|
};
|
|
203
203
|
exports.PhoneInput = PhoneInput;
|
|
204
204
|
var URLInput = function (_a) {
|
|
@@ -236,7 +236,7 @@ var URLInput = function (_a) {
|
|
|
236
236
|
}
|
|
237
237
|
});
|
|
238
238
|
}); };
|
|
239
|
-
return (react_1.default.createElement(exports.TextInput, __assign({
|
|
239
|
+
return (react_1.default.createElement(exports.TextInput, __assign({ type: "url", validateOnBlur: handleValidation, placeholder: "Enter a valid url..." }, props)));
|
|
240
240
|
};
|
|
241
241
|
exports.URLInput = URLInput;
|
|
242
242
|
var NumberInput = function (props) {
|
|
@@ -252,8 +252,10 @@ var NumberInput = function (props) {
|
|
|
252
252
|
return { type: 'error', msg: "Enter value less than ".concat(max) };
|
|
253
253
|
}
|
|
254
254
|
};
|
|
255
|
-
return (react_1.default.createElement(exports.TextInput
|
|
255
|
+
return (react_1.default.createElement(exports.TextInput
|
|
256
|
+
// type="number"
|
|
257
|
+
, __assign({
|
|
256
258
|
// type="number"
|
|
257
|
-
validateOnBlur: handleValidation, placeholder: "Enter Number..." })));
|
|
259
|
+
validateOnBlur: handleValidation, placeholder: "Enter Number..." }, props)));
|
|
258
260
|
};
|
|
259
261
|
exports.NumberInput = NumberInput;
|