@bigbinary/neetoui-rn 0.0.149 → 0.0.152

package/lib/components/Accordion.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Accordion=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _native=require("styled-components/native");var _=require("./");var _excluded=["header","noBorder","iconProp","children"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Accordion.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var Accordion=function Accordion(props){var header=props.header,_props$noBorder=props.noBorder,noBorder=_props$noBorder===void 0?false:_props$noBorder,_props$iconProp=props.iconProp,iconProp=_props$iconProp===void 0?{}:_props$iconProp,children=props.children,rest=(0,_objectWithoutProperties2.default)(props,_excluded);var name=iconProp.name,Label=iconProp.Label,size=iconProp.size,color=iconProp.color;var theme=(0,_react.useContext)(_native.ThemeContext);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isExpanded=_useState2[0],setExpanded=_useState2[1];var _useState3=(0,_react.useState)(0),_useState4=(0,_slicedToArray2.default)(_useState3,2),viewHeight=_useState4[0],setViewHeight=_useState4[1];var animationController=(0,_react.useRef)(new _reactNative.Animated.Value(isExpanded?1:0)).current;var getLayout=function getLayout(event){var height=event.nativeEvent.layout.height;setViewHeight(height);};var handleAnimation=function handleAnimation(){_reactNative.Animated.timing(animationController,{duration:300,toValue:isExpanded?1:0,useNativeDriver:false}).start();setExpanded(!isExpanded);};var arrowAngle=animationController.interpolate({inputRange:[0,1],outputRange:["0rad",Math.PI+"rad"]});var bodyContentHeight=animationController.interpolate({inputRange:[0,1],outputRange:[0,viewHeight]});return _react.default.createElement(_.Container,(0,_extends2.default)({},!noBorder&&{borderColor:"border.grey400",borderWidth:1,borderRadius:8},{width:"100%"},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:82,columnNumber:5}}),_react.default.createElement(_.Card,{p:2,flexDirection:"row",alignItems:"center",onPress:function onPress(){handleAnimation();},__self:_this,__source:{fileName:_jsxFileName,lineNumber:91,columnNumber:7}},!!header&&_react.default.createElement(_.Container,{flexGrow:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:99,columnNumber:22}},header()),_react.default.createElement(_.Container,{alignItems:"center",justifyContent:"center",flexDirection:"row",px:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:100,columnNumber:9}},Label&&_react.default.createElement(Label,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:106,columnNumber:21}}),_react.default.createElement(_reactNative.Animated.View,{style:{alignItems:"flex-end",transform:[{rotateZ:arrowAngle}]},__self:_this,__source:{fileName:_jsxFileName,lineNumber:107,columnNumber:11}},_react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:113,columnNumber:13}},_react.default.createElement(_reactNativeRemixIcon.default,{name:name!=null?name:"ri-arrow-down-s-line",color:color!=null?color:theme.colors.font.grey700,size:size!=null?size:24,__self:_this,__source:{fileName:_jsxFileName,lineNumber:114,columnNumber:15}}))))),_react.default.createElement(_reactNative.Animated.View,{style:{height:bodyContentHeight,overflow:"hidden"},__self:_this,__source:{fileName:_jsxFileName,lineNumber:123,columnNumber:7}},_react.default.createElement(_.Container,{width:"100%",position:"absolute",onLayout:getLayout,__self:_this,__source:{fileName:_jsxFileName,lineNumber:124,columnNumber:9}},children)));};exports.Accordion=Accordion;Accordion.propTypes={header:_propTypes.default.func,children:_propTypes.default.node,noBorder:_propTypes.default.bool,iconProp:_propTypes.default.shape({name:_propTypes.default.string,Label:_propTypes.default.elementType,size:_propTypes.default.number,color:_propTypes.default.string})};
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Accordion=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _native=require("styled-components/native");var _=require("./");var _excluded=["header","noBorder","iconProp","children"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Accordion.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var Accordion=function Accordion(props){var header=props.header,_props$noBorder=props.noBorder,noBorder=_props$noBorder===void 0?false:_props$noBorder,_props$iconProp=props.iconProp,iconProp=_props$iconProp===void 0?{}:_props$iconProp,children=props.children,rest=(0,_objectWithoutProperties2.default)(props,_excluded);var name=iconProp.name,Label=iconProp.Label,size=iconProp.size,color=iconProp.color;var theme=(0,_react.useContext)(_native.ThemeContext);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isExpanded=_useState2[0],setExpanded=_useState2[1];var _useState3=(0,_react.useState)(0),_useState4=(0,_slicedToArray2.default)(_useState3,2),viewHeight=_useState4[0],setViewHeight=_useState4[1];var animationController=(0,_react.useRef)(new _reactNative.Animated.Value(isExpanded?1:0)).current;var getLayout=function getLayout(event){var height=event.nativeEvent.layout.height;setViewHeight(height);};(0,_react.useEffect)(function(){_reactNative.Animated.timing(animationController,{duration:300,toValue:isExpanded?1:0,useNativeDriver:false}).start();},[isExpanded]);var handleAnimation=function handleAnimation(){setExpanded(!isExpanded);};var arrowAngle=animationController.interpolate({inputRange:[0,1],outputRange:["0rad",Math.PI+"rad"]});var bodyContentHeight=animationController.interpolate({inputRange:[0,1],outputRange:[0,viewHeight]});return _react.default.createElement(_.Container,(0,_extends2.default)({},!noBorder&&{borderColor:"border.grey400",borderWidth:1,borderRadius:8},{width:"100%"},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:86,columnNumber:5}}),_react.default.createElement(_.Card,{p:2,flexDirection:"row",alignItems:"center",onPress:function onPress(){handleAnimation();},__self:_this,__source:{fileName:_jsxFileName,lineNumber:95,columnNumber:7}},!!header&&_react.default.createElement(_.Container,{flexGrow:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:103,columnNumber:22}},header()),_react.default.createElement(_.Container,{alignItems:"center",justifyContent:"center",flexDirection:"row",px:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:104,columnNumber:9}},Label&&_react.default.createElement(Label,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:110,columnNumber:21}}),_react.default.createElement(_reactNative.Animated.View,{style:{alignItems:"flex-end",transform:[{rotateZ:arrowAngle}]},__self:_this,__source:{fileName:_jsxFileName,lineNumber:111,columnNumber:11}},_react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:117,columnNumber:13}},_react.default.createElement(_reactNativeRemixIcon.default,{name:name!=null?name:"ri-arrow-down-s-line",color:color!=null?color:theme.colors.font.grey700,size:size!=null?size:24,__self:_this,__source:{fileName:_jsxFileName,lineNumber:118,columnNumber:15}}))))),_react.default.createElement(_reactNative.Animated.View,{style:{height:bodyContentHeight,overflow:"hidden"},__self:_this,__source:{fileName:_jsxFileName,lineNumber:127,columnNumber:7}},_react.default.createElement(_.Container,{width:"100%",position:"absolute",onLayout:getLayout,__self:_this,__source:{fileName:_jsxFileName,lineNumber:128,columnNumber:9}},children)));};exports.Accordion=Accordion;Accordion.propTypes={header:_propTypes.default.func,children:_propTypes.default.node,noBorder:_propTypes.default.bool,iconProp:_propTypes.default.shape({name:_propTypes.default.string,Label:_propTypes.default.elementType,size:_propTypes.default.number,color:_propTypes.default.string})};

