etendo-ui-library 1.3.57 → 1.3.59

package/dist-native/components/cards/Cards.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _asyncToGenerator2=_interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _Cards=require("./Cards.style");var _SkeletonCard=_interopRequireDefault(require("./components/card/components/skeletonCard/SkeletonCard"));var _SwitchStateCards=_interopRequireDefault(require("./components/card/components/switchStateCards/SwitchStateCards"));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/cards/Cards.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 SCROLL_EVENT_THROTTLE=16;var BUFFER=50;var Cards=function Cards(_ref){var data=_ref.data,metadata=_ref.metadata,title=_ref.title,onPressCard=_ref.onPressCard,cardsHeight=_ref.cardsHeight,textEmptyCards=_ref.textEmptyCards,commentEmptyCards=_ref.commentEmptyCards,onLoadMoreData=_ref.onLoadMoreData,onAddNewData=_ref.onAddNewData,backgroundColor=_ref.backgroundColor,currentPage=_ref.currentPage,pageSize=_ref.pageSize,isLoading=_ref.isLoading,isLoadingMoreData=_ref.isLoadingMoreData;var _useState=(0,_react.useState)(0),_useState2=(0,_slicedToArray2.default)(_useState,2),containerHeight=_useState2[0],setContainerHeight=_useState2[1];var _useState3=(0,_react.useState)(0),_useState4=(0,_slicedToArray2.default)(_useState3,2),contentHeight=_useState4[0],setContentHeight=_useState4[1];var scrollViewRef=(0,_react.useRef)(null);(0,_react.useEffect)(function(){if(isLoading&&data.length){var _scrollViewRef$curren;(_scrollViewRef$curren=scrollViewRef.current)==null?void 0:_scrollViewRef$curren.scrollToEnd({animated:true});}},[isLoading]);(0,_react.useEffect)(function(){if(containerHeight>contentHeight&&data.length){handleLoadMore();}},[containerHeight,contentHeight,data]);var handleLoadMore=function(){var _ref2=(0,_asyncToGenerator2.default)(function*(){if(!isLoading&&onLoadMoreData&&isLoadingMoreData){onLoadMoreData(currentPage,pageSize);}});return function handleLoadMore(){return _ref2.apply(this,arguments);};}();var isAtEndOfScroll=function isAtEndOfScroll(_ref3){var layoutMeasurement=_ref3.layoutMeasurement,contentOffset=_ref3.contentOffset,contentSize=_ref3.contentSize;return layoutMeasurement.height+contentOffset.y>=contentSize.height-BUFFER;};var onScroll=function onScroll(event){if(isAtEndOfScroll(event.nativeEvent)){handleLoadMore();}};var onLayout=function onLayout(event){var height=event.nativeEvent.layout.height;setContainerHeight(height);};return _react.default.createElement(_reactNative.View,{onLayout:onLayout,style:[{maxHeight:cardsHeight},_Cards.styles.container,{backgroundColor:backgroundColor}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:81,columnNumber:5}},(title||onAddNewData)&&_react.default.createElement(_reactNative.View,{style:_Cards.styles.titleContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:89,columnNumber:9}},title&&_react.default.createElement(_reactNative.View,{style:_Cards.styles.titleTextContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:91,columnNumber:13}},_react.default.createElement(_reactNative.Text,{style:_Cards.styles.title,__self:_this,__source:{fileName:_jsxFileName,lineNumber:92,columnNumber:15}},title),_react.default.createElement(_reactNative.Text,{style:_Cards.styles.title,__self:_this,__source:{fileName:_jsxFileName,lineNumber:93,columnNumber:15}}," (",data.length,")")),_react.default.createElement(_reactNative.View,{style:_Cards.styles.buttonContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:96,columnNumber:11}},onAddNewData&&_react.default.createElement(_button.Button,{onPress:onAddNewData,typeStyle:'primary',height:40,width:40,iconLeft:_react.default.createElement(_icons.MoreIcon,{style:_Cards.styles.plus,__self:_this,__source:{fileName:_jsxFileName,lineNumber:103,columnNumber:27}}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:98,columnNumber:15}}))),_react.default.createElement(_reactNative.ScrollView,{ref:scrollViewRef,style:_Cards.styles.containerFlex,onScroll:onScroll,scrollEventThrottle:SCROLL_EVENT_THROTTLE,onContentSizeChange:function onContentSizeChange(contentWidth,contentHeight){return setContentHeight(contentHeight);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:109,columnNumber:7}},_react.default.createElement(_SwitchStateCards.default,{data:data,isLoading:isLoading,metadata:metadata,onPressCard:onPressCard,commentEmptyCards:commentEmptyCards,textEmptyCards:textEmptyCards,tableHeight:containerHeight,isTitle:!!title&&!!onAddNewData,__self:_this,__source:{fileName:_jsxFileName,lineNumber:117,columnNumber:9}}),!!data.length&&isLoading&&isLoadingMoreData&&_react.default.createElement(_SkeletonCard.default,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:127,columnNumber:61}})));};var _default=exports.default=Cards;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _asyncToGenerator2=_interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _Cards=require("./Cards.style");var _SkeletonCard=_interopRequireDefault(require("./components/card/components/skeletonCard/SkeletonCard"));var _SwitchStateCards=_interopRequireDefault(require("./components/card/components/switchStateCards/SwitchStateCards"));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/cards/Cards.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 SCROLL_EVENT_THROTTLE=16;var BUFFER=50;var Cards=function Cards(_ref){var data=_ref.data,metadata=_ref.metadata,title=_ref.title,onPressCard=_ref.onPressCard,cardsHeight=_ref.cardsHeight,textEmptyCards=_ref.textEmptyCards,commentEmptyCards=_ref.commentEmptyCards,onLoadMoreData=_ref.onLoadMoreData,onAddNewData=_ref.onAddNewData,backgroundColor=_ref.backgroundColor,currentPage=_ref.currentPage,pageSize=_ref.pageSize,isLoading=_ref.isLoading,isLoadingMoreData=_ref.isLoadingMoreData;var _useState=(0,_react.useState)(0),_useState2=(0,_slicedToArray2.default)(_useState,2),containerHeight=_useState2[0],setContainerHeight=_useState2[1];var _useState3=(0,_react.useState)(0),_useState4=(0,_slicedToArray2.default)(_useState3,2),contentHeight=_useState4[0],setContentHeight=_useState4[1];var scrollViewRef=(0,_react.useRef)(null);(0,_react.useEffect)(function(){if(isLoading&&data.length){var _scrollViewRef$curren;(_scrollViewRef$curren=scrollViewRef.current)==null?void 0:_scrollViewRef$curren.scrollToEnd({animated:true});}},[isLoading,data]);(0,_react.useEffect)(function(){if(containerHeight>contentHeight&&data.length){handleLoadMore();}},[containerHeight,contentHeight,data]);var handleLoadMore=function(){var _ref2=(0,_asyncToGenerator2.default)(function*(){if(!isLoading&&onLoadMoreData&&isLoadingMoreData){onLoadMoreData(currentPage,pageSize);}});return function handleLoadMore(){return _ref2.apply(this,arguments);};}();var isAtEndOfScroll=function isAtEndOfScroll(_ref3){var layoutMeasurement=_ref3.layoutMeasurement,contentOffset=_ref3.contentOffset,contentSize=_ref3.contentSize;return layoutMeasurement.height+contentOffset.y>=contentSize.height-BUFFER;};var onScroll=function onScroll(event){if(isAtEndOfScroll(event.nativeEvent)){handleLoadMore();}};var onLayout=function onLayout(event){var height=event.nativeEvent.layout.height;setContainerHeight(height);};return _react.default.createElement(_reactNative.View,{onLayout:onLayout,style:[{maxHeight:cardsHeight},_Cards.styles.container,{backgroundColor:backgroundColor}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:82,columnNumber:5}},(title||onAddNewData)&&_react.default.createElement(_reactNative.View,{style:_Cards.styles.titleContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:90,columnNumber:9}},title&&_react.default.createElement(_reactNative.View,{style:_Cards.styles.titleTextContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:92,columnNumber:13}},_react.default.createElement(_reactNative.Text,{style:_Cards.styles.title,__self:_this,__source:{fileName:_jsxFileName,lineNumber:93,columnNumber:15}},title),_react.default.createElement(_reactNative.Text,{style:_Cards.styles.title,__self:_this,__source:{fileName:_jsxFileName,lineNumber:94,columnNumber:15}}," (",data.length,")")),_react.default.createElement(_reactNative.View,{style:_Cards.styles.buttonContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:97,columnNumber:11}},onAddNewData&&_react.default.createElement(_button.Button,{onPress:onAddNewData,typeStyle:'primary',height:40,width:40,iconLeft:_react.default.createElement(_icons.MoreIcon,{style:_Cards.styles.plus,__self:_this,__source:{fileName:_jsxFileName,lineNumber:104,columnNumber:27}}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:99,columnNumber:15}}))),_react.default.createElement(_reactNative.ScrollView,{ref:scrollViewRef,style:_Cards.styles.containerFlex,onScroll:onScroll,scrollEventThrottle:SCROLL_EVENT_THROTTLE,onContentSizeChange:function onContentSizeChange(_contentWidth,contentHeightChange){return setContentHeight(contentHeightChange);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:110,columnNumber:7}},_react.default.createElement(_SwitchStateCards.default,{data:data,isLoading:isLoading,metadata:metadata,onPressCard:onPressCard,commentEmptyCards:commentEmptyCards,textEmptyCards:textEmptyCards,tableHeight:containerHeight,isTitle:!!title&&!!onAddNewData,__self:_this,__source:{fileName:_jsxFileName,lineNumber:118,columnNumber:9}}),!!data.length&&isLoading&&isLoadingMoreData&&_react.default.createElement(_SkeletonCard.default,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:128,columnNumber:61}})));};var _default=exports.default=Cards;

