etendo-ui-library 1.3.81 → 1.3.82

package/dist-native/components/input/Input.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { InputProps } from './Input.types';
-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, language, dateFormat, showCalendar, }: InputProps) => React.JSX.Element;
+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, language, dateFormat, showCalendar, currentPage, isLoadingMoreData, onLoadMoreData, isPagination, isStopLoadMoreData, }: InputProps) => React.JSX.Element;
 export default Input;

package/dist-native/components/input/Input.js

@@ -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 _colors=require("../../styles/colors");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/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,_ref$backgroundColor=_ref.backgroundColor,backgroundColor=_ref$backgroundColor===void 0?_colors.NEUTRAL_50:_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,language=_ref.language,dateFormat=_ref.dateFormat,showCalendar=_ref.showCalendar;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:63,columnNumber:5}},_react.default.createElement(_index.InputTitle,{disabled:getDisabled(),titleLabel:titleLabel,titleImage:titleImage,styleTitle:stateStyle().titleStyle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:64,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,language:language,dateFormat:dateFormat,showCalendar:showCalendar,__self:_this,__source:{fileName:_jsxFileName,lineNumber:70,columnNumber:7}}),_react.default.createElement(_index.InputHelperText,{label:helperText,styleHelper:stateStyle().helperStyle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:97,columnNumber:7}}));};var _default=exports.default=Input;
+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 _colors=require("../../styles/colors");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/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,_ref$backgroundColor=_ref.backgroundColor,backgroundColor=_ref$backgroundColor===void 0?_colors.NEUTRAL_50:_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,language=_ref.language,dateFormat=_ref.dateFormat,showCalendar=_ref.showCalendar,currentPage=_ref.currentPage,isLoadingMoreData=_ref.isLoadingMoreData,onLoadMoreData=_ref.onLoadMoreData,isPagination=_ref.isPagination,isStopLoadMoreData=_ref.isStopLoadMoreData;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:68,columnNumber:5}},_react.default.createElement(_index.InputTitle,{disabled:getDisabled(),titleLabel:titleLabel,titleImage:titleImage,styleTitle:stateStyle().titleStyle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:69,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,language:language,dateFormat:dateFormat,showCalendar:showCalendar,currentPage:currentPage,onLoadMoreData:onLoadMoreData,isLoadingMoreData:isLoadingMoreData,isPagination:isPagination,isStopLoadMoreData:isStopLoadMoreData,__self:_this,__source:{fileName:_jsxFileName,lineNumber:75,columnNumber:7}}),_react.default.createElement(_index.InputHelperText,{label:helperText,styleHelper:stateStyle().helperStyle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:107,columnNumber:7}}));};var _default=exports.default=Input;

package/dist-native/components/input/Input.types.d.ts

