etendo-ui-library 1.2.42 → 1.2.44

package/dist-native/components/secondaryComponents/SkeletonItem.d.ts

@@ -1,3 +1,12 @@
+import { ColorValue } from 'react-native';
 import React from 'react';
-declare const SkeletonItem: ({ width, height, color, borderRadius, delay }: any) => React.JSX.Element;
+interface SkeletonItemProps {
+    width: number;
+    height: number;
+    color?: ColorValue;
+    borderRadius?: number;
+    delay?: number;
+    animationSpeed?: number;
+}
+declare const SkeletonItem: React.FC<SkeletonItemProps>;
 export default SkeletonItem;

package/dist-native/components/secondaryComponents/SkeletonItem.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _reactNative=require("react-native");var _react=_interopRequireWildcard(require("react"));var _this=this,_jsxFileName="/home/jenkins/workspace/etendo_ui_library_develop/src/components/secondaryComponents/SkeletonItem.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 SkeletonItem=function SkeletonItem(_ref){var width=_ref.width,height=_ref.height,color=_ref.color,borderRadius=_ref.borderRadius,delay=_ref.delay;var opacity=(0,_react.useRef)(new _reactNative.Animated.Value(0.5)).current;var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),hasStarted=_useState2[0],setHasStarted=_useState2[1];(0,_react.useEffect)(function(){if(!hasStarted){_reactNative.Animated.timing(opacity,{toValue:0.5,useNativeDriver:false,duration:delay}).start(function(){_reactNative.Animated.loop(_reactNative.Animated.sequence([_reactNative.Animated.timing(opacity,{toValue:1,useNativeDriver:false,duration:600}),_reactNative.Animated.timing(opacity,{toValue:0.5,useNativeDriver:false,duration:600})])).start();});setHasStarted(true);}},[hasStarted]);return _react.default.createElement(_reactNative.Animated.View,{style:{width:width,height:height,backgroundColor:color,opacity:opacity,borderRadius:borderRadius},__self:_this,__source:{fileName:_jsxFileName,lineNumber:35,columnNumber:5}},_react.default.createElement(_reactNative.View,{style:{width:'100%',height:'100%'},__self:_this,__source:{fileName:_jsxFileName,lineNumber:36,columnNumber:7}}));};var _default=exports.default=SkeletonItem;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _reactNative=require("react-native");var _react=_interopRequireWildcard(require("react"));var _colors=require("../../styles/colors");var _this=this,_jsxFileName="/home/jenkins/workspace/etendo_ui_library_develop/src/components/secondaryComponents/SkeletonItem.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 SkeletonItem=function SkeletonItem(_ref){var width=_ref.width,height=_ref.height,_ref$color=_ref.color,color=_ref$color===void 0?_colors.NEUTRAL_10:_ref$color,borderRadius=_ref.borderRadius,_ref$delay=_ref.delay,delay=_ref$delay===void 0?10:_ref$delay,_ref$animationSpeed=_ref.animationSpeed,animationSpeed=_ref$animationSpeed===void 0?600:_ref$animationSpeed;var opacity=(0,_react.useRef)(new _reactNative.Animated.Value(0.5)).current;var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),hasStarted=_useState2[0],setHasStarted=_useState2[1];(0,_react.useEffect)(function(){if(!hasStarted){_reactNative.Animated.timing(opacity,{toValue:0.5,useNativeDriver:false,duration:delay}).start(function(){_reactNative.Animated.loop(_reactNative.Animated.sequence([_reactNative.Animated.timing(opacity,{toValue:1,useNativeDriver:false,duration:animationSpeed}),_reactNative.Animated.timing(opacity,{toValue:0.5,useNativeDriver:false,duration:animationSpeed})])).start();});setHasStarted(true);}},[hasStarted,delay,animationSpeed]);return _react.default.createElement(_reactNative.Animated.View,{style:{width:width,height:height,backgroundColor:color,opacity:opacity,borderRadius:borderRadius},__self:_this,__source:{fileName:_jsxFileName,lineNumber:52,columnNumber:5}},_react.default.createElement(_reactNative.View,{style:{width:'100%',height:'100%'},__self:_this,__source:{fileName:_jsxFileName,lineNumber:54,columnNumber:7}}));};var _default=exports.default=SkeletonItem;