package/dist-native/components/cards/Cards.types.d.ts

@@ -1,18 +1,13 @@
 import { ColorValue, DimensionValue } from 'react-native';
-import { Metadata } from '../../types/table.types';
-export interface CardsProps {
-    data: any[];
-    metadata: Metadata[];
-    title?: string;
+import { CommonTableProps, Metadata } from '../../interfaces/table.interface';
+export interface CardsMetadata extends Metadata {
+}
+export interface CardsProps extends CommonTableProps {
+    backgroundColor?: ColorValue;
     cardsHeight?: DimensionValue;
-    onPressCard?: (primary: string) => void;
-    isLoading?: boolean;
-    textEmptyCards?: string;
     commentEmptyCards?: string;
-    onLoadMoreData?: (currentPage?: number, pageSize?: number) => void;
-    currentPage?: number;
-    isLoadingMoreData?: boolean;
+    metadata: CardsMetadata[];
     onAddNewData?: () => void;
-    backgroundColor?: ColorValue;
-    pageSize?: number;
+    onPressCard?: (primary: string) => void;
+    textEmptyCards?: string;
 }

package/dist-native/components/cards/components/card/Card.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _table_utils=require("../../../../helpers/table_utils");var _Card=require("./Card.style");var _colors=require("../../../../styles/colors");var _SwitchRowCard=_interopRequireDefault(require("./components/switchRowCard/SwitchRowCard"));var _SwitchTitleCard=_interopRequireDefault(require("./components/switchTitleCard/SwitchTitleCard"));var _cards_utils=require("../../../../helpers/cards_utils");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/cards/components/card/Card.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 MAX_ROWS=4;var Card=function Card(_ref){var item=_ref.item,index=_ref.index,metadata=_ref.metadata,_onPress=_ref.onPress;var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isPressable=_useState2[0],setIsPressable=_useState2[1];var _useState3=(0,_react.useState)({shadowOpacity:0.1}),_useState4=(0,_slicedToArray2.default)(_useState3,2),shadowOpacity=_useState4[0],setShadowOpacity=_useState4[1];var onHoverIn=function onHoverIn(){setShadowOpacity({shadowOpacity:0.2});};var onHoverOut=function onHoverOut(){setShadowOpacity({shadowOpacity:0.1});};var onPressIn=function onPressIn(){setIsPressable(true);};var onPressOut=function onPressOut(){setIsPressable(false);};var isDisabled=function isDisabled(){return item.isActive===false;};var changeBackground=function changeBackground(){if(isDisabled()||isPressable){return{backgroundColor:_colors.NEUTRAL_200};}return{backgroundColor:_Card.styles.container.backgroundColor};};var changeStatusBackground=function changeStatusBackground(){if(isDisabled()){return{backgroundColor:_colors.NEUTRAL_400};}if(item.color){return{backgroundColor:item.color};}return{backgroundColor:_colors.TERTIARY_800};};var changeTextColor=function changeTextColor(){if(isDisabled()){return{color:_colors.NEUTRAL_500};}return{};};var getColumnTitle=(0,_react.useMemo)(function(){return(0,_cards_utils.findRowTitle)(metadata);},[metadata,item]);return _react.default.createElement(_reactNative.Pressable,{disabled:isDisabled(),onHoverIn:onHoverIn,onHoverOut:onHoverOut,onPressIn:onPressIn,onPressOut:onPressOut,onPress:function onPress(){if(_onPress){_onPress((0,_table_utils.findPrimaryId)(metadata,item));}},__self:_this,__source:{fileName:_jsxFileName,lineNumber:72,columnNumber:5}},_react.default.createElement(_reactNative.Animated.View,{style:[_Card.styles.container,changeBackground(),shadowOpacity],__self:_this,__source:{fileName:_jsxFileName,lineNumber:83,columnNumber:7}},_react.default.createElement(_reactNative.View,{style:[_Card.styles.status,changeStatusBackground()],__self:_this,__source:{fileName:_jsxFileName,lineNumber:85,columnNumber:9}}),_react.default.createElement(_SwitchTitleCard.default,{row:getColumnTitle,item:item,color:changeTextColor(),__self:_this,__source:{fileName:_jsxFileName,lineNumber:86,columnNumber:9}}),metadata.filter(function(row){return row.visible;}).slice(0,MAX_ROWS).map(function(row,rowIndex){return row.visible&&!row.title&&_react.default.createElement(_SwitchRowCard.default,{key:'rowCard'+index+rowIndex,row:row,item:item,color:changeTextColor(),backgroundColor:changeBackground(),__self:_this,__source:{fileName:_jsxFileName,lineNumber:98,columnNumber:17}});})));};var _default=exports.default=Card;
+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 _table_utils=require("../../../../helpers/table_utils");var _Card=require("./Card.style");var _colors=require("../../../../styles/colors");var _SwitchRowCard=_interopRequireDefault(require("./components/switchRowCard/SwitchRowCard"));var _SwitchTitleCard=_interopRequireDefault(require("./components/switchTitleCard/SwitchTitleCard"));var _cards_utils=require("../../../../helpers/cards_utils");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/cards/components/card/Card.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 MAX_ROWS=4;var Card=function Card(_ref){var item=_ref.item,index=_ref.index,metadata=_ref.metadata,_onPress=_ref.onPress;var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isPressable=_useState2[0],setIsPressable=_useState2[1];var _useState3=(0,_react.useState)({shadowOpacity:0.1}),_useState4=(0,_slicedToArray2.default)(_useState3,2),shadowOpacity=_useState4[0],setShadowOpacity=_useState4[1];var onHoverIn=function onHoverIn(){setShadowOpacity({shadowOpacity:0.2});};var onHoverOut=function onHoverOut(){setShadowOpacity({shadowOpacity:0.1});};var onPressIn=function onPressIn(){setIsPressable(true);};var onPressOut=function onPressOut(){setIsPressable(false);};var isDisabled=function isDisabled(){return item.isActive===false;};var changeBackground=function changeBackground(){if(isDisabled()||isPressable){return{backgroundColor:_colors.NEUTRAL_200};}return{backgroundColor:_Card.styles.container.backgroundColor};};var changeStatusBackground=function changeStatusBackground(){if(isDisabled()){return{backgroundColor:_colors.NEUTRAL_400};}if(item.color){return{backgroundColor:item.color};}return{backgroundColor:_colors.TERTIARY_800};};var changeTextColor=function changeTextColor(){if(isDisabled()){return{color:_colors.NEUTRAL_500};}return{};};var getColumnTitle=(0,_react.useMemo)(function(){return(0,_cards_utils.findRowTitle)(metadata);},[metadata]);return _react.default.createElement(_reactNative.Pressable,{disabled:isDisabled(),onHoverIn:onHoverIn,onHoverOut:onHoverOut,onPressIn:onPressIn,onPressOut:onPressOut,onPress:function onPress(){if(_onPress){_onPress((0,_table_utils.findPrimaryId)(metadata,item));}},__self:_this,__source:{fileName:_jsxFileName,lineNumber:72,columnNumber:5}},_react.default.createElement(_reactNative.Animated.View,{style:[_Card.styles.container,changeBackground(),shadowOpacity],__self:_this,__source:{fileName:_jsxFileName,lineNumber:83,columnNumber:7}},_react.default.createElement(_reactNative.View,{style:[_Card.styles.status,changeStatusBackground()],__self:_this,__source:{fileName:_jsxFileName,lineNumber:85,columnNumber:9}}),_react.default.createElement(_SwitchTitleCard.default,{row:getColumnTitle,item:item,color:changeTextColor(),__self:_this,__source:{fileName:_jsxFileName,lineNumber:86,columnNumber:9}}),metadata.filter(function(row){return row.visible;}).slice(0,MAX_ROWS).map(function(row,rowIndex){return row.visible&&!row.title&&_react.default.createElement(_SwitchRowCard.default,{key:'rowCard'+index+rowIndex,row:row,item:item,color:changeTextColor(),backgroundColor:changeBackground(),__self:_this,__source:{fileName:_jsxFileName,lineNumber:98,columnNumber:17}});})));};var _default=exports.default=Card;

package/dist-native/components/cards/components/card/Card.types.d.ts

@@ -1,7 +1,7 @@
-import { Metadata } from '../../../../types/table.types';
+import { CardsMetadata } from '../../Cards.types';
 export interface CardProps {
     item: any;
     index: number;
-    metadata: Metadata[];
+    metadata: CardsMetadata[];
     onPress?: (primary: string) => void;
 }

package/dist-native/components/cards/components/card/components/switchRowCard/SwitchRowCard.type.d.ts

@@ -1,7 +1,7 @@
 import { ViewStyle, TextStyle } from 'react-native';
-import { Metadata } from '../../../../../../types/table.types';
+import { CardsMetadata } from '../../../../Cards.types';
 export interface SwitchRowCardProps {
-    row?: Metadata;
+    row?: CardsMetadata;
     item: any;
     color: TextStyle | undefined;
     margin?: boolean;

package/dist-native/components/cards/components/card/components/switchStateCards/SwitchStateCards.types.d.ts

@@ -1,8 +1,8 @@
 import { DimensionValue } from 'react-native';
-import { Metadata } from '../../../../../../types/table.types';
+import { CardsMetadata } from '../../../../Cards.types';
 export interface SwitchStateCardsProps {
     data: Array<any>;
-    metadata: Metadata[];
+    metadata: CardsMetadata[];
     isLoading?: boolean;
     onPressCard?: (primary: string) => void;
     textEmptyCards?: string;

package/dist-native/components/cards/components/card/components/switchTitleCard/SwitchTitleCard.type.d.ts

@@ -1,7 +1,7 @@
 import { TextStyle } from 'react-native';
-import { Metadata } from '../../../../../../types/table.types';
+import { CardsMetadata } from '../../../../Cards.types';
 export interface SwitchTitleCardProps {
-    row?: Metadata;
+    row?: CardsMetadata;
     item: any;
     color?: TextStyle;
 }

package/dist-native/components/containers/titleContainer/TitleContainer.default.d.ts

@@ -11,6 +11,9 @@ export declare const DEFAULT: {
         flexDirection: "row" | "column";
         justifyContent: "flex-start" | "space-between";
         alignItems: "flex-start";
-        gap: number;
+        flexWrap: "wrap";
+    };
+    BUTTON_CONTAINER: {
+        width: number;
     };
 };

package/dist-native/components/containers/titleContainer/TitleContainer.default.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});exports.DEFAULT=void 0;var _reactNative=require("react-native");var _table_utils=require("../../../helpers/table_utils");var _colors=require("../../../styles/colors");var DEFAULT=exports.DEFAULT=_reactNative.StyleSheet.create({TITLE_STYLE:{fontSize:29,fontWeight:'600',textAlign:'left',marginBottom:6,color:_colors.PRIMARY_100},TITLE_CONTAINER:{display:'flex',flexDirection:_table_utils.isDeviceTablet?'row':'column',justifyContent:_table_utils.isDeviceTablet?'space-between':'flex-start',alignItems:'flex-start',gap:12}});
+Object.defineProperty(exports,"__esModule",{value:true});exports.DEFAULT=void 0;var _reactNative=require("react-native");var _table_utils=require("../../../helpers/table_utils");var _colors=require("../../../styles/colors");var DEFAULT=exports.DEFAULT=_reactNative.StyleSheet.create({TITLE_STYLE:{fontSize:29,fontWeight:'600',textAlign:'left',marginBottom:6,color:_colors.PRIMARY_100},TITLE_CONTAINER:{display:'flex',flexDirection:_table_utils.isDeviceTablet?'row':'column',justifyContent:_table_utils.isDeviceTablet?'space-between':'flex-start',alignItems:'flex-start',flexWrap:'wrap'},BUTTON_CONTAINER:{width:24}});

