etendo-ui-library 1.3.29 → 1.3.31

package/dist-native/components/containers/index.d.ts

@@ -1,3 +1,4 @@
 import { Layout } from './layout';
 import { ButtonContainer } from './buttonContainer';
-export { Layout, ButtonContainer };
+import { SearchContainer } from './searchContainer';
+export { Layout, ButtonContainer, SearchContainer };

package/dist-native/components/containers/index.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"ButtonContainer",{enumerable:true,get:function get(){return _buttonContainer.ButtonContainer;}});Object.defineProperty(exports,"Layout",{enumerable:true,get:function get(){return _layout.Layout;}});var _layout=require("./layout");var _buttonContainer=require("./buttonContainer");
+Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"ButtonContainer",{enumerable:true,get:function get(){return _buttonContainer.ButtonContainer;}});Object.defineProperty(exports,"Layout",{enumerable:true,get:function get(){return _layout.Layout;}});Object.defineProperty(exports,"SearchContainer",{enumerable:true,get:function get(){return _searchContainer.SearchContainer;}});var _layout=require("./layout");var _buttonContainer=require("./buttonContainer");var _searchContainer=require("./searchContainer");

package/dist-native/components/containers/searchContainer/SearchContainer.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { ISearchContainer } from './SearchContainer.types';
+declare const SearchContainer: FC<ISearchContainer>;
+export default SearchContainer;

package/dist-native/components/containers/searchContainer/SearchContainer.default.d.ts

@@ -0,0 +1,2 @@
+import { ViewStyle } from 'react-native';
+export declare const DEFAULT_SEARCH_CONTAINER: ViewStyle;

package/dist-native/components/containers/searchContainer/SearchContainer.default.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,"__esModule",{value:true});exports.DEFAULT_SEARCH_CONTAINER=void 0;var DEFAULT_SEARCH_CONTAINER=exports.DEFAULT_SEARCH_CONTAINER={paddingVertical:16,paddingHorizontal:0,flexDirection:'row',justifyContent:'flex-start',gap:12,alignItems:'center',flexWrap:'wrap'};

package/dist-native/components/containers/searchContainer/SearchContainer.js

@@ -0,0 +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 _SearchContainer=require("./SearchContainer.default");var _SearchContainer2=require("./SearchContainer.styles");var _input=require("../../input");var _buttonContainer=require("../buttonContainer");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/containers/searchContainer/SearchContainer.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 SearchContainer=function SearchContainer(_ref){var value=_ref.value,components=_ref.components,style=_ref.style,_onSubmit=_ref.onSubmit,_ref$placeholder=_ref.placeholder,placeholder=_ref$placeholder===void 0?'':_ref$placeholder,_ref$height=_ref.height,height=_ref$height===void 0?50:_ref$height,widthSearchInput=_ref.widthSearchInput;var _useState=(0,_react.useState)(value?value:''),_useState2=(0,_slicedToArray2.default)(_useState,2),valueContainer=_useState2[0],setValueContainer=_useState2[1];return _react.default.createElement(_reactNative.View,{style:[_SearchContainer.DEFAULT_SEARCH_CONTAINER,style],__self:_this,__source:{fileName:_jsxFileName,lineNumber:21,columnNumber:5}},_react.default.createElement(_reactNative.View,{style:[_SearchContainer2.styles.inputContainer,widthSearchInput?{width:widthSearchInput}:null],__self:_this,__source:{fileName:_jsxFileName,lineNumber:22,columnNumber:7}},_react.default.createElement(_input.Input,{value:valueContainer,onChangeText:function onChangeText(valueChange){setValueContainer(valueChange);},onSubmit:function onSubmit(){return _onSubmit(valueContainer);},placeholder:placeholder,typeField:"textInputSearch",height:height,__self:_this,__source:{fileName:_jsxFileName,lineNumber:27,columnNumber:9}})),_react.default.createElement(_buttonContainer.ButtonContainer,{components:components,style:{paddingVertical:0},__self:_this,__source:{fileName:_jsxFileName,lineNumber:38,columnNumber:7}}));};var _default=exports.default=SearchContainer;

package/dist-native/components/containers/searchContainer/SearchContainer.styles.d.ts

@@ -0,0 +1,5 @@
+export declare const styles: {
+    inputContainer: {
+        width: "100%" | "50%";
+    };
+};

package/dist-native/components/containers/searchContainer/SearchContainer.styles.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _table_utils=require("../../../helpers/table_utils");var styles=exports.styles=_reactNative.StyleSheet.create({inputContainer:{width:_table_utils.isDeviceTablet?'50%':'100%'}});

package/dist-native/components/containers/searchContainer/SearchContainer.types.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { DimensionValue, StyleProp, ViewStyle } from 'react-native';
+export interface ISearchContainer {
+    components: ReactNode[];
+    style?: StyleProp<ViewStyle>;
+    value?: string;
+    onSubmit: (...params: any[]) => void;
+    placeholder?: string;
+    height?: number;
+    widthSearchInput?: DimensionValue;
+}

package/dist-native/components/containers/searchContainer/SearchContainer.types.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,"__esModule",{value:true});

package/dist-native/components/containers/searchContainer/index.d.ts

@@ -0,0 +1,2 @@
+import SearchContainer from './SearchContainer';
+export { SearchContainer };

package/dist-native/components/containers/searchContainer/index.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"SearchContainer",{enumerable:true,get:function get(){return _SearchContainer.default;}});var _SearchContainer=_interopRequireDefault(require("./SearchContainer"));

package/dist-native/components/modal/Modal.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { IModalProps } from './Modal.types';
-declare const Modal: ({ buttons, children, disableTapOutside, fullScreen, handleSave, imageHeader, labelCloseButton, labelSaveButton, setVisible, subtitle, title, visible, }: IModalProps) => React.JSX.Element;
+declare const Modal: ({ buttons, children, disableTapOutside, fullScreen, handleAction, imageHeader, labelCloseButton, labelActionButton, setVisible, subtitle, title, visible, }: IModalProps) => React.JSX.Element;
 export default Modal;

package/dist-native/components/modal/Modal.js