package/dist-native/components/tab/Tab.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 _colors=require("../../styles/colors");var _Tab=require("./Tab.styles");var _this=this,_jsxFileName="/home/jenkins/workspace/etendo_ui_library_develop/src/components/tab/Tab.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 Tab=function Tab(_ref){var data=_ref.data,currentIndex=_ref.currentIndex,onPressTab=_ref.onPressTab,typeStyle=_ref.typeStyle;var _useState=(0,_react.useState)(),_useState2=(0,_slicedToArray2.default)(_useState,2),hoveredTab=_useState2[0],setHoveredTab=_useState2[1];var _useState3=(0,_react.useState)(0),_useState4=(0,_slicedToArray2.default)(_useState3,2),currentIndexSelected=_useState4[0],setCurrentIndexSelected=_useState4[1];(0,_react.useEffect)(function(){setCurrentIndexSelected(currentIndex);},[currentIndex]);var handleHoverIn=function handleHoverIn(index){setHoveredTab(index);};var handleHoverOut=function handleHoverOut(){setHoveredTab(null);};var handleOnPress=function handleOnPress(item,index){if(onPressTab){onPressTab(item.route,index);}setCurrentIndexSelected(index);};var hoveredStyle=function hoveredStyle(index){var HoveredColor;if(index===hoveredTab){HoveredColor=_colors.TERTIARY_80;return HoveredColor;}else{HoveredColor=_colors.TERTIARY_50;return HoveredColor;}};var getTabStyle=function getTabStyle(index){switch(typeStyle){case'primary':return{borderTopColor:index===currentIndexSelected?_colors.SECONDARY_100:'transparent',borderBottomColor:index===currentIndexSelected?_colors.PRIMARY_100:_colors.NEUTRAL_500,borderBottomWidth:index===currentIndexSelected?2:1};case'secondary':return{backgroundColor:index===currentIndexSelected?_colors.SECONDARY_100:_colors.NEUTRAL_200};case'terciary':return{backgroundColor:index===currentIndexSelected?_colors.PRIMARY_100:hoveredStyle(index),borderTopColor:index===currentIndexSelected?_colors.SECONDARY_100:'transparent'};}};var _useState5=(0,_react.useState)(false),_useState6=(0,_slicedToArray2.default)(_useState5,2),hasScroll=_useState6[0],setHasScroll=_useState6[1];var _useState7=(0,_react.useState)(0),_useState8=(0,_slicedToArray2.default)(_useState7,2),containerWidth=_useState8[0],setContainerWidth=_useState8[1];var _useState9=(0,_react.useState)(0),_useState10=(0,_slicedToArray2.default)(_useState9,2),mapContainer=_useState10[0],setMapContainer=_useState10[1];var handleContainerLayout=function handleContainerLayout(event){var width=event.nativeEvent.layout.width;setContainerWidth(width);};var handleMapContainerLayout=function handleMapContainerLayout(event){var width=event.nativeEvent.layout.width;setMapContainer(width);};(0,_react.useEffect)(function(){if(mapContainer>containerWidth){setHasScroll(true);}else{setHasScroll(false);}},[containerWidth]);return _react.default.createElement(_reactNative.ScrollView,{onLayout:handleContainerLayout,horizontal:true,contentContainerStyle:[_Tab.TabStyleVariants[typeStyle].container,!hasScroll&&{flex:1}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:97,columnNumber:5}},_react.default.createElement(_reactNative.View,{onLayout:handleMapContainerLayout,style:Object.assign({},_Tab.mapContainerViewStyle),__self:_this,__source:{fileName:_jsxFileName,lineNumber:105,columnNumber:7}},data==null?void 0:data.map(function(item,index){return _react.default.createElement(_reactNative.Pressable,{key:item.route,style:function style(_ref2){var pressed=_ref2.pressed;return[_Tab.TabStyleVariants[typeStyle].tab,getTabStyle(index)];},onPress:function onPress(){return handleOnPress(item,index);},onHoverIn:function onHoverIn(){return handleHoverIn(index);},onHoverOut:handleHoverOut,__self:_this,__source:{fileName:_jsxFileName,lineNumber:110,columnNumber:11}},_react.default.createElement(_reactNative.Text,{style:[index===currentIndexSelected?_Tab.TabStyleVariants[typeStyle].text:_Tab.TabStyleVariants[typeStyle].textDisabled],__self:_this,__source:{fileName:_jsxFileName,lineNumber:120,columnNumber:13}},item.name));})));};var _default=exports.default=Tab;
+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 _colors=require("../../styles/colors");var _Tab=require("./Tab.styles");var _this=this,_jsxFileName="/home/jenkins/workspace/etendo_ui_library_develop/src/components/tab/Tab.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 Tab=function Tab(_ref){var data=_ref.data,currentIndex=_ref.currentIndex,onPressTab=_ref.onPressTab,typeStyle=_ref.typeStyle;var _useState=(0,_react.useState)(),_useState2=(0,_slicedToArray2.default)(_useState,2),hoveredTab=_useState2[0],setHoveredTab=_useState2[1];var _useState3=(0,_react.useState)(0),_useState4=(0,_slicedToArray2.default)(_useState3,2),currentIndexSelected=_useState4[0],setCurrentIndexSelected=_useState4[1];(0,_react.useEffect)(function(){setCurrentIndexSelected(currentIndex);},[currentIndex]);var handleHoverIn=function handleHoverIn(index){setHoveredTab(index);};var handleHoverOut=function handleHoverOut(){setHoveredTab(null);};var handleOnPress=function handleOnPress(item,index){if(onPressTab){onPressTab(item.route,index);}setCurrentIndexSelected(index);};var hoveredStyle=function hoveredStyle(index){var HoveredColor;if(index===hoveredTab){HoveredColor=_colors.TERTIARY_80;return HoveredColor;}else{HoveredColor=_colors.TERTIARY_50;return HoveredColor;}};var getPrimaryBorderColor=function getPrimaryBorderColor(index){if(index===currentIndexSelected){return _colors.PRIMARY_100;}else if(index===hoveredTab){return _colors.NEUTRAL_700;}else{return _colors.NEUTRAL_500;}};var getSecondaryBackgroundColor=function getSecondaryBackgroundColor(index){if(index===currentIndexSelected){return _colors.SECONDARY_100;}else if(index===hoveredTab){return _colors.TERTIARY_50;}else{return _colors.NEUTRAL_200;}};var getTabTextStyle=function getTabTextStyle(index){if(index===currentIndexSelected){return _Tab.TabStyleVariants[typeStyle].text;}else if(index===hoveredTab){return _Tab.TabStyleVariants[typeStyle].hoveredColor;}else{return _Tab.TabStyleVariants[typeStyle].textDisabled;}};var getTabStyle=function getTabStyle(index){switch(typeStyle){case'primary':return{borderBottomColor:getPrimaryBorderColor(index),borderBottomWidth:index===currentIndexSelected?2:1};case'secondary':return{backgroundColor:getSecondaryBackgroundColor(index)};case'terciary':return{backgroundColor:index===currentIndexSelected?_colors.PRIMARY_100:hoveredStyle(index),borderTopColor:index===currentIndexSelected?_colors.SECONDARY_100:'transparent'};}};var _useState5=(0,_react.useState)(false),_useState6=(0,_slicedToArray2.default)(_useState5,2),hasScroll=_useState6[0],setHasScroll=_useState6[1];var _useState7=(0,_react.useState)(0),_useState8=(0,_slicedToArray2.default)(_useState7,2),containerWidth=_useState8[0],setContainerWidth=_useState8[1];var _useState9=(0,_react.useState)(0),_useState10=(0,_slicedToArray2.default)(_useState9,2),mapContainer=_useState10[0],setMapContainer=_useState10[1];var handleContainerLayout=function handleContainerLayout(event){var width=event.nativeEvent.layout.width;setContainerWidth(width);};var handleMapContainerLayout=function handleMapContainerLayout(event){var width=event.nativeEvent.layout.width;setMapContainer(width);};(0,_react.useEffect)(function(){if(mapContainer>containerWidth){setHasScroll(true);}else{setHasScroll(false);}},[containerWidth]);return _react.default.createElement(_reactNative.ScrollView,{onLayout:handleContainerLayout,horizontal:true,contentContainerStyle:[_Tab.TabStyleVariants[typeStyle].container,!hasScroll&&{flex:1}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:124,columnNumber:5}},_react.default.createElement(_reactNative.View,{onLayout:handleMapContainerLayout,style:Object.assign({},_Tab.mapContainerViewStyle),__self:_this,__source:{fileName:_jsxFileName,lineNumber:131,columnNumber:7}},data==null?void 0:data.map(function(item,index){return _react.default.createElement(_reactNative.Pressable,{key:item.route,style:function style(_ref2){var pressed=_ref2.pressed;return[_Tab.TabStyleVariants[typeStyle].tab,getTabStyle(index)];},onPress:function onPress(){return handleOnPress(item,index);},onHoverIn:function onHoverIn(){return handleHoverIn(index);},onHoverOut:handleHoverOut,__self:_this,__source:{fileName:_jsxFileName,lineNumber:135,columnNumber:11}},_react.default.createElement(_reactNative.Text,{style:getTabTextStyle(index),__self:_this,__source:{fileName:_jsxFileName,lineNumber:144,columnNumber:13}},item.name));})));};var _default=exports.default=Tab;

