etendo-ui-library 1.3.71 → 1.3.73

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/dist-native/components/inputBase/InputBase.d.ts +1 -1
  2. package/dist-native/components/inputBase/InputBase.js +1 -1
  3. package/dist-native/components/inputBase/InputBase.styles.d.ts +0 -1
  4. package/dist-native/components/inputBase/InputBase.styles.js +1 -1
  5. package/dist-native/components/inputBase/InputBase.types.d.ts +6 -5
  6. package/dist-native/components/inputBase/file-search-input/FileSearchInput.d.ts +1 -1
  7. package/dist-native/components/inputBase/file-search-input/FileSearchInput.js +1 -1
  8. package/dist-native/components/inputBase/file-search-input/FileSearchInput.types.d.ts +18 -16
  9. package/dist-native/components/inputBase/file-search-input/FileStatusDisplay.d.ts +4 -0
  10. package/dist-native/components/inputBase/file-search-input/FileStatusDisplay.js +1 -0
  11. package/dist-web/components/inputBase/InputBase.d.ts +1 -1
  12. package/dist-web/components/inputBase/InputBase.js +13 -5
  13. package/dist-web/components/inputBase/InputBase.styles.d.ts +0 -1
  14. package/dist-web/components/inputBase/InputBase.styles.js +1 -2
  15. package/dist-web/components/inputBase/InputBase.types.d.ts +6 -5
  16. package/dist-web/components/inputBase/file-search-input/FileSearchInput.d.ts +1 -1
  17. package/dist-web/components/inputBase/file-search-input/FileSearchInput.js +108 -79
  18. package/dist-web/components/inputBase/file-search-input/FileSearchInput.types.d.ts +18 -16
  19. package/dist-web/components/inputBase/file-search-input/FileStatusDisplay.d.ts +4 -0
  20. package/dist-web/components/inputBase/file-search-input/FileStatusDisplay.js +35 -0
  21. package/package.json +1 -1
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { IInputBase } from './InputBase.types';
3
- declare const InputBase: ({ value, placeholder, title, helperText, isDisabled, isError, onChangeText, icon, rightButtons, onSubmit, }: IInputBase) => React.JSX.Element;
3
+ declare const InputBase: ({ value, placeholder, title, helperText, isDisabled, isError, onChangeText, icon, rightButtons, onSubmit, isLoading, }: IInputBase) => React.JSX.Element;
4
4
  export default InputBase;
@@ -1 +1 @@
1
- var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _reactNative=require("react-native");var _react=_interopRequireWildcard(require("react"));var _containers=require("../containers");var _button=require("../button");var _CornerDownRightIcon=require("../../assets/images/icons/CornerDownRightIcon");var _InputBase=require("./InputBase.styles");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/inputBase/InputBase.tsx";function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap(),t=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(e){return e?t:r;})(e);}function _interopRequireWildcard(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&Object.prototype.hasOwnProperty.call(e,u)){var i=a?Object.getOwnPropertyDescriptor(e,u):null;i&&(i.get||i.set)?Object.defineProperty(n,u,i):n[u]=e[u];}return n.default=e,t&&t.set(e,n),n;}var InputBase=function InputBase(_ref){var value=_ref.value,placeholder=_ref.placeholder,title=_ref.title,helperText=_ref.helperText,isDisabled=_ref.isDisabled,isError=_ref.isError,onChangeText=_ref.onChangeText,icon=_ref.icon,rightButtons=_ref.rightButtons,onSubmit=_ref.onSubmit;var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isFocused=_useState2[0],setIsFocused=_useState2[1];var _useState3=(0,_react.useState)([]),_useState4=(0,_slicedToArray2.default)(_useState3,2),buttons=_useState4[0],setButtons=_useState4[1];var onFocusChange=function onFocusChange(){setIsFocused(true);};var onBlurChange=function onBlurChange(){setIsFocused(false);};var borderWidth=isFocused?3:1;var paddingVertical=13-(borderWidth-1);var paddingHorizontal=12-(borderWidth-1);var borderStyle=function borderStyle(){if(!value&&!isFocused){return _InputBase.styles.containerPlaceholder;}if(isDisabled){return _InputBase.styles.containerIsDisabled;}if(isError){return _InputBase.styles.containerIsError;}};var iconColorStyle=function iconColorStyle(){if(!value){return _InputBase.styles.iconPlaceholder.color;}if(isDisabled){return _InputBase.styles.iconIsDisabled.color;}if(isFocused){return _InputBase.styles.iconIsFocus.color;}if(isError){return _InputBase.styles.iconIsError.color;}};var textColorStyle=function textColorStyle(){if(!value){return _InputBase.styles.textPlaceholder;}if(isDisabled){return _InputBase.styles.textIsDisabled;}if(isFocused){return _InputBase.styles.textIsFocus;}if(isError&&!isFocused){return _InputBase.styles.textIsError;}};(0,_react.useEffect)(function(){setButtons([].concat((0,_toConsumableArray2.default)(rightButtons!=null?rightButtons:[]),[onSubmit!==undefined&&_react.default.createElement(_button.Button,{width:48,typeStyle:"white",onPress:onSubmit,iconLeft:_react.default.createElement(_CornerDownRightIcon.CornerDownRightIcon,{style:_InputBase.styles.iconSize,__self:_this,__source:{fileName:_jsxFileName,lineNumber:94,columnNumber:21}}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:90,columnNumber:9}})]));},[onSubmit,rightButtons]);return _react.default.createElement(_react.default.Fragment,null,!!title&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:_InputBase.styles.title,__self:_this,__source:{fileName:_jsxFileName,lineNumber:103,columnNumber:9}},title),_react.default.createElement(_reactNative.View,{style:[_InputBase.styles.container,borderStyle(),{borderWidth:borderWidth,paddingVertical:paddingVertical,paddingHorizontal:paddingHorizontal}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:107,columnNumber:7}},!!icon&&_react.default.createElement(_reactNative.TouchableOpacity,{disabled:!icon.onPress||isDisabled,onPress:function onPress(){if(icon.onPress){icon.onPress();}},style:{marginRight:5},__self:_this,__source:{fileName:_jsxFileName,lineNumber:118,columnNumber:11}},_react.default.cloneElement(icon.icon,{style:icon.icon.props.style||_InputBase.styles.iconRight,fill:iconColorStyle()})),_react.default.createElement(_reactNative.TextInput,{value:value,onChangeText:onChangeText,placeholder:placeholder,editable:!isDisabled,onFocus:onFocusChange,onBlur:onBlurChange,style:[_InputBase.styles.textInput,textColorStyle()],onSubmitEditing:onSubmit||function(){},__self:_this,__source:{fileName:_jsxFileName,lineNumber:132,columnNumber:9}}),!!buttons&&_react.default.createElement(_containers.ButtonContainer,{style:_InputBase.styles.buttonContainer,buttons:buttons,__self:_this,__source:{fileName:_jsxFileName,lineNumber:143,columnNumber:11}})),!!helperText&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:_InputBase.styles.helperText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:147,columnNumber:9}},helperText));};var _default=exports.default=InputBase;
1
+ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _reactNative=require("react-native");var _react=_interopRequireWildcard(require("react"));var _containers=require("../containers");var _button=require("../button");var _CornerDownRightIcon=require("../../assets/images/icons/CornerDownRightIcon");var _InputBase=require("./InputBase.styles");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/inputBase/InputBase.tsx";function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap(),t=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(e){return e?t:r;})(e);}function _interopRequireWildcard(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&Object.prototype.hasOwnProperty.call(e,u)){var i=a?Object.getOwnPropertyDescriptor(e,u):null;i&&(i.get||i.set)?Object.defineProperty(n,u,i):n[u]=e[u];}return n.default=e,t&&t.set(e,n),n;}var InputBase=function InputBase(_ref){var value=_ref.value,placeholder=_ref.placeholder,title=_ref.title,helperText=_ref.helperText,isDisabled=_ref.isDisabled,isError=_ref.isError,onChangeText=_ref.onChangeText,icon=_ref.icon,rightButtons=_ref.rightButtons,onSubmit=_ref.onSubmit,isLoading=_ref.isLoading;var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isFocused=_useState2[0],setIsFocused=_useState2[1];var _useState3=(0,_react.useState)([]),_useState4=(0,_slicedToArray2.default)(_useState3,2),buttons=_useState4[0],setButtons=_useState4[1];var onFocusChange=function onFocusChange(){setIsFocused(true);};var onBlurChange=function onBlurChange(){setIsFocused(false);};var borderWidth=isFocused?3:1;var paddingVertical=13-(borderWidth-1);var paddingHorizontal=12-(borderWidth-1);var borderStyle=function borderStyle(){if(!value&&!isFocused){return _InputBase.styles.containerPlaceholder;}if(isDisabled){return _InputBase.styles.containerIsDisabled;}if(isError){return _InputBase.styles.containerIsError;}};var iconColorStyle=function iconColorStyle(){if(!value){return _InputBase.styles.iconPlaceholder.color;}if(isDisabled){return _InputBase.styles.iconIsDisabled.color;}if(isFocused){return _InputBase.styles.iconIsFocus.color;}if(isError){return _InputBase.styles.iconIsError.color;}};var textColorStyle=function textColorStyle(){if(!value){return _InputBase.styles.textPlaceholder;}if(isDisabled){return _InputBase.styles.textIsDisabled;}if(isFocused){return _InputBase.styles.textIsFocus;}if(isError&&!isFocused){return _InputBase.styles.textIsError;}};var textInputStyle=[_InputBase.styles.textInput,textColorStyle()];if(_reactNative.Platform.OS==='web'){textInputStyle.push({outlineWidth:0});}(0,_react.useEffect)(function(){setButtons([].concat((0,_toConsumableArray2.default)(rightButtons!=null?rightButtons:[]),[onSubmit!==undefined&&_react.default.createElement(_button.Button,{width:48,typeStyle:"white",onPress:onSubmit,iconLeft:_react.default.createElement(_CornerDownRightIcon.CornerDownRightIcon,{style:_InputBase.styles.iconSize,__self:_this,__source:{fileName:_jsxFileName,lineNumber:102,columnNumber:21}}),disabled:isLoading,__self:_this,__source:{fileName:_jsxFileName,lineNumber:98,columnNumber:9}})]));},[onSubmit,isLoading,rightButtons]);return _react.default.createElement(_react.default.Fragment,null,!!title&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:_InputBase.styles.title,__self:_this,__source:{fileName:_jsxFileName,lineNumber:112,columnNumber:9}},title),_react.default.createElement(_reactNative.View,{style:[_InputBase.styles.container,borderStyle(),{borderWidth:borderWidth,paddingVertical:paddingVertical,paddingHorizontal:paddingHorizontal}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:116,columnNumber:7}},!!icon&&_react.default.createElement(_reactNative.TouchableOpacity,{disabled:!icon.onPress||isDisabled,onPress:function onPress(){if(icon.onPress){icon.onPress();}},style:{marginRight:5},__self:_this,__source:{fileName:_jsxFileName,lineNumber:127,columnNumber:11}},_react.default.cloneElement(icon.icon,{style:icon.icon.props.style||_InputBase.styles.iconRight,fill:iconColorStyle()})),_react.default.createElement(_reactNative.TextInput,{value:value,onChangeText:onChangeText,placeholder:placeholder,editable:!isDisabled,onFocus:onFocusChange,onBlur:onBlurChange,style:textInputStyle,onSubmitEditing:onSubmit||function(){},__self:_this,__source:{fileName:_jsxFileName,lineNumber:141,columnNumber:9}}),!!buttons&&_react.default.createElement(_containers.ButtonContainer,{style:_InputBase.styles.buttonContainer,buttons:buttons,__self:_this,__source:{fileName:_jsxFileName,lineNumber:152,columnNumber:11}})),!!helperText&&_react.default.createElement(_reactNative.Text,{numberOfLines:1,ellipsizeMode:"tail",style:_InputBase.styles.helperText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:156,columnNumber:9}},helperText));};var _default=exports.default=InputBase;
@@ -62,7 +62,6 @@ export declare const styles: {
62
62
  letterSpacing: number;
63
63
  color: string;
64
64
  flex: number;
65
- outlineStyle: string;
66
65
  };