@@ -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 _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _button=require("../button");var _MaximizedView=_interopRequireDefault(require("./components/maximizedView/MaximizedView"));var _MinimizedView=_interopRequireDefault(require("./components/minimizedView/MinimizedView"));var _Modal=require("./Modal.styles");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/modal/Modal.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 Modal=function Modal(_ref){var buttons=_ref.buttons,children=_ref.children,_ref$disableTapOutsid=_ref.disableTapOutside,disableTapOutside=_ref$disableTapOutsid===void 0?false:_ref$disableTapOutsid,_ref$fullScreen=_ref.fullScreen,fullScreen=_ref$fullScreen===void 0?false:_ref$fullScreen,handleSave=_ref.handleSave,imageHeader=_ref.imageHeader,labelCloseButton=_ref.labelCloseButton,labelSaveButton=_ref.labelSaveButton,setVisible=_ref.setVisible,subtitle=_ref.subtitle,title=_ref.title,visible=_ref.visible;var _useState=(0,_react.useState)([_react.default.createElement(_button.Button,{typeStyle:'white',text:labelCloseButton,onPress:function onPress(){return setVisible(false);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:29,columnNumber:5}}),handleSave&&labelSaveButton?_react.default.createElement(_button.Button,{typeStyle:'white',text:labelSaveButton,onPress:handleSave,__self:_this,__source:{fileName:_jsxFileName,lineNumber:35,columnNumber:7}}):null]),_useState2=(0,_slicedToArray2.default)(_useState,2),buttonsToDisplay=_useState2[0],setButtonsToDisplay=_useState2[1];(0,_react.useEffect)(function(){if(buttons){setButtonsToDisplay([].concat((0,_toConsumableArray2.default)(buttons),(0,_toConsumableArray2.default)(buttonsToDisplay)));}},[]);return _react.default.createElement(_reactNative.Modal,{animationType:"fade",transparent:true,visible:visible,onRequestClose:function onRequestClose(){return setVisible(false);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:46,columnNumber:5}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_Modal.styles.modalContainer,activeOpacity:1,onPressOut:function onPressOut(){return!disableTapOutside&&setVisible(false);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:51,columnNumber:7}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:55,columnNumber:9}},_react.default.createElement(_reactNative.View,{style:[_Modal.styles.modalContent,fullScreen&&_Modal.styles.modalFullScreen],__self:_this,__source:{fileName:_jsxFileName,lineNumber:56,columnNumber:11}},fullScreen?_react.default.createElement(_MaximizedView.default,{imageHeader:imageHeader,title:title,subtitle:subtitle,children:children,buttonsToDisplay:buttonsToDisplay,setVisible:setVisible,__self:_this,__source:{fileName:_jsxFileName,lineNumber:59,columnNumber:15}}):_react.default.createElement(_MinimizedView.default,{imageHeader:imageHeader,title:title,subtitle:subtitle,children:children,buttonsToDisplay:buttonsToDisplay,__self:_this,__source:{fileName:_jsxFileName,lineNumber:68,columnNumber:15}})))));};var _default=exports.default=Modal;
+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 _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _button=require("../button");var _MaximizedView=_interopRequireDefault(require("./components/maximizedView/MaximizedView"));var _MinimizedView=_interopRequireDefault(require("./components/minimizedView/MinimizedView"));var _Modal=require("./Modal.styles");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/modal/Modal.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 Modal=function Modal(_ref){var buttons=_ref.buttons,children=_ref.children,_ref$disableTapOutsid=_ref.disableTapOutside,disableTapOutside=_ref$disableTapOutsid===void 0?false:_ref$disableTapOutsid,_ref$fullScreen=_ref.fullScreen,fullScreen=_ref$fullScreen===void 0?false:_ref$fullScreen,handleAction=_ref.handleAction,imageHeader=_ref.imageHeader,labelCloseButton=_ref.labelCloseButton,labelActionButton=_ref.labelActionButton,setVisible=_ref.setVisible,subtitle=_ref.subtitle,title=_ref.title,visible=_ref.visible;var hasActionButton=!!handleAction&&!!labelActionButton;var actionBtn=hasActionButton&&_react.default.createElement(_button.Button,{typeStyle:"white",text:labelActionButton,onPress:handleAction,__self:_this,__source:{fileName:_jsxFileName,lineNumber:31,columnNumber:5}});var butonsList=function butonsList(){return[_react.default.createElement(_button.Button,{typeStyle:'white',text:labelCloseButton,onPress:function onPress(){return setVisible(false);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:36,columnNumber:7}}),actionBtn].filter(Boolean);};var _useState=(0,_react.useState)(butonsList()),_useState2=(0,_slicedToArray2.default)(_useState,2),buttonsToDisplay=_useState2[0],setButtonsToDisplay=_useState2[1];(0,_react.useEffect)(function(){if(buttons){setButtonsToDisplay([].concat((0,_toConsumableArray2.default)(buttons),(0,_toConsumableArray2.default)(buttonsToDisplay)));}},[]);return _react.default.createElement(_reactNative.Modal,{animationType:"fade",transparent:true,visible:visible,onRequestClose:function onRequestClose(){return setVisible(false);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:54,columnNumber:5}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_Modal.styles.modalContainer,activeOpacity:1,onPressOut:function onPressOut(){return!disableTapOutside&&setVisible(false);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:59,columnNumber:7}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:63,columnNumber:9}},_react.default.createElement(_reactNative.View,{style:[_Modal.styles.modalContent,fullScreen&&_Modal.styles.modalFullScreen],__self:_this,__source:{fileName:_jsxFileName,lineNumber:64,columnNumber:11}},fullScreen?_react.default.createElement(_MaximizedView.default,{imageHeader:imageHeader,title:title,subtitle:subtitle,children:children,buttonsToDisplay:buttonsToDisplay,setVisible:setVisible,__self:_this,__source:{fileName:_jsxFileName,lineNumber:67,columnNumber:15}}):_react.default.createElement(_MinimizedView.default,{imageHeader:imageHeader,title:title,subtitle:subtitle,children:children,buttonsToDisplay:buttonsToDisplay,__self:_this,__source:{fileName:_jsxFileName,lineNumber:76,columnNumber:15}})))));};var _default=exports.default=Modal;

package/dist-native/components/modal/Modal.styles.d.ts