package/dist-native/components/tab/Tab.styles.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});exports.mapContainerViewStyle=exports.TabStyleVariants=void 0;var _colors=require("../../styles/colors");var commonTabStyles={alignItems:'center',justifyContent:'center'};var mapContainerViewStyle=exports.mapContainerViewStyle={display:'flex',flexDirection:'row',justifyContent:'center'};var TabStyleVariants=exports.TabStyleVariants={primary:{container:Object.assign({},commonTabStyles),tab:{justifyContent:'center',alignItems:'center',borderBottomWidth:3,flex:1,height:40,paddingHorizontal:8},text:{color:_colors.PRIMARY_100,fontWeight:'600'},textDisabled:{color:_colors.NEUTRAL_500,fontWeight:'bold'}},secondary:{container:Object.assign({},commonTabStyles,{backgroundColor:_colors.NEUTRAL_50,paddingHorizontal:16,paddingVertical:12}),tab:{justifyContent:'center',alignItems:'center',flex:1,height:40,borderRadius:6,marginHorizontal:8,paddingHorizontal:8},text:{color:_colors.PRIMARY_100,fontWeight:'600'},textDisabled:{color:_colors.NEUTRAL_600,fontWeight:'bold'}},terciary:{container:Object.assign({},commonTabStyles),tab:{justifyContent:'center',alignItems:'center',borderBottomWidth:3,borderBottomColor:_colors.PRIMARY_100,borderTopWidth:4,height:40,paddingHorizontal:10},text:{color:_colors.NEUTRAL_0},textDisabled:{color:_colors.PRIMARY_100}}};
+Object.defineProperty(exports,"__esModule",{value:true});exports.mapContainerViewStyle=exports.TabStyleVariants=void 0;var _colors=require("../../styles/colors");var commonTabStyles={alignItems:'center',justifyContent:'center'};var mapContainerViewStyle=exports.mapContainerViewStyle={display:'flex',flexDirection:'row',justifyContent:'center'};var TabStyleVariants=exports.TabStyleVariants={primary:{container:Object.assign({},commonTabStyles),tab:{justifyContent:'center',alignItems:'center',borderBottomWidth:3,height:40,paddingHorizontal:8},text:{color:_colors.PRIMARY_100,fontWeight:'600'},textDisabled:{color:_colors.NEUTRAL_500,fontWeight:'bold'},hoveredColor:{color:_colors.NEUTRAL_700,fontWeight:'bold'}},secondary:{container:Object.assign({},commonTabStyles,{backgroundColor:_colors.NEUTRAL_50,paddingHorizontal:16,paddingVertical:12}),tab:{justifyContent:'center',alignItems:'center',height:40,borderRadius:6,marginHorizontal:8,paddingHorizontal:8},text:{color:_colors.PRIMARY_100,fontWeight:'600'},textDisabled:{color:_colors.NEUTRAL_600,fontWeight:'bold'},hoveredColor:{color:_colors.PRIMARY_100,fontWeight:'bold'}},terciary:{container:Object.assign({},commonTabStyles),tab:{justifyContent:'center',alignItems:'center',borderBottomWidth:3,borderBottomColor:_colors.PRIMARY_100,borderTopWidth:4,height:40,paddingHorizontal:10},text:{color:_colors.NEUTRAL_0},textDisabled:{color:_colors.PRIMARY_100},hoveredColor:{}}};