package/lib/components/BottomTabBar.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.BottomTabBar=void 0;var _react=_interopRequireWildcard(require("react"));var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _=require("./");var _native=require("styled-components/native");var _jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/BottomTabBar.js",_this=this;function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}function TabElement(_ref){var isFocused=_ref.isFocused,onPress=_ref.onPress,name=_ref.name,tabBarActiveTintColor=_ref.tabBarActiveTintColor,tabBarInactiveTintColor=_ref.tabBarInactiveTintColor,icon=_ref.icon,size=_ref.size;var theme=(0,_react.useContext)(_native.ThemeContext);var offset=(0,_reactNativeReanimated.useSharedValue)(isFocused?1:0);(0,_react.useEffect)(function(){if(isFocused){offset.value=(0,_reactNativeReanimated.withTiming)(1,{duration:500});}else{offset.value=(0,_reactNativeReanimated.withTiming)(0,{duration:0});}},[isFocused]);var animatedStyles=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){return{opacity:(0,_reactNativeReanimated.interpolate)(offset.value,[0,1],[1,0],{extrapolateRight:_reactNativeReanimated.Extrapolation.CLAMP})};};_f._closure={interpolate:_reactNativeReanimated.interpolate,offset:offset,Extrapolation:{CLAMP:_reactNativeReanimated.Extrapolation.CLAMP}};_f.asString="function _f(){const{interpolate,offset,Extrapolation}=jsThis._closure;{return{opacity:interpolate(offset.value,[0,1],[1,0],{extrapolateRight:Extrapolation.CLAMP})};}}";_f.__workletHash=10271988492931;_f.__location="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/BottomTabBar.js (92:42)";_f.__optimalization=3;return _f;}());var animatedStyles2=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){return{opacity:(0,_reactNativeReanimated.interpolate)(offset.value,[0,0.9,1],[0,0.5,1],{extrapolateRight:_reactNativeReanimated.Extrapolation.CLAMP}),transform:[{scale:(0,_reactNativeReanimated.interpolate)(offset.value,[0,0.8,1],[1,1.2,1],{extrapolateRight:_reactNativeReanimated.Extrapolation.CLAMP})}]};};_f._closure={interpolate:_reactNativeReanimated.interpolate,offset:offset,Extrapolation:{CLAMP:_reactNativeReanimated.Extrapolation.CLAMP}};_f.asString="function _f(){const{interpolate,offset,Extrapolation}=jsThis._closure;{return{opacity:interpolate(offset.value,[0,0.9,1],[0,0.5,1],{extrapolateRight:Extrapolation.CLAMP}),transform:[{scale:interpolate(offset.value,[0,0.8,1],[1,1.2,1],{extrapolateRight:Extrapolation.CLAMP})}]};}}";_f.__workletHash=9420491443699;_f.__location="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/BottomTabBar.js (100:43)";_f.__optimalization=3;return _f;}());return _react.default.createElement(_.Container,{flex:1,onTouchStart:onPress,alignItems:"center",borderTopWidth:1,borderColor:"background.grey200",__self:this,__source:{fileName:_jsxFileName,lineNumber:116,columnNumber:5}},_react.default.createElement(_.Container,{height:35,width:48,alignItems:"center",mb:1,__self:this,__source:{fileName:_jsxFileName,lineNumber:123,columnNumber:7}},_react.default.createElement(_reactNativeReanimated.default.View,{style:[styles.iconContainer,animatedStyles],__self:this,__source:{fileName:_jsxFileName,lineNumber:124,columnNumber:9}},_react.default.createElement(_reactNativeRemixIcon.default,{size:size,color:theme.colors.background.grey200,name:icon,__self:this,__source:{fileName:_jsxFileName,lineNumber:125,columnNumber:11}})),_react.default.createElement(_reactNativeReanimated.default.View,{style:[styles.iconContainer,animatedStyles2],__self:this,__source:{fileName:_jsxFileName,lineNumber:131,columnNumber:9}},_react.default.createElement(_reactNativeRemixIcon.default,{size:size,color:theme.colors.background.base,name:icon,__self:this,__source:{fileName:_jsxFileName,lineNumber:132,columnNumber:11}}))),_react.default.createElement(_.Typography,{color:isFocused?tabBarActiveTintColor:tabBarInactiveTintColor,fontFamily:"sf500",__self:this,__source:{fileName:_jsxFileName,lineNumber:136,columnNumber:7}},name));}var styles=_reactNative.StyleSheet.create({iconContainer:{position:"absolute",margin:10}});var BottomTabBar=function BottomTabBar(_ref2){var state=_ref2.state,descriptors=_ref2.descriptors,navigation=_ref2.navigation;return _react.default.createElement(_.Container,{flexDirection:"row",height:82,bg:"background.white",__self:_this,__source:{fileName:_jsxFileName,lineNumber:155,columnNumber:5}},state.routes.map(function(_ref3,index){var key=_ref3.key,name=_ref3.name;var options=descriptors[key].options;var isFocused=state.index===index;var _options$customTabBar=options==null?void 0:options.customTabBarProps,icon=_options$customTabBar.icon,size=_options$customTabBar.size;var tabBarActiveTintColor=options.tabBarActiveTintColor,tabBarInactiveTintColor=options.tabBarInactiveTintColor;var onPress=function onPress(){var event=navigation.emit({type:"tabPress",target:key,canPreventDefault:true});if(!isFocused&&!event.defaultPrevented){navigation.navigate({name:name,merge:true});}};return _react.default.createElement(TabElement,{key:index,onPress:onPress,isFocused:isFocused,name:name,tabBarActiveTintColor:tabBarActiveTintColor,tabBarInactiveTintColor:tabBarInactiveTintColor,icon:icon,size:size,__self:_this,__source:{fileName:_jsxFileName,lineNumber:174,columnNumber:11}});}));};exports.BottomTabBar=BottomTabBar;TabElement.propTypes={isFocused:_propTypes.default.boolean,onPress:_propTypes.default.func,name:_propTypes.default.string,tabBarActiveTintColor:_propTypes.default.string,tabBarInactiveTintColor:_propTypes.default.string,icon:_propTypes.default.string,size:_propTypes.default.number};BottomTabBar.propTypes={state:_propTypes.default.object,descriptors:_propTypes.default.object,navigation:_propTypes.default.object};