@@ -68,6 +68,11 @@ export interface InputProps {
     language?: LanguageFormat;
     dateFormat?: DateFormat;
     showCalendar?: boolean;
+    isLoadingMoreData?: boolean;
+    onLoadMoreData?: (currentPage?: number, filterText?: string) => void;
+    currentPage?: number;
+    isPagination?: boolean;
+    isStopLoadMoreData?: boolean;
 }
 export interface InputTitleProps {
     titleLabel?: string;
@@ -112,6 +117,11 @@ export interface InputFieldProps {
     onBlur: (event?: NativeSyntheticEvent<TextInputFocusEventData>) => void;
     dateFormat?: any;
     showCalendar?: boolean;
+    isLoadingMoreData?: boolean;
+    onLoadMoreData?: (currentPage?: number, filterText?: string) => void;
+    currentPage?: number;
+    isPagination?: boolean;
+    isStopLoadMoreData?: boolean;
 }
 export interface InputHelperProps {
     styleHelper: TextStyle | TextStyle[];
@@ -137,4 +147,9 @@ export interface InputOptionsProps {
     placeholderPickerSearch?: string;
     optionsTop: boolean;
     dataPicker: any;
+    isLoadingMoreData?: boolean;
+    onLoadMoreData?: (currentPage?: number, filterText?: string) => void;
+    currentPage?: number;
+    isPagination?: boolean;
+    isStopLoadMoreData?: boolean;
 }

package/dist-native/components/input/components/InputField.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { InputFieldProps } from '../Input.types';
-declare const InputField: ({ type, configField, styleField, value, disabled, placeholder, placeholderPickerSearch, maxLength, keyboardType, dataPicker, displayKey, showSearchInPicker, backgroundColor, showOptionsAmount, height, onPress, onSubmit, onChangeText, onOptionSelected, onFocus, onBlur, language, dateFormat, showCalendar, }: InputFieldProps) => React.JSX.Element;
+declare const InputField: ({ type, configField, styleField, value, disabled, placeholder, placeholderPickerSearch, maxLength, keyboardType, dataPicker, displayKey, showSearchInPicker, backgroundColor, showOptionsAmount, height, onPress, onSubmit, onChangeText, onOptionSelected, onFocus, onBlur, language, dateFormat, showCalendar, isLoadingMoreData, onLoadMoreData, currentPage, isPagination, isStopLoadMoreData, }: InputFieldProps) => React.JSX.Element;
 export default InputField;

package/dist-native/components/input/components/InputField.js

@@ -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 _Input2=require("../Input.types");var _ShowPasswordIcon=require("../../../assets/images/icons/ShowPasswordIcon");var _HidePasswordIcon=require("../../../assets/images/icons/HidePasswordIcon");var _InputOptions=_interopRequireDefault(require("./InputOptions"));var _DatePicker=_interopRequireDefault(require("../../datepicker/DatePicker"));var _colors=require("../../../styles/colors");var _table_utils=require("../../../helpers/table_utils");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/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,showOptionsAmount=_ref.showOptionsAmount,_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,language=_ref.language,dateFormat=_ref.dateFormat,showCalendar=_ref.showCalendar;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)(false),_useState12=(0,_slicedToArray2.default)(_useState11,2),optionsTop=_useState12[0],setOptionsTop=_useState12[1];var _useState13=(0,_react.useState)({top:0,left:0,width:0,height:0}),_useState14=(0,_slicedToArray2.default)(_useState13,2),positionModal=_useState14[0],setPositionModal=_useState14[1];var windowHeight=_reactNative.Dimensions.get('window').height;var refComponent=(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(){setDataOptionsFilter(dataPicker);if(showOptions){getTopLeft();}},[dataPicker]);var getTopLeft=function getTopLeft(){if(refComponent.current){refComponent.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 optionsHeight=_Input.styles.optionContainer.height+_Input.styles.optionContainer.marginTop+showFilterHeight+_Input.styles.optionContainer.marginTop+_Input.styles.optionsContainer.borderWidth*2;var topPosition,bottomPosition;if(optionsHeight+calcDropdownTopLeft+_Input.styles.offSet.height>windowHeight){topPosition=pageY-optionsHeight;setOptionsTop(true);}else{topPosition=calcDropdownTopLeft;setOptionsTop(false);}bottomPosition=windowHeight-(topPosition+optionsHeight);setPositionModal({top:topPosition,bottom:bottomPosition,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===_Input2.InputFieldVariant.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:209,columnNumber:9}});}return _react.default.cloneElement(image,{fill:fillValue});};var handlePressImage=function handlePressImage(){if(type===_Input2.InputFieldVariant.TextInputPassword){setShowPassword(function(prevState){return!prevState;});}else{onSubmit==null?void 0:onSubmit();}};var handleOnPress=function handleOnPress(event){if(type===_Input2.InputFieldVariant.Picker){getTopLeft();setShowOptions(true);}if(onPress){onPress(event);}};var getText=function getText(){if(value){return value;}return placeholder;};var isAreaDisabled=function isAreaDisabled(){return disabled||configField.disabledSubmit||!onSubmit&&type!==_Input2.InputFieldVariant.TextInputPassword;};return configField!=null&&configField.isDatePicker?_react.default.createElement(_DatePicker.default,{dateFormat:dateFormat,language:language,styleField:styleField,onChangeText:onChangeText,value:value,showCalendar:showCalendar,disabled:disabled,backgroundColor:backgroundColor,__self:_this,__source:{fileName:_jsxFileName,lineNumber:249,columnNumber:5}}):_react.default.createElement(_reactNative.View,{style:[styleField.focus,getFocusStyle()],__self:_this,__source:{fileName:_jsxFileName,lineNumber:260,columnNumber:5}},_react.default.createElement(_reactNative.TouchableOpacity,{ref:refComponent,style:[styleField.field,removePaddingField(),{backgroundColor:backgroundColor},{height:height}],disabled:disabled||configField.disabledField,onPress:handleOnPress,__self:_this,__source:{fileName:_jsxFileName,lineNumber:261,columnNumber:7}},(configField==null?void 0:configField.type)===_Input2.InputFieldVariant.TextInput&&_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===_Input2.InputFieldVariant.TextInputPassword&&showPassword,onSubmitEditing:function onSubmitEditing(){return onSubmit==null?void 0:onSubmit();},__self:_this,__source:{fileName:_jsxFileName,lineNumber:272,columnNumber:11}}),(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:291,columnNumber:11}},getText()),(configField==null?void 0:configField.image)&&_react.default.createElement(_reactNative.TouchableOpacity,{onPress:handlePressImage,style:_Input.styles.buttonContainerInputField,disabled:isAreaDisabled(),__self:_this,__source:{fileName:_jsxFileName,lineNumber:299,columnNumber:11}},getImage(configField.image)),_react.default.createElement(_InputOptions.default,{optionsTop:optionsTop,showOptionsAmount:showOptionsAmount,onOptionSelected:onOptionSelected,showOptions:showOptions,positionModal:positionModal,data:dataOptionsFilter,onClose:handleOnClose,onChangeFilterText:handleOnChangeFilterText,filterValue:filterValue,displayKey:displayKey,showSearchInPicker:showSearchInPicker,placeholderPickerSearch:placeholderPickerSearch,dataPicker:dataPicker,__self:_this,__source:{fileName:_jsxFileName,lineNumber:306,columnNumber:9}})));};var _default=exports.default=InputField;
+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 _Input2=require("../Input.types");var _ShowPasswordIcon=require("../../../assets/images/icons/ShowPasswordIcon");var _HidePasswordIcon=require("../../../assets/images/icons/HidePasswordIcon");var _InputOptions=_interopRequireDefault(require("./InputOptions"));var _DatePicker=_interopRequireDefault(require("../../datepicker/DatePicker"));var _colors=require("../../../styles/colors");var _table_utils=require("../../../helpers/table_utils");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/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,showOptionsAmount=_ref.showOptionsAmount,_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,language=_ref.language,dateFormat=_ref.dateFormat,showCalendar=_ref.showCalendar,isLoadingMoreData=_ref.isLoadingMoreData,onLoadMoreData=_ref.onLoadMoreData,currentPage=_ref.currentPage,isPagination=_ref.isPagination,isStopLoadMoreData=_ref.isStopLoadMoreData;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)(false),_useState12=(0,_slicedToArray2.default)(_useState11,2),optionsTop=_useState12[0],setOptionsTop=_useState12[1];var _useState13=(0,_react.useState)({top:0,left:0,width:0,height:0}),_useState14=(0,_slicedToArray2.default)(_useState13,2),positionModal=_useState14[0],setPositionModal=_useState14[1];var windowHeight=_reactNative.Dimensions.get('window').height;var refComponent=(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(){setDataOptionsFilter(dataPicker);if(showOptions){getTopLeft();}},[dataPicker]);var getTopLeft=function getTopLeft(){if(refComponent.current){refComponent.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 optionsHeight=_Input.styles.optionContainer.height+_Input.styles.optionContainer.marginTop+showFilterHeight+_Input.styles.optionContainer.marginTop+_Input.styles.optionsContainer.borderWidth*2;var topPosition,bottomPosition;if(optionsHeight+calcDropdownTopLeft+_Input.styles.offSet.height>windowHeight){topPosition=pageY-optionsHeight;setOptionsTop(true);}else{topPosition=calcDropdownTopLeft;setOptionsTop(false);}bottomPosition=windowHeight-(topPosition+optionsHeight);setPositionModal({top:topPosition,bottom:bottomPosition,left:pageX,width:width,height:height});});}};var handleOnChangeFilterText=function handleOnChangeFilterText(filterText){setFilterValue(filterText||'');if(displayKey){if(isPagination&&onLoadMoreData){onLoadMoreData(0,filterText);return;}var lowerCaseFilterText=(filterText==null?void 0:filterText.toLocaleLowerCase())||'';setDataOptionsFilter(dataPicker.filter(function(item){return item[displayKey].toLocaleLowerCase().includes(lowerCaseFilterText);}));}};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===_Input2.InputFieldVariant.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:221,columnNumber:9}});}return _react.default.cloneElement(image,{fill:fillValue});};var handlePressImage=function handlePressImage(){if(type===_Input2.InputFieldVariant.TextInputPassword){setShowPassword(function(prevState){return!prevState;});}else{onSubmit==null?void 0:onSubmit();}};var handleOnPress=function handleOnPress(event){if(type===_Input2.InputFieldVariant.Picker){getTopLeft();setShowOptions(true);}if(onPress){onPress(event);}};var getText=function getText(){if(value){return value;}return placeholder;};var isAreaDisabled=function isAreaDisabled(){return disabled||configField.disabledSubmit||!onSubmit&&type!==_Input2.InputFieldVariant.TextInputPassword;};return configField!=null&&configField.isDatePicker?_react.default.createElement(_DatePicker.default,{dateFormat:dateFormat,language:language,styleField:styleField,onChangeText:onChangeText,value:value,showCalendar:showCalendar,disabled:disabled,backgroundColor:backgroundColor,__self:_this,__source:{fileName:_jsxFileName,lineNumber:261,columnNumber:5}}):_react.default.createElement(_reactNative.View,{style:[styleField.focus,getFocusStyle()],__self:_this,__source:{fileName:_jsxFileName,lineNumber:272,columnNumber:5}},_react.default.createElement(_reactNative.TouchableOpacity,{ref:refComponent,style:[styleField.field,removePaddingField(),{backgroundColor:backgroundColor},{height:height}],disabled:disabled||configField.disabledField,onPress:handleOnPress,__self:_this,__source:{fileName:_jsxFileName,lineNumber:273,columnNumber:7}},(configField==null?void 0:configField.type)===_Input2.InputFieldVariant.TextInput&&_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===_Input2.InputFieldVariant.TextInputPassword&&showPassword,onSubmitEditing:function onSubmitEditing(){return onSubmit==null?void 0:onSubmit();},__self:_this,__source:{fileName:_jsxFileName,lineNumber:284,columnNumber:11}}),(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:303,columnNumber:11}},getText()),(configField==null?void 0:configField.image)&&_react.default.createElement(_reactNative.TouchableOpacity,{onPress:handlePressImage,style:_Input.styles.buttonContainerInputField,disabled:isAreaDisabled(),__self:_this,__source:{fileName:_jsxFileName,lineNumber:311,columnNumber:11}},getImage(configField.image)),_react.default.createElement(_InputOptions.default,{optionsTop:optionsTop,showOptionsAmount:showOptionsAmount,onOptionSelected:onOptionSelected,showOptions:showOptions,positionModal:positionModal,data:dataOptionsFilter,onClose:handleOnClose,onChangeFilterText:handleOnChangeFilterText,filterValue:filterValue,displayKey:displayKey,showSearchInPicker:showSearchInPicker,placeholderPickerSearch:placeholderPickerSearch,dataPicker:dataPicker,onLoadMoreData:onLoadMoreData,isLoadingMoreData:isLoadingMoreData,currentPage:currentPage,isPagination:isPagination,isStopLoadMoreData:isStopLoadMoreData,__self:_this,__source:{fileName:_jsxFileName,lineNumber:318,columnNumber:9}})));};var _default=exports.default=InputField;