package/dist-native/components/tab/Tab.types.d.ts

@@ -9,6 +9,7 @@ export type tabStyleVariant = Record<TabStyleType, {
     tab: ViewStyle;
     text: StyleProp<TextStyle>;
     textDisabled: TextStyle;
+    hoveredColor: StyleProp<TextStyle>;
 }>;
 export interface TabProps {
     data?: TabItemType[];

package/dist-native/styles/colors.d.ts

@@ -30,8 +30,9 @@ export declare const NEUTRAL_100 = "#000000";
 export declare const NEUTRAL_200 = "#EEEEEE";
 export declare const NEUTRAL_300 = "#E0E0E0";
 export declare const NEUTRAL_400 = "#BDBDBD";
-export declare const NEUTRAL_500 = "#E0E0E0";
+export declare const NEUTRAL_500 = "#9E9E9E";
 export declare const NEUTRAL_600 = "#757575";
+export declare const NEUTRAL_700 = "#616161";
 export declare const INITIAL_10 = "#ECF5FF";
 export declare const INITIAL_100 = "#3E97FF";
 export declare const PROCESS_10 = "#FFF6EC";

package/dist-native/styles/colors.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});exports.TERTIARY_800=exports.TERTIARY_80=exports.TERTIARY_50=exports.TERTIARY_30=exports.TERTIARY_100=exports.TERTIARY_10=exports.SUCCESS_100=exports.SUCCESS_10=exports.SECONDARY_50=exports.SECONDARY_300=exports.SECONDARY_30=exports.SECONDARY_100=exports.QUATERNARY_50=exports.QUATERNARY_100=exports.QUATERNARY_10=exports.PROCESS_100=exports.PROCESS_10=exports.PRIMARY_800=exports.PRIMARY_80=exports.PRIMARY_700=exports.PRIMARY_60=exports.PRIMARY_50=exports.PRIMARY_400=exports.PRIMARY_40=exports.PRIMARY_30=exports.PRIMARY_100=exports.OVERLAY=exports.NEUTRAL_600=exports.NEUTRAL_60=exports.NEUTRAL_500=exports.NEUTRAL_50=exports.NEUTRAL_5=exports.NEUTRAL_400=exports.NEUTRAL_40=exports.NEUTRAL_300=exports.NEUTRAL_200=exports.NEUTRAL_100=exports.NEUTRAL_10=exports.NEUTRAL_0=exports.INITIAL_100=exports.INITIAL_10=exports.DESTRUCTIVE_100=exports.DESTRUCTIVE_10=exports.DEFAULT_COLOR_THEME=void 0;var PRIMARY_30=exports.PRIMARY_30='#8689AA';var PRIMARY_40=exports.PRIMARY_40='#606380';var PRIMARY_50=exports.PRIMARY_50='#575A72';var PRIMARY_60=exports.PRIMARY_60='#4B539D';var PRIMARY_80=exports.PRIMARY_80='#303775';var PRIMARY_100=exports.PRIMARY_100='#202452';var PRIMARY_400=exports.PRIMARY_400='#525897';var PRIMARY_700=exports.PRIMARY_700='#10123B';var PRIMARY_800=exports.PRIMARY_800='#242D93';var SECONDARY_30=exports.SECONDARY_30='#FEF7D0';var SECONDARY_50=exports.SECONDARY_50='#FFEB7A';var SECONDARY_100=exports.SECONDARY_100='#FAD614';var SECONDARY_300=exports.SECONDARY_300='#FDEC71';var TERTIARY_10=exports.TERTIARY_10='#F2F5F9';var TERTIARY_30=exports.TERTIARY_30='#EFF1F7';var TERTIARY_50=exports.TERTIARY_50='#EDF1FF';var TERTIARY_80=exports.TERTIARY_80='#E0E7FF';var TERTIARY_100=exports.TERTIARY_100='#808695';var TERTIARY_800=exports.TERTIARY_800='#151C7A';var QUATERNARY_10=exports.QUATERNARY_10='#F5F5FC';var QUATERNARY_50=exports.QUATERNARY_50='#DDDFF6';var QUATERNARY_100=exports.QUATERNARY_100='#7182FF';var NEUTRAL_0=exports.NEUTRAL_0='#FFFFFF';var NEUTRAL_5=exports.NEUTRAL_5='#F2F2F2';var NEUTRAL_10=exports.NEUTRAL_10='#E5E5E5';var NEUTRAL_40=exports.NEUTRAL_40='#999999';var NEUTRAL_50=exports.NEUTRAL_50='#FAFAFA';var NEUTRAL_60=exports.NEUTRAL_60='#808080';var NEUTRAL_100=exports.NEUTRAL_100='#000000';var NEUTRAL_200=exports.NEUTRAL_200='#EEEEEE';var NEUTRAL_300=exports.NEUTRAL_300='#E0E0E0';var NEUTRAL_400=exports.NEUTRAL_400='#BDBDBD';var NEUTRAL_500=exports.NEUTRAL_500='#E0E0E0';var NEUTRAL_600=exports.NEUTRAL_600='#757575';var INITIAL_10=exports.INITIAL_10='#ECF5FF';var INITIAL_100=exports.INITIAL_100='#3E97FF';var PROCESS_10=exports.PROCESS_10='#FFF6EC';var PROCESS_100=exports.PROCESS_100='#FBA643';var SUCCESS_10=exports.SUCCESS_10='#E5F7ED';var SUCCESS_100=exports.SUCCESS_100='#00B34C';var DESTRUCTIVE_10=exports.DESTRUCTIVE_10='#FEF0EF';var DESTRUCTIVE_100=exports.DESTRUCTIVE_100='#F36A62';var OVERLAY=exports.OVERLAY='rgba(0,0,0,0.25)';var DEFAULT_COLOR_THEME=exports.DEFAULT_COLOR_THEME=PRIMARY_100;
+Object.defineProperty(exports,"__esModule",{value:true});exports.TERTIARY_800=exports.TERTIARY_80=exports.TERTIARY_50=exports.TERTIARY_30=exports.TERTIARY_100=exports.TERTIARY_10=exports.SUCCESS_100=exports.SUCCESS_10=exports.SECONDARY_50=exports.SECONDARY_300=exports.SECONDARY_30=exports.SECONDARY_100=exports.QUATERNARY_50=exports.QUATERNARY_100=exports.QUATERNARY_10=exports.PROCESS_100=exports.PROCESS_10=exports.PRIMARY_800=exports.PRIMARY_80=exports.PRIMARY_700=exports.PRIMARY_60=exports.PRIMARY_50=exports.PRIMARY_400=exports.PRIMARY_40=exports.PRIMARY_30=exports.PRIMARY_100=exports.OVERLAY=exports.NEUTRAL_700=exports.NEUTRAL_600=exports.NEUTRAL_60=exports.NEUTRAL_500=exports.NEUTRAL_50=exports.NEUTRAL_5=exports.NEUTRAL_400=exports.NEUTRAL_40=exports.NEUTRAL_300=exports.NEUTRAL_200=exports.NEUTRAL_100=exports.NEUTRAL_10=exports.NEUTRAL_0=exports.INITIAL_100=exports.INITIAL_10=exports.DESTRUCTIVE_100=exports.DESTRUCTIVE_10=exports.DEFAULT_COLOR_THEME=void 0;var PRIMARY_30=exports.PRIMARY_30='#8689AA';var PRIMARY_40=exports.PRIMARY_40='#606380';var PRIMARY_50=exports.PRIMARY_50='#575A72';var PRIMARY_60=exports.PRIMARY_60='#4B539D';var PRIMARY_80=exports.PRIMARY_80='#303775';var PRIMARY_100=exports.PRIMARY_100='#202452';var PRIMARY_400=exports.PRIMARY_400='#525897';var PRIMARY_700=exports.PRIMARY_700='#10123B';var PRIMARY_800=exports.PRIMARY_800='#242D93';var SECONDARY_30=exports.SECONDARY_30='#FEF7D0';var SECONDARY_50=exports.SECONDARY_50='#FFEB7A';var SECONDARY_100=exports.SECONDARY_100='#FAD614';var SECONDARY_300=exports.SECONDARY_300='#FDEC71';var TERTIARY_10=exports.TERTIARY_10='#F2F5F9';var TERTIARY_30=exports.TERTIARY_30='#EFF1F7';var TERTIARY_50=exports.TERTIARY_50='#EDF1FF';var TERTIARY_80=exports.TERTIARY_80='#E0E7FF';var TERTIARY_100=exports.TERTIARY_100='#808695';var TERTIARY_800=exports.TERTIARY_800='#151C7A';var QUATERNARY_10=exports.QUATERNARY_10='#F5F5FC';var QUATERNARY_50=exports.QUATERNARY_50='#DDDFF6';var QUATERNARY_100=exports.QUATERNARY_100='#7182FF';var NEUTRAL_0=exports.NEUTRAL_0='#FFFFFF';var NEUTRAL_5=exports.NEUTRAL_5='#F2F2F2';var NEUTRAL_10=exports.NEUTRAL_10='#E5E5E5';var NEUTRAL_40=exports.NEUTRAL_40='#999999';var NEUTRAL_50=exports.NEUTRAL_50='#FAFAFA';var NEUTRAL_60=exports.NEUTRAL_60='#808080';var NEUTRAL_100=exports.NEUTRAL_100='#000000';var NEUTRAL_200=exports.NEUTRAL_200='#EEEEEE';var NEUTRAL_300=exports.NEUTRAL_300='#E0E0E0';var NEUTRAL_400=exports.NEUTRAL_400='#BDBDBD';var NEUTRAL_500=exports.NEUTRAL_500='#9E9E9E';var NEUTRAL_600=exports.NEUTRAL_600='#757575';var NEUTRAL_700=exports.NEUTRAL_700='#616161';var INITIAL_10=exports.INITIAL_10='#ECF5FF';var INITIAL_100=exports.INITIAL_100='#3E97FF';var PROCESS_10=exports.PROCESS_10='#FFF6EC';var PROCESS_100=exports.PROCESS_100='#FBA643';var SUCCESS_10=exports.SUCCESS_10='#E5F7ED';var SUCCESS_100=exports.SUCCESS_100='#00B34C';var DESTRUCTIVE_10=exports.DESTRUCTIVE_10='#FEF0EF';var DESTRUCTIVE_100=exports.DESTRUCTIVE_100='#F36A62';var OVERLAY=exports.OVERLAY='rgba(0,0,0,0.25)';var DEFAULT_COLOR_THEME=exports.DEFAULT_COLOR_THEME=PRIMARY_100;

