oolib 2.23.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.
Files changed (8) hide show
  1. package/dist/components/RadioAndCheckbox/comps/CheckboxList/comps/CheckboxInput/index.js +2 -1
  2. package/dist/components/RadioAndCheckbox/comps/RadioList/comps/RadioInput/styled.js +1 -1
  3. package/dist/components/RadioAndCheckbox/comps/RadioList/index.js +1 -2
  4. package/dist/components/Tags/index.d.ts +2 -1
  5. package/dist/components/Tags/index.js +18 -13
  6. package/dist/components/Tags/index.styled.js +22 -10
  7. package/dist/components/TextInputs/index.js +8 -6
  8. package/package.json +1 -1
package/dist/components/RadioAndCheckbox/comps/CheckboxList/comps/CheckboxInput/index.js CHANGED
@@ -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 && react_1.default.createElement(Check, { weight: "bold", color: invert ? greyColor100 : white, size: 16 }))
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: {
package/dist/components/RadioAndCheckbox/comps/RadioList/comps/RadioInput/styled.js CHANGED
@@ -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) {
package/dist/components/RadioAndCheckbox/comps/RadioList/index.js CHANGED
@@ -52,8 +52,7 @@ function RadioList(_a) {
52
52
  var _e = (0, utils_1.genDisplayedOptions)({ injectOtherOption: injectOtherOption, options: options, valueProp: valueProp, saveValueAsString: saveValueAsString }), typicalOptions = _e.typicalOptions, injectedOtherOption = _e.injectedOtherOption;
53
53
  var value = saveValueAsString ?
54
54
  typicalOptions
55
- .concat(injectedOtherOption)
56
- .filter(Boolean)
55
+ .concat(injectedOtherOption || [])
57
56
  .find(function (op) { var _a; return ((_a = op.display_desc) !== null && _a !== void 0 ? _a : op.value) === valueProp; })
58
57
  : valueProp;
59
58
  var correctOp = options.find(function (op) { return op.isCorrect; }); //
package/dist/components/Tags/index.d.ts CHANGED
@@ -17,7 +17,7 @@ export function TagClear({ id, display, value, M, XS, invert, onClick, variant,
17
17
  variant?: string;
18
18
  grey: any;
19
19
  }): JSX.Element;
20
- export function TagSelect({ onClick, isSelected, display, value, M, XS, invert, style, onMouseDown }: {
20
+ export function TagSelect({ onClick, isSelected, display, value, M, XS, invert, disabled, style, onMouseDown }: {
21
21
  onClick: any;
22
22
  isSelected?: boolean;
23
23
  display: any;
@@ -25,6 +25,7 @@ export function TagSelect({ onClick, isSelected, display, value, M, XS, invert,
25
25
  M: any;
26
26
  XS: any;
27
27
  invert: any;
28
+ disabled: any;
28
29
  style: any;
29
30
  onMouseDown: any;
30
31
  }): JSX.Element;
package/dist/components/Tags/index.js CHANGED
@@ -1,4 +1,15 @@
1
1
  "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
2
13
  var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
14
  if (k2 === undefined) k2 = k;
4
15
  var desc = Object.getOwnPropertyDescriptor(m, k);
@@ -27,15 +38,9 @@ exports.TagLink = exports.TagSelect = exports.TagClear = exports.TagDisplay = vo
27
38
  var react_1 = __importStar(require("react"));
28
39
  var index_styled_1 = require("./index.styled");
29
40
  var icons_1 = require("../../icons");
30
- var getTypoComp = function (size) { return size === 'XS'
31
- ? function (_a) {
32
- var children = _a.children;
33
- return react_1.default.createElement(index_styled_1.STYLED_ELLIPSIS_SANS_2, null, children);
34
- }
35
- : function (_a) {
36
- var children = _a.children;
37
- return react_1.default.createElement(index_styled_1.STYLED_ELLIPSIS_SANS_3, null, children);
38
- }; };
41
+ var getTypoComp = function (size) { return size === 'XS' ?
42
+ function (props) { return react_1.default.createElement(index_styled_1.STYLED_ELLIPSIS_SANS_2, __assign({}, props)); }
43
+ : function (props) { return react_1.default.createElement(index_styled_1.STYLED_ELLIPSIS_SANS_3, __assign({}, props)); }; };
39
44
  function TagDisplay(_a) {
40
45
  var display = _a.display, style = _a.style, invert = _a.invert, M = _a.M, XS = _a.XS, _b = _a.variant, variant = _b === void 0 ? 'primary' : _b;
41
46
  var size = M ? 'M' : XS ? 'XS' : 'S';
@@ -56,11 +61,11 @@ function TagClear(_a) {
56
61
  }
57
62
  exports.TagClear = TagClear;
58
63
  function TagSelect(_a) {
59
- var onClick = _a.onClick, _b = _a.isSelected, isSelected = _b === void 0 ? false : _b, display = _a.display, value = _a.value, M = _a.M, XS = _a.XS, invert = _a.invert, style = _a.style, onMouseDown = _a.onMouseDown;
64
+ var onClick = _a.onClick, _b = _a.isSelected, isSelected = _b === void 0 ? false : _b, display = _a.display, value = _a.value, M = _a.M, XS = _a.XS, invert = _a.invert, disabled = _a.disabled, style = _a.style, onMouseDown = _a.onMouseDown;
60
65
  var _c = (0, react_1.useState)(isSelected), selected = _c[0], setSelected = _c[1];
61
66
  var handleOnClick = function () {
62
67
  setSelected(!selected);
63
- onClick({ display: display, value: value });
68
+ onClick && onClick({ display: display, value: value });
64
69
  };
65
70
  (0, react_1.useLayoutEffect)(function () {
66
71
  if (selected && !isSelected) {
@@ -69,8 +74,8 @@ function TagSelect(_a) {
69
74
  }, [isSelected]);
70
75
  var size = M ? 'M' : XS ? 'XS' : 'S';
71
76
  var TYPO_COMP = getTypoComp(size);
72
- return (react_1.default.createElement(index_styled_1.StyledTagSelect, { invert: invert, onClick: onMouseDown ? function () { return null; } : handleOnClick, selected: selected, size: size, style: style, onMouseDown: onMouseDown },
73
- react_1.default.createElement(TYPO_COMP, null, display)));
77
+ return (react_1.default.createElement(index_styled_1.StyledTagSelect, { disabled: disabled, invert: invert, onClick: function () { return !onMouseDown && !disabled && handleOnClick(); }, selected: selected, size: size, style: style, onMouseDown: function (ev) { return !disabled && onMouseDown && onMouseDown(ev); } },
78
+ react_1.default.createElement(TYPO_COMP, { semibold: true }, display)));
74
79
  }
75
80
  exports.TagSelect = TagSelect;
76
81
  function TagLink(_a) {
package/dist/components/Tags/index.styled.js CHANGED
@@ -46,7 +46,7 @@ var commonStyle = function (_a) {
46
46
  };
47
47
  var blueHover = function (_a) {
48
48
  var invert = _a.invert, colors = _a.colors;
49
- return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\t&:hover {\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\t\t\n\t}\n"], ["\n\t&:hover {\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\t\t\n\t}\n"])), invert
49
+ return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n @media (hover: hover){\n &:hover {\n background-color: ", ";\n color: ", ";\t\t\n }\n }\n"], ["\n @media (hover: hover){\n &:hover {\n background-color: ", ";\n color: ", ";\t\t\n }\n }\n"])), invert
50
50
  ? (0, utilsOolib_1.getPrimaryColor10)(colors)
51
51
  : (0, utilsOolib_1.getPrimaryColor40)(colors), invert
52
52
  ? greyColor100
@@ -54,7 +54,7 @@ var blueHover = function (_a) {
54
54
  };
55
55
  var greyHover = function (_a) {
56
56
  var invert = _a.invert;
57
- return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n\t&:hover {\n\t\tbackground-color: ", ";\n\t}\n"], ["\n\t&:hover {\n\t\tbackground-color: ", ";\n\t}\n"])), invert
57
+ return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n @media (hover: hover){\n &:hover {\n background-color: ", ";\n }\n }\n"], ["\n @media (hover: hover){\n &:hover {\n background-color: ", ";\n }\n }\n"])), invert
58
58
  ? greyColor80
59
59
  : greyColor10);
60
60
  };
@@ -100,26 +100,38 @@ var StyledTagClearIconWrapper = styled_components_1.default.div(templateObject_1
100
100
  : blueHover({ invert: invert, colors: colors });
101
101
  });
102
102
  exports.StyledTagClearIconWrapper = StyledTagClearIconWrapper;
103
- var StyledTagSelect = styled_components_1.default.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n ", "\n ", "\n\n\t", "\n \n"], ["\n ", "\n ", "\n\n\t", "\n \n"])), function (_a) {
103
+ var StyledTagSelect = styled_components_1.default.div(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n ", "\n ", "\n\n cursor: ", ";\n border-style: solid;\n border-width: ", ";\n \n\n ", "\n \n @media (hover: hover){\n &:hover {\n ", "\n }\n }\n \n"], ["\n ", "\n ", "\n\n cursor: ", ";\n border-style: solid;\n border-width: ", ";\n \n\n ", "\n \n @media (hover: hover){\n &:hover {\n ", "\n }\n }\n \n"])), function (_a) {
104
104
  var size = _a.size;
105
105
  return commonStyle({ size: size });
106
106
  }, (0, mixins_1.transition)("background-color"), function (_a) {
107
- var selected = _a.selected, size = _a.size, colors = _a.theme.colors;
108
- return (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n border: ", " solid ", ";\n cursor: pointer;\n background-color: ", ";\n\t color: ", ";\n\t\t", "\n "], ["\n border: ", " solid ", ";\n cursor: pointer;\n background-color: ", ";\n\t color: ", ";\n\t\t", "\n "])), size === "XS" ? "1px" : "2px", (0, utilsOolib_1.getPrimaryColor100)(colors), selected ? (0, utilsOolib_1.getPrimaryColor40)(colors) : null, (0, utilsOolib_1.getPrimaryColorText)(colors), !selected && (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["&:hover {\n background-color: ", ";\n color: ", ";\n\t\t}"], ["&:hover {\n background-color: ", ";\n color: ", ";\n\t\t}"])), (0, utilsOolib_1.getPrimaryColor40)(colors), (0, utilsOolib_1.getPrimaryColorText)(colors)));
107
+ var disabled = _a.disabled;
108
+ return disabled ? 'not-allowed' : 'pointer';
109
+ }, function (_a) {
110
+ var size = _a.size;
111
+ return size === "XS" ? "1px" : "2px";
112
+ }, function (_a) {
113
+ var disabled = _a.disabled, selected = _a.selected, invert = _a.invert, colors = _a.theme.colors;
114
+ if (disabled) {
115
+ return invert ? (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "], ["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "])), greyColor40, greyColor80, greyColor40) : (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n border-color: ", ";\n color: ", ";\n "], ["\n border-color: ", ";\n color: ", ";\n "])), greyColor15, greyColor40);
116
+ }
117
+ return invert ? (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "], ["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "])), (0, utilsOolib_1.getPrimaryColor40)(colors), selected ? (0, utilsOolib_1.getPrimaryColor40)(colors) : 'unset', selected ? greyColor100 : (0, utilsOolib_1.getPrimaryColor40)(colors)) : (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "], ["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "])), (0, utilsOolib_1.getPrimaryColor100)(colors), selected ? (0, utilsOolib_1.getPrimaryColor100)(colors) : 'unset', selected ? white : (0, utilsOolib_1.getPrimaryColorText)(colors));
118
+ }, function (_a) {
119
+ var selected = _a.selected, invert = _a.invert, disabled = _a.disabled, colors = _a.theme.colors;
120
+ return !selected && !disabled && (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), invert ? greyColor80 : (0, utilsOolib_1.getPrimaryColor40)(colors), invert ? (0, utilsOolib_1.getPrimaryColor40)(colors) : (0, utilsOolib_1.getPrimaryColorText)(colors));
109
121
  });
110
122
  exports.StyledTagSelect = StyledTagSelect;
111
- var StyledTagLink = styled_components_1.default.div(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n \t", "\n\t", ";\n ", "\n"], ["\n \t", "\n\t", ";\n ", "\n"])), function (_a) {
123
+ var StyledTagLink = styled_components_1.default.div(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n \t", "\n\t", ";\n ", "\n"], ["\n \t", "\n\t", ";\n ", "\n"])), function (_a) {
112
124
  var size = _a.size;
113
125
  return commonStyle({ size: size });
114
126
  }, (0, mixins_1.transition)("background-color", "color"), function (_a) {
115
127
  var variant = _a.variant, invert = _a.invert, size = _a.size, colors = _a.theme.colors;
116
128
  return variant === "primary"
117
- ? (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n \t\tbackground-color: ", ";\n \t\tcolor: ", ";\n\t\t\t\t", ";\n \t"], ["\n \t\tbackground-color: ", ";\n \t\tcolor: ", ";\n\t\t\t\t", ";\n \t"])), !invert
129
+ ? (0, styled_components_1.css)(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n \t\tbackground-color: ", ";\n \t\tcolor: ", ";\n\t\t\t\t", ";\n \t"], ["\n \t\tbackground-color: ", ";\n \t\tcolor: ", ";\n\t\t\t\t", ";\n \t"])), !invert
118
130
  ? (0, utilsOolib_1.getPrimaryColor100)(colors)
119
131
  : (0, utilsOolib_1.getPrimaryColor40)(colors), !invert ? white : greyColor100, blueHover({ invert: invert, colors: colors })) : // secondary
120
- (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n \t\tbackground: none;\n \t\tborder: ", " solid ", ";\n \t\tcolor: ", ";\n\t\t\t\t", "\n \t"], ["\n \t\tbackground: none;\n \t\tborder: ", " solid ", ";\n \t\tcolor: ", ";\n\t\t\t\t", "\n \t"])), size === "XS" ? "1px" : "2px", !invert ? (0, utilsOolib_1.getPrimaryColor100)(colors) : (0, utilsOolib_1.getPrimaryColor40)(colors), !invert ? (0, utilsOolib_1.getPrimaryColorText)(colors) : (0, utilsOolib_1.getPrimaryColor40)(colors), blueHover({ invert: invert, colors: colors }));
132
+ (0, styled_components_1.css)(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n \t\tbackground: none;\n \t\tborder: ", " solid ", ";\n \t\tcolor: ", ";\n\t\t\t\t", "\n \t"], ["\n \t\tbackground: none;\n \t\tborder: ", " solid ", ";\n \t\tcolor: ", ";\n\t\t\t\t", "\n \t"])), size === "XS" ? "1px" : "2px", !invert ? (0, utilsOolib_1.getPrimaryColor100)(colors) : (0, utilsOolib_1.getPrimaryColor40)(colors), !invert ? (0, utilsOolib_1.getPrimaryColorText)(colors) : (0, utilsOolib_1.getPrimaryColor40)(colors), blueHover({ invert: invert, colors: colors }));
121
133
  });
122
134
  exports.StyledTagLink = StyledTagLink;
123
- var StyledLink = (0, styled_components_1.default)(react_router_dom_1.NavLink)(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n text-decoration: none;\n"], ["\n text-decoration: none;\n"])));
135
+ var StyledLink = (0, styled_components_1.default)(react_router_dom_1.NavLink)(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n text-decoration: none;\n"], ["\n text-decoration: none;\n"])));
124
136
  exports.StyledLink = StyledLink;
125
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21;
137
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24;
package/dist/components/TextInputs/index.js CHANGED
@@ -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, maxNumLimiter = props.maxNumLimiter, _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;
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: maxNumLimiter, onBlur: handleValidateOnBlur, onFocus: onFocus, size: size, autoComplete: 'off' }),
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, maxNumLimiter: 10 }, props)));
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({}, props, { type: "url", validateOnBlur: handleValidation, placeholder: "Enter a valid url..." })));
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, __assign({}, props, {
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;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oolib",
3
- "version": "2.23.0",
3
+ "version": "2.24.1",
4
4
  "description": " OKE Component Library",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",