67
66
  helperText: {
68
67
  fontFamily: string;
@@ -1 +1 @@
1
- Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _colors=require("../../styles/colors");var styles=exports.styles=_reactNative.StyleSheet.create({title:{fontFamily:'Inter',fontSize:16,fontWeight:'600',lineHeight:24,letterSpacing:-0.16,color:_colors.NEUTRAL_800},container:{backgroundColor:_colors.NEUTRAL_0,height:48,borderRadius:8,borderColor:_colors.PRIMARY_100,overflow:'hidden',justifyContent:'center',alignItems:'center',flexDirection:'row'},containerIsError:{borderColor:_colors.DANGER_600},containerIsDisabled:{borderColor:_colors.NEUTRAL_400},containerPlaceholder:{borderColor:_colors.NEUTRAL_400},iconPlaceholder:{color:_colors.NEUTRAL_800},iconIsDisabled:{color:_colors.NEUTRAL_500},iconIsError:{color:_colors.NEUTRAL_800},iconIsFocus:{color:_colors.NEUTRAL_1000},textPlaceholder:{color:_colors.NEUTRAL_500},textIsError:{color:_colors.DANGER_700},textIsFocus:{color:_colors.NEUTRAL_800},textIsDisabled:{color:_colors.NEUTRAL_500},textInput:{paddingHorizontal:0,height:48,backgroundColor:'white',fontFamily:'Inter',fontSize:16,fontStyle:'normal',fontWeight:'500',lineHeight:22,letterSpacing:-0.16,color:_colors.PRIMARY_100,flex:1,outlineStyle:"none"},helperText:{fontFamily:'Inter',fontSize:14,fontWeight:'500',lineHeight:22,letterSpacing:-0.14,color:_colors.NEUTRAL_800},iconLeft:{width:24,height:24,marginRight:8},iconRight:{width:24,height:24,marginLeft:8},iconSize:{width:24,height:24},buttonContainer:{flexDirection:'row',paddingVertical:0,gap:0,marginLeft:5}});
1
+ Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _colors=require("../../styles/colors");var styles=exports.styles=_reactNative.StyleSheet.create({title:{fontFamily:'Inter',fontSize:16,fontWeight:'600',lineHeight:24,letterSpacing:-0.16,color:_colors.NEUTRAL_800},container:{backgroundColor:_colors.NEUTRAL_0,height:48,borderRadius:8,borderColor:_colors.PRIMARY_100,overflow:'hidden',justifyContent:'center',alignItems:'center',flexDirection:'row'},containerIsError:{borderColor:_colors.DANGER_600},containerIsDisabled:{borderColor:_colors.NEUTRAL_400},containerPlaceholder:{borderColor:_colors.NEUTRAL_400},iconPlaceholder:{color:_colors.NEUTRAL_800},iconIsDisabled:{color:_colors.NEUTRAL_500},iconIsError:{color:_colors.NEUTRAL_800},iconIsFocus:{color:_colors.NEUTRAL_1000},textPlaceholder:{color:_colors.NEUTRAL_500},textIsError:{color:_colors.DANGER_700},textIsFocus:{color:_colors.NEUTRAL_800},textIsDisabled:{color:_colors.NEUTRAL_500},textInput:{paddingHorizontal:0,height:48,backgroundColor:'white',fontFamily:'Inter',fontSize:16,fontStyle:'normal',fontWeight:'500',lineHeight:22,letterSpacing:-0.16,color:_colors.PRIMARY_100,flex:1},helperText:{fontFamily:'Inter',fontSize:14,fontWeight:'500',lineHeight:22,letterSpacing:-0.14,color:_colors.NEUTRAL_800},iconLeft:{width:24,height:24,marginRight:8},iconRight:{width:24,height:24,marginLeft:8},iconSize:{width:24,height:24},buttonContainer:{flexDirection:'row',paddingVertical:0,gap:0,marginLeft:5}});
@@ -4,14 +4,15 @@ export interface IInputButtons {
4
4
  onPress?: () => void;
5
5
  }
6
6
  export interface IInputBase {
7
- value?: string;
8
- placeholder?: string;
9
- title?: string;
10
7
  helperText?: string;
8
+ icon?: IInputButtons;
11
9
  isDisabled?: boolean;
12
10
  isError?: boolean;
11
+ isLoading?: boolean;
13
12
  onChangeText?: (value: string) => void;
14
- icon?: IInputButtons;
15
- rightButtons?: ReactNode[];
16
13
  onSubmit?: (...params: any[]) => void;
14
+ placeholder?: string;
15
+ rightButtons?: ReactNode[];
16
+ title?: string;
17
+ value?: string;
17
18
  }
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { FileSearchInputProps } from './FileSearchInput.types';
3
- declare const FileSearchInput: ({ value, onSubmit, setLoadingFile, loadingFile, onLoadingFile, file, setFile, ...inputBaseProps }: FileSearchInputProps) => React.JSX.Element;
3
+ declare const FileSearchInput: ({ value, placeholder, onChangeText, onSubmit, setFile, fetchData, ...inputBaseProps }: FileSearchInputProps) => React.JSX.Element;
4
4
  export default FileSearchInput;
@@ -1 +1 @@
1
- var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _asyncToGenerator2=_interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _InputBase=_interopRequireDefault(require("../InputBase"));var _FileSearchInput=require("./FileSearchInput.styles");var _colors=require("../../../styles/colors");var _CheckCircleIcon=require("../../../assets/images/icons/CheckCircleIcon");var _Clipboard=require("../../../assets/images/icons/Clipboard");var _DeleteIcon=require("../../../assets/images/icons/DeleteIcon");var _FileIcon=require("../../../assets/images/icons/FileIcon");var _button=require("../../button");var _excluded=["value","onSubmit","setLoadingFile","loadingFile","onLoadingFile","file","setFile"];var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/inputBase/file-search-input/FileSearchInput.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 DocumentPicker=null;if(_reactNative.Platform.OS!=='web'){DocumentPicker=require('react-native-document-picker').default;}var FileSearchInput=function FileSearchInput(_ref){var value=_ref.value,onSubmit=_ref.onSubmit,setLoadingFile=_ref.setLoadingFile,loadingFile=_ref.loadingFile,onLoadingFile=_ref.onLoadingFile,file=_ref.file,setFile=_ref.setFile,inputBaseProps=(0,_objectWithoutProperties2.default)(_ref,_excluded);var _useState=(0,_react.useState)(0),_useState2=(0,_slicedToArray2.default)(_useState,2),progress=_useState2[0],setProgress=_useState2[1];var dropAreaRef=(0,_react.useRef)(null);var fileInputRef=(0,_react.useRef)(null);var progressAnim=(0,_react.useRef)(new _reactNative.Animated.Value(0)).current;var progressSteps=[5,25,50,70,90];var currentStep=0;(0,_react.useEffect)(function(){if(!loadingFile&&progress===90){completeProgress();}},[loadingFile,progress]);var handleDrop=function handleDrop(event){event.preventDefault();var files=event.dataTransfer.files;if(files.length>0){var _file=files[0];startLoading(_file);if(onLoadingFile&&typeof onLoadingFile==='function'){onLoadingFile(_file,function(){return setFile(_file);});}else{setFile(_file);}}};var completeProgress=function completeProgress(){setProgress(100);animateProgress(100);setTimeout(function(){setProgress(0);animateProgress(0);},2000);};var animateProgress=function animateProgress(toValue){_reactNative.Animated.timing(progressAnim,{toValue:toValue,duration:500,useNativeDriver:false}).start();};var startLoading=function startLoading(pickedFile){currentStep=0;setFile(pickedFile);setProgress(progressSteps[0]);animateProgress(progressSteps[0]);var progressInterval=setInterval(function(){if(currentStep<progressSteps.length-1){currentStep++;setProgress(progressSteps[currentStep]);animateProgress(progressSteps[currentStep]);}else{clearInterval(progressInterval);if(!loadingFile){completeProgress();}}},1000);};var handleFileButtonClick=function(){var _ref2=(0,_asyncToGenerator2.default)(function*(){if(_reactNative.Platform.OS==='web'){fileInputRef.current.click();}else if(_reactNative.Platform.OS==='android'||_reactNative.Platform.OS==='ios'){if(!DocumentPicker){console.error('DocumentPicker is not available on this platform.');return;}try{var response=yield DocumentPicker.pick({type:[DocumentPicker.types.allFiles]});var pickedFile={name:response[0].name,size:response[0].size,type:response[0].type,uri:response[0].uri};startLoading(pickedFile);if(onLoadingFile&&typeof onLoadingFile==='function'){onLoadingFile(pickedFile,function(){return setFile(pickedFile);});}else{setFile(pickedFile);}}catch(err){if(!DocumentPicker.isCancel(err)){console.error(err);}}}});return function handleFileButtonClick(){return _ref2.apply(this,arguments);};}();var handleSendMessage=function handleSendMessage(){if(!loadingFile&&(value==null?void 0:value.trim())!==''){if(onSubmit){onSubmit(fileInputRef.current);setProgress(0);animateProgress(0);setLoadingFile(false);}}else{_reactNative.Alert.alert("Message Incomplete","Please wait for the file to finish loading or ensure the message is not empty.");}};var rightButtons=[_react.default.createElement(_button.Button,{width:48,typeStyle:"white",onPress:handleFileButtonClick,iconLeft:_react.default.createElement(_Clipboard.ClipboardIcon,{style:{width:24,height:24},fill:_colors.PRIMARY_100,__self:_this,__source:{fileName:_jsxFileName,lineNumber:162,columnNumber:23}}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:158,columnNumber:9}})];var handleFileSelect=function handleFileSelect(event){var file=event.target.files[0];if(file){startLoading(file);if(onLoadingFile&&typeof onLoadingFile==='function'){onLoadingFile(file,function(){return setFile(file);});}else{setFile(file);}}event.target.value=null;};var handleDeleteFile=function handleDeleteFile(){setFile(null);setProgress(0);animateProgress(0);if(fileInputRef.current){fileInputRef.current.value=null;}};return _react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.container,__self:_this,__source:{fileName:_jsxFileName,lineNumber:192,columnNumber:9}},file&&loadingFile?_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:195,columnNumber:17}},_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameLeftContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:196,columnNumber:21}},_react.default.createElement(_FileIcon.FileIcon,{style:_FileSearchInput.styles.fileIcon,__self:_this,__source:{fileName:_jsxFileName,lineNumber:197,columnNumber:25}}),_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameLeftContent,__self:_this,__source:{fileName:_jsxFileName,lineNumber:198,columnNumber:25}},_react.default.createElement(_reactNative.Text,{style:_FileSearchInput.styles.fileNameText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:199,columnNumber:29}},file.name),_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.progressBarBackground,__self:_this,__source:{fileName:_jsxFileName,lineNumber:200,columnNumber:29}},_react.default.createElement(_reactNative.Animated.View,{style:[_FileSearchInput.styles.progressBarFill,{width:progressAnim.interpolate({inputRange:[0,100],outputRange:['0%','100%']})}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:201,columnNumber:33}})))),_react.default.createElement(_reactNative.TouchableOpacity,{onPress:handleDeleteFile,__self:_this,__source:{fileName:_jsxFileName,lineNumber:210,columnNumber:21}},_react.default.createElement(_DeleteIcon.DeleteIcon,{style:_FileSearchInput.styles.deleteIcon,__self:_this,__source:{fileName:_jsxFileName,lineNumber:211,columnNumber:25}}))):file&&_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:216,columnNumber:21}},_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameLoadedLeftContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:217,columnNumber:25}},_react.default.createElement(_FileIcon.FileIcon,{style:_FileSearchInput.styles.fileIcon,__self:_this,__source:{fileName:_jsxFileName,lineNumber:218,columnNumber:29}}),_react.default.createElement(_reactNative.Text,{style:_FileSearchInput.styles.fileNameText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:219,columnNumber:29}},file.name)),_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameRightContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:221,columnNumber:25}},_react.default.createElement(_CheckCircleIcon.CheckCircleIcon,{style:_FileSearchInput.styles.checkCircleIcon,fill:_colors.SUCCESS_600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:222,columnNumber:29}}),_react.default.createElement(_reactNative.TouchableOpacity,{onPress:handleDeleteFile,__self:_this,__source:{fileName:_jsxFileName,lineNumber:223,columnNumber:29}},_react.default.createElement(_DeleteIcon.DeleteIcon,{style:_FileSearchInput.styles.deleteIcon,__self:_this,__source:{fileName:_jsxFileName,lineNumber:224,columnNumber:33}})))),_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.inputContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:230,columnNumber:13}},_reactNative.Platform.OS==="web"?_react.default.createElement("div",{ref:dropAreaRef,onDrop:handleDrop,__self:_this,__source:{fileName:_jsxFileName,lineNumber:232,columnNumber:21}},_react.default.createElement(_InputBase.default,(0,_extends2.default)({value:value},inputBaseProps,{onSubmit:handleSendMessage,rightButtons:rightButtons,__self:_this,__source:{fileName:_jsxFileName,lineNumber:236,columnNumber:25}})),_react.default.createElement("input",{type:"file",ref:fileInputRef,style:{display:'none'},onChange:handleFileSelect,__self:_this,__source:{fileName:_jsxFileName,lineNumber:242,columnNumber:25}})):_react.default.createElement(_InputBase.default,(0,_extends2.default)({value:value},inputBaseProps,{onSubmit:handleSendMessage,rightButtons:rightButtons,__self:_this,__source:{fileName:_jsxFileName,lineNumber:249,columnNumber:21}}))));};var _default=exports.default=FileSearchInput;
1
+ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _asyncToGenerator2=_interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _InputBase=_interopRequireDefault(require("../InputBase"));var _FileSearchInput=require("./FileSearchInput.styles");var _colors=require("../../../styles/colors");var _CheckCircleIcon=require("../../../assets/images/icons/CheckCircleIcon");var _Clipboard=require("../../../assets/images/icons/Clipboard");var _DeleteIcon=require("../../../assets/images/icons/DeleteIcon");var _FileIcon=require("../../../assets/images/icons/FileIcon");var _button=require("../../button");var _FileStatusDisplay=_interopRequireDefault(require("./FileStatusDisplay"));var _excluded=["value","placeholder","onChangeText","onSubmit","setFile","fetchData"];var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/inputBase/file-search-input/FileSearchInput.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 DocumentPicker=null;if(_reactNative.Platform.OS!=='web'){DocumentPicker=require('react-native-document-picker').default;}var FileSearchInput=function FileSearchInput(_ref){var value=_ref.value,placeholder=_ref.placeholder,onChangeText=_ref.onChangeText,onSubmit=_ref.onSubmit,setFile=_ref.setFile,fetchData=_ref.fetchData,inputBaseProps=(0,_objectWithoutProperties2.default)(_ref,_excluded);var _useState=(0,_react.useState)(null),_useState2=(0,_slicedToArray2.default)(_useState,2),file=_useState2[0],setLocalFile=_useState2[1];var _useState3=(0,_react.useState)(false),_useState4=(0,_slicedToArray2.default)(_useState3,2),loadingFile=_useState4[0],setLoadingFile=_useState4[1];var _useState5=(0,_react.useState)(0),_useState6=(0,_slicedToArray2.default)(_useState5,2),progress=_useState6[0],setProgress=_useState6[1];var dropAreaRef=(0,_react.useRef)(null);var fileInputRef=(0,_react.useRef)(null);var progressAnim=(0,_react.useRef)(new _reactNative.Animated.Value(0)).current;var progressSteps=[5,25,50,70,90];var currentStep=0;(0,_react.useEffect)(function(){if(!loadingFile&&progress===90){completeProgress();}},[loadingFile,progress]);var handleDrop=function handleDrop(event){event.preventDefault();var files=event.dataTransfer.files;if(files.length>0){var _file=files[0];startLoading(_file);setFile(_file);}};var completeProgress=function completeProgress(){setProgress(100);animateProgress(100);setLoadingFile(false);setTimeout(function(){setProgress(0);animateProgress(0);},2000);};var animateProgress=function animateProgress(toValue){_reactNative.Animated.timing(progressAnim,{toValue:toValue,duration:500,useNativeDriver:false}).start();};var startLoading=function startLoading(pickedFile){currentStep=0;setLoadingFile(true);setFile(pickedFile);setLocalFile(pickedFile);setProgress(progressSteps[0]);animateProgress(progressSteps[0]);var progressInterval=setInterval(function(){if(currentStep<progressSteps.length-1){currentStep++;setProgress(progressSteps[currentStep]);animateProgress(progressSteps[currentStep]);}else{clearInterval(progressInterval);if(!loadingFile){completeProgress();}}},1000);};var handleFileButtonClick=function(){var _ref2=(0,_asyncToGenerator2.default)(function*(){if(_reactNative.Platform.OS==='web'){fileInputRef.current.click();}else if(_reactNative.Platform.OS==='android'||_reactNative.Platform.OS==='ios'){if(!DocumentPicker){console.error('DocumentPicker is not available on this platform.');return;}try{var response=yield DocumentPicker.pick({type:[DocumentPicker.types.allFiles]});var pickedFile={name:response[0].name,size:response[0].size,type:response[0].type,uri:response[0].uri};startLoading(pickedFile);setFile(pickedFile);}catch(err){if(!DocumentPicker.isCancel(err)){console.error(err);}}}});return function handleFileButtonClick(){return _ref2.apply(this,arguments);};}();var handleSendMessage=function handleSendMessage(){if(!loadingFile&&(value==null?void 0:value.trim())!==''){if(onSubmit){onSubmit(value,fileInputRef.current);setProgress(0);animateProgress(0);setLoadingFile(false);setLocalFile(null);}}else{_reactNative.Alert.alert('Message Incomplete','Please wait for the file to finish loading or ensure the message is not empty.');}};var rightButtons=[];if(fetchData){rightButtons.push(_react.default.createElement(_button.Button,{width:48,typeStyle:"white",onPress:handleFileButtonClick,iconLeft:_react.default.createElement(_Clipboard.ClipboardIcon,{style:{width:24,height:24},fill:_colors.PRIMARY_100,__self:_this,__source:{fileName:_jsxFileName,lineNumber:168,columnNumber:11}}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:163,columnNumber:7}}));}var handleFileSelect=function handleFileSelect(event){var file=event.target.files[0];if(file){startLoading(file);setFile(file);setLocalFile(file);uploadFile(file);}event.target.value=null;};var handleDeleteFile=function handleDeleteFile(){setFile(null);setLocalFile(null);setProgress(0);animateProgress(0);setLoadingFile(false);if(fileInputRef.current){fileInputRef.current.value=null;}};var uploadFile=function(){var _ref3=(0,_asyncToGenerator2.default)(function*(file){if(!fetchData||!fetchData.url||!fetchData.method){_reactNative.Alert.alert('Fetch data is not properly defined.');return;}var formData=new FormData();formData.append(fetchData.file||'file',file);try{var response=yield fetch(fetchData.url,{method:fetchData.method,body:formData});var result=yield response.json();setFile(result);completeProgress();}catch(error){console.error('Error uploading file:',error);}});return function uploadFile(_x){return _ref3.apply(this,arguments);};}();return _react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.container,__self:_this,__source:{fileName:_jsxFileName,lineNumber:221,columnNumber:5}},file&&loadingFile?_react.default.createElement(_FileStatusDisplay.default,{file:file,progressAnim:progressAnim,handleDeleteFile:handleDeleteFile,__self:_this,__source:{fileName:_jsxFileName,lineNumber:224,columnNumber:9}}):file&&_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:231,columnNumber:11}},_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameLoadedLeftContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:232,columnNumber:13}},_react.default.createElement(_FileIcon.FileIcon,{style:_FileSearchInput.styles.fileIcon,__self:_this,__source:{fileName:_jsxFileName,lineNumber:233,columnNumber:15}}),_react.default.createElement(_reactNative.Text,{style:_FileSearchInput.styles.fileNameText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:234,columnNumber:15}},file.name)),_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameRightContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:236,columnNumber:13}},_react.default.createElement(_CheckCircleIcon.CheckCircleIcon,{style:_FileSearchInput.styles.checkCircleIcon,fill:_colors.SUCCESS_600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:237,columnNumber:15}}),_react.default.createElement(_reactNative.TouchableOpacity,{onPress:handleDeleteFile,__self:_this,__source:{fileName:_jsxFileName,lineNumber:241,columnNumber:15}},_react.default.createElement(_DeleteIcon.DeleteIcon,{style:_FileSearchInput.styles.deleteIcon,__self:_this,__source:{fileName:_jsxFileName,lineNumber:242,columnNumber:17}})))),_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.inputContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:249,columnNumber:7}},_reactNative.Platform.OS==='web'?_react.default.createElement("div",{ref:dropAreaRef,onDrop:handleDrop,__self:_this,__source:{fileName:_jsxFileName,lineNumber:251,columnNumber:11}},_react.default.createElement(_InputBase.default,(0,_extends2.default)({},inputBaseProps,{value:value,onChangeText:onChangeText,onSubmit:handleSendMessage,rightButtons:rightButtons,isLoading:loadingFile,__self:_this,__source:{fileName:_jsxFileName,lineNumber:252,columnNumber:13}})),_react.default.createElement("input",{type:"file",ref:fileInputRef,style:{display:'none'},onChange:handleFileSelect,__self:_this,__source:{fileName:_jsxFileName,lineNumber:260,columnNumber:13}})):_react.default.createElement(_InputBase.default,(0,_extends2.default)({},inputBaseProps,{value:value,onChangeText:onChangeText,onSubmit:handleSendMessage,rightButtons:rightButtons,isLoading:loadingFile,__self:_this,__source:{fileName:_jsxFileName,lineNumber:268,columnNumber:11}}))));};var _default=exports.default=FileSearchInput;
@@ -1,18 +1,20 @@
1
- /// <reference types="react" />
2
- import { IInputBase } from "../InputBase.types";
3
- interface IFile {
4
- name: string;
5
- size: number;
6
- type: string;
7
- uri: string;
8
- }
1
+ import { Animated } from 'react-native';
2
+ import { IInputBase } from '../InputBase.types';
3
+ export type FetchData = {
4
+ file: any;
5
+ url: string;
6
+ method: string;
7
+ };
9
8
  export interface FileSearchInputProps extends IInputBase {
10
- value?: string;
11
- onSubmit?: (message: string, file?: IFile) => void;
12
- file: IFile | null;
13
- setFile: React.Dispatch<React.SetStateAction<IFile | null>>;
14
- loadingFile: boolean;
15
- setLoadingFile: React.Dispatch<React.SetStateAction<boolean>>;
16
- onLoadingFile: (file: IFile, callback?: () => void) => void;
9
+ value: string;
10
+ setFile: (file: any) => void;
11
+ onChangeText: (text: string) => void;
12
+ onSubmit: (message: string, file?: any) => void;
13
+ placeholder: string;
14
+ fetchData?: FetchData;
15
+ }
16
+ export interface FileStatusDisplayProps {
17
+ file: any;
18
+ progressAnim: Animated.Value;
19
+ handleDeleteFile: () => void;
17
20
  }