package/dist-native/components/containers/titleContainer/TitleContainer.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 _TitleContainer=require("./TitleContainer.default");var _buttonContainer=require("../buttonContainer");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/containers/titleContainer/TitleContainer.tsx";var TitleContainer=function TitleContainer(_ref){var buttons=_ref.buttons,style=_ref.style,title=_ref.title,textStyle=_ref.textStyle;return _react.default.createElement(_reactNative.View,{style:[_TitleContainer.DEFAULT.TITLE_CONTAINER,style],__self:_this,__source:{fileName:_jsxFileName,lineNumber:14,columnNumber:5}},_react.default.createElement(_reactNative.Text,{style:[_TitleContainer.DEFAULT.TITLE_STYLE,textStyle],__self:_this,__source:{fileName:_jsxFileName,lineNumber:15,columnNumber:7}},title),buttons&&_react.default.createElement(_buttonContainer.ButtonContainer,{buttons:buttons,style:{paddingVertical:0},__self:_this,__source:{fileName:_jsxFileName,lineNumber:17,columnNumber:9}}));};var _default=exports.default=TitleContainer;
+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 _TitleContainer=require("./TitleContainer.default");var _buttonContainer=require("../buttonContainer");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/containers/titleContainer/TitleContainer.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 TitleContainer=function TitleContainer(_ref){var buttons=_ref.buttons,style=_ref.style,title=_ref.title,textStyle=_ref.textStyle,buttonsGap=_ref.buttonsGap;var _useState=(0,_react.useState)([]),_useState2=(0,_slicedToArray2.default)(_useState,2),arrayOfButtons=_useState2[0],setArrayOfButtons=_useState2[1];(0,_react.useEffect)(function(){var renderButtonsWithGaps=function renderButtonsWithGaps(buttonsList){var result=[];for(var i=0;i<buttonsList.length;i++){result.push(buttonsList[i]);if(i<buttonsList.length-1){result.push(_react.default.createElement(_reactNative.View,{style:[_TitleContainer.DEFAULT.BUTTON_CONTAINER,buttonsGap?{width:buttonsGap}:null],key:"view-"+i,__self:_this,__source:{fileName:_jsxFileName,lineNumber:24,columnNumber:13}}));}}return result;};if(buttons){setArrayOfButtons(renderButtonsWithGaps(buttons));}},[buttons,buttonsGap]);return _react.default.createElement(_reactNative.View,{style:[_TitleContainer.DEFAULT.TITLE_CONTAINER,style],__self:_this,__source:{fileName:_jsxFileName,lineNumber:43,columnNumber:5}},_react.default.createElement(_reactNative.Text,{style:[_TitleContainer.DEFAULT.TITLE_STYLE,textStyle],numberOfLines:1,ellipsizeMode:"tail",__self:_this,__source:{fileName:_jsxFileName,lineNumber:44,columnNumber:7}},title),arrayOfButtons&&_react.default.createElement(_buttonContainer.ButtonContainer,{buttons:arrayOfButtons,style:{paddingVertical:0,gap:0},__self:_this,__source:{fileName:_jsxFileName,lineNumber:51,columnNumber:9}}));};var _default=exports.default=TitleContainer;