@@ -3,9 +3,7 @@ export declare const styles: {
         alignItems: "center";
         backgroundColor: string;
         flex: number;
-        height: "100%";
         justifyContent: "center";
-        width: "100%";
     };
     modalContent: {
         backgroundColor: string;
@@ -24,5 +22,6 @@ export declare const styles: {
         maxWidth: "100%";
         width: "100%";
         borderRadius: number;
+        paddingTop: number;
     };
 };

package/dist-native/components/modal/Modal.styles.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _colors=require("../../styles/colors");var _table_utils=require("../../helpers/table_utils");var styles=exports.styles=_reactNative.StyleSheet.create({modalContainer:{alignItems:'center',backgroundColor:'rgba(0, 0, 0, 0.5)',flex:1,height:'100%',justifyContent:'center',width:'100%'},modalContent:{backgroundColor:_colors.NEUTRAL_300,borderRadius:28,flexDirection:'column',height:'auto',justifyContent:'space-between',maxHeight:_table_utils.isDeviceTablet?'65%':'85%',maxWidth:'85%',padding:24,width:'auto'},modalFullScreen:{height:'100%',maxHeight:'100%',maxWidth:'100%',width:'100%',borderRadius:0}});
+Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _colors=require("../../styles/colors");var _table_utils=require("../../helpers/table_utils");var styles=exports.styles=_reactNative.StyleSheet.create({modalContainer:{alignItems:'center',backgroundColor:'rgba(0, 0, 0, 0.5)',flex:1,justifyContent:'center'},modalContent:{backgroundColor:_colors.NEUTRAL_300,borderRadius:28,flexDirection:'column',height:'auto',justifyContent:'space-between',maxHeight:_table_utils.isDeviceTablet?'65%':'85%',maxWidth:'85%',padding:0,width:'auto'},modalFullScreen:{height:'100%',maxHeight:'100%',maxWidth:'100%',width:'100%',borderRadius:0,paddingTop:0}});

package/dist-native/components/modal/Modal.types.d.ts