package/lib/components/FlashList.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.FlashList=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _flashList=require("@shopify/flash-list");var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _excluded=["durationPerItem","data"],_excluded2=["renderItem","initialDelay","durationPerItem","data"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/FlashList.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var FlashList=function FlashList(_ref){var _ref$durationPerItem=_ref.durationPerItem,durationPerItem=_ref$durationPerItem===void 0?200:_ref$durationPerItem,_ref$data=_ref.data,data=_ref$data===void 0?[]:_ref$data,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);return _react.default.createElement(FadeInFlatList,(0,_extends2.default)({durationPerItem:durationPerItem,data:data},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:15,columnNumber:5}}));};exports.FlashList=FlashList;var FadeInFlatList=function FadeInFlatList(_ref2){var originalRenderItem=_ref2.renderItem,_ref2$initialDelay=_ref2.initialDelay,initialDelay=_ref2$initialDelay===void 0?250:_ref2$initialDelay,_ref2$durationPerItem=_ref2.durationPerItem,durationPerItem=_ref2$durationPerItem===void 0?200:_ref2$durationPerItem,_ref2$data=_ref2.data,data=_ref2$data===void 0?[]:_ref2$data,props=(0,_objectWithoutProperties2.default)(_ref2,_excluded2);var value=(0,_reactNativeReanimated.useSharedValue)(0);var FadeInComponent=(0,_react.useCallback)(function(_ref3){var index=_ref3.index,children=_ref3.children;var inputRange=index===0?[-1,0,1,2]:[index-1,index,index+1,index+2];var animatedStyles=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){return{opacity:(0,_reactNativeReanimated.interpolate)(value.value,inputRange,[0,0,1,1],_reactNativeReanimated.Extrapolation.CLAMP),transform:[{translateX:(0,_reactNativeReanimated.interpolate)(value.value,inputRange,[25,15,10,0],_reactNativeReanimated.Extrapolation.CLAMP)}]};};_f._closure={interpolate:_reactNativeReanimated.interpolate,value:value,inputRange:inputRange,Extrapolation:{CLAMP:_reactNativeReanimated.Extrapolation.CLAMP}};_f.asString="function _f(){const{interpolate,value,inputRange,Extrapolation}=jsThis._closure;{return{opacity:interpolate(value.value,inputRange,[0,0,1,1],Extrapolation.CLAMP),transform:[{translateX:interpolate(value.value,inputRange,[25,15,10,0],Extrapolation.CLAMP)}]};}}";_f.__workletHash=13443821877058;_f.__location="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/FlashList.js (33:46)";_f.__optimalization=3;return _f;}());return _react.default.createElement(_reactNativeReanimated.default.View,{style:animatedStyles,__self:_this,__source:{fileName:_jsxFileName,lineNumber:54,columnNumber:14}},children);},[]);var Item=(0,_react.useCallback)(function(_ref4){var item=_ref4.item;return item.index===0?originalRenderItem(item):_react.default.createElement(FadeInComponent,{index:item.index,__self:_this,__source:{fileName:_jsxFileName,lineNumber:64,columnNumber:7}},originalRenderItem(item));},[]);var renderItem=(0,_react.useCallback)(function(item){return _react.default.createElement(Item,{item:item,__self:_this,__source:{fileName:_jsxFileName,lineNumber:72,columnNumber:12}});},[]);(0,_react.useEffect)(function(){value.value=(0,_reactNativeReanimated.withDelay)(initialDelay,(0,_reactNativeReanimated.withTiming)(data.length+1,{duration:data.length*durationPerItem}));},[data.length,durationPerItem,initialDelay,value]);return _react.default.createElement(_flashList.FlashList,(0,_extends2.default)({},props,{data:data,renderItem:renderItem,__self:_this,__source:{fileName:_jsxFileName,lineNumber:84,columnNumber:10}}));};var _default=FadeInFlatList;exports.default=_default;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.FlashList=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _flashList=require("@shopify/flash-list");var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _propTypes=_interopRequireDefault(require("prop-types"));var _native=_interopRequireWildcard(require("react-content-loader/native"));var _native2=require("styled-components/native");var _reactNative=require("react-native");var _hooks=require("../hooks");var _excluded=["durationPerItem","SkeletonComponent","placeHolderItemCount","isLoading","data","onRefresh","keyExtractor"],_excluded2=["renderItem","initialDelay","durationPerItem","isLoading","SkeletonComponent"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/FlashList.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var Placeholder=function Placeholder(){var theme=(0,_react.useContext)(_native2.ThemeContext);return _react.default.createElement(_native.default,{height:68,width:400,viewBox:"0 0 400 50",backgroundColor:theme.colors.lightgrey,foregroundColor:theme.colors.grey300,__self:_this,__source:{fileName:_jsxFileName,lineNumber:22,columnNumber:5}},_react.default.createElement(_native.Rect,{x:"0",y:"8",width:400,height:"70",__self:_this,__source:{fileName:_jsxFileName,lineNumber:29,columnNumber:7}}));};var FlashList=function FlashList(_ref){var _ref$durationPerItem=_ref.durationPerItem,durationPerItem=_ref$durationPerItem===void 0?200:_ref$durationPerItem,SkeletonComponent=_ref.SkeletonComponent,_ref$placeHolderItemC=_ref.placeHolderItemCount,placeHolderItemCount=_ref$placeHolderItemC===void 0?10:_ref$placeHolderItemC,_ref$isLoading=_ref.isLoading,isLoading=_ref$isLoading===void 0?false:_ref$isLoading,_ref$data=_ref.data,data=_ref$data===void 0?[]:_ref$data,_ref$onRefresh=_ref.onRefresh,onRefresh=_ref$onRefresh===void 0?function(){}:_ref$onRefresh,_keyExtractor=_ref.keyExtractor,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var dummyData=Array.apply(null,Array(placeHolderItemCount));var _useRefreshByUser=(0,_hooks.useRefreshByUser)(onRefresh),isRefetchingByUser=_useRefreshByUser.isRefetchingByUser,refetchByUser=_useRefreshByUser.refetchByUser;return _react.default.createElement(FadeInFlatList,(0,_extends2.default)({durationPerItem:durationPerItem,SkeletonComponent:SkeletonComponent,isLoading:isLoading,extraData:{isLoading:isLoading},data:isLoading?dummyData:data,refreshControl:onRefresh&&_react.default.createElement(_reactNative.RefreshControl,{refreshing:isRefetchingByUser,onRefresh:refetchByUser,__self:_this,__source:{fileName:_jsxFileName,lineNumber:57,columnNumber:11}}),keyExtractor:function keyExtractor(item,index){return isLoading||!_keyExtractor?index.toString():_keyExtractor(item,index);}},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:49,columnNumber:5}}));};exports.FlashList=FlashList;var FadeInFlatList=function FadeInFlatList(_ref2){var originalRenderItem=_ref2.renderItem,_ref2$initialDelay=_ref2.initialDelay,initialDelay=_ref2$initialDelay===void 0?250:_ref2$initialDelay,_ref2$durationPerItem=_ref2.durationPerItem,durationPerItem=_ref2$durationPerItem===void 0?200:_ref2$durationPerItem,_ref2$isLoading=_ref2.isLoading,isLoading=_ref2$isLoading===void 0?false:_ref2$isLoading,SkeletonComponent=_ref2.SkeletonComponent,props=(0,_objectWithoutProperties2.default)(_ref2,_excluded2);var value=(0,_reactNativeReanimated.useSharedValue)(0);var FadeInComponent=(0,_react.useCallback)(function(_ref3){var index=_ref3.index,children=_ref3.children;var inputRange=index===0?[-1,0,1,2]:[index-1,index,index+1,index+2];var animatedStyles=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){return{opacity:(0,_reactNativeReanimated.interpolate)(value.value,inputRange,[0,0,1,1],_reactNativeReanimated.Extrapolation.CLAMP),transform:[{translateX:(0,_reactNativeReanimated.interpolate)(value.value,inputRange,[25,15,10,0],_reactNativeReanimated.Extrapolation.CLAMP)}]};};_f._closure={interpolate:_reactNativeReanimated.interpolate,value:value,inputRange:inputRange,Extrapolation:{CLAMP:_reactNativeReanimated.Extrapolation.CLAMP}};_f.asString="function _f(){const{interpolate,value,inputRange,Extrapolation}=jsThis._closure;{return{opacity:interpolate(value.value,inputRange,[0,0,1,1],Extrapolation.CLAMP),transform:[{translateX:interpolate(value.value,inputRange,[25,15,10,0],Extrapolation.CLAMP)}]};}}";_f.__workletHash=13443821877058;_f.__location="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/FlashList.js (88:46)";_f.__optimalization=3;return _f;}());return _react.default.createElement(_reactNativeReanimated.default.View,{style:animatedStyles,__self:_this,__source:{fileName:_jsxFileName,lineNumber:109,columnNumber:14}},children);},[]);var Item=(0,_react.useCallback)(function(_ref4){var _item$extraData;var item=_ref4.item;return item!=null&&(_item$extraData=item.extraData)!=null&&_item$extraData.isLoading?_react.default.createElement(FadeInComponent,{index:item.index,__self:_this,__source:{fileName:_jsxFileName,lineNumber:118,columnNumber:9}},SkeletonComponent||_react.default.createElement(Placeholder,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:119,columnNumber:33}})):item.index===0?originalRenderItem(item):_react.default.createElement(FadeInComponent,{index:item.index,__self:_this,__source:{fileName:_jsxFileName,lineNumber:124,columnNumber:9}},originalRenderItem(item));},[]);var renderItem=(0,_react.useCallback)(function(item){return _react.default.createElement(Item,{item:item,__self:_this,__source:{fileName:_jsxFileName,lineNumber:134,columnNumber:12}});},[]);(0,_react.useEffect)(function(){value.value=0;value.value=(0,_reactNativeReanimated.withDelay)(initialDelay,(0,_reactNativeReanimated.withTiming)(props.data.length+1,{duration:props.data.length*durationPerItem}));},[props.data.length,durationPerItem,initialDelay,value,isLoading]);return _react.default.createElement(_flashList.FlashList,(0,_extends2.default)({},props,{renderItem:renderItem,__self:_this,__source:{fileName:_jsxFileName,lineNumber:147,columnNumber:10}}));};FlashList.propTypes={SkeletonComponent:_propTypes.default.element,durationPerItem:_propTypes.default.number,data:_propTypes.default.array.isRequired,isLoading:_propTypes.default.bool,placeHolderItemCount:_propTypes.default.number,onRefresh:_propTypes.default.func,keyExtractor:_propTypes.default.func};