package/dist-native/components/containers/titleContainer/TitleContainer.types.d.ts

@@ -4,5 +4,6 @@ export interface ITitleContainer {
     buttons?: ReactNode[];
     style?: StyleProp<ViewStyle>;
     textStyle?: StyleProp<ViewStyle>;
+    buttonsGap?: number;
     title: string;
 }

package/dist-native/components/table/Table.types.d.ts

@@ -1,33 +1,27 @@
 import { ReactNode } from 'react';
 import { DimensionValue, ViewStyle } from 'react-native';
-export interface TableProps {
-    data: Array<any>;
-    columns: Columns[];
-    title?: string;
-    tableHeight?: DimensionValue;
+import { CommonTableProps, Metadata } from '../../interfaces/table.interface';
+export interface TableProps extends CommonTableProps {
+    columns: ColumnsMetadata[];
+    commentEmptyTable?: string;
     onRowPress?: (primary: string) => void;
-    isLoading?: boolean;
+    tableHeight?: DimensionValue;
     textEmptyTable?: string;
-    commentEmptyTable?: string;
-    onLoadMoreData?: (currentPage: number, pageSize: number) => void;
-    pageSize?: number;
-    currentPage?: number;
-    isLoadingMoreData?: boolean;
 }
 export interface TableCellProps {
     label?: string;
 }
 export interface TableHeaderProps {
     title?: string;
-    columns: Columns[];
+    columns: ColumnsMetadata[];
     isLoading?: boolean;
 }
-export type Columns = {
+export interface ColumnsMetadata extends Metadata {
+    cellStyle?: ViewStyle;
+    components?: ReactNode[];
+    key?: string;
+    label?: string;
     primary?: boolean;
     visible?: boolean;
-    label?: string;
-    key?: string;
     width?: DimensionValue;
-    components?: ReactNode[];
-    cellStyle?: ViewStyle;
-};
+}

package/dist-native/helpers/cards_utils.d.ts

@@ -1,2 +1,2 @@
-import { Metadata } from '../types/table.types';
-export declare const findRowTitle: (columns: Metadata[]) => Metadata | undefined;
+import { CardsMetadata } from '../components/cards/Cards.types';
+export declare const findRowTitle: (columns: CardsMetadata[]) => CardsMetadata | undefined;

package/dist-native/helpers/cards_utils.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});exports.findRowTitle=void 0;var findRowTitle=exports.findRowTitle=function findRowTitle(columns){var column=columns.find(function(column){return column.title&&column.key;});return column!=null?column:undefined;};
+Object.defineProperty(exports,"__esModule",{value:true});exports.findRowTitle=void 0;var findRowTitle=exports.findRowTitle=function findRowTitle(columns){var column=columns.find(function(columnItem){return columnItem.title&&columnItem.key;});return column!=null?column:undefined;};

