etendo-ui-library 1.3.111 → 1.3.112
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.
- package/dist-native/components/inputBase/InputBase.js +1 -1
- package/dist-native/components/inputBase/InputBase.styles.d.ts +0 -1
- package/dist-native/components/inputBase/InputBase.styles.js +1 -1
- package/dist-web/components/inputBase/InputBase.js +11 -3
- package/dist-web/components/inputBase/InputBase.styles.d.ts +0 -1
- package/dist-web/components/inputBase/InputBase.styles.js +1 -2
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _reactNative=require("react-native");var _react=_interopRequireWildcard(require("react"));var _containers=require("../containers");var _button=require("../button");var _CornerDownRightIcon=require("../../assets/images/icons/CornerDownRightIcon");var _InputBase=require("./InputBase.styles");var _colors=require("../../styles/colors");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/inputBase/InputBase.tsx";function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap(),t=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(e){return e?t:r;})(e);}function _interopRequireWildcard(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&Object.prototype.hasOwnProperty.call(e,u)){var i=a?Object.getOwnPropertyDescriptor(e,u):null;i&&(i.get||i.set)?Object.defineProperty(n,u,i):n[u]=e[u];}return n.default=e,t&&t.set(e,n),n;}var InputBase=function InputBase(_ref){var value=_ref.value,placeholder=_ref.placeholder,title=_ref.title,helperText=_ref.helperText,isDisabled=_ref.isDisabled,isError=_ref.isError,onChangeText=_ref.onChangeText,icon=_ref.icon,rightButtons=_ref.rightButtons,onSubmit=_ref.onSubmit,isLoading=_ref.isLoading,onBlur=_ref.onBlur,_ref$keyboardType=_ref.keyboardType,keyboardType=_ref$keyboardType===void 0?"default":_ref$keyboardType;var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isFocused=_useState2[0],setIsFocused=_useState2[1];var _useState3=(0,_react.useState)([]),_useState4=(0,_slicedToArray2.default)(_useState3,2),buttons=_useState4[0],setButtons=_useState4[1];var onFocusChange=function onFocusChange(){setIsFocused(true);};var onBlurChange=function onBlurChange(){setIsFocused(false);onBlur==null?void 0:onBlur();};var borderWidth=isFocused?1.5:1;var paddingVertical=13-(borderWidth-1);var paddingHorizontal=12-(borderWidth-1);var borderStyle=function borderStyle(){if(!value&&!isFocused){return _InputBase.styles.containerPlaceholder;}if(isDisabled){return _InputBase.styles.containerIsDisabled;}if(isError){return _InputBase.styles.containerIsError;}};var iconColorStyle=function iconColorStyle(){if(!value){return _InputBase.styles.iconPlaceholder.color;}if(isDisabled){return _InputBase.styles.iconIsDisabled.color;}if(isFocused){return _InputBase.styles.iconIsFocus.color;}if(isError){return _InputBase.styles.iconIsError.color;}};var textColorStyle=function textColorStyle(){if(!value){return _InputBase.styles.textPlaceholder;}if(isDisabled){return _InputBase.styles.textIsDisabled;}if(isFocused){return _InputBase.styles.textIsFocus;}if(isError&&!isFocused){return _InputBase.styles.textIsError;}};var textInputStyle=[_InputBase.styles.textInput,textColorStyle()];if(_reactNative.Platform.OS==='web'){textInputStyle.push({outlineWidth:0});}(0,_react.useEffect)(function(){setButtons([].concat((0,_toConsumableArray2.default)(rightButtons!=null?rightButtons:[]),[onSubmit!==undefined&&_react.default.createElement(_button.Button,{paddingHorizontal:6,typeStyle:"white",onPress:onSubmit,iconLeft:_react.default.createElement(_CornerDownRightIcon.CornerDownRightIcon,{style:_InputBase.styles.iconSize,__self:_this,__source:{fileName:_jsxFileName,lineNumber:
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _reactNative=require("react-native");var _react=_interopRequireWildcard(require("react"));var _containers=require("../containers");var _button=require("../button");var _CornerDownRightIcon=require("../../assets/images/icons/CornerDownRightIcon");var _InputBase=require("./InputBase.styles");var _colors=require("../../styles/colors");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/inputBase/InputBase.tsx";function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap(),t=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(e){return e?t:r;})(e);}function _interopRequireWildcard(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&Object.prototype.hasOwnProperty.call(e,u)){var i=a?Object.getOwnPropertyDescriptor(e,u):null;i&&(i.get||i.set)?Object.defineProperty(n,u,i):n[u]=e[u];}return n.default=e,t&&t.set(e,n),n;}var InputBase=function InputBase(_ref){var value=_ref.value,placeholder=_ref.placeholder,title=_ref.title,helperText=_ref.helperText,isDisabled=_ref.isDisabled,isError=_ref.isError,onChangeText=_ref.onChangeText,icon=_ref.icon,rightButtons=_ref.rightButtons,onSubmit=_ref.onSubmit,isLoading=_ref.isLoading,onBlur=_ref.onBlur,_ref$keyboardType=_ref.keyboardType,keyboardType=_ref$keyboardType===void 0?"default":_ref$keyboardType;var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isFocused=_useState2[0],setIsFocused=_useState2[1];var _useState3=(0,_react.useState)([]),_useState4=(0,_slicedToArray2.default)(_useState3,2),buttons=_useState4[0],setButtons=_useState4[1];var onFocusChange=function onFocusChange(){setIsFocused(true);};var onBlurChange=function onBlurChange(){setIsFocused(false);onBlur==null?void 0:onBlur();};function determineTextColor(isError,isDisabled){if(isDisabled){return _colors.NEUTRAL_500;}return isError?_colors.DANGER_700:_colors.NEUTRAL_800;}var borderWidth=isFocused?1.5:1;var paddingVertical=13-(borderWidth-1);var paddingHorizontal=12-(borderWidth-1);var borderStyle=function borderStyle(){if(!value&&!isFocused){return _InputBase.styles.containerPlaceholder;}if(isDisabled){return _InputBase.styles.containerIsDisabled;}if(isError){return _InputBase.styles.containerIsError;}};var iconColorStyle=function iconColorStyle(){if(!value){return _InputBase.styles.iconPlaceholder.color;}if(isDisabled){return _InputBase.styles.iconIsDisabled.color;}if(isFocused){return _InputBase.styles.iconIsFocus.color;}if(isError){return _InputBase.styles.iconIsError.color;}};var textColorStyle=function textColorStyle(){if(!value){return _InputBase.styles.textPlaceholder;}if(isDisabled){return _InputBase.styles.textIsDisabled;}if(isFocused){return _InputBase.styles.textIsFocus;}if(isError&&!isFocused){return _InputBase.styles.textIsError;}};var textInputStyle=[_InputBase.styles.textInput,textColorStyle()];if(_reactNative.Platform.OS==='web'){textInputStyle.push({outlineWidth:0});}(0,_react.useEffect)(function(){setButtons([].concat((0,_toConsumableArray2.default)(rightButtons!=null?rightButtons:[]),[onSubmit!==undefined&&_react.default.createElement(_button.Button,{paddingHorizontal:6,typeStyle:"white",onPress:onSubmit,iconLeft:_react.default.createElement(_CornerDownRightIcon.CornerDownRightIcon,{style:_InputBase.styles.iconSize,__self:_this,__source:{fileName:_jsxFileName,lineNumber:113,columnNumber:21}}),disabled:isLoading,__self:_this,__source:{fileName:_jsxFileName,lineNumber:109,columnNumber:9}})]));},[onSubmit,isLoading,rightButtons]);return _react.default.createElement(_react.default.Fragment,null,!!title&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:[_InputBase.styles.title,{color:determineTextColor(isError,isDisabled)}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:123,columnNumber:9}},title),_react.default.createElement(_reactNative.View,{style:[_InputBase.styles.container,borderStyle(),{borderWidth:borderWidth,paddingVertical:paddingVertical,paddingHorizontal:paddingHorizontal}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:127,columnNumber:7}},!!icon&&_react.default.createElement(_reactNative.TouchableOpacity,{disabled:!icon.onPress||isDisabled,onPress:function onPress(){if(icon.onPress){icon.onPress();}},style:{marginRight:5},__self:_this,__source:{fileName:_jsxFileName,lineNumber:138,columnNumber:11}},_react.default.cloneElement(icon.icon,{style:icon.icon.props.style||_InputBase.styles.iconRight,fill:iconColorStyle()})),_react.default.createElement(_reactNative.TextInput,{value:value,onChangeText:onChangeText,placeholder:placeholder,editable:!isDisabled,onFocus:onFocusChange,onBlur:onBlurChange,style:textInputStyle,onSubmitEditing:onSubmit||function(){},keyboardType:keyboardType,__self:_this,__source:{fileName:_jsxFileName,lineNumber:152,columnNumber:9}}),!!buttons&&_react.default.createElement(_containers.ButtonContainer,{style:_InputBase.styles.buttonContainer,buttons:buttons,__self:_this,__source:{fileName:_jsxFileName,lineNumber:164,columnNumber:11}})),!!helperText&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:[_InputBase.styles.helperText,{color:determineTextColor(isError,isDisabled)}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:168,columnNumber:9}},helperText));};var _default=exports.default=InputBase;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _colors=require("../../styles/colors");var styles=exports.styles=_reactNative.StyleSheet.create({title:{fontSize:16,fontWeight:'600',lineHeight:24,letterSpacing:-0.16,color:_colors.NEUTRAL_800},container:{backgroundColor:_colors.NEUTRAL_50,height:48,borderRadius:8,borderColor:_colors.PRIMARY_100,overflow:'hidden',justifyContent:'center',alignItems:'center',flexDirection:'row'},containerIsError:{borderColor:_colors.DANGER_600},containerIsDisabled:{borderColor:_colors.NEUTRAL_400},containerPlaceholder:{borderColor:_colors.NEUTRAL_400},iconPlaceholder:{color:_colors.NEUTRAL_800},iconIsDisabled:{color:_colors.NEUTRAL_500},iconIsError:{color:_colors.NEUTRAL_800},iconIsFocus:{color:_colors.NEUTRAL_1000},textPlaceholder:{color:_colors.NEUTRAL_500},textIsError:{color:_colors.DANGER_700},textIsFocus:{color:_colors.NEUTRAL_800},textIsDisabled:{color:_colors.NEUTRAL_500},textInput:{paddingHorizontal:0,height:48,backgroundColor:_colors.NEUTRAL_50,fontSize:16,fontStyle:'normal',fontWeight:'500',lineHeight:22,letterSpacing:-0.16,color:_colors.PRIMARY_100,flex:1},helperText:{fontSize:14,fontWeight:'500',lineHeight:22,letterSpacing:-0.14
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _colors=require("../../styles/colors");var styles=exports.styles=_reactNative.StyleSheet.create({title:{fontSize:16,fontWeight:'600',lineHeight:24,letterSpacing:-0.16,color:_colors.NEUTRAL_800},container:{backgroundColor:_colors.NEUTRAL_50,height:48,borderRadius:8,borderColor:_colors.PRIMARY_100,overflow:'hidden',justifyContent:'center',alignItems:'center',flexDirection:'row'},containerIsError:{borderColor:_colors.DANGER_600},containerIsDisabled:{borderColor:_colors.NEUTRAL_400},containerPlaceholder:{borderColor:_colors.NEUTRAL_400},iconPlaceholder:{color:_colors.NEUTRAL_800},iconIsDisabled:{color:_colors.NEUTRAL_500},iconIsError:{color:_colors.NEUTRAL_800},iconIsFocus:{color:_colors.NEUTRAL_1000},textPlaceholder:{color:_colors.NEUTRAL_500},textIsError:{color:_colors.DANGER_700},textIsFocus:{color:_colors.NEUTRAL_800},textIsDisabled:{color:_colors.NEUTRAL_500},textInput:{paddingHorizontal:0,height:48,backgroundColor:_colors.NEUTRAL_50,fontSize:16,fontStyle:'normal',fontWeight:'500',lineHeight:22,letterSpacing:-0.16,color:_colors.PRIMARY_100,flex:1},helperText:{fontSize:14,fontWeight:'500',lineHeight:22,letterSpacing:-0.14},iconLeft:{width:24,height:24,marginRight:8},iconRight:{width:24,height:24,marginLeft:8},iconSize:{width:24,height:24},buttonContainer:{flexDirection:'row',paddingVertical:0,gap:0,marginLeft:5}});
|
|
@@ -14,7 +14,7 @@ import { ButtonContainer } from "../containers";
|
|
|
14
14
|
import { Button } from "../button";
|
|
15
15
|
import { CornerDownRightIcon } from "../../assets/images/icons/CornerDownRightIcon";
|
|
16
16
|
import { styles } from "./InputBase.styles";
|
|
17
|
-
import { DANGER_700, NEUTRAL_800 } from "../../styles/colors";
|
|
17
|
+
import { DANGER_700, NEUTRAL_500, NEUTRAL_800 } from "../../styles/colors";
|
|
18
18
|
var InputBase = function InputBase(_ref) {
|
|
19
19
|
var value = _ref.value,
|
|
20
20
|
placeholder = _ref.placeholder,
|
|
@@ -45,6 +45,12 @@ var InputBase = function InputBase(_ref) {
|
|
|
45
45
|
setIsFocused(false);
|
|
46
46
|
onBlur === null || onBlur === void 0 || onBlur();
|
|
47
47
|
};
|
|
48
|
+
function determineTextColor(isError, isDisabled) {
|
|
49
|
+
if (isDisabled) {
|
|
50
|
+
return NEUTRAL_500;
|
|
51
|
+
}
|
|
52
|
+
return isError ? DANGER_700 : NEUTRAL_800;
|
|
53
|
+
}
|
|
48
54
|
var borderWidth = isFocused ? 1.5 : 1;
|
|
49
55
|
var paddingVertical = 13 - (borderWidth - 1);
|
|
50
56
|
var paddingHorizontal = 12 - (borderWidth - 1);
|
|
@@ -108,7 +114,7 @@ var InputBase = function InputBase(_ref) {
|
|
|
108
114
|
numberOfLines: 1,
|
|
109
115
|
ellipsizeMode: "tail",
|
|
110
116
|
style: [styles.title, {
|
|
111
|
-
color:
|
|
117
|
+
color: determineTextColor(isError, isDisabled)
|
|
112
118
|
}]
|
|
113
119
|
}, title), /*#__PURE__*/React.createElement(View, {
|
|
114
120
|
style: [styles.container, borderStyle(), {
|
|
@@ -145,7 +151,9 @@ var InputBase = function InputBase(_ref) {
|
|
|
145
151
|
})), !!helperText && /*#__PURE__*/React.createElement(Text, {
|
|
146
152
|
numberOfLines: 1,
|
|
147
153
|
ellipsizeMode: "tail",
|
|
148
|
-
style: styles.helperText
|
|
154
|
+
style: [styles.helperText, {
|
|
155
|
+
color: determineTextColor(isError, isDisabled)
|
|
156
|
+
}]
|
|
149
157
|
}, helperText));
|
|
150
158
|
};
|
|
151
159
|
export default InputBase;
|