package/dist-web/components/secondaryComponents/SkeletonItem.d.ts

@@ -1,3 +1,12 @@
+import { ColorValue } from 'react-native';
 import React from 'react';
-declare const SkeletonItem: ({ width, height, color, borderRadius, delay }: any) => React.JSX.Element;
+interface SkeletonItemProps {
+    width: number;
+    height: number;
+    color?: ColorValue;
+    borderRadius?: number;
+    delay?: number;
+    animationSpeed?: number;
+}
+declare const SkeletonItem: React.FC<SkeletonItemProps>;
 export default SkeletonItem;

package/dist-web/components/secondaryComponents/SkeletonItem.js

@@ -6,12 +6,17 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { View, Animated } from "react-native-web";
 import React, { useEffect, useRef, useState } from 'react';
+import { NEUTRAL_10 } from "../../styles/colors";
 var SkeletonItem = function SkeletonItem(_ref) {
   var width = _ref.width,
     height = _ref.height,
-    color = _ref.color,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? NEUTRAL_10 : _ref$color,
     borderRadius = _ref.borderRadius,
-    delay = _ref.delay;
+    _ref$delay = _ref.delay,
+    delay = _ref$delay === void 0 ? 10 : _ref$delay,
+    _ref$animationSpeed = _ref.animationSpeed,
+    animationSpeed = _ref$animationSpeed === void 0 ? 600 : _ref$animationSpeed;
   var opacity = useRef(new Animated.Value(0.5)).current;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -19,7 +24,6 @@ var SkeletonItem = function SkeletonItem(_ref) {
     setHasStarted = _useState2[1];
   useEffect(function () {
     if (!hasStarted) {
-      // Aplicar el delay solo una vez al inicio
       Animated.timing(opacity, {
         toValue: 0.5,
         useNativeDriver: false,
@@ -28,16 +32,16 @@ var SkeletonItem = function SkeletonItem(_ref) {
         Animated.loop(Animated.sequence([Animated.timing(opacity, {
           toValue: 1,
           useNativeDriver: false,
-          duration: 600
+          duration: animationSpeed
         }), Animated.timing(opacity, {
           toValue: 0.5,
           useNativeDriver: false,
-          duration: 600
+          duration: animationSpeed
         })])).start();
       });
       setHasStarted(true);
     }
-  }, [hasStarted]);
+  }, [hasStarted, delay, animationSpeed]);
   return /*#__PURE__*/React.createElement(Animated.View, {
     style: {
       width: width,

package/dist-web/components/tab/Tab.js

@@ -13,7 +13,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 // Imports
 import React, { useEffect, useState } from 'react';
 import { View, Text, Pressable, ScrollView } from "react-native-web";
-import { NEUTRAL_200, NEUTRAL_500, PRIMARY_100, SECONDARY_100, TERTIARY_50, TERTIARY_80 } from "../../styles/colors";
+import { NEUTRAL_200, NEUTRAL_500, NEUTRAL_700, PRIMARY_100, SECONDARY_100, TERTIARY_50, TERTIARY_80 } from "../../styles/colors";
 import { TabStyleVariants, mapContainerViewStyle } from "./Tab.styles";
 var Tab = function Tab(_ref) {
   var data = _ref.data,
@@ -53,17 +53,43 @@ var Tab = function Tab(_ref) {
       return HoveredColor;
     }
   };
+  var getPrimaryBorderColor = function getPrimaryBorderColor(index) {
+    if (index === currentIndexSelected) {
+      return PRIMARY_100;
+    } else if (index === hoveredTab) {
+      return NEUTRAL_700;
+    } else {
+      return NEUTRAL_500;
+    }
+  };
+  var getSecondaryBackgroundColor = function getSecondaryBackgroundColor(index) {
+    if (index === currentIndexSelected) {
+      return SECONDARY_100;
+    } else if (index === hoveredTab) {
+      return TERTIARY_50;
+    } else {
+      return NEUTRAL_200;
+    }
+  };
+  var getTabTextStyle = function getTabTextStyle(index) {
+    if (index === currentIndexSelected) {
+      return TabStyleVariants[typeStyle].text;
+    } else if (index === hoveredTab) {
+      return TabStyleVariants[typeStyle].hoveredColor;
+    } else {
+      return TabStyleVariants[typeStyle].textDisabled;
+    }
+  };
   var getTabStyle = function getTabStyle(index) {
     switch (typeStyle) {
       case 'primary':
         return {
-          borderTopColor: index === currentIndexSelected ? SECONDARY_100 : 'transparent',
-          borderBottomColor: index === currentIndexSelected ? PRIMARY_100 : NEUTRAL_500,
+          borderBottomColor: getPrimaryBorderColor(index),
           borderBottomWidth: index === currentIndexSelected ? 2 : 1
         };
       case 'secondary':
         return {
-          backgroundColor: index === currentIndexSelected ? SECONDARY_100 : NEUTRAL_200
+          backgroundColor: getSecondaryBackgroundColor(index)
         };
       case 'terciary':
         return {
@@ -123,7 +149,7 @@ var Tab = function Tab(_ref) {
       },
       onHoverOut: handleHoverOut
     }, /*#__PURE__*/React.createElement(Text, {
-      style: [index === currentIndexSelected ? TabStyleVariants[typeStyle].text : TabStyleVariants[typeStyle].textDisabled]
+      style: getTabTextStyle(index)
     }, item.name));
   })));
 };