package/dist-native/helpers/table_utils.d.ts

@@ -1,4 +1,4 @@
-import { Columns } from '../components/table/Table.types';
+import { ColumnsMetadata } from '../components/table/Table.types';
 import { ViewStyle } from 'react-native';
 export declare const removeHeaderBorder: (header?: string) => false | {
     borderTopWidth: number;
@@ -12,4 +12,4 @@ export declare const paintOddRows: (index: number) => {
 export declare const isTablet: () => boolean;
 export declare const isDeviceTablet: boolean;
 export declare const disableOutline: () => ViewStyle | undefined;
-export declare const findPrimaryId: (col: Columns[], data: any) => string;
+export declare const findPrimaryId: (col: ColumnsMetadata[], data: any) => string;

package/dist-native/helpers/table_utils.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});exports.removeHeaderBorder=exports.paintOddRows=exports.isTablet=exports.isOdd=exports.isDeviceTablet=exports.findPrimaryId=exports.disableOutline=void 0;var _colors=require("../styles/colors");var _reactNative=require("react-native");var width=_reactNative.Dimensions.get('screen').width;var height=_reactNative.Dimensions.get('screen').height;var isWeb=_reactNative.Platform.OS==='web';var removeHeaderBorder=exports.removeHeaderBorder=function removeHeaderBorder(header){return!header&&{borderTopWidth:0,borderTopLeftRadius:0,borderTopRightRadius:0};};var isOdd=exports.isOdd=function isOdd(index){return index%2!==0;};var paintOddRows=exports.paintOddRows=function paintOddRows(index){return isOdd(index)?{backgroundColor:_colors.QUATERNARY_10}:{backgroundColor:_colors.NEUTRAL_0};};var isTablet=exports.isTablet=function isTablet(){var pixelDensity=_reactNative.PixelRatio.get();var adjustedWidth=width*pixelDensity;var adjustedHeight=height*pixelDensity;if(pixelDensity<1.75&&(adjustedWidth>=1000||adjustedHeight>=1000)){return true;}else return pixelDensity===2&&(adjustedWidth>=1920||adjustedHeight>=1920);};var isDeviceTablet=exports.isDeviceTablet=isTablet();var disableOutline=exports.disableOutline=function disableOutline(){if(isWeb){return{outline:'none'};}};var findPrimaryId=exports.findPrimaryId=function findPrimaryId(col,data){var primary='';for(var element of col){if(element.primary===true){if(element.key){primary=data[element.key];break;}}}return primary;};
+Object.defineProperty(exports,"__esModule",{value:true});exports.removeHeaderBorder=exports.paintOddRows=exports.isTablet=exports.isOdd=exports.isDeviceTablet=exports.findPrimaryId=exports.disableOutline=void 0;var _colors=require("../styles/colors");var _reactNative=require("react-native");var width=_reactNative.Dimensions.get('screen').width;var height=_reactNative.Dimensions.get('screen').height;var isWeb=_reactNative.Platform.OS==='web';var removeHeaderBorder=exports.removeHeaderBorder=function removeHeaderBorder(header){return!header&&{borderTopWidth:0,borderTopLeftRadius:0,borderTopRightRadius:0};};var isOdd=exports.isOdd=function isOdd(index){return index%2!==0;};var paintOddRows=exports.paintOddRows=function paintOddRows(index){return isOdd(index)?{backgroundColor:_colors.QUATERNARY_10}:{backgroundColor:_colors.NEUTRAL_0};};var isTablet=exports.isTablet=function isTablet(){var pixelDensity=_reactNative.PixelRatio.get();var adjustedWidth=width*pixelDensity;var adjustedHeight=height*pixelDensity;if(pixelDensity<1.75&&(adjustedWidth>=1000||adjustedHeight>=1000)){return true;}else{return pixelDensity===2&&(adjustedWidth>=1920||adjustedHeight>=1920);}};var isDeviceTablet=exports.isDeviceTablet=isTablet();var disableOutline=exports.disableOutline=function disableOutline(){if(isWeb){return{outline:'none'};}};var findPrimaryId=exports.findPrimaryId=function findPrimaryId(col,data){var primary='';for(var element of col){if(element.primary===true){if(element.key){primary=data[element.key];break;}}}return primary;};