18
- export {};
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { FileStatusDisplayProps } from './FileSearchInput.types';
3
+ declare const FileStatusDisplay: ({ file, progressAnim, handleDeleteFile, }: FileStatusDisplayProps) => React.JSX.Element;
4
+ export default FileStatusDisplay;
@@ -0,0 +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 _FileSearchInput=require("./FileSearchInput.styles");var _DeleteIcon=require("../../../assets/images/icons/DeleteIcon");var _FileIcon=require("../../../assets/images/icons/FileIcon");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/inputBase/file-search-input/FileStatusDisplay.tsx";var FileStatusDisplay=function FileStatusDisplay(_ref){var file=_ref.file,progressAnim=_ref.progressAnim,handleDeleteFile=_ref.handleDeleteFile;return _react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:14,columnNumber:9}},_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameLeftContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:15,columnNumber:13}},_react.default.createElement(_FileIcon.FileIcon,{style:_FileSearchInput.styles.fileIcon,__self:_this,__source:{fileName:_jsxFileName,lineNumber:16,columnNumber:17}}),_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.fileNameLeftContent,__self:_this,__source:{fileName:_jsxFileName,lineNumber:17,columnNumber:17}},_react.default.createElement(_reactNative.Text,{style:_FileSearchInput.styles.fileNameText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:18,columnNumber:21}},file.name),_react.default.createElement(_reactNative.View,{style:_FileSearchInput.styles.progressBarBackground,__self:_this,__source:{fileName:_jsxFileName,lineNumber:19,columnNumber:21}},_react.default.createElement(_reactNative.Animated.View,{style:[_FileSearchInput.styles.progressBarFill,{width:progressAnim.interpolate({inputRange:[0,100],outputRange:['0%','100%']})}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:20,columnNumber:25}})))),_react.default.createElement(_reactNative.TouchableOpacity,{onPress:handleDeleteFile,__self:_this,__source:{fileName:_jsxFileName,lineNumber:34,columnNumber:13}},_react.default.createElement(_DeleteIcon.DeleteIcon,{style:_FileSearchInput.styles.deleteIcon,__self:_this,__source:{fileName:_jsxFileName,lineNumber:35,columnNumber:17}})));};var _default=exports.default=FileStatusDisplay;
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { IInputBase } from './InputBase.types';
3
- declare const InputBase: ({ value, placeholder, title, helperText, isDisabled, isError, onChangeText, icon, rightButtons, onSubmit, }: IInputBase) => React.JSX.Element;
3
+ declare const InputBase: ({ value, placeholder, title, helperText, isDisabled, isError, onChangeText, icon, rightButtons, onSubmit, isLoading, }: IInputBase) => React.JSX.Element;
4
4
  export default InputBase;
