etendo-ui-library 1.2.39 → 1.2.40
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/input/Input.d.ts +1 -1
- package/dist-native/components/input/Input.js +1 -1
- package/dist-native/components/input/Input.types.d.ts +5 -5
- package/dist-native/components/input/components/InputField.d.ts +1 -1
- package/dist-native/components/input/components/InputField.js +1 -1
- package/dist-native/components/input/components/InputOptions.d.ts +1 -1
- package/dist-native/components/input/components/InputOptions.js +1 -1
- package/dist-web/components/input/Input.d.ts +1 -1
- package/dist-web/components/input/Input.js +4 -4
- package/dist-web/components/input/Input.types.d.ts +5 -5
- package/dist-web/components/input/components/InputField.d.ts +1 -1
- package/dist-web/components/input/components/InputField.js +2 -2
- package/dist-web/components/input/components/InputOptions.d.ts +1 -1
- package/dist-web/components/input/components/InputOptions.js +9 -9
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { InputProps } from './Input.types';
|
|
3
|
-
declare const Input: ({ value, titleLabel, titleImage, helperText, placeholder,
|
|
3
|
+
declare const Input: ({ value, titleLabel, titleImage, helperText, placeholder, placeholderPickerSearch, disabled, maxLength, centerText, keyboardType, displayKey, dataPicker, backgroundColor, showOptionsAmount, showSearchInPicker, height, onPress, onSubmit, onFocus, onBlur, onChangeText, onOptionSelected, typeField, isError, }: InputProps) => React.JSX.Element;
|
|
4
4
|
export default Input;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _Input=require("./Input.style");var _index=require("./index");var _this=this,_jsxFileName="/home/jenkins/workspace/etendo_ui_library_develop/src/components/input/Input.tsx";var Input=function Input(_ref){var value=_ref.value,titleLabel=_ref.titleLabel,titleImage=_ref.titleImage,helperText=_ref.helperText,placeholder=_ref.placeholder,
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _Input=require("./Input.style");var _index=require("./index");var _this=this,_jsxFileName="/home/jenkins/workspace/etendo_ui_library_develop/src/components/input/Input.tsx";var Input=function Input(_ref){var value=_ref.value,titleLabel=_ref.titleLabel,titleImage=_ref.titleImage,helperText=_ref.helperText,placeholder=_ref.placeholder,placeholderPickerSearch=_ref.placeholderPickerSearch,_ref$disabled=_ref.disabled,disabled=_ref$disabled===void 0?false:_ref$disabled,maxLength=_ref.maxLength,centerText=_ref.centerText,keyboardType=_ref.keyboardType,displayKey=_ref.displayKey,dataPicker=_ref.dataPicker,backgroundColor=_ref.backgroundColor,showOptionsAmount=_ref.showOptionsAmount,showSearchInPicker=_ref.showSearchInPicker,height=_ref.height,onPress=_ref.onPress,onSubmit=_ref.onSubmit,_ref$onFocus=_ref.onFocus,onFocus=_ref$onFocus===void 0?function(){}:_ref$onFocus,_ref$onBlur=_ref.onBlur,onBlur=_ref$onBlur===void 0?function(){}:_ref$onBlur,onChangeText=_ref.onChangeText,onOptionSelected=_ref.onOptionSelected,typeField=_ref.typeField,isError=_ref.isError;var stateStyle=function stateStyle(){if(typeField==='readOnly'){return _Input.inputStyleVariants.readOnly;}else if(getDisabled()){return _Input.inputStyleVariants.disabled;}else if(isError){return _Input.inputStyleVariants.destructive;}else{return _Input.inputStyleVariants.default;}};var getDisabled=function getDisabled(){if(typeField==='picker'){return!(dataPicker!=null&&dataPicker.length)||disabled;}if(typeField==='readOnly'){return false;}return disabled;};var showFilterSearch=dataPicker&&(showSearchInPicker!=null?showSearchInPicker:(dataPicker==null?void 0:dataPicker.length)>16);return _react.default.createElement(_reactNative.View,{style:_Input.styles.inputContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:58,columnNumber:5}},_react.default.createElement(_index.InputTitle,{disabled:getDisabled(),titleLabel:titleLabel,titleImage:titleImage,styleTitle:stateStyle().titleStyle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:59,columnNumber:7}}),_react.default.createElement(_index.InputField,{disabled:getDisabled(),type:typeField,configField:_Input.inputVariants[typeField].field,styleField:stateStyle().fieldStyle,placeholder:placeholder,placeholderPickerSearch:placeholderPickerSearch,value:value,onPress:onPress,onSubmit:onSubmit,onFocus:onFocus,onBlur:onBlur,onChangeText:onChangeText,onOptionSelected:onOptionSelected,showOptionsAmount:showOptionsAmount,showSearchInPicker:showFilterSearch,keyboardType:keyboardType,maxLength:maxLength,centerText:centerText,dataPicker:dataPicker,displayKey:displayKey,backgroundColor:backgroundColor,height:height,__self:_this,__source:{fileName:_jsxFileName,lineNumber:65,columnNumber:7}}),_react.default.createElement(_index.InputHelperText,{label:helperText,styleHelper:stateStyle().helperStyle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:89,columnNumber:7}}));};var _default=exports.default=Input;
|
|
@@ -33,7 +33,7 @@ export interface InputProps {
|
|
|
33
33
|
value: string;
|
|
34
34
|
helperText?: string;
|
|
35
35
|
placeholder?: string;
|
|
36
|
-
|
|
36
|
+
placeholderPickerSearch?: string;
|
|
37
37
|
disabled?: boolean;
|
|
38
38
|
isError?: boolean;
|
|
39
39
|
maxLength?: number;
|
|
@@ -42,7 +42,7 @@ export interface InputProps {
|
|
|
42
42
|
keyboardType?: KeyboardTypes;
|
|
43
43
|
fontSize?: number;
|
|
44
44
|
height?: number | string;
|
|
45
|
-
dataPicker?: any
|
|
45
|
+
dataPicker?: Array<Record<string, any>>;
|
|
46
46
|
displayKey?: string;
|
|
47
47
|
showOptionsAmount?: number;
|
|
48
48
|
showSearchInPicker?: boolean;
|
|
@@ -51,7 +51,7 @@ export interface InputProps {
|
|
|
51
51
|
onChangeText?: (text: string) => void;
|
|
52
52
|
onFocus?: (event?: NativeSyntheticEvent<TextInputFocusEventData>) => void;
|
|
53
53
|
onBlur?: (event?: NativeSyntheticEvent<TextInputFocusEventData>) => void;
|
|
54
|
-
onOptionSelected?: any;
|
|
54
|
+
onOptionSelected?: (selectedItem: Array<Record<string, any>>) => void;
|
|
55
55
|
backgroundColor?: ColorValue;
|
|
56
56
|
}
|
|
57
57
|
export interface InputTitleProps {
|
|
@@ -68,7 +68,7 @@ export interface InputFieldProps {
|
|
|
68
68
|
disabled?: boolean;
|
|
69
69
|
value?: string;
|
|
70
70
|
placeholder?: string;
|
|
71
|
-
|
|
71
|
+
placeholderPickerSearch?: string;
|
|
72
72
|
configField: InputFieldConfigType;
|
|
73
73
|
keyboardType?: KeyboardTypes;
|
|
74
74
|
styleField: {
|
|
@@ -115,5 +115,5 @@ export interface InputOptionsProps {
|
|
|
115
115
|
onClose: (event?: GestureResponderEvent) => void;
|
|
116
116
|
onChangeFilterText: (text: string) => void;
|
|
117
117
|
filterValue: string;
|
|
118
|
-
|
|
118
|
+
placeholderPickerSearch?: string;
|
|
119
119
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { InputFieldProps } from '../Input.types';
|
|
3
|
-
declare const InputField: ({ type, configField, styleField, value, disabled, placeholder,
|
|
3
|
+
declare const InputField: ({ type, configField, styleField, value, disabled, placeholder, placeholderPickerSearch, maxLength, keyboardType, dataPicker, displayKey, showSearchInPicker, backgroundColor, showOptionsAmount, height, onPress, onSubmit, onChangeText, onOptionSelected, onFocus, onBlur, }: InputFieldProps) => React.JSX.Element;
|
|
4
4
|
export default InputField;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _Input=require("../Input.style");var _ShowPasswordIcon=require("../../../assets/images/icons/ShowPasswordIcon");var _HidePasswordIcon=require("../../../assets/images/icons/HidePasswordIcon");var _InputOptions=_interopRequireDefault(require("./InputOptions"));var _colors=require("../../../styles/colors");var _table_utils=require("../../../helpers/table_utils");var _this=this,_jsxFileName="/home/jenkins/workspace/etendo_ui_library_develop/src/components/input/components/InputField.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 InputField=function InputField(_ref){var type=_ref.type,configField=_ref.configField,styleField=_ref.styleField,value=_ref.value,disabled=_ref.disabled,placeholder=_ref.placeholder,
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _Input=require("../Input.style");var _ShowPasswordIcon=require("../../../assets/images/icons/ShowPasswordIcon");var _HidePasswordIcon=require("../../../assets/images/icons/HidePasswordIcon");var _InputOptions=_interopRequireDefault(require("./InputOptions"));var _colors=require("../../../styles/colors");var _table_utils=require("../../../helpers/table_utils");var _this=this,_jsxFileName="/home/jenkins/workspace/etendo_ui_library_develop/src/components/input/components/InputField.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 InputField=function InputField(_ref){var type=_ref.type,configField=_ref.configField,styleField=_ref.styleField,value=_ref.value,disabled=_ref.disabled,placeholder=_ref.placeholder,placeholderPickerSearch=_ref.placeholderPickerSearch,maxLength=_ref.maxLength,keyboardType=_ref.keyboardType,dataPicker=_ref.dataPicker,displayKey=_ref.displayKey,showSearchInPicker=_ref.showSearchInPicker,_ref$backgroundColor=_ref.backgroundColor,backgroundColor=_ref$backgroundColor===void 0?_colors.NEUTRAL_0:_ref$backgroundColor,_ref$showOptionsAmoun=_ref.showOptionsAmount,showOptionsAmount=_ref$showOptionsAmoun===void 0?4:_ref$showOptionsAmoun,_ref$height=_ref.height,height=_ref$height===void 0?40:_ref$height,onPress=_ref.onPress,onSubmit=_ref.onSubmit,onChangeText=_ref.onChangeText,onOptionSelected=_ref.onOptionSelected,onFocus=_ref.onFocus,onBlur=_ref.onBlur;var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isFocus=_useState2[0],setIsFocus=_useState2[1];var _useState3=(0,_react.useState)(true),_useState4=(0,_slicedToArray2.default)(_useState3,2),showPassword=_useState4[0],setShowPassword=_useState4[1];var _useState5=(0,_react.useState)(false),_useState6=(0,_slicedToArray2.default)(_useState5,2),showOptions=_useState6[0],setShowOptions=_useState6[1];var _useState7=(0,_react.useState)([]),_useState8=(0,_slicedToArray2.default)(_useState7,2),dataOptionsFilter=_useState8[0],setDataOptionsFilter=_useState8[1];var _useState9=(0,_react.useState)(''),_useState10=(0,_slicedToArray2.default)(_useState9,2),filterValue=_useState10[0],setFilterValue=_useState10[1];var _useState11=(0,_react.useState)({top:0,left:0,width:0,height:0}),_useState12=(0,_slicedToArray2.default)(_useState11,2),positionModal=_useState12[0],setpositionModal=_useState12[1];var windowHeight=_reactNative.Dimensions.get('window').height;var refComponente=(0,_react.useRef)(null);var regex=/^[0-9.,]+$/g;var getStyleText=function getStyleText(){var style=[];if(value){style.push(styleField.textDefault);}else{style.push(styleField.textPlaceholder);}return style;};(0,_react.useEffect)(function(){if(dataPicker){setDataOptionsFilter(dataPicker);}},[dataPicker]);(0,_react.useEffect)(function(){if(showOptions){getTopLeft();}});var getTopLeft=function getTopLeft(){if(refComponente.current){refComponente.current.measure(function(x,y,width,height,pageX,pageY){var calcDropdownTopLeft=pageY+height+_Input.styles.spaceInOptionsAndInput.height;var showFilterHeight=showSearchInPicker?_Input.styles.optionFilterContainer.height:0;var countOptions=showOptionsAmount>(dataPicker==null?void 0:dataPicker.length)?dataPicker==null?void 0:dataPicker.length:showOptionsAmount;var optionsHeight=(_Input.styles.optionContainer.height+_Input.styles.optionContainer.marginTop)*countOptions+showFilterHeight+_Input.styles.optionContainer.marginTop+_Input.styles.optionsContainer.borderWidth*2;var topPosition;if(optionsHeight+calcDropdownTopLeft+_Input.styles.offSet.height>windowHeight){topPosition=pageY-_Input.styles.spaceInOptionsAndInput.height-optionsHeight;}else{topPosition=calcDropdownTopLeft;}setpositionModal({top:topPosition,left:pageX,width:width,height:height});});}};var handleOnChangeFilterText=function handleOnChangeFilterText(filterText){setFilterValue(filterText);if(displayKey)setDataOptionsFilter(dataPicker.filter(function(item){return item[displayKey].toLocaleLowerCase().includes(filterText.toLocaleLowerCase());}));};var handleOnClose=function handleOnClose(){setShowOptions(false);setDataOptionsFilter(dataPicker);setFilterValue('');};var getKeyboardType=function getKeyboardType(keyboardType){if(keyboardType==='number'){return'numeric';}return'default';};var getOnChangeText=function getOnChangeText(text){if(onChangeText){if(keyboardType==='number'){if(text.match(regex)||(text==null?void 0:text.length)===0){onChangeText(text);}return;}onChangeText(text);}};var getFocusStyle=function getFocusStyle(){var style=[];if(!isFocus){style.push({borderColor:'transparent'});}return style;};var removePaddingField=function removePaddingField(){var style={};if(configField!=null&&configField.image){style={paddingRight:0};}return style;};var onPressFocus=function onPressFocus(event){onFocus(event);setIsFocus(true);};var onPressBlur=function onPressBlur(event){onBlur(event);setIsFocus(false);};var getImage=function getImage(image){var fillValue=disabled?_colors.NEUTRAL_400:undefined;if(type==='textInputPassword'){var PasswordComponent=showPassword?_HidePasswordIcon.HidePasswordIcon:_ShowPasswordIcon.ShowPasswordIcon;return _react.default.createElement(PasswordComponent,{style:_Input.styles.inputImageSize,fill:fillValue,__self:_this,__source:{fileName:_jsxFileName,lineNumber:214,columnNumber:9}});}return _react.default.cloneElement(image,{fill:fillValue});};var handlePressImage=function handlePressImage(){if(type==='textInputPassword'){setShowPassword(function(prevState){return!prevState;});}else{onSubmit==null?void 0:onSubmit();}};var handleOnPress=function handleOnPress(event){if(type==='picker'){getTopLeft();setShowOptions(true);}if(onPress){onPress(event);}};var getText=function getText(){if(value){return value;}return placeholder;};return _react.default.createElement(_reactNative.View,{style:[styleField.focus,getFocusStyle()],__self:_this,__source:{fileName:_jsxFileName,lineNumber:247,columnNumber:5}},_react.default.createElement(_reactNative.TouchableOpacity,{ref:refComponente,style:[styleField.field,removePaddingField(),{backgroundColor:backgroundColor},{height:height}],disabled:disabled||configField.disabledField,onPress:handleOnPress,__self:_this,__source:{fileName:_jsxFileName,lineNumber:248,columnNumber:7}},(configField==null?void 0:configField.type)==='textInput'&&(value?_react.default.createElement(_reactNative.TextInput,{editable:!disabled||!configField.disabledField,focusable:!disabled||!configField.disabledField,onBlur:onPressBlur,onFocus:onPressFocus,value:value,keyboardType:getKeyboardType(keyboardType),onChangeText:getOnChangeText,style:[getStyleText(),(0,_table_utils.disableOutline)(),styleField.textDefault],placeholder:placeholder,placeholderTextColor:_colors.NEUTRAL_600,maxLength:maxLength,secureTextEntry:type==='textInputPassword'&&showPassword,__self:_this,__source:{fileName:_jsxFileName,lineNumber:261,columnNumber:13}}):_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:[getStyleText(),(0,_table_utils.disableOutline)(),styleField.textPlaceholder],__self:_this,__source:{fileName:_jsxFileName,lineNumber:276,columnNumber:13}},placeholder)),(configField==null?void 0:configField.type)==='text'&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:[getStyleText(),(0,_table_utils.disableOutline)(),styleField.textDefault],__self:_this,__source:{fileName:_jsxFileName,lineNumber:289,columnNumber:11}},getText()),(configField==null?void 0:configField.image)&&_react.default.createElement(_reactNative.TouchableOpacity,{onPress:handlePressImage,style:_Input.styles.buttonContainerInputField,disabled:disabled||configField.disabledSubmit,__self:_this,__source:{fileName:_jsxFileName,lineNumber:298,columnNumber:11}},getImage(configField.image)),_react.default.createElement(_InputOptions.default,{showOptionsAmount:showOptionsAmount,onOptionSelected:onOptionSelected,showOptions:showOptions,positionModal:positionModal,data:dataOptionsFilter,onClose:handleOnClose,onChangeFilterText:handleOnChangeFilterText,filterValue:filterValue,displayKey:displayKey,showSearchInPicker:showSearchInPicker,placeholderPickerSearch:placeholderPickerSearch,__self:_this,__source:{fileName:_jsxFileName,lineNumber:306,columnNumber:9}})));};var _default=exports.default=InputField;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { InputOptionsProps } from '../Input.types';
|
|
3
|
-
declare const InputOptions: ({ data, onOptionSelected, showOptions, positionModal, showOptionsAmount, onClose, filterValue, onChangeFilterText, displayKey, showSearchInPicker,
|
|
3
|
+
declare const InputOptions: ({ data, onOptionSelected, showOptions, positionModal, showOptionsAmount, onClose, filterValue, onChangeFilterText, displayKey, showSearchInPicker, placeholderPickerSearch, }: InputOptionsProps) => React.JSX.Element;
|
|
4
4
|
export default InputOptions;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _reactNative=require("react-native");var _react=_interopRequireWildcard(require("react"));var _Input=require("../Input.style");var _SearchIcon=require("../../../assets/images/icons/SearchIcon");var _colors=require("../../../styles/colors");var _CancelIcon=require("../../../assets/images/icons/CancelIcon");var _table_utils=require("../../../helpers/table_utils");var _this=this,_jsxFileName="/home/jenkins/workspace/etendo_ui_library_develop/src/components/input/components/InputOptions.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 InputOptions=function InputOptions(_ref){var data=_ref.data,onOptionSelected=_ref.onOptionSelected,showOptions=_ref.showOptions,positionModal=_ref.positionModal,_ref$showOptionsAmoun=_ref.showOptionsAmount,showOptionsAmount=_ref$showOptionsAmoun===void 0?4:_ref$showOptionsAmoun,onClose=_ref.onClose,filterValue=_ref.filterValue,onChangeFilterText=_ref.onChangeFilterText,displayKey=_ref.displayKey,showSearchInPicker=_ref.showSearchInPicker,
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _reactNative=require("react-native");var _react=_interopRequireWildcard(require("react"));var _Input=require("../Input.style");var _SearchIcon=require("../../../assets/images/icons/SearchIcon");var _colors=require("../../../styles/colors");var _CancelIcon=require("../../../assets/images/icons/CancelIcon");var _table_utils=require("../../../helpers/table_utils");var _this=this,_jsxFileName="/home/jenkins/workspace/etendo_ui_library_develop/src/components/input/components/InputOptions.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 InputOptions=function InputOptions(_ref){var data=_ref.data,onOptionSelected=_ref.onOptionSelected,showOptions=_ref.showOptions,positionModal=_ref.positionModal,_ref$showOptionsAmoun=_ref.showOptionsAmount,showOptionsAmount=_ref$showOptionsAmoun===void 0?4:_ref$showOptionsAmoun,onClose=_ref.onClose,filterValue=_ref.filterValue,onChangeFilterText=_ref.onChangeFilterText,displayKey=_ref.displayKey,showSearchInPicker=_ref.showSearchInPicker,placeholderPickerSearch=_ref.placeholderPickerSearch;var calculatedMaxHeight=8+48*showOptionsAmount;var _useState=(0,_react.useState)(true),_useState2=(0,_slicedToArray2.default)(_useState,2),showSearchImg=_useState2[0],setShowSearchImg=_useState2[1];var _useState3=(0,_react.useState)(true),_useState4=(0,_slicedToArray2.default)(_useState3,2),showScroll=_useState4[0],setShowScroll=_useState4[1];var _useState5=(0,_react.useState)(placeholderPickerSearch!=null?placeholderPickerSearch:''),_useState6=(0,_slicedToArray2.default)(_useState5,2),placeholderText=_useState6[0],setPlaceholderText=_useState6[1];var _useState7=(0,_react.useState)(-1),_useState8=(0,_slicedToArray2.default)(_useState7,2),indexHover=_useState8[0],setIndexHover=_useState8[1];var textInputRef=(0,_react.useRef)(null);var handleOptionSelected=function handleOptionSelected(item,index){if(onOptionSelected){onOptionSelected(item,index);}onClose();};var handleOnBlur=function handleOnBlur(){setShowSearchImg(true);if(placeholderPickerSearch){setPlaceholderText(placeholderPickerSearch);}};var handleOnFocus=function handleOnFocus(){var _textInputRef$current;setShowSearchImg(false);textInputRef==null?void 0:(_textInputRef$current=textInputRef.current)==null?void 0:_textInputRef$current.focus();setPlaceholderText('');};var handlePressOverlay=function handlePressOverlay(){onClose();if(placeholderPickerSearch){setPlaceholderText(placeholderPickerSearch);}setShowSearchImg(true);};var getBackground=function getBackground(index){if(indexHover===index){return{backgroundColor:_colors.QUATERNARY_10};}};var addRadius=function addRadius(add){if(add){return{borderBottomLeftRadius:5,borderBottomRightRadius:5};}};var removePadding=function removePadding(remove){if(!remove){return{paddingHorizontal:0};}};var addPadding=function addPadding(add){if(!add){return{paddingHorizontal:8};}};var handleCancelFilter=function handleCancelFilter(){onChangeFilterText('');};var onContentSizeChange=function onContentSizeChange(contentWidth,contentHeight){var containerHeight=calculatedMaxHeight;setShowScroll(contentHeight>containerHeight);};(0,_react.useEffect)(function(){if(placeholderPickerSearch){setPlaceholderText(placeholderPickerSearch);}},[placeholderPickerSearch]);return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement(_reactNative.Modal,{transparent:true,visible:showOptions,animationType:"fade",__self:_this,__source:{fileName:_jsxFileName,lineNumber:110,columnNumber:7}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_Input.styles.optionOverlay,onPress:handlePressOverlay,activeOpacity:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:111,columnNumber:9}}),_react.default.createElement(_reactNative.View,{style:[_Input.styles.optionsContainer,{width:positionModal.width,top:positionModal.top,left:positionModal.left}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:116,columnNumber:9}},showSearchInPicker&&_react.default.createElement(_reactNative.Pressable,{onPress:handleOnFocus,style:[_Input.styles.optionFilterContainer,removePadding(!filterValue&&showSearchImg)],__self:_this,__source:{fileName:_jsxFileName,lineNumber:127,columnNumber:13}},filterValue===''&&showSearchImg&&_react.default.createElement(_reactNative.View,{style:_Input.styles.searchContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:135,columnNumber:17}},_react.default.createElement(_SearchIcon.SearchIcon,{style:_Input.styles.optionFilterImg,fill:_colors.NEUTRAL_600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:136,columnNumber:19}})),_react.default.createElement(_reactNative.TextInput,{ref:textInputRef,onFocus:handleOnFocus,onBlur:handleOnBlur,style:[_Input.styles.optionFilterText,addPadding(!filterValue&&showSearchImg),(0,_table_utils.disableOutline)()],value:filterValue,onChangeText:onChangeFilterText,placeholder:placeholderText,placeholderTextColor:_colors.NEUTRAL_600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:142,columnNumber:15}}),filterValue!==''&&_react.default.createElement(_reactNative.TouchableOpacity,{style:_Input.styles.cancelContainer,onPress:handleCancelFilter,__self:_this,__source:{fileName:_jsxFileName,lineNumber:157,columnNumber:17}},_react.default.createElement(_CancelIcon.CancelIcon,{style:_Input.styles.cancelFilterImg,__self:_this,__source:{fileName:_jsxFileName,lineNumber:161,columnNumber:19}}))),_react.default.createElement(_reactNative.ScrollView,{style:[showScroll&&{marginRight:8},{maxHeight:calculatedMaxHeight},_Input.styles.scrollOptions],persistentScrollbar:true,showsVerticalScrollIndicator:true,indicatorStyle:'black',onContentSizeChange:onContentSizeChange,__self:_this,__source:{fileName:_jsxFileName,lineNumber:166,columnNumber:11}},data==null?void 0:data.map(function(item,index){return _react.default.createElement(_reactNative.Pressable,{onHoverIn:function onHoverIn(){setIndexHover(index);},onHoverOut:function onHoverOut(){setIndexHover(-1);},onPressIn:function onPressIn(){setIndexHover(index);},onPressOut:function onPressOut(){setIndexHover(-1);},key:index,style:[_Input.styles.optionContainer,0===index&&{marginTop:0},getBackground(index),addRadius(index===(data==null?void 0:data.length)-1)],onPress:function onPress(){return handleOptionSelected(item,index);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:179,columnNumber:17}},displayKey&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:_Input.styles.optionText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:202,columnNumber:21}},item[displayKey]));})))));};var _default=exports.default=InputOptions;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { InputProps } from './Input.types';
|
|
3
|
-
declare const Input: ({ value, titleLabel, titleImage, helperText, placeholder,
|
|
3
|
+
declare const Input: ({ value, titleLabel, titleImage, helperText, placeholder, placeholderPickerSearch, disabled, maxLength, centerText, keyboardType, displayKey, dataPicker, backgroundColor, showOptionsAmount, showSearchInPicker, height, onPress, onSubmit, onFocus, onBlur, onChangeText, onOptionSelected, typeField, isError, }: InputProps) => React.JSX.Element;
|
|
4
4
|
export default Input;
|
|
@@ -8,7 +8,7 @@ var Input = function Input(_ref) {
|
|
|
8
8
|
titleImage = _ref.titleImage,
|
|
9
9
|
helperText = _ref.helperText,
|
|
10
10
|
placeholder = _ref.placeholder,
|
|
11
|
-
|
|
11
|
+
placeholderPickerSearch = _ref.placeholderPickerSearch,
|
|
12
12
|
_ref$disabled = _ref.disabled,
|
|
13
13
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
14
14
|
maxLength = _ref.maxLength,
|
|
@@ -43,14 +43,14 @@ var Input = function Input(_ref) {
|
|
|
43
43
|
};
|
|
44
44
|
var getDisabled = function getDisabled() {
|
|
45
45
|
if (typeField === 'picker') {
|
|
46
|
-
return !dataPicker.length || disabled;
|
|
46
|
+
return !(dataPicker !== null && dataPicker !== void 0 && dataPicker.length) || disabled;
|
|
47
47
|
}
|
|
48
48
|
if (typeField === 'readOnly') {
|
|
49
49
|
return false;
|
|
50
50
|
}
|
|
51
51
|
return disabled;
|
|
52
52
|
};
|
|
53
|
-
var showFilterSearch = showSearchInPicker !== null && showSearchInPicker !== void 0 ? showSearchInPicker : (dataPicker === null || dataPicker === void 0 ? void 0 : dataPicker.length) > 16;
|
|
53
|
+
var showFilterSearch = dataPicker && (showSearchInPicker !== null && showSearchInPicker !== void 0 ? showSearchInPicker : (dataPicker === null || dataPicker === void 0 ? void 0 : dataPicker.length) > 16);
|
|
54
54
|
return /*#__PURE__*/React.createElement(View, {
|
|
55
55
|
style: styles.inputContainer
|
|
56
56
|
}, /*#__PURE__*/React.createElement(InputTitle, {
|
|
@@ -64,7 +64,7 @@ var Input = function Input(_ref) {
|
|
|
64
64
|
configField: inputVariants[typeField].field,
|
|
65
65
|
styleField: stateStyle().fieldStyle,
|
|
66
66
|
placeholder: placeholder,
|
|
67
|
-
|
|
67
|
+
placeholderPickerSearch: placeholderPickerSearch,
|
|
68
68
|
value: value,
|
|
69
69
|
onPress: onPress,
|
|
70
70
|
onSubmit: onSubmit,
|
|
@@ -33,7 +33,7 @@ export interface InputProps {
|
|
|
33
33
|
value: string;
|
|
34
34
|
helperText?: string;
|
|
35
35
|
placeholder?: string;
|
|
36
|
-
|
|
36
|
+
placeholderPickerSearch?: string;
|
|
37
37
|
disabled?: boolean;
|
|
38
38
|
isError?: boolean;
|
|
39
39
|
maxLength?: number;
|
|
@@ -42,7 +42,7 @@ export interface InputProps {
|
|
|
42
42
|
keyboardType?: KeyboardTypes;
|
|
43
43
|
fontSize?: number;
|
|
44
44
|
height?: number | string;
|
|
45
|
-
dataPicker?: any
|
|
45
|
+
dataPicker?: Array<Record<string, any>>;
|
|
46
46
|
displayKey?: string;
|
|
47
47
|
showOptionsAmount?: number;
|
|
48
48
|
showSearchInPicker?: boolean;
|
|
@@ -51,7 +51,7 @@ export interface InputProps {
|
|
|
51
51
|
onChangeText?: (text: string) => void;
|
|
52
52
|
onFocus?: (event?: NativeSyntheticEvent<TextInputFocusEventData>) => void;
|
|
53
53
|
onBlur?: (event?: NativeSyntheticEvent<TextInputFocusEventData>) => void;
|
|
54
|
-
onOptionSelected?: any;
|
|
54
|
+
onOptionSelected?: (selectedItem: Array<Record<string, any>>) => void;
|
|
55
55
|
backgroundColor?: ColorValue;
|
|
56
56
|
}
|
|
57
57
|
export interface InputTitleProps {
|
|
@@ -68,7 +68,7 @@ export interface InputFieldProps {
|
|
|
68
68
|
disabled?: boolean;
|
|
69
69
|
value?: string;
|
|
70
70
|
placeholder?: string;
|
|
71
|
-
|
|
71
|
+
placeholderPickerSearch?: string;
|
|
72
72
|
configField: InputFieldConfigType;
|
|
73
73
|
keyboardType?: KeyboardTypes;
|
|
74
74
|
styleField: {
|
|
@@ -115,5 +115,5 @@ export interface InputOptionsProps {
|
|
|
115
115
|
onClose: (event?: GestureResponderEvent) => void;
|
|
116
116
|
onChangeFilterText: (text: string) => void;
|
|
117
117
|
filterValue: string;
|
|
118
|
-
|
|
118
|
+
placeholderPickerSearch?: string;
|
|
119
119
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { InputFieldProps } from '../Input.types';
|
|
3
|
-
declare const InputField: ({ type, configField, styleField, value, disabled, placeholder,
|
|
3
|
+
declare const InputField: ({ type, configField, styleField, value, disabled, placeholder, placeholderPickerSearch, maxLength, keyboardType, dataPicker, displayKey, showSearchInPicker, backgroundColor, showOptionsAmount, height, onPress, onSubmit, onChangeText, onOptionSelected, onFocus, onBlur, }: InputFieldProps) => React.JSX.Element;
|
|
4
4
|
export default InputField;
|
|
@@ -19,7 +19,7 @@ var InputField = function InputField(_ref) {
|
|
|
19
19
|
value = _ref.value,
|
|
20
20
|
disabled = _ref.disabled,
|
|
21
21
|
placeholder = _ref.placeholder,
|
|
22
|
-
|
|
22
|
+
placeholderPickerSearch = _ref.placeholderPickerSearch,
|
|
23
23
|
maxLength = _ref.maxLength,
|
|
24
24
|
keyboardType = _ref.keyboardType,
|
|
25
25
|
dataPicker = _ref.dataPicker,
|
|
@@ -248,7 +248,7 @@ var InputField = function InputField(_ref) {
|
|
|
248
248
|
filterValue: filterValue,
|
|
249
249
|
displayKey: displayKey,
|
|
250
250
|
showSearchInPicker: showSearchInPicker,
|
|
251
|
-
|
|
251
|
+
placeholderPickerSearch: placeholderPickerSearch
|
|
252
252
|
})));
|
|
253
253
|
};
|
|
254
254
|
export default InputField;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { InputOptionsProps } from '../Input.types';
|
|
3
|
-
declare const InputOptions: ({ data, onOptionSelected, showOptions, positionModal, showOptionsAmount, onClose, filterValue, onChangeFilterText, displayKey, showSearchInPicker,
|
|
3
|
+
declare const InputOptions: ({ data, onOptionSelected, showOptions, positionModal, showOptionsAmount, onClose, filterValue, onChangeFilterText, displayKey, showSearchInPicker, placeholderPickerSearch, }: InputOptionsProps) => React.JSX.Element;
|
|
4
4
|
export default InputOptions;
|
|
@@ -23,7 +23,7 @@ var InputOptions = function InputOptions(_ref) {
|
|
|
23
23
|
onChangeFilterText = _ref.onChangeFilterText,
|
|
24
24
|
displayKey = _ref.displayKey,
|
|
25
25
|
showSearchInPicker = _ref.showSearchInPicker,
|
|
26
|
-
|
|
26
|
+
placeholderPickerSearch = _ref.placeholderPickerSearch;
|
|
27
27
|
var calculatedMaxHeight = 8 + 48 * showOptionsAmount;
|
|
28
28
|
var _useState = useState(true),
|
|
29
29
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -33,7 +33,7 @@ var InputOptions = function InputOptions(_ref) {
|
|
|
33
33
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
34
34
|
showScroll = _useState4[0],
|
|
35
35
|
setShowScroll = _useState4[1];
|
|
36
|
-
var _useState5 = useState(
|
|
36
|
+
var _useState5 = useState(placeholderPickerSearch !== null && placeholderPickerSearch !== void 0 ? placeholderPickerSearch : ''),
|
|
37
37
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
38
38
|
placeholderText = _useState6[0],
|
|
39
39
|
setPlaceholderText = _useState6[1];
|
|
@@ -50,8 +50,8 @@ var InputOptions = function InputOptions(_ref) {
|
|
|
50
50
|
};
|
|
51
51
|
var handleOnBlur = function handleOnBlur() {
|
|
52
52
|
setShowSearchImg(true);
|
|
53
|
-
if (
|
|
54
|
-
setPlaceholderText(
|
|
53
|
+
if (placeholderPickerSearch) {
|
|
54
|
+
setPlaceholderText(placeholderPickerSearch);
|
|
55
55
|
}
|
|
56
56
|
};
|
|
57
57
|
var handleOnFocus = function handleOnFocus() {
|
|
@@ -62,8 +62,8 @@ var InputOptions = function InputOptions(_ref) {
|
|
|
62
62
|
};
|
|
63
63
|
var handlePressOverlay = function handlePressOverlay() {
|
|
64
64
|
onClose();
|
|
65
|
-
if (
|
|
66
|
-
setPlaceholderText(
|
|
65
|
+
if (placeholderPickerSearch) {
|
|
66
|
+
setPlaceholderText(placeholderPickerSearch);
|
|
67
67
|
}
|
|
68
68
|
setShowSearchImg(true);
|
|
69
69
|
};
|
|
@@ -104,10 +104,10 @@ var InputOptions = function InputOptions(_ref) {
|
|
|
104
104
|
setShowScroll(contentHeight > containerHeight);
|
|
105
105
|
};
|
|
106
106
|
useEffect(function () {
|
|
107
|
-
if (
|
|
108
|
-
setPlaceholderText(
|
|
107
|
+
if (placeholderPickerSearch) {
|
|
108
|
+
setPlaceholderText(placeholderPickerSearch);
|
|
109
109
|
}
|
|
110
|
-
}, [
|
|
110
|
+
}, [placeholderPickerSearch]);
|
|
111
111
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Modal, {
|
|
112
112
|
transparent: true,
|
|
113
113
|
visible: showOptions,
|