package/dist-native/interfaces/table.interface.d.ts

@@ -0,0 +1,18 @@
+import { MetadataType } from '../types/table.types';
+export interface Metadata {
+    key?: string;
+    label?: string;
+    primary?: boolean;
+    title?: boolean;
+    type?: MetadataType;
+    visible?: boolean;
+}
+export interface CommonTableProps {
+    currentPage?: number;
+    data: any[];
+    isLoading?: boolean;
+    isLoadingMoreData?: boolean;
+    onLoadMoreData?: (currentPage: number, pageSize: number) => void;
+    pageSize?: number;
+    title?: string;
+}

package/dist-native/interfaces/table.interface.js

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

package/dist-native/types/table.types.d.ts

@@ -1,8 +1 @@
-export type Metadata = {
-    primary?: boolean;
-    visible?: boolean;
-    label?: string;
-    key?: string;
-    type?: 'number' | 'string' | 'boolean' | 'date' | 'time';
-    title?: boolean;
-};
+export type MetadataType = 'number' | 'string' | 'boolean' | 'date' | 'time';

package/dist-web/components/cards/Cards.js

@@ -8,6 +8,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+/* eslint-disable react-hooks/exhaustive-deps */
 import React, { useEffect, useRef, useState } from 'react';
 import { View, Text, ScrollView } from "react-native-web";
 import { styles } from "./Cards.style";
@@ -48,7 +49,7 @@ var Cards = function Cards(_ref) {
         animated: true
       });
     }