@@ -8,7 +8,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
8
8
  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; }
9
9
  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; } }
10
10
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
11
- import { Text, TextInput, TouchableOpacity, View } from "react-native-web";
11
+ import { Platform, Text, TextInput, TouchableOpacity, View } from "react-native-web";
12
12
  import React, { useEffect, useState } from 'react';
13
13
  import { ButtonContainer } from "../containers";
14
14
  import { Button } from "../button";
@@ -24,7 +24,8 @@ var InputBase = function InputBase(_ref) {
24
24
  onChangeText = _ref.onChangeText,
25
25
  icon = _ref.icon,
26
26
  rightButtons = _ref.rightButtons,
27
- onSubmit = _ref.onSubmit;
27
+ onSubmit = _ref.onSubmit,
28
+ isLoading = _ref.isLoading;
28
29
  var _useState = useState(false),
29
30
  _useState2 = _slicedToArray(_useState, 2),
30
31
  isFocused = _useState2[0],
@@ -81,6 +82,12 @@ var InputBase = function InputBase(_ref) {
81
82
  return styles.textIsError;
82
83
  }
83
84
  };
85
+ var textInputStyle = [styles.textInput, textColorStyle()];
86
+ if (Platform.OS === 'web') {
87
+ textInputStyle.push({
88
+ outlineWidth: 0
89
+ });
90
+ }
84
91
  useEffect(function () {
85
92
  setButtons([].concat(_toConsumableArray(rightButtons !== null && rightButtons !== void 0 ? rightButtons : []), [onSubmit !== undefined && /*#__PURE__*/React.createElement(Button, {
86
93
  width: 48,
@@ -88,9 +95,10 @@ var InputBase = function InputBase(_ref) {
88
95
  onPress: onSubmit,
89
96
  iconLeft: /*#__PURE__*/React.createElement(CornerDownRightIcon, {
90
97
  style: styles.iconSize
91
- })
98
+ }),
99
+ disabled: isLoading
92
100
  })]));
93
- }, [onSubmit, rightButtons]);
101
+ }, [onSubmit, isLoading, rightButtons]);
94
102
  return /*#__PURE__*/React.createElement(React.Fragment, null, !!title && /*#__PURE__*/React.createElement(Text, {
95
103
  numberOfLines: 1,
96
104
  ellipsizeMode: "tail",
@@ -121,7 +129,7 @@ var InputBase = function InputBase(_ref) {
121
129
  editable: !isDisabled,
122
130
  onFocus: onFocusChange,
123
131
  onBlur: onBlurChange,
124
- style: [styles.textInput, textColorStyle()],
132
+ style: textInputStyle,
125
133
  onSubmitEditing: onSubmit || function () {}
126
134
  }), !!buttons && /*#__PURE__*/React.createElement(ButtonContainer, {
127
135
  style: styles.buttonContainer,
@@ -62,7 +62,6 @@ export declare const styles: {
62
62
  letterSpacing: number;
63
63
  color: string;
64
64
  flex: number;
65
- outlineStyle: string;
66
65
  };
67
66
  helperText: {
68
67
  fontFamily: string;
@@ -63,8 +63,7 @@ export var styles = StyleSheet.create({
63
63
  lineHeight: 22,
64
64
  letterSpacing: -0.16,
65
65
  color: PRIMARY_100,
66
- flex: 1,
67
- outlineStyle: "none"
66
+ flex: 1
68
67
  },
69
68
  helperText: {
70
69
  fontFamily: 'Inter',
@@ -4,14 +4,15 @@ export interface IInputButtons {
4
4
  onPress?: () => void;
5
5
  }
6
6
  export interface IInputBase {
7
- value?: string;
8
- placeholder?: string;
9
- title?: string;
10
7
  helperText?: string;
8
+ icon?: IInputButtons;
11
9
  isDisabled?: boolean;
12
10
  isError?: boolean;
11
+ isLoading?: boolean;
13
12
  onChangeText?: (value: string) => void;
14
- icon?: IInputButtons;
15
- rightButtons?: ReactNode[];
16
13
  onSubmit?: (...params: any[]) => void;
14
+ placeholder?: string;
15
+ rightButtons?: ReactNode[];
16
+ title?: string;
17
+ value?: string;
17
18
  }
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { FileSearchInputProps } from './FileSearchInput.types';
3
- declare const FileSearchInput: ({ value, onSubmit, setLoadingFile, loadingFile, onLoadingFile, file, setFile, ...inputBaseProps }: FileSearchInputProps) => React.JSX.Element;
3
+ declare const FileSearchInput: ({ value, placeholder, onChangeText, onSubmit, setFile, fetchData, ...inputBaseProps }: FileSearchInputProps) => React.JSX.Element;
4
4
  export default FileSearchInput;
@@ -1,5 +1,5 @@
1
1
  function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
- var _excluded = ["value", "onSubmit", "setLoadingFile", "loadingFile", "onLoadingFile", "file", "setFile"];
2
+ var _excluded = ["value", "placeholder", "onChangeText", "onSubmit", "setFile", "fetchData"];
3
3
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
4
4
  function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator["return"] && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, "catch": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
5
5
  function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
@@ -29,6 +29,7 @@ import { FileIcon } from "../../../assets/images/icons/FileIcon";
29
29
  // Import types
30
30
 
31
31
  import { Button } from "../../button";
32
+ import FileStatusDisplay from "./FileStatusDisplay";
32
33
 
33
34
  // Import DocumentPicker for mobile platforms only
34
35
  var DocumentPicker = null;
@@ -37,17 +38,24 @@ if (Platform.OS !== 'web') {
37
38
  }
38
39
  var FileSearchInput = function FileSearchInput(_ref) {
39
40
  var value = _ref.value,
41
+ placeholder = _ref.placeholder,
42
+ onChangeText = _ref.onChangeText,
40
43
  onSubmit = _ref.onSubmit,
41
- setLoadingFile = _ref.setLoadingFile,
42
- loadingFile = _ref.loadingFile,
43
- onLoadingFile = _ref.onLoadingFile,
44
- file = _ref.file,
45
44
  setFile = _ref.setFile,
45
+ fetchData = _ref.fetchData,
46
46
  inputBaseProps = _objectWithoutProperties(_ref, _excluded);
47
- var _useState = useState(0),
47
+ var _useState = useState(null),
48
48
  _useState2 = _slicedToArray(_useState, 2),
49
- progress = _useState2[0],
50
- setProgress = _useState2[1];
49
+ file = _useState2[0],
50
+ setLocalFile = _useState2[1];
51
+ var _useState3 = useState(false),
52
+ _useState4 = _slicedToArray(_useState3, 2),
53
+ loadingFile = _useState4[0],
54
+ setLoadingFile = _useState4[1];
55
+ var _useState5 = useState(0),
56
+ _useState6 = _slicedToArray(_useState5, 2),
57
+ progress = _useState6[0],
58
+ setProgress = _useState6[1];
51
59
  var dropAreaRef = useRef(null);
52
60
  var fileInputRef = useRef(null);
53
61
  var progressAnim = useRef(new Animated.Value(0)).current;
@@ -62,20 +70,15 @@ var FileSearchInput = function FileSearchInput(_ref) {
62
70
  event.preventDefault();
63
71
  var files = event.dataTransfer.files;
64
72
  if (files.length > 0) {
65
- var _file = files[0]; // Tomar el primer archivo si se sueltan varios
73
+ var _file = files[0];
66
74
  startLoading(_file);
67
- if (onLoadingFile && typeof onLoadingFile === 'function') {
68
- onLoadingFile(_file, function () {
69
- return setFile(_file);
70
- });
71
- } else {
72
- setFile(_file);
73
- }
75
+ setFile(_file);
74
76
  }
75
77
  };
76
78
  var completeProgress = function completeProgress() {
77
79
  setProgress(100);
78
80
  animateProgress(100);
81
+ setLoadingFile(false);
79
82
  setTimeout(function () {
80
83
  setProgress(0);
81
84
  animateProgress(0);
@@ -90,7 +93,9 @@ var FileSearchInput = function FileSearchInput(_ref) {
90
93
  };
91
94
  var startLoading = function startLoading(pickedFile) {
92
95
  currentStep = 0;
96
+ setLoadingFile(true);
93
97
  setFile(pickedFile);
98
+ setLocalFile(pickedFile);
94
99
  setProgress(progressSteps[0]);
95
100
  animateProgress(progressSteps[0]);
96
101
  var progressInterval = setInterval(function () {
@@ -147,15 +152,7 @@ var FileSearchInput = function FileSearchInput(_ref) {
147
152
  uri: response[0].uri
148
153
  };
149
154
  startLoading(pickedFile);
150
-
151
- // If an onLoadingFile function is provided, call it
152
- if (onLoadingFile && typeof onLoadingFile === 'function') {
153
- onLoadingFile(pickedFile, function () {
154
- return setFile(pickedFile);
155
- });
156
- } else {
157
- setFile(pickedFile);
158
- }
155
+ setFile(pickedFile);
159
156
  _context.next = 20;
160
157
  break;
161
158
  case 17:
@@ -179,42 +176,42 @@ var FileSearchInput = function FileSearchInput(_ref) {
179
176
  var handleSendMessage = function handleSendMessage() {
180
177
  if (!loadingFile && (value === null || value === void 0 ? void 0 : value.trim()) !== '') {
181
178
  if (onSubmit) {
182
- onSubmit(fileInputRef.current);
179
+ onSubmit(value, fileInputRef.current);
183
180
  setProgress(0);
184
181
  animateProgress(0);
185
182
  setLoadingFile(false);
183
+ setLocalFile(null);
186
184
  }
187
185
  } else {
188
- Alert.alert("Message Incomplete", "Please wait for the file to finish loading or ensure the message is not empty.");
186
+ Alert.alert('Message Incomplete', 'Please wait for the file to finish loading or ensure the message is not empty.');
189
187
  }
190
188
  };
191
189
 
192
190
  // Define the right buttons for the input
193
- var rightButtons = [/*#__PURE__*/React.createElement(Button, {
194
- width: 48,
195
- typeStyle: "white",
196
- onPress: handleFileButtonClick,
197
- iconLeft: /*#__PURE__*/React.createElement(ClipboardIcon, {
198
- style: {
199
- width: 24,
200
- height: 24
201
- },
202
- fill: PRIMARY_100
203
- })
204
- })];
191
+ var rightButtons = [];
192
+ if (fetchData) {
193
+ rightButtons.push( /*#__PURE__*/React.createElement(Button, {
194
+ width: 48,
195
+ typeStyle: "white",
196
+ onPress: handleFileButtonClick,
197
+ iconLeft: /*#__PURE__*/React.createElement(ClipboardIcon, {
198
+ style: {
199
+ width: 24,
200
+ height: 24
201
+ },
202
+ fill: PRIMARY_100
203
+ })
204
+ }));
205
+ }
205
206
 
206
207
  // Handle file selection from the input - Web specific
207
208
  var handleFileSelect = function handleFileSelect(event) {
208
209
  var file = event.target.files[0];
209
210
  if (file) {
210
211
  startLoading(file);
211
- if (onLoadingFile && typeof onLoadingFile === 'function') {
212
- onLoadingFile(file, function () {
213
- return setFile(file);
214
- });
215
- } else {
216
- setFile(file);
217
- }
212
+ setFile(file);
213
+ setLocalFile(file);
214
+ uploadFile(file);
218
215
  }
219
216
  event.target.value = null;
220
217
  };
@@ -222,38 +219,68 @@ var FileSearchInput = function FileSearchInput(_ref) {
222
219
  // Function to handle file deletion
223
220
  var handleDeleteFile = function handleDeleteFile() {
224
221
  setFile(null);
222
+ setLocalFile(null);
225
223
  setProgress(0);
226
224
  animateProgress(0);
225
+ setLoadingFile(false);
227
226
  if (fileInputRef.current) {
228
227
  fileInputRef.current.value = null;
229
228
  }
230
229
  };
230
+
231
+ // Manejo de la carga de archivos
232
+ var uploadFile = /*#__PURE__*/function () {
233
+ var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(file) {
234
+ var formData, response, result;
235
+ return _regeneratorRuntime().wrap(function _callee2$(_context2) {
236
+ while (1) switch (_context2.prev = _context2.next) {
237
+ case 0:
238
+ if (!(!fetchData || !fetchData.url || !fetchData.method)) {
239
+ _context2.next = 3;
240
+ break;
241
+ }
242
+ Alert.alert('Fetch data is not properly defined.');
243
+ return _context2.abrupt("return");
244
+ case 3:
245
+ formData = new FormData();
246
+ formData.append(fetchData.file || 'file', file);
247
+ _context2.prev = 5;
248
+ _context2.next = 8;
249
+ return fetch(fetchData.url, {
250
+ method: fetchData.method,
251
+ body: formData
252
+ });
253
+ case 8:
254
+ response = _context2.sent;
255
+ _context2.next = 11;
256
+ return response.json();
257
+ case 11:
258
+ result = _context2.sent;
259
+ setFile(result);
260
+ completeProgress();
261
+ _context2.next = 19;
262
+ break;
263
+ case 16:
264
+ _context2.prev = 16;
265
+ _context2.t0 = _context2["catch"](5);
266
+ console.error('Error uploading file:', _context2.t0);
267
+ case 19:
268
+ case "end":
269
+ return _context2.stop();
270
+ }
271
+ }, _callee2, null, [[5, 16]]);
272
+ }));
273
+ return function uploadFile(_x) {
274
+ return _ref3.apply(this, arguments);
275
+ };
276
+ }();
231
277
  return /*#__PURE__*/React.createElement(View, {
232
278
  style: styles.container
233
- }, file && loadingFile ? /*#__PURE__*/React.createElement(View, {
234
- style: styles.fileNameContainer
235
- }, /*#__PURE__*/React.createElement(View, {
236
- style: styles.fileNameLeftContainer
237
- }, /*#__PURE__*/React.createElement(FileIcon, {
238
- style: styles.fileIcon
239
- }), /*#__PURE__*/React.createElement(View, {
240
- style: styles.fileNameLeftContent
241
- }, /*#__PURE__*/React.createElement(Text, {
242
- style: styles.fileNameText
243
- }, file.name), /*#__PURE__*/React.createElement(View, {
244
- style: styles.progressBarBackground
245
- }, /*#__PURE__*/React.createElement(Animated.View, {
246
- style: [styles.progressBarFill, {
247
- width: progressAnim.interpolate({
248
- inputRange: [0, 100],
249
- outputRange: ['0%', '100%']
250
- })
251
- }]
252
- })))), /*#__PURE__*/React.createElement(TouchableOpacity, {
253
- onPress: handleDeleteFile
254
- }, /*#__PURE__*/React.createElement(DeleteIcon, {
255
- style: styles.deleteIcon
256
- }))) : file && /*#__PURE__*/React.createElement(View, {
279
+ }, file && loadingFile ? /*#__PURE__*/React.createElement(FileStatusDisplay, {
280
+ file: file,
281
+ progressAnim: progressAnim,
282
+ handleDeleteFile: handleDeleteFile
283
+ }) : file && /*#__PURE__*/React.createElement(View, {
257
284
  style: styles.fileNameContainer
258
285
  }, /*#__PURE__*/React.createElement(View, {
259
286
  style: styles.fileNameLoadedLeftContainer
@@ -272,14 +299,15 @@ var FileSearchInput = function FileSearchInput(_ref) {
272
299
  style: styles.deleteIcon
273
300
  })))), /*#__PURE__*/React.createElement(View, {
274
301
  style: styles.inputContainer
275
- }, Platform.OS === "web" ? /*#__PURE__*/React.createElement("div", {
302
+ }, Platform.OS === 'web' ? /*#__PURE__*/React.createElement("div", {
276
303
  ref: dropAreaRef,
277
304
  onDrop: handleDrop
278
- }, /*#__PURE__*/React.createElement(InputBase, _extends({
279
- value: value
280
- }, inputBaseProps, {
305
+ }, /*#__PURE__*/React.createElement(InputBase, _extends({}, inputBaseProps, {
306
+ value: value,
307
+ onChangeText: onChangeText,
281
308
  onSubmit: handleSendMessage,
282
- rightButtons: rightButtons
309
+ rightButtons: rightButtons,
310
+ isLoading: loadingFile
283
311
  })), /*#__PURE__*/React.createElement("input", {
284
312
  type: "file",
285
313
  ref: fileInputRef,
@@ -287,11 +315,12 @@ var FileSearchInput = function FileSearchInput(_ref) {
287
315
  display: 'none'
288
316
  },
289
317
  onChange: handleFileSelect
290
- })) : /*#__PURE__*/React.createElement(InputBase, _extends({
291
- value: value
292
- }, inputBaseProps, {
318
+ })) : /*#__PURE__*/React.createElement(InputBase, _extends({}, inputBaseProps, {
319
+ value: value,
320
+ onChangeText: onChangeText,
293
321
  onSubmit: handleSendMessage,
294
- rightButtons: rightButtons
322
+ rightButtons: rightButtons,
323
+ isLoading: loadingFile
295
324
  }))));
296
325
  };
297
326
  export default FileSearchInput;
@@ -1,18 +1,20 @@
1
- /// <reference types="react" />
2
- import { IInputBase } from "../InputBase.types";
3
- interface IFile {
4
- name: string;
5
- size: number;
6
- type: string;
7
- uri: string;
8
- }
1
+ import { Animated } from 'react-native';
2
+ import { IInputBase } from '../InputBase.types';
3
+ export type FetchData = {
4
+ file: any;
5
+ url: string;
6
+ method: string;
7
+ };
9
8
  export interface FileSearchInputProps extends IInputBase {
10
- value?: string;
11
- onSubmit?: (message: string, file?: IFile) => void;
12
- file: IFile | null;
13
- setFile: React.Dispatch<React.SetStateAction<IFile | null>>;
14
- loadingFile: boolean;
15
- setLoadingFile: React.Dispatch<React.SetStateAction<boolean>>;
16
- onLoadingFile: (file: IFile, callback?: () => void) => void;
9
+ value: string;
10
+ setFile: (file: any) => void;
11
+ onChangeText: (text: string) => void;
12
+ onSubmit: (message: string, file?: any) => void;
13
+ placeholder: string;
14
+ fetchData?: FetchData;
15
+ }
16
+ export interface FileStatusDisplayProps {
17
+ file: any;
18
+ progressAnim: Animated.Value;
19
+ handleDeleteFile: () => void;
17
20
  }
18
- export {};
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { FileStatusDisplayProps } from './FileSearchInput.types';
3
+ declare const FileStatusDisplay: ({ file, progressAnim, handleDeleteFile, }: FileStatusDisplayProps) => React.JSX.Element;
4
+ export default FileStatusDisplay;
@@ -0,0 +1,35 @@
1
+ import React from 'react';
2
+ import { View, Text, TouchableOpacity, Animated } from "react-native-web";
3
+ import { styles } from "./FileSearchInput.styles";
4
+ import { DeleteIcon } from "../../../assets/images/icons/DeleteIcon";
5
+ import { FileIcon } from "../../../assets/images/icons/FileIcon";
6
+ var FileStatusDisplay = function FileStatusDisplay(_ref) {
7
+ var file = _ref.file,
8
+ progressAnim = _ref.progressAnim,
9
+ handleDeleteFile = _ref.handleDeleteFile;
10
+ return /*#__PURE__*/React.createElement(View, {
11
+ style: styles.fileNameContainer
12
+ }, /*#__PURE__*/React.createElement(View, {
13
+ style: styles.fileNameLeftContainer
14
+ }, /*#__PURE__*/React.createElement(FileIcon, {
15
+ style: styles.fileIcon
16
+ }), /*#__PURE__*/React.createElement(View, {
17
+ style: styles.fileNameLeftContent
18
+ }, /*#__PURE__*/React.createElement(Text, {
19
+ style: styles.fileNameText
20
+ }, file.name), /*#__PURE__*/React.createElement(View, {
21
+ style: styles.progressBarBackground
22
+ }, /*#__PURE__*/React.createElement(Animated.View, {
23
+ style: [styles.progressBarFill, {
24
+ width: progressAnim.interpolate({
25
+ inputRange: [0, 100],
26
+ outputRange: ['0%', '100%']
27
+ })
28
+ }]
29
+ })))), /*#__PURE__*/React.createElement(TouchableOpacity, {
30
+ onPress: handleDeleteFile
31
+ }, /*#__PURE__*/React.createElement(DeleteIcon, {
32
+ style: styles.deleteIcon
33
+ })));
34
+ };
35
+ export default FileStatusDisplay;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "etendo-ui-library",
3
- "version": "1.3.71",
3
+ "version": "1.3.73",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "android": "react-native run-android",