package/dist-native/components/input/components/InputOptions.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { InputOptionsProps } from '../Input.types';
-declare const InputOptions: ({ data, onOptionSelected, showOptions, positionModal, showOptionsAmount, onClose, filterValue, onChangeFilterText, displayKey, showSearchInPicker, placeholderPickerSearch, optionsTop, }: InputOptionsProps) => React.JSX.Element;
+declare const InputOptions: ({ data, onOptionSelected, showOptions, positionModal, showOptionsAmount, onClose, filterValue, onChangeFilterText, displayKey, showSearchInPicker, placeholderPickerSearch, optionsTop, isLoadingMoreData, onLoadMoreData, currentPage, isPagination, isStopLoadMoreData, }: InputOptionsProps) => React.JSX.Element;
 export default InputOptions;

package/dist-native/components/input/components/InputOptions.js

@@ -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/agent/workspace/etendo_ui_library_develop/etendo_ui_library/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,showOptionsAmount=_ref.showOptionsAmount,onClose=_ref.onClose,filterValue=_ref.filterValue,onChangeFilterText=_ref.onChangeFilterText,displayKey=_ref.displayKey,showSearchInPicker=_ref.showSearchInPicker,placeholderPickerSearch=_ref.placeholderPickerSearch,optionsTop=_ref.optionsTop;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 useKeyboard=function useKeyboard(){var _useState9=(0,_react.useState)(0),_useState10=(0,_slicedToArray2.default)(_useState9,2),keyboardHeight=_useState10[0],setKeyboardHeight=_useState10[1];(0,_react.useEffect)(function(){function onKeyboardDidShow(event){setKeyboardHeight(event.endCoordinates.height);}function onKeyboardDidHide(){setKeyboardHeight(0);}var showSubscription=_reactNative.Keyboard.addListener('keyboardDidShow',onKeyboardDidShow);var hideSubscription=_reactNative.Keyboard.addListener('keyboardDidHide',onKeyboardDidHide);return function(){showSubscription.remove();hideSubscription.remove();};},[]);return keyboardHeight;};var screenHeight=_reactNative.Dimensions.get('screen').height-useKeyboard();var calculatedMaxHeight=showOptionsAmount?8+48*showOptionsAmount:screenHeight;var onContentSizeChange=function onContentSizeChange(contentWidth,contentHeight){var containerHeight=calculatedMaxHeight;setShowScroll(contentHeight>containerHeight);};(0,_react.useEffect)(function(){if(placeholderPickerSearch){setPlaceholderText(placeholderPickerSearch);}},[placeholderPickerSearch]);var keyboardHeight=useKeyboard();var bottomValue=positionModal.bottom||0;var heightValue=positionModal.height||0;var bottomDevices=function bottomDevices(){if(_reactNative.Platform.OS==='web'){return bottomValue;}else if(keyboardHeight!==0){return 0;}else{return bottomValue-heightValue*2-keyboardHeight;}};return _react.default.createElement(_reactNative.Modal,{transparent:true,visible:showOptions,animationType:"fade",__self:_this,__source:{fileName:_jsxFileName,lineNumber:158,columnNumber:5}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_Input.styles.optionOverlay,onPress:handlePressOverlay,activeOpacity:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:159,columnNumber:7}}),optionsTop?_react.default.createElement(_reactNative.View,{style:[_Input.styles.optionsContainer,{width:positionModal.width,left:positionModal.left,bottom:bottomDevices(),top:keyboardHeight!==0||!showOptionsAmount?0:undefined}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:165,columnNumber:9}},_react.default.createElement(_reactNative.ScrollView,{style:[showScroll&&{marginRight:8},{maxHeight:calculatedMaxHeight},_Input.styles.scrollOptions],keyboardShouldPersistTaps:"always",persistentScrollbar:true,showsVerticalScrollIndicator:true,indicatorStyle:'black',onContentSizeChange:onContentSizeChange,__self:_this,__source:{fileName:_jsxFileName,lineNumber:175,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:188,columnNumber:17}},displayKey&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:_Input.styles.optionText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:210,columnNumber:21}},item[displayKey]));})),showSearchInPicker&&_react.default.createElement(_reactNative.Pressable,{onPress:handleOnFocus,style:[_Input.styles.optionTopFilterContainer,removePadding(!filterValue&&showSearchImg)],__self:_this,__source:{fileName:_jsxFileName,lineNumber:222,columnNumber:13}},filterValue===''&&showSearchImg&&_react.default.createElement(_reactNative.View,{style:_Input.styles.searchContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:229,columnNumber:17}},_react.default.createElement(_SearchIcon.SearchIcon,{style:_Input.styles.optionFilterImg,fill:_colors.NEUTRAL_600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:230,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:236,columnNumber:15}}),filterValue!==''&&_react.default.createElement(_reactNative.TouchableOpacity,{style:_Input.styles.cancelContainer,onPress:handleCancelFilter,__self:_this,__source:{fileName:_jsxFileName,lineNumber:251,columnNumber:17}},_react.default.createElement(_CancelIcon.CancelIcon,{style:_Input.styles.cancelFilterImg,__self:_this,__source:{fileName:_jsxFileName,lineNumber:254,columnNumber:19}})))):_react.default.createElement(_reactNative.View,{style:[_Input.styles.optionsContainer,{width:positionModal.width,left:positionModal.left,top:positionModal.top}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:261,columnNumber:9}},showSearchInPicker&&_react.default.createElement(_reactNative.Pressable,{onPress:handleOnFocus,style:[_Input.styles.optionFilterContainer,removePadding(!filterValue&&showSearchImg)],__self:_this,__source:{fileName:_jsxFileName,lineNumber:271,columnNumber:13}},filterValue===''&&showSearchImg&&_react.default.createElement(_reactNative.View,{style:_Input.styles.searchContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:278,columnNumber:17}},_react.default.createElement(_SearchIcon.SearchIcon,{style:_Input.styles.optionFilterImg,fill:_colors.NEUTRAL_600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:279,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:285,columnNumber:15}}),filterValue!==''&&_react.default.createElement(_reactNative.TouchableOpacity,{style:_Input.styles.cancelContainer,onPress:handleCancelFilter,__self:_this,__source:{fileName:_jsxFileName,lineNumber:300,columnNumber:17}},_react.default.createElement(_CancelIcon.CancelIcon,{style:_Input.styles.cancelFilterImg,__self:_this,__source:{fileName:_jsxFileName,lineNumber:303,columnNumber:19}}))),_react.default.createElement(_reactNative.ScrollView,{style:[showScroll&&{marginRight:8},{maxHeight:calculatedMaxHeight},_Input.styles.scrollOptions],keyboardShouldPersistTaps:"always",persistentScrollbar:true,showsVerticalScrollIndicator:true,indicatorStyle:'black',onContentSizeChange:onContentSizeChange,__self:_this,__source:{fileName:_jsxFileName,lineNumber:308,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:321,columnNumber:17}},displayKey&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:_Input.styles.optionText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:343,columnNumber:21}},item[displayKey]));}))));};var _default=exports.default=InputOptions;
+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/agent/workspace/etendo_ui_library_develop/etendo_ui_library/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,showOptionsAmount=_ref.showOptionsAmount,onClose=_ref.onClose,filterValue=_ref.filterValue,onChangeFilterText=_ref.onChangeFilterText,displayKey=_ref.displayKey,showSearchInPicker=_ref.showSearchInPicker,placeholderPickerSearch=_ref.placeholderPickerSearch,optionsTop=_ref.optionsTop,isLoadingMoreData=_ref.isLoadingMoreData,onLoadMoreData=_ref.onLoadMoreData,currentPage=_ref.currentPage,isPagination=_ref.isPagination,isStopLoadMoreData=_ref.isStopLoadMoreData;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)(0),_useState6=(0,_slicedToArray2.default)(_useState5,2),startIndex=_useState6[0],setStartIndex=_useState6[1];var _useState7=(0,_react.useState)(''),_useState8=(0,_slicedToArray2.default)(_useState7,2),filterInputValue=_useState8[0],setFilterInputValue=_useState8[1];var _useState9=(0,_react.useState)(placeholderPickerSearch!=null?placeholderPickerSearch:''),_useState10=(0,_slicedToArray2.default)(_useState9,2),placeholderText=_useState10[0],setPlaceholderText=_useState10[1];var _useState11=(0,_react.useState)(-1),_useState12=(0,_slicedToArray2.default)(_useState11,2),indexHover=_useState12[0],setIndexHover=_useState12[1];var textInputRef=(0,_react.useRef)(null);var scrollViewRef=(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(){setFilterInputValue('');onChangeFilterText('');};var useKeyboard=function useKeyboard(){var _useState13=(0,_react.useState)(0),_useState14=(0,_slicedToArray2.default)(_useState13,2),keyboardHeight=_useState14[0],setKeyboardHeight=_useState14[1];(0,_react.useEffect)(function(){function onKeyboardDidShow(event){setKeyboardHeight(event.endCoordinates.height);}function onKeyboardDidHide(){setKeyboardHeight(0);}var showSubscription=_reactNative.Keyboard.addListener('keyboardDidShow',onKeyboardDidShow);var hideSubscription=_reactNative.Keyboard.addListener('keyboardDidHide',onKeyboardDidHide);return function(){showSubscription.remove();hideSubscription.remove();};},[]);return keyboardHeight;};var screenHeight=_reactNative.Dimensions.get('screen').height-useKeyboard();var calculatedMaxHeight=showOptionsAmount?8+48*showOptionsAmount:screenHeight;var onContentSizeChange=function onContentSizeChange(contentWidth,contentHeight){var containerHeight=calculatedMaxHeight;if(showOptionsAmount&&contentHeight>containerHeight&&data.length>showOptionsAmount){setStartIndex((startIndex+1)%data.length);}setShowScroll(contentHeight>containerHeight);};var keyboardHeight=useKeyboard();var bottomValue=positionModal.bottom||0;var heightValue=positionModal.height||0;var bottomDevices=function bottomDevices(){if(_reactNative.Platform.OS==='web'){return bottomValue;}else if(keyboardHeight!==0){return 0;}else{return bottomValue-heightValue*2-keyboardHeight;}};var loadMoreData=function loadMoreData(){if(onLoadMoreData&&!isStopLoadMoreData&&!isLoadingMoreData&&(currentPage||currentPage===0)&&isPagination){if(scrollViewRef.current)scrollViewRef.current.scrollToEnd({animated:true});onLoadMoreData(currentPage+1,filterValue);}};var debounce=function debounce(func,delay){var inDebounce;return function(){for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}var context=this;clearTimeout(inDebounce);inDebounce=setTimeout(function(){return func.apply(context,args);},delay);};};var debounceOnChange=(0,_react.useRef)(debounce(function(nextValue){if(scrollViewRef.current)scrollViewRef.current.scrollTo({y:0,animated:false});onChangeFilterText(nextValue);},500)).current;var onChangeText=(0,_react.useCallback)(function(text){setFilterInputValue(text);debounceOnChange(text);},[debounceOnChange]);return _react.default.createElement(_reactNative.Modal,{transparent:true,visible:showOptions,animationType:"fade",__self:_this,__source:{fileName:_jsxFileName,lineNumber:223,columnNumber:5}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_Input.styles.optionOverlay,onPress:handlePressOverlay,activeOpacity:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:224,columnNumber:7}}),optionsTop?_react.default.createElement(_reactNative.View,{style:[_Input.styles.optionsContainer,{width:positionModal.width,left:positionModal.left,bottom:bottomDevices(),top:keyboardHeight!==0||!showOptionsAmount?0:undefined}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:230,columnNumber:9}},_react.default.createElement(_reactNative.ScrollView,{style:[showScroll&&{marginRight:8},{maxHeight:calculatedMaxHeight},_Input.styles.scrollOptions],keyboardShouldPersistTaps:"always",persistentScrollbar:true,showsVerticalScrollIndicator:true,indicatorStyle:'black',onContentSizeChange:onContentSizeChange,__self:_this,__source:{fileName:_jsxFileName,lineNumber:240,columnNumber:11}},data==null?void 0:data.map(function(item,index){var actualIndex=(startIndex+index)%data.length;return _react.default.createElement(_reactNative.Pressable,{onHoverIn:function onHoverIn(){setIndexHover(actualIndex);},onHoverOut:function onHoverOut(){setIndexHover(-1);},onPressIn:function onPressIn(){setIndexHover(actualIndex);},onPressOut:function onPressOut(){setIndexHover(-1);},key:actualIndex,style:[_Input.styles.optionContainer,0===index&&{marginTop:0},getBackground(actualIndex),addRadius(index===(data==null?void 0:data.length)-1)],onPress:function onPress(){return handleOptionSelected(item,actualIndex);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:254,columnNumber:17}},displayKey&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:_Input.styles.optionText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:276,columnNumber:21}},item[displayKey]));})),showSearchInPicker&&_react.default.createElement(_reactNative.Pressable,{onPress:handleOnFocus,style:[_Input.styles.optionTopFilterContainer,removePadding(!filterValue&&showSearchImg)],__self:_this,__source:{fileName:_jsxFileName,lineNumber:288,columnNumber:13}},filterValue===''&&showSearchImg&&_react.default.createElement(_reactNative.View,{style:_Input.styles.searchContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:295,columnNumber:17}},_react.default.createElement(_SearchIcon.SearchIcon,{style:_Input.styles.optionFilterImg,fill:_colors.NEUTRAL_600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:296,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:302,columnNumber:15}}),filterValue!==''&&_react.default.createElement(_reactNative.TouchableOpacity,{style:_Input.styles.cancelContainer,onPress:handleCancelFilter,__self:_this,__source:{fileName:_jsxFileName,lineNumber:317,columnNumber:17}},_react.default.createElement(_CancelIcon.CancelIcon,{style:_Input.styles.cancelFilterImg,__self:_this,__source:{fileName:_jsxFileName,lineNumber:320,columnNumber:19}})))):_react.default.createElement(_reactNative.View,{style:[_Input.styles.optionsContainer,{width:positionModal.width,left:positionModal.left,top:positionModal.top}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:327,columnNumber:9}},showSearchInPicker&&_react.default.createElement(_reactNative.Pressable,{onPress:handleOnFocus,style:[_Input.styles.optionFilterContainer,removePadding(!filterValue&&showSearchImg)],__self:_this,__source:{fileName:_jsxFileName,lineNumber:337,columnNumber:13}},filterInputValue===''&&showSearchImg&&_react.default.createElement(_reactNative.View,{style:_Input.styles.searchContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:344,columnNumber:17}},_react.default.createElement(_SearchIcon.SearchIcon,{style:_Input.styles.optionFilterImg,fill:_colors.NEUTRAL_600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:345,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:filterInputValue,onChangeText:onChangeText,placeholder:placeholderText,placeholderTextColor:_colors.NEUTRAL_600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:351,columnNumber:15}}),isLoadingMoreData&&_react.default.createElement(_reactNative.TouchableOpacity,{style:{marginRight:12},onPress:handleCancelFilter,__self:_this,__source:{fileName:_jsxFileName,lineNumber:366,columnNumber:17}},_react.default.createElement(_reactNative.ActivityIndicator,{size:'small',color:_colors.PRIMARY_100,style:[_Input.styles.cancelFilterImg],__self:_this,__source:{fileName:_jsxFileName,lineNumber:369,columnNumber:19}})),filterInputValue!==''&&_react.default.createElement(_reactNative.TouchableOpacity,{style:_Input.styles.cancelContainer,onPress:handleCancelFilter,__self:_this,__source:{fileName:_jsxFileName,lineNumber:377,columnNumber:17}},_react.default.createElement(_CancelIcon.CancelIcon,{style:_Input.styles.cancelFilterImg,__self:_this,__source:{fileName:_jsxFileName,lineNumber:380,columnNumber:19}}))),_react.default.createElement(_reactNative.ScrollView,{ref:scrollViewRef,style:[showScroll&&{marginRight:8},{maxHeight:calculatedMaxHeight},_Input.styles.scrollOptions],keyboardShouldPersistTaps:"always",persistentScrollbar:true,showsVerticalScrollIndicator:true,indicatorStyle:'black',onContentSizeChange:onContentSizeChange,onScroll:function onScroll(_ref2){var nativeEvent=_ref2.nativeEvent;var isCloseToBottom=nativeEvent.layoutMeasurement.height+nativeEvent.contentOffset.y>=nativeEvent.contentSize.height-50;if(isCloseToBottom){loadMoreData();}},__self:_this,__source:{fileName:_jsxFileName,lineNumber:386,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:409,columnNumber:17}},displayKey&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:_Input.styles.optionText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:431,columnNumber:21}},item[displayKey]));}),isLoadingMoreData&&_react.default.createElement(_reactNative.ActivityIndicator,{size:'large',color:_colors.PRIMARY_100,__self:_this,__source:{fileName:_jsxFileName,lineNumber:442,columnNumber:15}}))));};var _default=exports.default=InputOptions;