package/lib/components/SearchBar.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.SearchBar=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _=require("./");var _hooks=require("../hooks");var _theme=require("../theme");var _excluded=["placeholder","onChangeText","onCancel","debounceDelay"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/SearchBar.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var SearchBar=function SearchBar(props){var _props$placeholder=props.placeholder,placeholder=_props$placeholder===void 0?"Search":_props$placeholder,_props$onChangeText=props.onChangeText,onChangeText=_props$onChangeText===void 0?function(){}:_props$onChangeText,_props$onCancel=props.onCancel,onCancel=_props$onCancel===void 0?function(){}:_props$onCancel,_props$debounceDelay=props.debounceDelay,debounceDelay=_props$debounceDelay===void 0?1000:_props$debounceDelay,rest=(0,_objectWithoutProperties2.default)(props,_excluded);var inputRef=(0,_react.useRef)();var _useState=(0,_react.useState)(""),_useState2=(0,_slicedToArray2.default)(_useState,2),searchText=_useState2[0],setSearchText=_useState2[1];var debouncedSearchTextValue=(0,_hooks.useDebounce)(searchText,Number(debounceDelay));var searchAnimationController=(0,_react.useRef)(new _reactNative.Animated.Value(0)).current;(0,_react.useEffect)(function(){onChangeText(debouncedSearchTextValue);},[debouncedSearchTextValue,onChangeText]);var animateSearchInput=function animateSearchInput(val){_reactNative.Animated.timing(searchAnimationController,{toValue:val,duration:350,useNativeDriver:false}).start();};var searchInputWidth=searchAnimationController.interpolate({inputRange:[0,1],outputRange:["100%","85%"]});var onCancelHandle=function onCancelHandle(){animateSearchInput(0);setSearchText("");inputRef.current.blur();onCancel();};return _react.default.createElement(_.Container,(0,_extends2.default)({flexDirection:"row",alignItems:"center"},rest.containerProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:69,columnNumber:5}}),_react.default.createElement(_reactNative.Animated.View,{style:(0,_extends2.default)({},styles.inputContainerStyles,{width:searchInputWidth}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:70,columnNumber:7}},_react.default.createElement(_.Container,{px:10,__self:_this,__source:{fileName:_jsxFileName,lineNumber:76,columnNumber:9}},_react.default.createElement(_reactNativeRemixIcon.default,{name:"ri-search-line",size:20,color:_theme.theme.colors.font.grey600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:77,columnNumber:11}})),_react.default.createElement(_reactNative.TextInput,(0,_extends2.default)({ref:inputRef,value:searchText,onChangeText:setSearchText,onFocus:function onFocus(){animateSearchInput(1);},onBlur:function onBlur(){if(!searchText)animateSearchInput(0);},placeholder:placeholder,fontSize:16,flex:1,placeholderTextColor:_theme.theme.colors.font.grey600,color:"font.primary"},rest.searchbarProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:83,columnNumber:9}}))),_react.default.createElement(_reactNative.Animated.View,{style:{opacity:searchAnimationController},__self:_this,__source:{fileName:_jsxFileName,lineNumber:101,columnNumber:7}},_react.default.createElement(_.Button,{variant:"text",label:"Cancel",onPress:onCancelHandle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:106,columnNumber:9}})));};exports.SearchBar=SearchBar;var styles=_reactNative.StyleSheet.create({inputContainerStyles:{height:42,borderWidth:1,borderColor:_theme.theme.colors.border.grey400,borderRadius:8,flexDirection:"row",alignItems:"center"}});SearchBar.propTypes={placeholder:_propTypes.default.string,onChangeText:_propTypes.default.func.isRequired,debounceDelay:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),searchbarProps:_propTypes.default.object,onCancel:_propTypes.default.func};
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.SearchBar=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _=require("./");var _hooks=require("../hooks");var _theme=require("../theme");var _excluded=["placeholder","onChangeText","onCancel","debounceDelay"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/SearchBar.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var SearchBar=function SearchBar(props){var _props$placeholder=props.placeholder,placeholder=_props$placeholder===void 0?"Search":_props$placeholder,_props$onChangeText=props.onChangeText,onChangeText=_props$onChangeText===void 0?function(){}:_props$onChangeText,_props$onCancel=props.onCancel,onCancel=_props$onCancel===void 0?function(){}:_props$onCancel,_props$debounceDelay=props.debounceDelay,debounceDelay=_props$debounceDelay===void 0?1000:_props$debounceDelay,rest=(0,_objectWithoutProperties2.default)(props,_excluded);var inputRef=(0,_react.useRef)();var _useState=(0,_react.useState)(""),_useState2=(0,_slicedToArray2.default)(_useState,2),searchText=_useState2[0],setSearchText=_useState2[1];var debouncedSearchTextValue=(0,_hooks.useDebounce)(searchText,Number(debounceDelay));var searchAnimationController=(0,_react.useRef)(new _reactNative.Animated.Value(0)).current;(0,_react.useEffect)(function(){onChangeText(debouncedSearchTextValue);},[debouncedSearchTextValue,onChangeText]);var animateSearchInput=function animateSearchInput(val){_reactNative.Animated.timing(searchAnimationController,{toValue:val,duration:350,useNativeDriver:false}).start();};var searchInputWidth=searchAnimationController.interpolate({inputRange:[0,1],outputRange:["100%","85%"]});var onCancelHandle=function onCancelHandle(){animateSearchInput(0);setSearchText("");inputRef.current.blur();onCancel();};return _react.default.createElement(_.Container,(0,_extends2.default)({flexDirection:"row",alignItems:"center"},rest.containerProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:69,columnNumber:5}}),_react.default.createElement(_reactNative.Animated.View,{style:(0,_extends2.default)({},styles.inputContainerStyles,{width:searchInputWidth}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:70,columnNumber:7}},_react.default.createElement(_.Container,{px:10,__self:_this,__source:{fileName:_jsxFileName,lineNumber:76,columnNumber:9}},_react.default.createElement(_reactNativeRemixIcon.default,{name:"ri-search-line",size:20,color:_theme.theme.colors.font.grey600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:77,columnNumber:11}})),_react.default.createElement(_reactNative.TextInput,(0,_extends2.default)({ref:inputRef,value:searchText,onChangeText:setSearchText,onFocus:function onFocus(){animateSearchInput(1);},onBlur:function onBlur(){if(!searchText)animateSearchInput(0);},placeholder:placeholder,fontSize:16,flex:1,placeholderTextColor:_theme.theme.colors.font.grey600,color:"font.primary",autoCapitalize:"none",returnKeyType:"search"},rest.searchbarProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:83,columnNumber:9}}))),_react.default.createElement(_reactNative.Animated.View,{style:{opacity:searchAnimationController},__self:_this,__source:{fileName:_jsxFileName,lineNumber:103,columnNumber:7}},_react.default.createElement(_.Button,{variant:"text",label:"Cancel",onPress:onCancelHandle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:108,columnNumber:9}})));};exports.SearchBar=SearchBar;var styles=_reactNative.StyleSheet.create({inputContainerStyles:{height:42,borderWidth:1,borderColor:_theme.theme.colors.border.grey400,borderRadius:8,flexDirection:"row",alignItems:"center"}});SearchBar.propTypes={placeholder:_propTypes.default.string,onChangeText:_propTypes.default.func.isRequired,debounceDelay:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),searchbarProps:_propTypes.default.object,onCancel:_propTypes.default.func};