@@ -5,11 +5,11 @@ export interface IModalProps {
     children?: ReactNode;
     disableTapOutside?: boolean;
     fullScreen?: boolean;
-    handleSave?: any;
+    handleAction?: (...params: any[]) => void;
     imageHeader?: ReactNode;
     labelCloseButton: string;
-    labelSaveButton?: string;
-    setVisible: any;
+    labelActionButton?: string;
+    setVisible: (...params: any[]) => void;
     styles?: ViewStyle;
     subtitle?: string;
     title: string;

package/dist-native/components/modal/components/maximizedView/MaximizedView.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 _containers=require("../../../containers");var _MaximizedView=require("./MaximizedView.styles");var _button=require("../../../button");var _icons=require("../../../../assets/images/icons");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/modal/components/maximizedView/MaximizedView.tsx";var MaximizedView=function MaximizedView(_ref){var buttonsToDisplay=_ref.buttonsToDisplay,children=_ref.children,setVisible=_ref.setVisible,title=_ref.title;return _react.default.createElement(_reactNative.View,{style:{justifyContent:'flex-start'},__self:_this,__source:{fileName:_jsxFileName,lineNumber:16,columnNumber:5}},_react.default.createElement(_reactNative.View,{style:_MaximizedView.styles.headerContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:17,columnNumber:7}},_react.default.createElement(_reactNative.View,{style:_MaximizedView.styles.titleCloseContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:18,columnNumber:9}},_react.default.createElement(_button.Button,{typeStyle:'white',iconLeft:_react.default.createElement(_icons.CancelIcon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:21,columnNumber:23}}),onPress:function onPress(){return setVisible(false);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:19,columnNumber:11}}),_react.default.createElement(_reactNative.Text,{numberOfLines:1,style:_MaximizedView.styles.modalTitle,ellipsizeMode:"tail",__self:_this,__source:{fileName:_jsxFileName,lineNumber:24,columnNumber:11}},title)),(buttonsToDisplay==null?void 0:buttonsToDisplay.length)&&_react.default.createElement(_containers.ButtonContainer,{components:[buttonsToDisplay[buttonsToDisplay.length-1]],style:{justifyContent:'flex-end',paddingVertical:0},__self:_this,__source:{fileName:_jsxFileName,lineNumber:32,columnNumber:11}})),children&&_react.default.createElement(_reactNative.TouchableOpacity,{activeOpacity:1,style:_MaximizedView.styles.childrenModalContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:42,columnNumber:9}},_react.default.createElement(_reactNative.ScrollView,{style:{flexGrow:0},__self:_this,__source:{fileName:_jsxFileName,lineNumber:45,columnNumber:11}},_react.default.createElement(_reactNative.View,{onStartShouldSetResponder:function onStartShouldSetResponder(){return true;},__self:_this,__source:{fileName:_jsxFileName,lineNumber:46,columnNumber:13}},children))));};var _default=exports.default=MaximizedView;
+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 _containers=require("../../../containers");var _MaximizedView=require("./MaximizedView.styles");var _button=require("../../../button");var _icons=require("../../../../assets/images/icons");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/modal/components/maximizedView/MaximizedView.tsx";var MaximizedView=function MaximizedView(_ref){var buttonsToDisplay=_ref.buttonsToDisplay,children=_ref.children,setVisible=_ref.setVisible,title=_ref.title;var hasActionButton=!!buttonsToDisplay&&(buttonsToDisplay==null?void 0:buttonsToDisplay.length)>1;return _react.default.createElement(_reactNative.SafeAreaView,{style:{flex:1},__self:_this,__source:{fileName:_jsxFileName,lineNumber:23,columnNumber:5}},_react.default.createElement(_reactNative.View,{style:{justifyContent:'flex-start'},__self:_this,__source:{fileName:_jsxFileName,lineNumber:24,columnNumber:7}},_react.default.createElement(_reactNative.View,{style:_MaximizedView.styles.headerContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:25,columnNumber:9}},_react.default.createElement(_reactNative.View,{style:[_MaximizedView.styles.titleCloseContainer,{width:hasActionButton?'70%':'85%',marginRight:hasActionButton?16:0}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:26,columnNumber:11}},_react.default.createElement(_button.Button,{typeStyle:'white',iconLeft:_react.default.createElement(_icons.CancelIcon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:36,columnNumber:25}}),onPress:function onPress(){return setVisible(false);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:34,columnNumber:13}}),_react.default.createElement(_reactNative.Text,{numberOfLines:1,style:_MaximizedView.styles.modalTitle,ellipsizeMode:"tail",__self:_this,__source:{fileName:_jsxFileName,lineNumber:39,columnNumber:13}},title)),hasActionButton&&buttonsToDisplay&&_react.default.createElement(_containers.ButtonContainer,{components:[buttonsToDisplay[buttonsToDisplay.length-1]],style:{justifyContent:'flex-end',paddingVertical:0,flex:1},__self:_this,__source:{fileName:_jsxFileName,lineNumber:47,columnNumber:13}})),children&&_react.default.createElement(_reactNative.View,{style:_MaximizedView.styles.childrenModalContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:58,columnNumber:11}},_react.default.createElement(_reactNative.ScrollView,{style:{flexGrow:0},__self:_this,__source:{fileName:_jsxFileName,lineNumber:59,columnNumber:13}},_react.default.createElement(_reactNative.View,{onStartShouldSetResponder:function onStartShouldSetResponder(){return true;},__self:_this,__source:{fileName:_jsxFileName,lineNumber:60,columnNumber:15}},children)))));};var _default=exports.default=MaximizedView;

package/dist-native/components/modal/components/maximizedView/MaximizedView.styles.d.ts

@@ -1,10 +1,12 @@
 export declare const styles: {
     headerContainer: {
         flexDirection: "row";
-        paddingTop: number;
         justifyContent: "space-between";
-        width: "100%";
+        maxWidth: "100%";
+        paddingTop: number;
         alignItems: "center";
+        paddingHorizontal: number;
+        width: "100%";
     };
     titleCloseContainer: {
         flexDirection: "row";
@@ -19,17 +21,14 @@ export declare const styles: {
         textAlign: "center";
     };
     childrenModalContainer: {
-        borderBottomWidth: number;
-        maxHeight: "90%";
-        alignItems: "center";
-        borderBottomColor: string;
         borderTopColor: string;
         borderTopWidth: number;
         display: "flex";
         flexDirection: "column";
         justifyContent: "center";
-        marginBottom: number;
         paddingVertical: number;
-        flex: number;
+        paddingHorizontal: number;
+        width: "100%";
+        maxHeight: "97%";
     };
 };

package/dist-native/components/modal/components/maximizedView/MaximizedView.styles.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _MinimizedView=require("../minimizedView/MinimizedView.styles");var styles=exports.styles=_reactNative.StyleSheet.create({headerContainer:Object.assign({},_MinimizedView.styles.headerContainer,{flexDirection:'row',paddingTop:16,justifyContent:'space-between',width:'100%'}),titleCloseContainer:{flexDirection:'row'},modalTitle:Object.assign({},_MinimizedView.styles.modalTitle,{paddingBottom:0,alignSelf:'center'}),childrenModalContainer:Object.assign({},_MinimizedView.styles.childrenModalContainer,{borderBottomWidth:0,maxHeight:'90%'})});
+Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _MinimizedView=require("../minimizedView/MinimizedView.styles");var _colors=require("../../../../styles/colors");var styles=exports.styles=_reactNative.StyleSheet.create({headerContainer:Object.assign({},_MinimizedView.styles.headerContainer,{flexDirection:'row',justifyContent:'space-between',maxWidth:'100%',paddingTop:0}),titleCloseContainer:{flexDirection:'row'},modalTitle:Object.assign({},_MinimizedView.styles.modalTitle,{paddingBottom:0,alignSelf:'center'}),childrenModalContainer:{borderTopColor:_colors.NEUTRAL_400,borderTopWidth:1,display:'flex',flexDirection:'column',justifyContent:'center',paddingVertical:8,paddingHorizontal:24,width:'100%',maxHeight:'97%'}});

package/dist-native/components/modal/components/maximizedView/MaximizedView.types.d.ts

@@ -3,7 +3,7 @@ export interface IMaximizedViewProps {
     buttonsToDisplay?: ReactNode[];
     children?: ReactNode;
     imageHeader?: ReactNode;
-    setVisible: any;
+    setVisible: (...params: any[]) => void;
     subtitle?: string;
     title: string;
 }

package/dist-native/components/modal/components/minimizedView/MinimizedView.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 _containers=require("../../../containers");var _MinimizedView=require("./MinimizedView.styles");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/modal/components/minimizedView/MinimizedView.tsx";var MinimizedView=function MinimizedView(_ref){var buttonsToDisplay=_ref.buttonsToDisplay,children=_ref.children,imageHeader=_ref.imageHeader,subtitle=_ref.subtitle,title=_ref.title;return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement(_reactNative.View,{style:_MinimizedView.styles.headerContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:16,columnNumber:7}},imageHeader&&_react.default.createElement(_reactNative.View,{style:_MinimizedView.styles.imageHeaderContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:18,columnNumber:11}},imageHeader),_react.default.createElement(_reactNative.Text,{numberOfLines:1,style:_MinimizedView.styles.modalTitle,ellipsizeMode:"tail",__self:_this,__source:{fileName:_jsxFileName,lineNumber:20,columnNumber:9}},title),subtitle&&_react.default.createElement(_reactNative.Text,{numberOfLines:2,style:_MinimizedView.styles.modalSubtitle,ellipsizeMode:"tail",__self:_this,__source:{fileName:_jsxFileName,lineNumber:24,columnNumber:11}},subtitle)),children&&_react.default.createElement(_reactNative.View,{style:_MinimizedView.styles.childrenModalContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:33,columnNumber:9}},_react.default.createElement(_reactNative.TouchableOpacity,{activeOpacity:1,style:{maxHeight:'100%'},__self:_this,__source:{fileName:_jsxFileName,lineNumber:34,columnNumber:11}},_react.default.createElement(_reactNative.ScrollView,{style:{flexGrow:0},__self:_this,__source:{fileName:_jsxFileName,lineNumber:35,columnNumber:13}},_react.default.createElement(_reactNative.View,{onStartShouldSetResponder:function onStartShouldSetResponder(){return true;},__self:_this,__source:{fileName:_jsxFileName,lineNumber:36,columnNumber:15}},children)))),_react.default.createElement(_reactNative.View,{style:_MinimizedView.styles.buttonModalContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:41,columnNumber:7}},(buttonsToDisplay==null?void 0:buttonsToDisplay.length)&&_react.default.createElement(_containers.ButtonContainer,{components:buttonsToDisplay,style:{justifyContent:'flex-end',paddingVertical:0},__self:_this,__source:{fileName:_jsxFileName,lineNumber:43,columnNumber:11}})));};var _default=exports.default=MinimizedView;
+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 _containers=require("../../../containers");var _MinimizedView=require("./MinimizedView.styles");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/modal/components/minimizedView/MinimizedView.tsx";var MinimizedView=function MinimizedView(_ref){var buttonsToDisplay=_ref.buttonsToDisplay,children=_ref.children,imageHeader=_ref.imageHeader,subtitle=_ref.subtitle,title=_ref.title;return _react.default.createElement(_reactNative.View,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:21,columnNumber:5}},_react.default.createElement(_reactNative.View,{style:_MinimizedView.styles.headerContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:22,columnNumber:7}},imageHeader&&_react.default.createElement(_reactNative.View,{style:_MinimizedView.styles.imageHeaderContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:24,columnNumber:11}},imageHeader),_react.default.createElement(_reactNative.Text,{numberOfLines:1,style:_MinimizedView.styles.modalTitle,ellipsizeMode:"tail",__self:_this,__source:{fileName:_jsxFileName,lineNumber:26,columnNumber:9}},title),subtitle&&_react.default.createElement(_reactNative.Text,{numberOfLines:2,style:_MinimizedView.styles.modalSubtitle,ellipsizeMode:"tail",__self:_this,__source:{fileName:_jsxFileName,lineNumber:30,columnNumber:11}},subtitle)),children&&_react.default.createElement(_reactNative.View,{style:_MinimizedView.styles.childrenModalContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:39,columnNumber:9}},_react.default.createElement(_reactNative.TouchableOpacity,{activeOpacity:1,style:{maxHeight:'100%'},__self:_this,__source:{fileName:_jsxFileName,lineNumber:40,columnNumber:11}},_react.default.createElement(_reactNative.ScrollView,{style:{flexGrow:0},__self:_this,__source:{fileName:_jsxFileName,lineNumber:41,columnNumber:13}},_react.default.createElement(_reactNative.View,{onStartShouldSetResponder:function onStartShouldSetResponder(){return true;},__self:_this,__source:{fileName:_jsxFileName,lineNumber:42,columnNumber:15}},children)))),_react.default.createElement(_reactNative.View,{style:_MinimizedView.styles.buttonModalContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:47,columnNumber:7}},(buttonsToDisplay==null?void 0:buttonsToDisplay.length)&&_react.default.createElement(_containers.ButtonContainer,{components:buttonsToDisplay,style:{justifyContent:'flex-end',paddingVertical:0},__self:_this,__source:{fileName:_jsxFileName,lineNumber:49,columnNumber:11}})));};var _default=exports.default=MinimizedView;

package/dist-native/components/modal/components/minimizedView/MinimizedView.styles.d.ts

@@ -3,6 +3,9 @@ export declare const styles: {
         alignItems: "center";
         flexDirection: "column";
         justifyContent: "space-between";
+        paddingHorizontal: number;
+        paddingTop: number;
+        width: "100%";
     };
     imageHeaderContainer: {
         alignItems: "center";
@@ -34,17 +37,17 @@ export declare const styles: {
         borderBottomWidth: number;
         borderTopColor: string;
         borderTopWidth: number;
-        display: "flex";
         flexDirection: "column";
         justifyContent: "center";
-        marginBottom: number;
+        maxHeight: number;
+        paddingHorizontal: number;
         paddingVertical: number;
-        flex: number;
     };
     buttonModalContainer: {
         flexDirection: "row";
         justifyContent: "flex-end";
         height: "auto";
+        padding: number;
     };
     buttonContainer: {
         width: "40%" | "45%";

package/dist-native/components/modal/components/minimizedView/MinimizedView.styles.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _colors=require("../../../../styles/colors");var _table_utils=require("../../../../helpers/table_utils");var styles=exports.styles=_reactNative.StyleSheet.create({headerContainer:{alignItems:'center',flexDirection:'column',justifyContent:'space-between'},imageHeaderContainer:{alignItems:'center',flexDirection:'row',justifyContent:'center',paddingBottom:16},modalTitle:{alignSelf:'flex-start',color:_colors.PRIMARY_100,fontSize:22,fontWeight:'500',maxWidth:'100%',paddingBottom:12,textAlign:'center'},modalSubtitle:{alignSelf:'flex-start',color:_colors.NEUTRAL_800,fontSize:14,fontWeight:'500',maxWidth:'95%',textAlign:'left',marginBottom:16},childrenModalContainer:{alignItems:'center',borderBottomColor:_colors.NEUTRAL_400,borderBottomWidth:1,borderTopColor:_colors.NEUTRAL_400,borderTopWidth:1,display:'flex',flexDirection:'column',justifyContent:'center',marginBottom:12,paddingVertical:8,flex:1},buttonModalContainer:{flexDirection:'row',justifyContent:'flex-end',height:'auto'},buttonContainer:{width:_table_utils.isDeviceTablet?'40%':'45%'}});
+Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var _colors=require("../../../../styles/colors");var _table_utils=require("../../../../helpers/table_utils");var DIFFERENCE_HEIGHT=500;var styles=exports.styles=_reactNative.StyleSheet.create({headerContainer:{alignItems:'center',flexDirection:'column',justifyContent:'space-between',paddingHorizontal:24,paddingTop:24,width:'100%'},imageHeaderContainer:{alignItems:'center',flexDirection:'row',justifyContent:'center',paddingBottom:12},modalTitle:{alignSelf:'flex-start',color:_colors.PRIMARY_100,fontSize:22,fontWeight:'500',maxWidth:'100%',paddingBottom:12,textAlign:'center'},modalSubtitle:{alignSelf:'flex-start',color:_colors.NEUTRAL_800,fontSize:14,fontWeight:'500',maxWidth:'95%',textAlign:'left',marginBottom:16},childrenModalContainer:{alignItems:'center',borderBottomColor:_colors.NEUTRAL_400,borderBottomWidth:1,borderTopColor:_colors.NEUTRAL_400,borderTopWidth:1,flexDirection:'column',justifyContent:'center',maxHeight:_reactNative.Dimensions.get('window').height-DIFFERENCE_HEIGHT,paddingHorizontal:24,paddingVertical:8},buttonModalContainer:{flexDirection:'row',justifyContent:'flex-end',height:'auto',padding:12},buttonContainer:{width:_table_utils.isDeviceTablet?'40%':'45%'}});

package/dist-web/components/containers/index.d.ts

@@ -1,3 +1,4 @@
 import { Layout } from './layout';
 import { ButtonContainer } from './buttonContainer';
-export { Layout, ButtonContainer };
+import { SearchContainer } from './searchContainer';
+export { Layout, ButtonContainer, SearchContainer };

package/dist-web/components/containers/index.js

@@ -1,3 +1,4 @@
 import { Layout } from "./layout";
 import { ButtonContainer } from "./buttonContainer";
-export { Layout, ButtonContainer };
+import { SearchContainer } from "./searchContainer";
+export { Layout, ButtonContainer, SearchContainer };

package/dist-web/components/containers/searchContainer/SearchContainer.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { ISearchContainer } from './SearchContainer.types';
+declare const SearchContainer: FC<ISearchContainer>;
+export default SearchContainer;

package/dist-web/components/containers/searchContainer/SearchContainer.default.d.ts

@@ -0,0 +1,2 @@
+import { ViewStyle } from 'react-native';
+export declare const DEFAULT_SEARCH_CONTAINER: ViewStyle;

package/dist-web/components/containers/searchContainer/SearchContainer.default.js

@@ -0,0 +1,9 @@
+export var DEFAULT_SEARCH_CONTAINER = {
+  paddingVertical: 16,
+  paddingHorizontal: 0,
+  flexDirection: 'row',
+  justifyContent: 'flex-start',
+  gap: 12,
+  alignItems: 'center',
+  flexWrap: 'wrap'
+};

package/dist-web/components/containers/searchContainer/SearchContainer.js

@@ -0,0 +1,51 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+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 React, { useState } from 'react';
+import { View } from "react-native-web";
+import { DEFAULT_SEARCH_CONTAINER } from "./SearchContainer.default";
+import { styles } from "./SearchContainer.styles";
+import { Input } from "../../input";
+import { ButtonContainer } from "../buttonContainer";
+var SearchContainer = function SearchContainer(_ref) {
+  var value = _ref.value,
+    components = _ref.components,
+    style = _ref.style,
+    _onSubmit = _ref.onSubmit,
+    _ref$placeholder = _ref.placeholder,
+    placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? 50 : _ref$height,
+    widthSearchInput = _ref.widthSearchInput;
+  var _useState = useState(value ? value : ''),
+    _useState2 = _slicedToArray(_useState, 2),
+    valueContainer = _useState2[0],
+    setValueContainer = _useState2[1];
+  return /*#__PURE__*/React.createElement(View, {
+    style: [DEFAULT_SEARCH_CONTAINER, style]
+  }, /*#__PURE__*/React.createElement(View, {
+    style: [styles.inputContainer, widthSearchInput ? {
+      width: widthSearchInput
+    } : null]
+  }, /*#__PURE__*/React.createElement(Input, {
+    value: valueContainer,
+    onChangeText: function onChangeText(valueChange) {
+      setValueContainer(valueChange);
+    },
+    onSubmit: function onSubmit() {
+      return _onSubmit(valueContainer);
+    },
+    placeholder: placeholder,
+    typeField: "textInputSearch",
+    height: height
+  })), /*#__PURE__*/React.createElement(ButtonContainer, {
+    components: components,
+    style: {
+      paddingVertical: 0
+    }
+  }));
+};
+export default SearchContainer;

package/dist-web/components/containers/searchContainer/SearchContainer.styles.d.ts

@@ -0,0 +1,5 @@
+export declare const styles: {
+    inputContainer: {
+        width: "100%" | "50%";
+    };
+};

package/dist-web/components/containers/searchContainer/SearchContainer.styles.js

@@ -0,0 +1,7 @@
+import { StyleSheet } from "react-native-web";
+import { isDeviceTablet } from "../../../helpers/table_utils";
+export var styles = StyleSheet.create({
+  inputContainer: {
+    width: isDeviceTablet ? '50%' : '100%'
+  }
+});

package/dist-web/components/containers/searchContainer/SearchContainer.types.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { DimensionValue, StyleProp, ViewStyle } from 'react-native';
+export interface ISearchContainer {
+    components: ReactNode[];
+    style?: StyleProp<ViewStyle>;
+    value?: string;
+    onSubmit: (...params: any[]) => void;
+    placeholder?: string;
+    height?: number;
+    widthSearchInput?: DimensionValue;
+}

package/dist-web/components/containers/searchContainer/SearchContainer.types.js

@@ -0,0 +1 @@
+export {};

package/dist-web/components/containers/searchContainer/index.d.ts

@@ -0,0 +1,2 @@
+import SearchContainer from './SearchContainer';
+export { SearchContainer };

package/dist-web/components/containers/searchContainer/index.js

@@ -0,0 +1,2 @@
+import SearchContainer from "./SearchContainer";
+export { SearchContainer };

package/dist-web/components/modal/Modal.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { IModalProps } from './Modal.types';
-declare const Modal: ({ buttons, children, disableTapOutside, fullScreen, handleSave, imageHeader, labelCloseButton, labelSaveButton, setVisible, subtitle, title, visible, }: IModalProps) => React.JSX.Element;
+declare const Modal: ({ buttons, children, disableTapOutside, fullScreen, handleAction, imageHeader, labelCloseButton, labelActionButton, setVisible, subtitle, title, visible, }: IModalProps) => React.JSX.Element;
 export default Modal;

package/dist-web/components/modal/Modal.js

@@ -21,25 +21,30 @@ var Modal = function Modal(_ref) {
     disableTapOutside = _ref$disableTapOutsid === void 0 ? false : _ref$disableTapOutsid,
     _ref$fullScreen = _ref.fullScreen,
     fullScreen = _ref$fullScreen === void 0 ? false : _ref$fullScreen,
-    handleSave = _ref.handleSave,
+    handleAction = _ref.handleAction,
     imageHeader = _ref.imageHeader,
     labelCloseButton = _ref.labelCloseButton,
-    labelSaveButton = _ref.labelSaveButton,
+    labelActionButton = _ref.labelActionButton,
     setVisible = _ref.setVisible,
     subtitle = _ref.subtitle,
     title = _ref.title,
     visible = _ref.visible;
-  var _useState = useState([/*#__PURE__*/React.createElement(Button, {
+  var hasActionButton = !!handleAction && !!labelActionButton;
+  var actionBtn = hasActionButton && /*#__PURE__*/React.createElement(Button, {
+    typeStyle: "white",
+    text: labelActionButton,
+    onPress: handleAction
+  });
+  var butonsList = function butonsList() {
+    return [/*#__PURE__*/React.createElement(Button, {
       typeStyle: 'white',
       text: labelCloseButton,
       onPress: function onPress() {
         return setVisible(false);
       }
-    }), handleSave && labelSaveButton ? /*#__PURE__*/React.createElement(Button, {
-      typeStyle: 'white',
-      text: labelSaveButton,
-      onPress: handleSave
-    }) : null]),
+    }), actionBtn].filter(Boolean);
+  };
+  var _useState = useState(butonsList()),
     _useState2 = _slicedToArray(_useState, 2),
     buttonsToDisplay = _useState2[0],
     setButtonsToDisplay = _useState2[1];

package/dist-web/components/modal/Modal.styles.d.ts

@@ -3,9 +3,7 @@ export declare const styles: {
         alignItems: "center";
         backgroundColor: string;
         flex: number;
-        height: "100%";
         justifyContent: "center";
-        width: "100%";
     };
     modalContent: {
         backgroundColor: string;
@@ -24,5 +22,6 @@ export declare const styles: {
         maxWidth: "100%";
         width: "100%";
         borderRadius: number;
+        paddingTop: number;
     };
 };

package/dist-web/components/modal/Modal.styles.js

@@ -6,9 +6,7 @@ export var styles = StyleSheet.create({
     alignItems: 'center',
     backgroundColor: 'rgba(0, 0, 0, 0.5)',
     flex: 1,
-    height: '100%',
-    justifyContent: 'center',
-    width: '100%'
+    justifyContent: 'center'
   },
   modalContent: {
     backgroundColor: NEUTRAL_300,
@@ -18,7 +16,7 @@ export var styles = StyleSheet.create({
     justifyContent: 'space-between',
     maxHeight: isDeviceTablet ? '65%' : '85%',
     maxWidth: '85%',
-    padding: 24,
+    padding: 0,
     width: 'auto'
   },
   modalFullScreen: {
@@ -26,6 +24,7 @@ export var styles = StyleSheet.create({
     maxHeight: '100%',
     maxWidth: '100%',
     width: '100%',
-    borderRadius: 0
+    borderRadius: 0,
+    paddingTop: 0
   }
 });

package/dist-web/components/modal/Modal.types.d.ts

@@ -5,11 +5,11 @@ export interface IModalProps {
     children?: ReactNode;
     disableTapOutside?: boolean;
     fullScreen?: boolean;
-    handleSave?: any;
+    handleAction?: (...params: any[]) => void;
     imageHeader?: ReactNode;
     labelCloseButton: string;
-    labelSaveButton?: string;
-    setVisible: any;
+    labelActionButton?: string;
+    setVisible: (...params: any[]) => void;
     styles?: ViewStyle;
     subtitle?: string;
     title: string;

package/dist-web/components/modal/components/maximizedView/MaximizedView.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ScrollView, Text, TouchableOpacity, View } from "react-native-web";
+import { SafeAreaView, ScrollView, Text, View } from "react-native-web";
 import { ButtonContainer } from "../../../containers";
 import { styles } from "./MaximizedView.styles";
 import { Button } from "../../../button";
@@ -9,14 +9,22 @@ var MaximizedView = function MaximizedView(_ref) {
     children = _ref.children,
     setVisible = _ref.setVisible,
     title = _ref.title;
-  return /*#__PURE__*/React.createElement(View, {
+  var hasActionButton = !!buttonsToDisplay && (buttonsToDisplay === null || buttonsToDisplay === void 0 ? void 0 : buttonsToDisplay.length) > 1;
+  return /*#__PURE__*/React.createElement(SafeAreaView, {
+    style: {
+      flex: 1
+    }
+  }, /*#__PURE__*/React.createElement(View, {
     style: {
       justifyContent: 'flex-start'
     }
   }, /*#__PURE__*/React.createElement(View, {
     style: styles.headerContainer
   }, /*#__PURE__*/React.createElement(View, {
-    style: styles.titleCloseContainer
+    style: [styles.titleCloseContainer, {
+      width: hasActionButton ? '70%' : '85%',
+      marginRight: hasActionButton ? 16 : 0
+    }]
   }, /*#__PURE__*/React.createElement(Button, {
     typeStyle: 'white',
     iconLeft: /*#__PURE__*/React.createElement(CancelIcon, null),
@@ -27,14 +35,14 @@ var MaximizedView = function MaximizedView(_ref) {
     numberOfLines: 1,
     style: styles.modalTitle,
     ellipsizeMode: "tail"
-  }, title)), (buttonsToDisplay === null || buttonsToDisplay === void 0 ? void 0 : buttonsToDisplay.length) && /*#__PURE__*/React.createElement(ButtonContainer, {
+  }, title)), hasActionButton && buttonsToDisplay && /*#__PURE__*/React.createElement(ButtonContainer, {
     components: [buttonsToDisplay[buttonsToDisplay.length - 1]],
     style: {
       justifyContent: 'flex-end',
-      paddingVertical: 0
+      paddingVertical: 0,
+      flex: 1
     }
-  })), children && /*#__PURE__*/React.createElement(TouchableOpacity, {
-    activeOpacity: 1,
+  })), children && /*#__PURE__*/React.createElement(View, {
     style: styles.childrenModalContainer
   }, /*#__PURE__*/React.createElement(ScrollView, {
     style: {
@@ -44,6 +52,6 @@ var MaximizedView = function MaximizedView(_ref) {
     onStartShouldSetResponder: function onStartShouldSetResponder() {
       return true;
     }
-  }, children))));
+  }, children)))));
 };
 export default MaximizedView;

package/dist-web/components/modal/components/maximizedView/MaximizedView.styles.d.ts

@@ -1,10 +1,12 @@
 export declare const styles: {
     headerContainer: {
         flexDirection: "row";
-        paddingTop: number;
         justifyContent: "space-between";
-        width: "100%";
+        maxWidth: "100%";
+        paddingTop: number;
         alignItems: "center";
+        paddingHorizontal: number;
+        width: "100%";
     };
     titleCloseContainer: {
         flexDirection: "row";
@@ -19,17 +21,14 @@ export declare const styles: {
         textAlign: "center";
     };
     childrenModalContainer: {
-        borderBottomWidth: number;
-        maxHeight: "90%";
-        alignItems: "center";
-        borderBottomColor: string;
         borderTopColor: string;
         borderTopWidth: number;
         display: "flex";
         flexDirection: "column";
         justifyContent: "center";
-        marginBottom: number;
         paddingVertical: number;
-        flex: number;
+        paddingHorizontal: number;
+        width: "100%";
+        maxHeight: "97%";
     };
 };

package/dist-web/components/modal/components/maximizedView/MaximizedView.styles.js

@@ -6,12 +6,13 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { StyleSheet } from "react-native-web";
 import { styles as modalBasicStyles } from "../minimizedView/MinimizedView.styles";
+import { NEUTRAL_400 } from "../../../../styles/colors";
 export var styles = StyleSheet.create({
   headerContainer: _objectSpread(_objectSpread({}, modalBasicStyles.headerContainer), {}, {
     flexDirection: 'row',
-    paddingTop: 16,
     justifyContent: 'space-between',
-    width: '100%'
+    maxWidth: '100%',
+    paddingTop: 0
   }),
   titleCloseContainer: {
     flexDirection: 'row'
@@ -20,8 +21,15 @@ export var styles = StyleSheet.create({
     paddingBottom: 0,
     alignSelf: 'center'
   }),
-  childrenModalContainer: _objectSpread(_objectSpread({}, modalBasicStyles.childrenModalContainer), {}, {
-    borderBottomWidth: 0,
-    maxHeight: '90%'
-  })
+  childrenModalContainer: {
+    borderTopColor: NEUTRAL_400,
+    borderTopWidth: 1,
+    display: 'flex',
+    flexDirection: 'column',
+    justifyContent: 'center',
+    paddingVertical: 8,
+    paddingHorizontal: 24,
+    width: '100%',
+    maxHeight: '97%'
+  }
 });

package/dist-web/components/modal/components/maximizedView/MaximizedView.types.d.ts

@@ -3,7 +3,7 @@ export interface IMaximizedViewProps {
     buttonsToDisplay?: ReactNode[];
     children?: ReactNode;
     imageHeader?: ReactNode;
-    setVisible: any;
+    setVisible: (...params: any[]) => void;
     subtitle?: string;
     title: string;
 }

package/dist-web/components/modal/components/minimizedView/MinimizedView.js

@@ -8,7 +8,7 @@ var MinimizedView = function MinimizedView(_ref) {
     imageHeader = _ref.imageHeader,
     subtitle = _ref.subtitle,
     title = _ref.title;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
+  return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
     style: styles.headerContainer
   }, imageHeader && /*#__PURE__*/React.createElement(View, {
     style: styles.imageHeaderContainer

package/dist-web/components/modal/components/minimizedView/MinimizedView.styles.d.ts

@@ -3,6 +3,9 @@ export declare const styles: {
         alignItems: "center";
         flexDirection: "column";
         justifyContent: "space-between";
+        paddingHorizontal: number;
+        paddingTop: number;
+        width: "100%";
     };
     imageHeaderContainer: {
         alignItems: "center";
@@ -34,17 +37,17 @@ export declare const styles: {
         borderBottomWidth: number;
         borderTopColor: string;
         borderTopWidth: number;
-        display: "flex";
         flexDirection: "column";
         justifyContent: "center";
-        marginBottom: number;
+        maxHeight: number;
+        paddingHorizontal: number;
         paddingVertical: number;
-        flex: number;
     };
     buttonModalContainer: {
         flexDirection: "row";
         justifyContent: "flex-end";
         height: "auto";
+        padding: number;
     };
     buttonContainer: {
         width: "40%" | "45%";

package/dist-web/components/modal/components/minimizedView/MinimizedView.styles.js

@@ -1,17 +1,21 @@
-import { StyleSheet } from "react-native-web";
+import { Dimensions, StyleSheet } from "react-native-web";
 import { NEUTRAL_400, NEUTRAL_800, PRIMARY_100 } from "../../../../styles/colors";
 import { isDeviceTablet } from "../../../../helpers/table_utils";
+var DIFFERENCE_HEIGHT = 500;
 export var styles = StyleSheet.create({
   headerContainer: {
     alignItems: 'center',
     flexDirection: 'column',
-    justifyContent: 'space-between'
+    justifyContent: 'space-between',
+    paddingHorizontal: 24,
+    paddingTop: 24,
+    width: '100%'
   },
   imageHeaderContainer: {
     alignItems: 'center',
     flexDirection: 'row',
     justifyContent: 'center',
-    paddingBottom: 16
+    paddingBottom: 12
   },
   modalTitle: {
     alignSelf: 'flex-start',
@@ -37,17 +41,17 @@ export var styles = StyleSheet.create({
     borderBottomWidth: 1,
     borderTopColor: NEUTRAL_400,
     borderTopWidth: 1,
-    display: 'flex',
     flexDirection: 'column',
     justifyContent: 'center',
-    marginBottom: 12,
-    paddingVertical: 8,
-    flex: 1
+    maxHeight: Dimensions.get('window').height - DIFFERENCE_HEIGHT,
+    paddingHorizontal: 24,
+    paddingVertical: 8
   },
   buttonModalContainer: {
     flexDirection: 'row',
     justifyContent: 'flex-end',
-    height: 'auto'
+    height: 'auto',
+    padding: 12
   },
   buttonContainer: {
     width: isDeviceTablet ? '40%' : '45%'

package/package.json

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