package/dist-web/components/input/Input.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { InputProps } from './Input.types';
-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, language, dateFormat, showCalendar, }: InputProps) => React.JSX.Element;
+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, language, dateFormat, showCalendar, currentPage, isLoadingMoreData, onLoadMoreData, isPagination, isStopLoadMoreData, }: InputProps) => React.JSX.Element;
 export default Input;

package/dist-web/components/input/Input.js

@@ -34,7 +34,12 @@ var Input = function Input(_ref) {
     isError = _ref.isError,
     language = _ref.language,
     dateFormat = _ref.dateFormat,
-    showCalendar = _ref.showCalendar;
+    showCalendar = _ref.showCalendar,
+    currentPage = _ref.currentPage,
+    isLoadingMoreData = _ref.isLoadingMoreData,
+    onLoadMoreData = _ref.onLoadMoreData,
+    isPagination = _ref.isPagination,
+    isStopLoadMoreData = _ref.isStopLoadMoreData;
   var stateStyle = function stateStyle() {
     if (typeField === 'readOnly') {
       return inputStyleVariants.readOnly;
@@ -88,7 +93,12 @@ var Input = function Input(_ref) {
     height: height,
     language: language,
     dateFormat: dateFormat,
-    showCalendar: showCalendar
+    showCalendar: showCalendar,
+    currentPage: currentPage,
+    onLoadMoreData: onLoadMoreData,
+    isLoadingMoreData: isLoadingMoreData,
+    isPagination: isPagination,
+    isStopLoadMoreData: isStopLoadMoreData
   }), /*#__PURE__*/React.createElement(InputHelperText, {
     label: helperText,
     styleHelper: stateStyle().helperStyle

package/dist-web/components/input/Input.types.d.ts

@@ -68,6 +68,11 @@ export interface InputProps {
     language?: LanguageFormat;
     dateFormat?: DateFormat;
     showCalendar?: boolean;
+    isLoadingMoreData?: boolean;
+    onLoadMoreData?: (currentPage?: number, filterText?: string) => void;
+    currentPage?: number;
+    isPagination?: boolean;
+    isStopLoadMoreData?: boolean;
 }
 export interface InputTitleProps {
     titleLabel?: string;
@@ -112,6 +117,11 @@ export interface InputFieldProps {
     onBlur: (event?: NativeSyntheticEvent<TextInputFocusEventData>) => void;
     dateFormat?: any;
     showCalendar?: boolean;
+    isLoadingMoreData?: boolean;
+    onLoadMoreData?: (currentPage?: number, filterText?: string) => void;
+    currentPage?: number;
+    isPagination?: boolean;
+    isStopLoadMoreData?: boolean;
 }
 export interface InputHelperProps {
     styleHelper: TextStyle | TextStyle[];
@@ -137,4 +147,9 @@ export interface InputOptionsProps {
     placeholderPickerSearch?: string;
     optionsTop: boolean;
     dataPicker: any;
+    isLoadingMoreData?: boolean;
+    onLoadMoreData?: (currentPage?: number, filterText?: string) => void;
+    currentPage?: number;
+    isPagination?: boolean;
+    isStopLoadMoreData?: boolean;
 }

package/dist-web/components/input/components/InputField.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { InputFieldProps } from '../Input.types';
-declare const InputField: ({ type, configField, styleField, value, disabled, placeholder, placeholderPickerSearch, maxLength, keyboardType, dataPicker, displayKey, showSearchInPicker, backgroundColor, showOptionsAmount, height, onPress, onSubmit, onChangeText, onOptionSelected, onFocus, onBlur, language, dateFormat, showCalendar, }: InputFieldProps) => React.JSX.Element;
+declare const InputField: ({ type, configField, styleField, value, disabled, placeholder, placeholderPickerSearch, maxLength, keyboardType, dataPicker, displayKey, showSearchInPicker, backgroundColor, showOptionsAmount, height, onPress, onSubmit, onChangeText, onOptionSelected, onFocus, onBlur, language, dateFormat, showCalendar, isLoadingMoreData, onLoadMoreData, currentPage, isPagination, isStopLoadMoreData, }: InputFieldProps) => React.JSX.Element;
 export default InputField;

package/dist-web/components/input/components/InputField.js

@@ -40,7 +40,12 @@ var InputField = function InputField(_ref) {
     onBlur = _ref.onBlur,
     language = _ref.language,
     dateFormat = _ref.dateFormat,
-    showCalendar = _ref.showCalendar;
+    showCalendar = _ref.showCalendar,
+    isLoadingMoreData = _ref.isLoadingMoreData,
+    onLoadMoreData = _ref.onLoadMoreData,
+    currentPage = _ref.currentPage,
+    isPagination = _ref.isPagination,
+    isStopLoadMoreData = _ref.isStopLoadMoreData;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isFocus = _useState2[0],
@@ -118,10 +123,17 @@ var InputField = function InputField(_ref) {
     }
   };
   var handleOnChangeFilterText = function handleOnChangeFilterText(filterText) {
-    setFilterValue(filterText);
-    if (displayKey) setDataOptionsFilter(dataPicker.filter(function (item) {
-      return item[displayKey].toLocaleLowerCase().includes(filterText.toLocaleLowerCase());
-    }));
+    setFilterValue(filterText || '');
+    if (displayKey) {
+      if (isPagination && onLoadMoreData) {
+        onLoadMoreData(0, filterText);
+        return;
+      }
+      var lowerCaseFilterText = (filterText === null || filterText === void 0 ? void 0 : filterText.toLocaleLowerCase()) || '';
+      setDataOptionsFilter(dataPicker.filter(function (item) {
+        return item[displayKey].toLocaleLowerCase().includes(lowerCaseFilterText);
+      }));
+    }
   };
   var handleOnClose = function handleOnClose() {
     setShowOptions(false);
@@ -268,7 +280,12 @@ var InputField = function InputField(_ref) {
     displayKey: displayKey,
     showSearchInPicker: showSearchInPicker,
     placeholderPickerSearch: placeholderPickerSearch,
-    dataPicker: dataPicker
+    dataPicker: dataPicker,
+    onLoadMoreData: onLoadMoreData,
+    isLoadingMoreData: isLoadingMoreData,
+    currentPage: currentPage,
+    isPagination: isPagination,
+    isStopLoadMoreData: isStopLoadMoreData
   })));
 };
 export default InputField;

package/dist-web/components/input/components/InputOptions.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { InputOptionsProps } from '../Input.types';
-declare const InputOptions: ({ data, onOptionSelected, showOptions, positionModal, showOptionsAmount, onClose, filterValue, onChangeFilterText, displayKey, showSearchInPicker, placeholderPickerSearch, optionsTop, }: InputOptionsProps) => React.JSX.Element;
+declare const InputOptions: ({ data, onOptionSelected, showOptions, positionModal, showOptionsAmount, onClose, filterValue, onChangeFilterText, displayKey, showSearchInPicker, placeholderPickerSearch, optionsTop, isLoadingMoreData, onLoadMoreData, currentPage, isPagination, isStopLoadMoreData, }: InputOptionsProps) => React.JSX.Element;
 export default InputOptions;

package/dist-web/components/input/components/InputOptions.js

@@ -4,11 +4,11 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { Modal, Pressable, ScrollView, Text, TextInput, TouchableOpacity, View, Platform, Keyboard, Dimensions } from "react-native-web";
-import React, { useEffect, useRef, useState } from 'react';
+import { Modal, Pressable, ScrollView, Text, TextInput, TouchableOpacity, View, Platform, Keyboard, Dimensions, ActivityIndicator } from "react-native-web";
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { styles } from "../Input.style";
 import { SearchIcon } from "../../../assets/images/icons/SearchIcon";
-import { NEUTRAL_600, QUATERNARY_10 } from "../../../styles/colors";
+import { NEUTRAL_600, PRIMARY_100, QUATERNARY_10 } from "../../../styles/colors";
 import { CancelIcon } from "../../../assets/images/icons/CancelIcon";
 import { disableOutline } from "../../../helpers/table_utils";
 var InputOptions = function InputOptions(_ref) {
@@ -23,7 +23,12 @@ var InputOptions = function InputOptions(_ref) {
     displayKey = _ref.displayKey,
     showSearchInPicker = _ref.showSearchInPicker,
     placeholderPickerSearch = _ref.placeholderPickerSearch,
-    optionsTop = _ref.optionsTop;
+    optionsTop = _ref.optionsTop,
+    isLoadingMoreData = _ref.isLoadingMoreData,
+    onLoadMoreData = _ref.onLoadMoreData,
+    currentPage = _ref.currentPage,
+    isPagination = _ref.isPagination,
+    isStopLoadMoreData = _ref.isStopLoadMoreData;
   var _useState = useState(true),
     _useState2 = _slicedToArray(_useState, 2),
     showSearchImg = _useState2[0],
@@ -32,15 +37,24 @@ var InputOptions = function InputOptions(_ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     showScroll = _useState4[0],
     setShowScroll = _useState4[1];
-  var _useState5 = useState(placeholderPickerSearch !== null && placeholderPickerSearch !== void 0 ? placeholderPickerSearch : ''),
+  var _useState5 = useState(0),
     _useState6 = _slicedToArray(_useState5, 2),
-    placeholderText = _useState6[0],
-    setPlaceholderText = _useState6[1];
-  var _useState7 = useState(-1),
+    startIndex = _useState6[0],
+    setStartIndex = _useState6[1];
+  var _useState7 = useState(''),
     _useState8 = _slicedToArray(_useState7, 2),
-    indexHover = _useState8[0],
-    setIndexHover = _useState8[1];
+    filterInputValue = _useState8[0],
+    setFilterInputValue = _useState8[1];
+  var _useState9 = useState(placeholderPickerSearch !== null && placeholderPickerSearch !== void 0 ? placeholderPickerSearch : ''),
+    _useState10 = _slicedToArray(_useState9, 2),
+    placeholderText = _useState10[0],
+    setPlaceholderText = _useState10[1];
+  var _useState11 = useState(-1),
+    _useState12 = _slicedToArray(_useState11, 2),
+    indexHover = _useState12[0],
+    setIndexHover = _useState12[1];
   var textInputRef = useRef(null);
+  var scrollViewRef = useRef(null);
   var handleOptionSelected = function handleOptionSelected(item, index) {
     if (onOptionSelected) {
       onOptionSelected(item, index);
@@ -96,13 +110,14 @@ var InputOptions = function InputOptions(_ref) {
     }
   };
   var handleCancelFilter = function handleCancelFilter() {
+    setFilterInputValue('');
     onChangeFilterText('');
   };
   var useKeyboard = function useKeyboard() {
-    var _useState9 = useState(0),
-      _useState10 = _slicedToArray(_useState9, 2),
-      keyboardHeight = _useState10[0],
-      setKeyboardHeight = _useState10[1];
+    var _useState13 = useState(0),
+      _useState14 = _slicedToArray(_useState13, 2),
+      keyboardHeight = _useState14[0],
+      setKeyboardHeight = _useState14[1];
     useEffect(function () {
       function onKeyboardDidShow(event) {
         setKeyboardHeight(event.endCoordinates.height);
@@ -123,13 +138,11 @@ var InputOptions = function InputOptions(_ref) {
   var calculatedMaxHeight = showOptionsAmount ? 8 + 48 * showOptionsAmount : screenHeight;
   var onContentSizeChange = function onContentSizeChange(contentWidth, contentHeight) {
     var containerHeight = calculatedMaxHeight;
+    if (showOptionsAmount && contentHeight > containerHeight && data.length > showOptionsAmount) {
+      setStartIndex((startIndex + 1) % data.length);
+    }
     setShowScroll(contentHeight > containerHeight);
   };
-  useEffect(function () {
-    if (placeholderPickerSearch) {
-      setPlaceholderText(placeholderPickerSearch);
-    }
-  }, [placeholderPickerSearch]);
   var keyboardHeight = useKeyboard();
   var bottomValue = positionModal.bottom || 0;
   var heightValue = positionModal.height || 0;
@@ -142,6 +155,38 @@ var InputOptions = function InputOptions(_ref) {
       return bottomValue - heightValue * 2 - keyboardHeight;
     }
   };
+  var loadMoreData = function loadMoreData() {
+    if (onLoadMoreData && !isStopLoadMoreData && !isLoadingMoreData && (currentPage || currentPage === 0) && isPagination) {
+      if (scrollViewRef.current) scrollViewRef.current.scrollToEnd({
+        animated: true
+      });
+      onLoadMoreData(currentPage + 1, filterValue);
+    }
+  };
+  var debounce = function debounce(func, delay) {
+    var inDebounce;
+    return function () {
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      var context = this;
+      clearTimeout(inDebounce);
+      inDebounce = setTimeout(function () {
+        return func.apply(context, args);
+      }, delay);
+    };
+  };
+  var debounceOnChange = useRef(debounce(function (nextValue) {
+    if (scrollViewRef.current) scrollViewRef.current.scrollTo({
+      y: 0,
+      animated: false
+    });
+    onChangeFilterText(nextValue);
+  }, 500)).current;
+  var onChangeText = useCallback(function (text) {
+    setFilterInputValue(text);
+    debounceOnChange(text);
+  }, [debounceOnChange]);
   return /*#__PURE__*/React.createElement(Modal, {
     transparent: true,
     visible: showOptions,
@@ -169,25 +214,26 @@ var InputOptions = function InputOptions(_ref) {
     indicatorStyle: 'black',
     onContentSizeChange: onContentSizeChange
   }, data === null || data === void 0 ? void 0 : data.map(function (item, index) {
+    var actualIndex = (startIndex + index) % data.length;
     return /*#__PURE__*/React.createElement(Pressable, {
       onHoverIn: function onHoverIn() {
-        setIndexHover(index);
+        setIndexHover(actualIndex);
       },
       onHoverOut: function onHoverOut() {
         setIndexHover(-1);
       },
       onPressIn: function onPressIn() {
-        setIndexHover(index);
+        setIndexHover(actualIndex);
       },
       onPressOut: function onPressOut() {
         setIndexHover(-1);
       },
-      key: index,
+      key: actualIndex,
       style: [styles.optionContainer, 0 === index && {
         marginTop: 0
-      }, getBackground(index), addRadius(index === (data === null || data === void 0 ? void 0 : data.length) - 1)],
+      }, getBackground(actualIndex), addRadius(index === (data === null || data === void 0 ? void 0 : data.length) - 1)],
       onPress: function onPress() {
-        return handleOptionSelected(item, index);
+        return handleOptionSelected(item, actualIndex);
       }
     }, displayKey && /*#__PURE__*/React.createElement(Text, {
       numberOfLines: 1,
@@ -225,7 +271,7 @@ var InputOptions = function InputOptions(_ref) {
   }, showSearchInPicker && /*#__PURE__*/React.createElement(Pressable, {
     onPress: handleOnFocus,
     style: [styles.optionFilterContainer, removePadding(!filterValue && showSearchImg)]
-  }, filterValue === '' && showSearchImg && /*#__PURE__*/React.createElement(View, {
+  }, filterInputValue === '' && showSearchImg && /*#__PURE__*/React.createElement(View, {
     style: styles.searchContainer
   }, /*#__PURE__*/React.createElement(SearchIcon, {
     style: styles.optionFilterImg,
@@ -235,16 +281,26 @@ var InputOptions = function InputOptions(_ref) {
     onFocus: handleOnFocus,
     onBlur: handleOnBlur,
     style: [styles.optionFilterText, addPadding(!filterValue && showSearchImg), disableOutline()],
-    value: filterValue,
-    onChangeText: onChangeFilterText,
+    value: filterInputValue,
+    onChangeText: onChangeText,
     placeholder: placeholderText,
     placeholderTextColor: NEUTRAL_600
-  }), filterValue !== '' && /*#__PURE__*/React.createElement(TouchableOpacity, {
+  }), isLoadingMoreData && /*#__PURE__*/React.createElement(TouchableOpacity, {
+    style: {
+      marginRight: 12
+    },
+    onPress: handleCancelFilter
+  }, /*#__PURE__*/React.createElement(ActivityIndicator, {
+    size: 'small',
+    color: PRIMARY_100,
+    style: [styles.cancelFilterImg]
+  })), filterInputValue !== '' && /*#__PURE__*/React.createElement(TouchableOpacity, {
     style: styles.cancelContainer,
     onPress: handleCancelFilter
   }, /*#__PURE__*/React.createElement(CancelIcon, {
     style: styles.cancelFilterImg
   }))), /*#__PURE__*/React.createElement(ScrollView, {
+    ref: scrollViewRef,
     style: [showScroll && {
       marginRight: 8
     }, {
@@ -254,7 +310,14 @@ var InputOptions = function InputOptions(_ref) {
     persistentScrollbar: true,
     showsVerticalScrollIndicator: true,
     indicatorStyle: 'black',
-    onContentSizeChange: onContentSizeChange
+    onContentSizeChange: onContentSizeChange,
+    onScroll: function onScroll(_ref2) {
+      var nativeEvent = _ref2.nativeEvent;
+      var isCloseToBottom = nativeEvent.layoutMeasurement.height + nativeEvent.contentOffset.y >= nativeEvent.contentSize.height - 50;
+      if (isCloseToBottom) {
+        loadMoreData();
+      }
+    }
   }, data === null || data === void 0 ? void 0 : data.map(function (item, index) {
     return /*#__PURE__*/React.createElement(Pressable, {
       onHoverIn: function onHoverIn() {
@@ -281,6 +344,9 @@ var InputOptions = function InputOptions(_ref) {
       ellipsizeMode: "tail",
       style: styles.optionText
     }, item[displayKey]));
+  }), isLoadingMoreData && /*#__PURE__*/React.createElement(ActivityIndicator, {
+    size: 'large',
+    color: PRIMARY_100
   }))));
 };
 export default InputOptions;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "etendo-ui-library",
-  "version": "1.3.81",
+  "version": "1.3.82",
   "private": false,
   "scripts": {
     "android": "react-native run-android",