package/lib/components/index.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"Accordion",{enumerable:true,get:function get(){return _Accordion.Accordion;}});Object.defineProperty(exports,"Alert",{enumerable:true,get:function get(){return _Alert.Alert;}});Object.defineProperty(exports,"Avatar",{enumerable:true,get:function get(){return _Avatar.Avatar;}});Object.defineProperty(exports,"Badge",{enumerable:true,get:function get(){return _Badge.Badge;}});Object.defineProperty(exports,"BottomSheet",{enumerable:true,get:function get(){return _BottomSheet.BottomSheet;}});Object.defineProperty(exports,"Button",{enumerable:true,get:function get(){return _Button.Button;}});Object.defineProperty(exports,"ButtonGroup",{enumerable:true,get:function get(){return _ButtonGroup.ButtonGroup;}});Object.defineProperty(exports,"Calendar",{enumerable:true,get:function get(){return _Calendar.Calendar;}});Object.defineProperty(exports,"Card",{enumerable:true,get:function get(){return _Card.Card;}});Object.defineProperty(exports,"Carousel",{enumerable:true,get:function get(){return _Carousel.Carousel;}});Object.defineProperty(exports,"CheckBox",{enumerable:true,get:function get(){return _CheckBox.CheckBox;}});Object.defineProperty(exports,"Chip",{enumerable:true,get:function get(){return _Chip.Chip;}});Object.defineProperty(exports,"Container",{enumerable:true,get:function get(){return _Container.Container;}});Object.defineProperty(exports,"Divider",{enumerable:true,get:function get(){return _Divider.Divider;}});Object.defineProperty(exports,"FAB",{enumerable:true,get:function get(){return _FAB.FAB;}});Object.defineProperty(exports,"FlashList",{enumerable:true,get:function get(){return _FlashList.FlashList;}});Object.defineProperty(exports,"FlatList",{enumerable:true,get:function get(){return _FlatList.FlatList;}});Object.defineProperty(exports,"Input",{enumerable:true,get:function get(){return _Input.Input;}});Object.defineProperty(exports,"ListItem",{enumerable:true,get:function get(){return _ListItem.ListItem;}});Object.defineProperty(exports,"MultiSelect",{enumerable:true,get:function get(){return _MultiSelect.MultiSelect;}});Object.defineProperty(exports,"OnBoarding",{enumerable:true,get:function get(){return _OnBoarding.OnBoarding;}});Object.defineProperty(exports,"OtpInputs",{enumerable:true,get:function get(){return _OtpInputs.OtpInputs;}});Object.defineProperty(exports,"ParentView",{enumerable:true,get:function get(){return _ParentView.ParentView;}});Object.defineProperty(exports,"Popover",{enumerable:true,get:function get(){return _Popover.Popover;}});Object.defineProperty(exports,"RadioButton",{enumerable:true,get:function get(){return _RadioButton.RadioButton;}});Object.defineProperty(exports,"RichTextEditor",{enumerable:true,get:function get(){return _RichTextEditor.RichTextEditor;}});Object.defineProperty(exports,"ScrollView",{enumerable:true,get:function get(){return _ScrollView.ScrollView;}});Object.defineProperty(exports,"SearchBar",{enumerable:true,get:function get(){return _SearchBar.SearchBar;}});Object.defineProperty(exports,"SegmentPicker",{enumerable:true,get:function get(){return _SegmentPicker.SegmentPicker;}});Object.defineProperty(exports,"Select",{enumerable:true,get:function get(){return _Select.Select;}});Object.defineProperty(exports,"SocialButton",{enumerable:true,get:function get(){return _SocialButton.SocialButton;}});Object.defineProperty(exports,"Toast",{enumerable:true,get:function get(){return _Toast.Toast;}});Object.defineProperty(exports,"ToggleSwitch",{enumerable:true,get:function get(){return _ToggleSwitch.ToggleSwitch;}});Object.defineProperty(exports,"TopBar",{enumerable:true,get:function get(){return _TopBar.TopBar;}});Object.defineProperty(exports,"Touchable",{enumerable:true,get:function get(){return _Touchable.Touchable;}});Object.defineProperty(exports,"Typography",{enumerable:true,get:function get(){return _Typography.Typography;}});var _Button=require("./Button");var _SocialButton=require("./SocialButton");var _Container=require("./Container");var _Typography=require("./Typography");var _Input=require("./Input");var _FAB=require("./FAB");var _ToggleSwitch=require("./ToggleSwitch");var _Avatar=require("./Avatar");var _Badge=require("./Badge");var _Toast=require("./Toast");var _Alert=require("./Alert");var _BottomSheet=require("./BottomSheet");var _Chip=require("./Chip");var _ParentView=require("./ParentView");var _RichTextEditor=require("./RichTextEditor");var _ButtonGroup=require("./ButtonGroup");var _OtpInputs=require("./OtpInputs");var _Popover=require("./Popover");var _Touchable=require("./Touchable");var _Card=require("./Card");var _TopBar=require("./TopBar");var _RadioButton=require("./RadioButton");var _CheckBox=require("./CheckBox");var _Select=require("./Select");var _MultiSelect=require("./MultiSelect");var _Divider=require("./Divider");var _FlatList=require("./FlatList");var _ScrollView=require("./ScrollView");var _SegmentPicker=require("./SegmentPicker");var _ListItem=require("./ListItem");var _Carousel=require("./Carousel");var _OnBoarding=require("./OnBoarding");var _SearchBar=require("./SearchBar");var _Accordion=require("./Accordion");var _Calendar=require("./Calendar");var _FlashList=require("./FlashList");
+Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"Accordion",{enumerable:true,get:function get(){return _Accordion.Accordion;}});Object.defineProperty(exports,"Alert",{enumerable:true,get:function get(){return _Alert.Alert;}});Object.defineProperty(exports,"Avatar",{enumerable:true,get:function get(){return _Avatar.Avatar;}});Object.defineProperty(exports,"Badge",{enumerable:true,get:function get(){return _Badge.Badge;}});Object.defineProperty(exports,"BottomSheet",{enumerable:true,get:function get(){return _BottomSheet.BottomSheet;}});Object.defineProperty(exports,"BottomTabBar",{enumerable:true,get:function get(){return _BottomTabBar.BottomTabBar;}});Object.defineProperty(exports,"Button",{enumerable:true,get:function get(){return _Button.Button;}});Object.defineProperty(exports,"ButtonGroup",{enumerable:true,get:function get(){return _ButtonGroup.ButtonGroup;}});Object.defineProperty(exports,"Calendar",{enumerable:true,get:function get(){return _Calendar.Calendar;}});Object.defineProperty(exports,"Card",{enumerable:true,get:function get(){return _Card.Card;}});Object.defineProperty(exports,"Carousel",{enumerable:true,get:function get(){return _Carousel.Carousel;}});Object.defineProperty(exports,"CheckBox",{enumerable:true,get:function get(){return _CheckBox.CheckBox;}});Object.defineProperty(exports,"Chip",{enumerable:true,get:function get(){return _Chip.Chip;}});Object.defineProperty(exports,"Container",{enumerable:true,get:function get(){return _Container.Container;}});Object.defineProperty(exports,"Divider",{enumerable:true,get:function get(){return _Divider.Divider;}});Object.defineProperty(exports,"FAB",{enumerable:true,get:function get(){return _FAB.FAB;}});Object.defineProperty(exports,"FlashList",{enumerable:true,get:function get(){return _FlashList.FlashList;}});Object.defineProperty(exports,"FlatList",{enumerable:true,get:function get(){return _FlatList.FlatList;}});Object.defineProperty(exports,"Input",{enumerable:true,get:function get(){return _Input.Input;}});Object.defineProperty(exports,"ListItem",{enumerable:true,get:function get(){return _ListItem.ListItem;}});Object.defineProperty(exports,"MultiSelect",{enumerable:true,get:function get(){return _MultiSelect.MultiSelect;}});Object.defineProperty(exports,"OnBoarding",{enumerable:true,get:function get(){return _OnBoarding.OnBoarding;}});Object.defineProperty(exports,"OtpInputs",{enumerable:true,get:function get(){return _OtpInputs.OtpInputs;}});Object.defineProperty(exports,"ParentView",{enumerable:true,get:function get(){return _ParentView.ParentView;}});Object.defineProperty(exports,"Popover",{enumerable:true,get:function get(){return _Popover.Popover;}});Object.defineProperty(exports,"RadioButton",{enumerable:true,get:function get(){return _RadioButton.RadioButton;}});Object.defineProperty(exports,"RichTextEditor",{enumerable:true,get:function get(){return _RichTextEditor.RichTextEditor;}});Object.defineProperty(exports,"ScrollView",{enumerable:true,get:function get(){return _ScrollView.ScrollView;}});Object.defineProperty(exports,"SearchBar",{enumerable:true,get:function get(){return _SearchBar.SearchBar;}});Object.defineProperty(exports,"SegmentPicker",{enumerable:true,get:function get(){return _SegmentPicker.SegmentPicker;}});Object.defineProperty(exports,"Select",{enumerable:true,get:function get(){return _Select.Select;}});Object.defineProperty(exports,"SocialButton",{enumerable:true,get:function get(){return _SocialButton.SocialButton;}});Object.defineProperty(exports,"Toast",{enumerable:true,get:function get(){return _Toast.Toast;}});Object.defineProperty(exports,"ToggleSwitch",{enumerable:true,get:function get(){return _ToggleSwitch.ToggleSwitch;}});Object.defineProperty(exports,"TopBar",{enumerable:true,get:function get(){return _TopBar.TopBar;}});Object.defineProperty(exports,"Touchable",{enumerable:true,get:function get(){return _Touchable.Touchable;}});Object.defineProperty(exports,"Typography",{enumerable:true,get:function get(){return _Typography.Typography;}});var _Button=require("./Button");var _SocialButton=require("./SocialButton");var _Container=require("./Container");var _Typography=require("./Typography");var _Input=require("./Input");var _FAB=require("./FAB");var _ToggleSwitch=require("./ToggleSwitch");var _Avatar=require("./Avatar");var _Badge=require("./Badge");var _Toast=require("./Toast");var _Alert=require("./Alert");var _BottomSheet=require("./BottomSheet");var _Chip=require("./Chip");var _ParentView=require("./ParentView");var _RichTextEditor=require("./RichTextEditor");var _ButtonGroup=require("./ButtonGroup");var _OtpInputs=require("./OtpInputs");var _Popover=require("./Popover");var _Touchable=require("./Touchable");var _Card=require("./Card");var _TopBar=require("./TopBar");var _RadioButton=require("./RadioButton");var _CheckBox=require("./CheckBox");var _Select=require("./Select");var _MultiSelect=require("./MultiSelect");var _Divider=require("./Divider");var _FlatList=require("./FlatList");var _ScrollView=require("./ScrollView");var _SegmentPicker=require("./SegmentPicker");var _ListItem=require("./ListItem");var _Carousel=require("./Carousel");var _OnBoarding=require("./OnBoarding");var _SearchBar=require("./SearchBar");var _Accordion=require("./Accordion");var _Calendar=require("./Calendar");var _FlashList=require("./FlashList");var _BottomTabBar=require("./BottomTabBar");