package/dist-web/components/tab/Tab.styles.js

@@ -4,7 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-import { NEUTRAL_0, NEUTRAL_50, NEUTRAL_500, NEUTRAL_600, PRIMARY_100 } from "../../styles/colors";
+import { NEUTRAL_0, NEUTRAL_50, NEUTRAL_500, NEUTRAL_600, NEUTRAL_700, PRIMARY_100 } from "../../styles/colors";
 var commonTabStyles = {
   alignItems: 'center',
   justifyContent: 'center'
@@ -21,7 +21,6 @@ export var TabStyleVariants = {
       justifyContent: 'center',
       alignItems: 'center',
       borderBottomWidth: 3,
-      flex: 1,
       height: 40,
       paddingHorizontal: 8
     },
@@ -32,6 +31,10 @@ export var TabStyleVariants = {
     textDisabled: {
       color: NEUTRAL_500,
       fontWeight: 'bold'
+    },
+    hoveredColor: {
+      color: NEUTRAL_700,
+      fontWeight: 'bold'
     }
   },
   secondary: {
@@ -43,7 +46,6 @@ export var TabStyleVariants = {
     tab: {
       justifyContent: 'center',
       alignItems: 'center',
-      flex: 1,
       height: 40,
       borderRadius: 6,
       marginHorizontal: 8,
@@ -56,6 +58,10 @@ export var TabStyleVariants = {
     textDisabled: {
       color: NEUTRAL_600,
       fontWeight: 'bold'
+    },
+    hoveredColor: {
+      color: PRIMARY_100,
+      fontWeight: 'bold'
     }
   },
   terciary: {
@@ -74,6 +80,7 @@ export var TabStyleVariants = {
     },
     textDisabled: {
       color: PRIMARY_100
-    }
+    },
+    hoveredColor: {}
   }
 };

package/dist-web/components/tab/Tab.types.d.ts

@@ -9,6 +9,7 @@ export type tabStyleVariant = Record<TabStyleType, {
     tab: ViewStyle;
     text: StyleProp<TextStyle>;
     textDisabled: TextStyle;
+    hoveredColor: StyleProp<TextStyle>;
 }>;
 export interface TabProps {
     data?: TabItemType[];

package/dist-web/styles/colors.d.ts

@@ -30,8 +30,9 @@ export declare const NEUTRAL_100 = "#000000";
 export declare const NEUTRAL_200 = "#EEEEEE";
 export declare const NEUTRAL_300 = "#E0E0E0";
 export declare const NEUTRAL_400 = "#BDBDBD";
-export declare const NEUTRAL_500 = "#E0E0E0";
+export declare const NEUTRAL_500 = "#9E9E9E";
 export declare const NEUTRAL_600 = "#757575";
+export declare const NEUTRAL_700 = "#616161";
 export declare const INITIAL_10 = "#ECF5FF";
 export declare const INITIAL_100 = "#3E97FF";
 export declare const PROCESS_10 = "#FFF6EC";

package/dist-web/styles/colors.js

@@ -30,8 +30,9 @@ export var NEUTRAL_100 = '#000000';
 export var NEUTRAL_200 = '#EEEEEE';
 export var NEUTRAL_300 = '#E0E0E0';
 export var NEUTRAL_400 = '#BDBDBD';
-export var NEUTRAL_500 = '#E0E0E0';
+export var NEUTRAL_500 = '#9E9E9E';
 export var NEUTRAL_600 = '#757575';
+export var NEUTRAL_700 = '#616161';
 export var INITIAL_10 = '#ECF5FF';
 export var INITIAL_100 = '#3E97FF';
 export var PROCESS_10 = '#FFF6EC';

package/package.json

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