-  }, [isLoading]);
+  }, [isLoading, data]);
   useEffect(function () {
     if (containerHeight > contentHeight && data.length) {
       handleLoadMore();
@@ -117,8 +118,8 @@ var Cards = function Cards(_ref) {
     style: styles.containerFlex,
     onScroll: onScroll,
     scrollEventThrottle: SCROLL_EVENT_THROTTLE,
-    onContentSizeChange: function onContentSizeChange(contentWidth, contentHeight) {
-      return setContentHeight(contentHeight);
+    onContentSizeChange: function onContentSizeChange(_contentWidth, contentHeightChange) {
+      return setContentHeight(contentHeightChange);
     }
   }, /*#__PURE__*/React.createElement(SwitchStateCards, {
     data: data,

package/dist-web/components/cards/Cards.types.d.ts

@@ -1,18 +1,13 @@
 import { ColorValue, DimensionValue } from 'react-native';
-import { Metadata } from '../../types/table.types';
-export interface CardsProps {
-    data: any[];
-    metadata: Metadata[];
-    title?: string;
+import { CommonTableProps, Metadata } from '../../interfaces/table.interface';
+export interface CardsMetadata extends Metadata {
+}
+export interface CardsProps extends CommonTableProps {
+    backgroundColor?: ColorValue;
     cardsHeight?: DimensionValue;
-    onPressCard?: (primary: string) => void;
-    isLoading?: boolean;
-    textEmptyCards?: string;
     commentEmptyCards?: string;
-    onLoadMoreData?: (currentPage?: number, pageSize?: number) => void;
-    currentPage?: number;
-    isLoadingMoreData?: boolean;
+    metadata: CardsMetadata[];
     onAddNewData?: () => void;
-    backgroundColor?: ColorValue;
-    pageSize?: number;
+    onPressCard?: (primary: string) => void;
+    textEmptyCards?: string;
 }

package/dist-web/components/cards/components/card/Card.js

@@ -82,7 +82,7 @@ var Card = function Card(_ref) {
   };
   var getColumnTitle = useMemo(function () {
     return findRowTitle(metadata);
-  }, [metadata, item]);
+  }, [metadata]);
   return /*#__PURE__*/React.createElement(Pressable, {
     disabled: isDisabled(),
     onHoverIn: onHoverIn,

package/dist-web/components/cards/components/card/Card.types.d.ts

@@ -1,7 +1,7 @@
-import { Metadata } from '../../../../types/table.types';
+import { CardsMetadata } from '../../Cards.types';
 export interface CardProps {
     item: any;
     index: number;
-    metadata: Metadata[];
+    metadata: CardsMetadata[];
     onPress?: (primary: string) => void;
 }

package/dist-web/components/cards/components/card/components/switchRowCard/SwitchRowCard.type.d.ts

@@ -1,7 +1,7 @@
 import { ViewStyle, TextStyle } from 'react-native';
-import { Metadata } from '../../../../../../types/table.types';
+import { CardsMetadata } from '../../../../Cards.types';
 export interface SwitchRowCardProps {
-    row?: Metadata;
+    row?: CardsMetadata;
     item: any;
     color: TextStyle | undefined;
     margin?: boolean;

package/dist-web/components/cards/components/card/components/switchStateCards/SwitchStateCards.types.d.ts

@@ -1,8 +1,8 @@
 import { DimensionValue } from 'react-native';
-import { Metadata } from '../../../../../../types/table.types';
+import { CardsMetadata } from '../../../../Cards.types';
 export interface SwitchStateCardsProps {
     data: Array<any>;
-    metadata: Metadata[];
+    metadata: CardsMetadata[];
     isLoading?: boolean;
     onPressCard?: (primary: string) => void;
     textEmptyCards?: string;

package/dist-web/components/cards/components/card/components/switchTitleCard/SwitchTitleCard.type.d.ts

@@ -1,7 +1,7 @@
 import { TextStyle } from 'react-native';
-import { Metadata } from '../../../../../../types/table.types';
+import { CardsMetadata } from '../../../../Cards.types';
 export interface SwitchTitleCardProps {
-    row?: Metadata;
+    row?: CardsMetadata;
     item: any;
     color?: TextStyle;
 }

package/dist-web/components/containers/titleContainer/TitleContainer.default.d.ts

@@ -11,6 +11,9 @@ export declare const DEFAULT: {
         flexDirection: "row" | "column";
         justifyContent: "flex-start" | "space-between";
         alignItems: "flex-start";
-        gap: number;
+        flexWrap: "wrap";
+    };
+    BUTTON_CONTAINER: {
+        width: number;
     };
 };

package/dist-web/components/containers/titleContainer/TitleContainer.default.js

@@ -14,6 +14,9 @@ export var DEFAULT = StyleSheet.create({
     flexDirection: isDeviceTablet ? 'row' : 'column',
     justifyContent: isDeviceTablet ? 'space-between' : 'flex-start',
     alignItems: 'flex-start',
-    gap: 12
+    flexWrap: 'wrap'
+  },
+  BUTTON_CONTAINER: {
+    width: 24
   }
 });

package/dist-web/components/containers/titleContainer/TitleContainer.js

@@ -1,4 +1,10 @@
-import React from 'react';
+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, { useEffect, useState } from 'react';
 import { Text, View } from "react-native-web";
 import { DEFAULT } from "./TitleContainer.default";
 import { ButtonContainer } from "../buttonContainer";
@@ -6,15 +12,44 @@ var TitleContainer = function TitleContainer(_ref) {
   var buttons = _ref.buttons,
     style = _ref.style,
     title = _ref.title,
-    textStyle = _ref.textStyle;
+    textStyle = _ref.textStyle,
+    buttonsGap = _ref.buttonsGap;
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    arrayOfButtons = _useState2[0],
+    setArrayOfButtons = _useState2[1];
+  useEffect(function () {
+    // This adds a gap between buttons if it's possible using a dummy View
+    var renderButtonsWithGaps = function renderButtonsWithGaps(buttonsList) {
+      var result = [];
+      for (var i = 0; i < buttonsList.length; i++) {
+        result.push(buttonsList[i]);
+        if (i < buttonsList.length - 1) {
+          result.push( /*#__PURE__*/React.createElement(View, {
+            style: [DEFAULT.BUTTON_CONTAINER, buttonsGap ? {
+              width: buttonsGap
+            } : null],
+            key: "view-".concat(i)
+          }));
+        }
+      }
+      return result;
+    };
+    if (buttons) {
+      setArrayOfButtons(renderButtonsWithGaps(buttons));
+    }
+  }, [buttons, buttonsGap]);
   return /*#__PURE__*/React.createElement(View, {
     style: [DEFAULT.TITLE_CONTAINER, style]
   }, /*#__PURE__*/React.createElement(Text, {
-    style: [DEFAULT.TITLE_STYLE, textStyle]
-  }, title), buttons && /*#__PURE__*/React.createElement(ButtonContainer, {
-    buttons: buttons,
+    style: [DEFAULT.TITLE_STYLE, textStyle],
+    numberOfLines: 1,
+    ellipsizeMode: "tail"
+  }, title), arrayOfButtons && /*#__PURE__*/React.createElement(ButtonContainer, {
+    buttons: arrayOfButtons,
     style: {
-      paddingVertical: 0
+      paddingVertical: 0,
+      gap: 0
     }
   }));
 };

package/dist-web/components/containers/titleContainer/TitleContainer.types.d.ts

@@ -4,5 +4,6 @@ export interface ITitleContainer {
     buttons?: ReactNode[];
     style?: StyleProp<ViewStyle>;
     textStyle?: StyleProp<ViewStyle>;
+    buttonsGap?: number;
     title: string;
 }

package/dist-web/components/table/Table.types.d.ts

@@ -1,33 +1,27 @@
 import { ReactNode } from 'react';
 import { DimensionValue, ViewStyle } from 'react-native';
-export interface TableProps {
-    data: Array<any>;
-    columns: Columns[];
-    title?: string;
-    tableHeight?: DimensionValue;
+import { CommonTableProps, Metadata } from '../../interfaces/table.interface';
+export interface TableProps extends CommonTableProps {
+    columns: ColumnsMetadata[];
+    commentEmptyTable?: string;
     onRowPress?: (primary: string) => void;
-    isLoading?: boolean;
+    tableHeight?: DimensionValue;
     textEmptyTable?: string;
-    commentEmptyTable?: string;
-    onLoadMoreData?: (currentPage: number, pageSize: number) => void;
-    pageSize?: number;
-    currentPage?: number;
-    isLoadingMoreData?: boolean;
 }
 export interface TableCellProps {
     label?: string;
 }
 export interface TableHeaderProps {
     title?: string;
-    columns: Columns[];
+    columns: ColumnsMetadata[];
     isLoading?: boolean;
 }
-export type Columns = {
+export interface ColumnsMetadata extends Metadata {
+    cellStyle?: ViewStyle;
+    components?: ReactNode[];
+    key?: string;
+    label?: string;
     primary?: boolean;
     visible?: boolean;
-    label?: string;
-    key?: string;
     width?: DimensionValue;
-    components?: ReactNode[];
-    cellStyle?: ViewStyle;
-};
+}

package/dist-web/helpers/cards_utils.d.ts

@@ -1,2 +1,2 @@
-import { Metadata } from '../types/table.types';
-export declare const findRowTitle: (columns: Metadata[]) => Metadata | undefined;
+import { CardsMetadata } from '../components/cards/Cards.types';
+export declare const findRowTitle: (columns: CardsMetadata[]) => CardsMetadata | undefined;

package/dist-web/helpers/cards_utils.js

@@ -1,6 +1,6 @@
 export var findRowTitle = function findRowTitle(columns) {
-  var column = columns.find(function (column) {
-    return column.title && column.key;
+  var column = columns.find(function (columnItem) {
+    return columnItem.title && columnItem.key;
   });
   return column !== null && column !== void 0 ? column : undefined;
 };

package/dist-web/helpers/table_utils.d.ts

@@ -1,4 +1,4 @@
-import { Columns } from '../components/table/Table.types';
+import { ColumnsMetadata } from '../components/table/Table.types';
 import { ViewStyle } from 'react-native';
 export declare const removeHeaderBorder: (header?: string) => false | {
     borderTopWidth: number;
@@ -12,4 +12,4 @@ export declare const paintOddRows: (index: number) => {
 export declare const isTablet: () => boolean;
 export declare const isDeviceTablet: boolean;
 export declare const disableOutline: () => ViewStyle | undefined;
-export declare const findPrimaryId: (col: Columns[], data: any) => string;
+export declare const findPrimaryId: (col: ColumnsMetadata[], data: any) => string;

package/dist-web/helpers/table_utils.js

@@ -32,7 +32,9 @@ export var isTablet = function isTablet() {
   var adjustedHeight = height * pixelDensity;
   if (pixelDensity < 1.75 && (adjustedWidth >= 1000 || adjustedHeight >= 1000)) {
     return true;
-  } else return pixelDensity === 2 && (adjustedWidth >= 1920 || adjustedHeight >= 1920);
+  } else {
+    return pixelDensity === 2 && (adjustedWidth >= 1920 || adjustedHeight >= 1920);
+  }
 };
 export var isDeviceTablet = isTablet();
 export var disableOutline = function disableOutline() {

package/dist-web/interfaces/table.interface.d.ts

@@ -0,0 +1,18 @@
+import { MetadataType } from '../types/table.types';
+export interface Metadata {
+    key?: string;
+    label?: string;
+    primary?: boolean;
+    title?: boolean;
+    type?: MetadataType;
+    visible?: boolean;
+}
+export interface CommonTableProps {
+    currentPage?: number;
+    data: any[];
+    isLoading?: boolean;
+    isLoadingMoreData?: boolean;
+    onLoadMoreData?: (currentPage: number, pageSize: number) => void;
+    pageSize?: number;
+    title?: string;
+}

package/dist-web/interfaces/table.interface.js

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

package/dist-web/types/table.types.d.ts

@@ -1,8 +1 @@
-export type Metadata = {
-    primary?: boolean;
-    visible?: boolean;
-    label?: string;
-    key?: string;
-    type?: 'number' | 'string' | 'boolean' | 'date' | 'time';
-    title?: boolean;
-};
+export type MetadataType = 'number' | 'string' | 'boolean' | 'date' | 'time';

package/package.json

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