package/lib/hooks/index.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"useDebounce",{enumerable:true,get:function get(){return _useDebounce.useDebounce;}});Object.defineProperty(exports,"useKeyboard",{enumerable:true,get:function get(){return _useKeyboard.useKeyboard;}});var _useKeyboard=require("./useKeyboard");var _useDebounce=require("./useDebounce");
+Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"useDebounce",{enumerable:true,get:function get(){return _useDebounce.useDebounce;}});Object.defineProperty(exports,"useKeyboard",{enumerable:true,get:function get(){return _useKeyboard.useKeyboard;}});Object.defineProperty(exports,"useRefreshByUser",{enumerable:true,get:function get(){return _useRefreshByUser.useRefreshByUser;}});var _useKeyboard=require("./useKeyboard");var _useDebounce=require("./useDebounce");var _useRefreshByUser=require("./useRefreshByUser");

package/lib/hooks/useRefreshByUser.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.useRefreshByUser=useRefreshByUser;var _regenerator=_interopRequireDefault(require("@babel/runtime/regenerator"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=require("react");function useRefreshByUser(refetch){var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isRefetchingByUser=_useState2[0],setIsRefetchingByUser=_useState2[1];function refetchByUser(){return _regenerator.default.async(function refetchByUser$(_context){while(1){switch(_context.prev=_context.next){case 0:setIsRefetchingByUser(true);_context.prev=1;_context.next=4;return _regenerator.default.awrap(refetch());case 4:_context.prev=4;setIsRefetchingByUser(false);return _context.finish(4);case 7:case"end":return _context.stop();}}},null,null,[[1,,4,7]],Promise);}return{isRefetchingByUser:isRefetchingByUser,refetchByUser:refetchByUser};}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigbinary/neetoui-rn",
-  "version": "0.0.149",
+  "version": "0.0.152",
   "main": "lib/index.js",
   "author": "BigBinary",
   "license": "MIT",
@@ -25,7 +25,8 @@
     "get-stories": "sb-rn-get-stories --config-path=./.storybook",
     "preweb": "yarn get-stories",
     "web": "yarn prestart && webpack serve --mode=development --config webpack.config.js",
-    "prepare": "husky install"
+    "prepare": "husky install",
+    "yalc:publish": "yarn build && rm -rf ~/.yalc/packages && yalc publish --private"
   },
   "files": [
     "lib",
@@ -50,6 +51,7 @@
     "@shopify/flash-list": "^1.2.0",
     "@styled-system/prop-types": "^5.1.5",
     "dayjs": "^1.11.4",
+    "react-content-loader": "^6.2.0",
     "react-native-calendars": "^1.1285.0",
     "react-native-gesture-handler": "^2.4.0",
     "react-native-material-ripple": "^0.9.1",
@@ -68,10 +70,13 @@
     "@babel/cli": "^7.16.0",
     "@babel/core": "^7.12.9",
     "@babel/runtime": "^7.12.5",
+    "@bigbinary/eslint-plugin-neeto": "^1.0.11",
     "@react-native-async-storage/async-storage": "^1.15.11",
     "@react-native-community/datetimepicker": "^3.5.2",
     "@react-native-community/eslint-config": "^3.0.1",
     "@react-native-community/slider": "^4.1.12",
+    "@react-navigation/bottom-tabs": "^6.3.2",
+    "@react-navigation/native": "^6.0.11",
     "@storybook/addon-actions": "^6.3.12",
     "@storybook/addon-controls": "^6.3.12",
     "@storybook/addon-essentials": "^6.4.0-beta.33",
@@ -99,7 +104,6 @@
     "eslint-import-resolver-babel-module": "^5.3.1",
     "eslint-plugin-import": "^2.25.3",
     "eslint-plugin-jest": "^25.2.4",
-    "eslint-plugin-neeto": "^1.0.10",
     "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-promise": "^5.1.1",
     "eslint-plugin-react": "^7.27.0",
@@ -115,6 +119,7 @@
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "react-native": "0.66.2",
+    "react-native-screens": "^3.15.0",
     "react-native-storybook-loader": "^2.0.4",
     "react-native-svg": "^12.1.1",
     "react-native-svg-transformer": "^1.0.0",

package/src/components/BottomTabBar.js

@@ -0,0 +1,204 @@
+import React, { useContext, useEffect } from "react";
+import Icon from "react-native-remix-icon";
+import PropTypes from "prop-types";
+import { StyleSheet } from "react-native";
+import Animated, {
+  useSharedValue,
+  useAnimatedStyle,
+  withTiming,
+  interpolate,
+  Extrapolation,
+} from "react-native-reanimated";
+import { Container, Typography } from "@components";
+import { ThemeContext } from "styled-components/native";
+
+/**
+ *
+ *  ## Usage
+ * ```js
+ * import * as React from 'react';
+ * import { Typography, BottomTabBar  } from '@bigbinary/neetoui-rn';
+ * import { NavigationContainer } from '@react-navigation/native';
+ * import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+ * import { ThemeContext } from "styled-components/native";
+ *
+ * const Tab = createBottomTabNavigator();
+ *
+ * const HomeScreen = () => {
+ *  return (
+ *   <Typography fontSize="14px">Home Screen</Typography>
+ *  )
+ * }
+ *
+ * const SettingsScreen = () => {
+ *   return (
+ *     <Typography fontSize="14px">Settings Screen</Typography>
+ *   )
+ * }
+ *
+ * export default function Main() {
+ *  const theme = useContext(ThemeContext);
+ *  return (
+ *    <Tab.Navigator
+ *      screenOptions={{
+ *        tabBarActiveTintColor: theme.colors.background.base,
+ *        tabBarInactiveTintColor: theme.colors.background.grey500,
+ *      }}
+ *      tabBar={props => <BottomTabBar {...props} />}
+ *    >
+ *      <Tab.Screen name="Home" component={HomeScreen}
+ *        options={{
+ *          customTabBarProps: {
+ *            icon: "home-5-line",
+ *            size: 26,
+ *          },
+ *        }}
+ *      />
+ *      <Tab.Screen name="Settings" component={SettingsScreen}
+ *        options={{
+ *          customTabBarProps: {
+ *            icon: "user-3-line",
+ *            size: 26,
+ *          },
+ *        }} />
+ *    </Tab.Navigator>
+ *  );
+ * }
+ * ```
+ *
+ */
+
+function TabElement({
+  isFocused,
+  onPress,
+  name,
+  tabBarActiveTintColor,
+  tabBarInactiveTintColor,
+  icon,
+  size,
+}) {
+  const theme = useContext(ThemeContext);
+  const offset = useSharedValue(isFocused ? 1 : 0);
+
+  useEffect(() => {
+    if (isFocused) {
+      offset.value = withTiming(1, { duration: 500 });
+    } else {
+      offset.value = withTiming(0, { duration: 0 });
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isFocused]);
+
+  const animatedStyles = useAnimatedStyle(() => {
+    return {
+      opacity: interpolate(offset.value, [0, 1], [1, 0], {
+        extrapolateRight: Extrapolation.CLAMP,
+      }),
+    };
+  });
+
+  const animatedStyles2 = useAnimatedStyle(() => {
+    return {
+      opacity: interpolate(offset.value, [0, 0.9, 1], [0, 0.5, 1], {
+        extrapolateRight: Extrapolation.CLAMP,
+      }),
+      transform: [
+        {
+          scale: interpolate(offset.value, [0, 0.8, 1], [1, 1.2, 1], {
+            extrapolateRight: Extrapolation.CLAMP,
+          }),
+        },
+      ],
+    };
+  });
+
+  return (
+    <Container
+      flex={1}
+      onTouchStart={onPress}
+      alignItems="center"
+      borderTopWidth={1}
+      borderColor="background.grey200"
+    >
+      <Container height={35} width={48} alignItems="center" mb={1}>
+        <Animated.View style={[styles.iconContainer, animatedStyles]}>
+          <Icon
+            size={size}
+            color={theme.colors.background.grey200}
+            name={icon}
+          />
+        </Animated.View>
+        <Animated.View style={[styles.iconContainer, animatedStyles2]}>
+          <Icon size={size} color={theme.colors.background.base} name={icon} />
+        </Animated.View>
+      </Container>
+
+      <Typography
+        color={isFocused ? tabBarActiveTintColor : tabBarInactiveTintColor}
+        fontFamily="sf500"
+      >
+        {name}
+      </Typography>
+    </Container>
+  );
+}
+
+const styles = StyleSheet.create({
+  iconContainer: {
+    position: "absolute",
+    margin: 10,
+  },
+});
+
+export const BottomTabBar = ({ state, descriptors, navigation }) => {
+  return (
+    <Container flexDirection="row" height={82} bg="background.white">
+      {state.routes.map(({ key, name }, index) => {
+        const { options } = descriptors[key];
+        const isFocused = state.index === index;
+        const { icon, size } = options?.customTabBarProps;
+        const { tabBarActiveTintColor, tabBarInactiveTintColor } = options;
+        const onPress = () => {
+          const event = navigation.emit({
+            type: "tabPress",
+            target: key,
+            canPreventDefault: true,
+          });
+
+          if (!isFocused && !event.defaultPrevented) {
+            navigation.navigate({ name: name, merge: true });
+          }
+        };
+
+        return (
+          <TabElement
+            key={index}
+            onPress={onPress}
+            isFocused={isFocused}
+            name={name}
+            tabBarActiveTintColor={tabBarActiveTintColor}
+            tabBarInactiveTintColor={tabBarInactiveTintColor}
+            icon={icon}
+            size={size}
+          />
+        );
+      })}
+    </Container>
+  );
+};
+
+TabElement.propTypes = {
+  isFocused: PropTypes.boolean,
+  onPress: PropTypes.func,
+  name: PropTypes.string,
+  tabBarActiveTintColor: PropTypes.string,
+  tabBarInactiveTintColor: PropTypes.string,
+  icon: PropTypes.string,
+  size: PropTypes.number,
+};
+
+BottomTabBar.propTypes = {
+  state: PropTypes.object,
+  descriptors: PropTypes.object,
+  navigation: PropTypes.object,
+};

package/src/components/FlashList.js

@@ -1,5 +1,5 @@
 /* eslint-disable react/prop-types */
-import React, { useCallback, useEffect } from "react";
+import React, { useCallback, useContext, useEffect } from "react";
 import { FlashList as ShopifyFlashList } from "@shopify/flash-list";
 import Animated, {
   Extrapolation,
@@ -9,10 +9,64 @@ import Animated, {
   withDelay,
   withTiming,
 } from "react-native-reanimated";
+import PropTypes from "prop-types";
+import ContentLoader, { Rect } from "react-content-loader/native";
+import { ThemeContext } from "styled-components/native";
+import { RefreshControl } from "react-native";
 
-export const FlashList = ({ durationPerItem = 200, data = [], ...rest }) => {
+import { useRefreshByUser } from "@hooks";
+
+const Placeholder = () => {
+  const theme = useContext(ThemeContext);
   return (
-    <FadeInFlatList durationPerItem={durationPerItem} data={data} {...rest} />
+    <ContentLoader
+      height={68}
+      width={400}
+      viewBox="0 0 400 50"
+      backgroundColor={theme.colors.lightgrey}
+      foregroundColor={theme.colors.grey300}
+    >
+      <Rect x="0" y="8" width={400} height="70" />
+    </ContentLoader>
+  );
+};
+
+export const FlashList = ({
+  durationPerItem = 200,
+  SkeletonComponent,
+  placeHolderItemCount = 10,
+  isLoading = false,
+  data = [],
+  onRefresh = () => {},
+  keyExtractor,
+  ...rest
+}) => {
+  const dummyData = Array.apply(null, Array(placeHolderItemCount));
+
+  const { isRefetchingByUser, refetchByUser } = useRefreshByUser(onRefresh);
+
+  return (
+    <FadeInFlatList
+      durationPerItem={durationPerItem}
+      SkeletonComponent={SkeletonComponent}
+      isLoading={isLoading}
+      extraData={{ isLoading }}
+      data={isLoading ? dummyData : data}
+      refreshControl={
+        onRefresh && (
+          <RefreshControl
+            refreshing={isRefetchingByUser}
+            onRefresh={refetchByUser}
+          />
+        )
+      }
+      keyExtractor={(item, index) => {
+        return isLoading || !keyExtractor
+          ? index.toString()
+          : keyExtractor(item, index);
+      }}
+      {...rest}
+    />
   );
 };
 
@@ -20,7 +74,8 @@ const FadeInFlatList = ({
   renderItem: originalRenderItem,
   initialDelay = 250,
   durationPerItem = 200,
-  data = [],
+  isLoading = false,
+  SkeletonComponent,
   ...props
 }) => {
   const value = useSharedValue(0);
@@ -57,31 +112,47 @@ const FadeInFlatList = ({
     []
   );
 
-  const Item = useCallback(({ item }) => {
-    return item.index === 0 ? (
-      originalRenderItem(item)
-    ) : (
-      <FadeInComponent index={item.index}>
-        {originalRenderItem(item)}
-      </FadeInComponent>
-    );
+  const Item = useCallback(
+    ({ item }) => {
+      return item?.extraData?.isLoading ? (
+        <FadeInComponent index={item.index}>
+          {SkeletonComponent || <Placeholder />}
+        </FadeInComponent>
+      ) : item.index === 0 ? (
+        originalRenderItem(item)
+      ) : (
+        <FadeInComponent index={item.index}>
+          {originalRenderItem(item)}
+        </FadeInComponent>
+      );
+    },
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+    []
+  );
 
   const renderItem = useCallback(item => {
     return <Item item={item} />;
   }, []);
 
   useEffect(() => {
+    value.value = 0;
     value.value = withDelay(
       initialDelay,
-      withTiming(data.length + 1, {
-        duration: data.length * durationPerItem,
+      withTiming(props.data.length + 1, {
+        duration: props.data.length * durationPerItem,
       })
     );
-  }, [data.length, durationPerItem, initialDelay, value]);
+  }, [props.data.length, durationPerItem, initialDelay, value, isLoading]);
 
-  return <ShopifyFlashList {...props} data={data} renderItem={renderItem} />;
+  return <ShopifyFlashList {...props} renderItem={renderItem} />;
 };
 
-export default FadeInFlatList;
+FlashList.propTypes = {
+  SkeletonComponent: PropTypes.element,
+  durationPerItem: PropTypes.number,
+  data: PropTypes.array.isRequired,
+  isLoading: PropTypes.bool,
+  placeHolderItemCount: PropTypes.number,
+  onRefresh: PropTypes.func,
+  keyExtractor: PropTypes.func,
+};

package/src/components/SearchBar.js

@@ -95,6 +95,8 @@ export const SearchBar = props => {
           flex={1}
           placeholderTextColor={theme.colors.font.grey600}
           color="font.primary"
+          autoCapitalize="none"
+          returnKeyType="search"
           {...rest.searchbarProps}
         />
       </Animated.View>

package/src/components/index.js

@@ -34,3 +34,4 @@ export { SearchBar } from "./SearchBar";
 export { Accordion } from "./Accordion";
 export { Calendar } from "./Calendar";
 export { FlashList } from "./FlashList";
+export { BottomTabBar } from "./BottomTabBar";

package/src/hooks/index.js

@@ -1,2 +1,3 @@
 export { useKeyboard } from "./useKeyboard";
 export { useDebounce } from "./useDebounce";
+export { useRefreshByUser } from "./useRefreshByUser";

package/src/hooks/useRefreshByUser.js

@@ -0,0 +1,20 @@
+import { useState } from "react";
+
+export function useRefreshByUser(refetch) {
+  const [isRefetchingByUser, setIsRefetchingByUser] = useState(false);
+
+  async function refetchByUser() {
+    setIsRefetchingByUser(true);
+
+    try {
+      await refetch();
+    } finally {
+      setIsRefetchingByUser(false);
+    }
+  }
+
+  return {
+    isRefetchingByUser,
+    refetchByUser,
+  };
+}