@bigbinary/neetoui-rn 0.0.176 → 0.0.177

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,4 @@
1
+ <svg width="255" height="139" viewBox="0 0 255 139" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <rect width="255" height="139" rx="18" fill="#F6F6FA"/>
3
+ <path d="M142.375 48.25H112.625C109.106 48.2539 106.254 51.1057 106.25 54.625V73.8953V84.375C106.254 87.8943 109.106 90.7461 112.625 90.75H142.375C142.762 90.7495 143.145 90.7033 143.522 90.6333C143.662 90.6076 143.796 90.5688 143.933 90.534C144.158 90.4765 144.38 90.4094 144.597 90.3274C144.755 90.2682 144.91 90.206 145.062 90.1348C145.24 90.0508 145.411 89.9534 145.581 89.8527C145.741 89.7588 145.903 89.6708 146.053 89.5638C146.065 89.5549 146.079 89.5491 146.092 89.5402C146.107 89.5287 146.121 89.5146 146.136 89.5023C146.165 89.4788 146.202 89.4673 146.228 89.4407C146.243 89.4265 146.247 89.4076 146.26 89.393C147.763 88.2268 148.748 86.4241 148.75 84.375V78.1494V54.625C148.746 51.1057 145.894 48.2539 142.375 48.25ZM143.597 88.424C143.2 88.5468 142.79 88.6247 142.375 88.625H112.625C110.279 88.622 108.378 86.721 108.375 84.375V74.3352L116.371 66.3395C117.824 64.891 120.176 64.891 121.629 66.3395L128.865 73.5741C128.869 73.5783 128.87 73.5839 128.874 73.588L143.683 88.3971C143.654 88.4065 143.626 88.4151 143.597 88.424ZM146.625 84.375C146.624 85.4721 146.196 86.4621 145.513 87.2161L131.13 72.8344L133.373 70.5916C134.842 69.1846 137.158 69.1846 138.627 70.5916L146.625 78.5894V84.375ZM146.625 75.5845L140.13 69.0891C137.848 66.8105 134.152 66.8105 131.87 69.0891L129.627 71.3321L123.132 64.837C120.848 62.5585 117.152 62.5585 114.868 64.837L108.375 71.3303V54.625C108.378 52.279 110.279 50.378 112.625 50.375H142.375C144.721 50.378 146.622 52.279 146.625 54.625V75.5845ZM130.688 56.75C128.927 56.75 127.5 58.1771 127.5 59.9375C127.5 61.6979 128.927 63.125 130.688 63.125C132.447 63.1231 133.873 61.6971 133.875 59.9375C133.875 58.1771 132.448 56.75 130.688 56.75ZM130.688 61C130.101 61 129.625 60.5243 129.625 59.9375C129.625 59.3507 130.101 58.875 130.688 58.875C131.274 58.8762 131.749 59.3511 131.75 59.9375C131.75 60.5243 131.274 61 130.688 61Z" fill="#68737D"/>
4
+ </svg>
@@ -0,0 +1 @@
1
+ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.AnimatedImage=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 _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _=require("./");var _imagePlaceholder=_interopRequireDefault(require("../../assets/images/image-placeholder.svg"));var _reactNative=require("react-native");var _theme=require("../theme");var _excluded=["imageHeight","imageWidth","imageUrl"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/AnimatedImage.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 AnimatedImage=function AnimatedImage(_ref){var _ref$imageHeight=_ref.imageHeight,imageHeight=_ref$imageHeight===void 0?139:_ref$imageHeight,_ref$imageWidth=_ref.imageWidth,imageWidth=_ref$imageWidth===void 0?255:_ref$imageWidth,imageUrl=_ref.imageUrl,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var opacity=(0,_reactNativeReanimated.useSharedValue)(0);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isImageLoaded=_useState2[0],setImageLoaded=_useState2[1];var profileImageStyle=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){return{opacity:(0,_reactNativeReanimated.withTiming)(opacity.value,{duration:300,easing:_reactNativeReanimated.Easing.bezier(0.25,0.1,0.25,1)}),height:imageHeight,width:imageWidth,alignSelf:"center",borderRadius:10};};_f._closure={withTiming:_reactNativeReanimated.withTiming,opacity:opacity,Easing:{bezier:_reactNativeReanimated.Easing.bezier},imageHeight:imageHeight,imageWidth:imageWidth};_f.asString="function _f(){const{withTiming,opacity,Easing,imageHeight,imageWidth}=jsThis._closure;{return{opacity:withTiming(opacity.value,{duration:300,easing:Easing.bezier(0.25,0.1,0.25,1)}),height:imageHeight,width:imageWidth,alignSelf:\"center\",borderRadius:10};}}";_f.__workletHash=14435952499043;_f.__location="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/AnimatedImage.js (51:45)";_f.__optimalization=2;return _f;}());return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement(_.Container,{justifyContent:"center",alignItems:"center",borderRadius:10,overflow:"hidden",__self:_this,__source:{fileName:_jsxFileName,lineNumber:66,columnNumber:7}},_react.default.createElement(_reactNativeReanimated.default.Image,(0,_extends2.default)({style:profileImageStyle,source:{uri:imageUrl,headers:{Accept:"*/*","Content-Type":"application/json",Pragma:"no-cache"}},onLoad:function onLoad(){setImageLoaded(true);opacity.value=1;}},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:72,columnNumber:9}})),!isImageLoaded&&_react.default.createElement(_.Container,{position:"absolute",__self:_this,__source:{fileName:_jsxFileName,lineNumber:90,columnNumber:11}},_react.default.createElement(_imagePlaceholder.default,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:91,columnNumber:13}}),_react.default.createElement(_.Container,{position:"absolute",bottom:15,right:15,__self:_this,__source:{fileName:_jsxFileName,lineNumber:92,columnNumber:13}},_react.default.createElement(_reactNative.ActivityIndicator,{size:"small",color:_theme.theme.colors.font.grey600,__self:_this,__source:{fileName:_jsxFileName,lineNumber:93,columnNumber:15}})))));};exports.AnimatedImage=AnimatedImage;AnimatedImage.defaultProps={alignItems:"center",justifyContent:"center"};AnimatedImage.propTypes={imageHeight:_propTypes.default.number,imageWidth:_propTypes.default.number,imageUrl:_propTypes.default.string.isRequired};
@@ -1 +1 @@
1
- var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Button=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("@styled-system/prop-types"));var _propTypes2=_interopRequireDefault(require("prop-types"));var _native=require("styled-components/native");var _reactNative=require("react-native");var _=require("./");var _excluded=["variant","label","labelStyle","RightIcon","LeftIcon","disabled","isLoading","loadingText","fontFamily","color","fontSize"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Button.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 Button=function Button(props){var variant=props.variant,label=props.label,labelStyle=props.labelStyle,RightIcon=props.RightIcon,LeftIcon=props.LeftIcon,disabled=props.disabled,isLoading=props.isLoading,loadingText=props.loadingText,fontFamily=props.fontFamily,color=props.color,fontSize=props.fontSize,rest=(0,_objectWithoutProperties2.default)(props,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);var width=variant==="text"||variant==="danger-text"?null:"100%";var getButtonColors=function getButtonColors(){switch(variant){case"solid":return{bg:theme.colors.background[disabled?"grey400":"base"],border:theme.colors.background[disabled?"grey400":"base"],color:theme.colors.background.white,ripple:"white"};case"text":return{bg:"transparent",border:"transparent",color:theme.colors.font.primary,ripple:theme.colors.background.grey800};case"danger":return{bg:theme.colors.background.danger,border:theme.colors.background.danger,color:theme.colors.background.white,ripple:"white"};case"danger-inverse":return{bg:theme.colors.background.white,border:theme.colors.background.danger,color:theme.colors.background.danger,ripple:theme.colors.background.grey800};case"danger-text":return{bg:"transparent",border:"transparent",color:theme.colors.background.danger,ripple:theme.colors.background.grey800};default:return{bg:theme.colors.background[disabled?"grey400":"base"],border:theme.colors.background[disabled?"grey400":"base"],color:theme.colors.background.white,ripple:"white"};}};var renderOpacity=function renderOpacity(){if(["danger","danger-inverse","danger-text"].includes(variant)&&disabled)return 0.5;return 1;};return _react.default.createElement(_.Touchable,(0,_extends2.default)({rippleColor:getButtonColors().ripple,disabled:disabled,bg:getButtonColors().bg,height:48,width:width,borderRadius:8,flexDirection:"row",alignItems:"center",justifyContent:"center",borderColor:getButtonColors().border,borderWidth:1,opacity:renderOpacity()},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:136,columnNumber:5}}),isLoading?_react.default.createElement(_.Container,{flexDirection:"row",__self:_this,__source:{fileName:_jsxFileName,lineNumber:152,columnNumber:9}},_react.default.createElement(_reactNative.ActivityIndicator,{color:getButtonColors().color,__self:_this,__source:{fileName:_jsxFileName,lineNumber:153,columnNumber:11}}),!!loadingText&&_react.default.createElement(_.Typography,(0,_extends2.default)({textAlign:"center",mx:2,color:color||getButtonColors().color,fontSize:fontSize,fontFamily:fontFamily||theme.fonts.sf500},labelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:155,columnNumber:13}}),loadingText)):_react.default.createElement(_react.default.Fragment,null,LeftIcon&&_react.default.createElement(LeftIcon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:169,columnNumber:24}}),_react.default.createElement(_.Typography,(0,_extends2.default)({textAlign:"center",mx:2,color:color||getButtonColors().color,fontSize:fontSize,fontFamily:fontFamily||theme.fonts.sf500},labelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:170,columnNumber:11}}),label),RightIcon&&_react.default.createElement(RightIcon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:180,columnNumber:25}})));};exports.Button=Button;Button.defaultProps={variant:"solid",isLoading:false,loadingText:"",fontSize:"m"};Button.propTypes=(0,_extends2.default)({},_propTypes.default.buttonStyle,_propTypes.default.flexbox,_propTypes.default.space,_propTypes.default.border,_propTypes.default.layout,_propTypes.default.color,{label:_propTypes2.default.string.isRequired,variant:_propTypes2.default.oneOf(["text","solid","danger","danger-inverse","danger-text"]),disabled:_propTypes2.default.bool,labelStyle:_propTypes2.default.object,RightIcon:_propTypes2.default.elementType,LeftIcon:_propTypes2.default.elementType,isLoading:_propTypes2.default.bool,loadingText:_propTypes2.default.string});
1
+ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Button=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("@styled-system/prop-types"));var _propTypes2=_interopRequireDefault(require("prop-types"));var _native=require("styled-components/native");var _reactNative=require("react-native");var _=require("./");var _excluded=["variant","label","labelStyle","RightIcon","LeftIcon","disabled","isLoading","loadingText","fontFamily","color","fontSize"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Button.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 Button=function Button(props){var variant=props.variant,label=props.label,labelStyle=props.labelStyle,RightIcon=props.RightIcon,LeftIcon=props.LeftIcon,disabled=props.disabled,isLoading=props.isLoading,loadingText=props.loadingText,fontFamily=props.fontFamily,color=props.color,fontSize=props.fontSize,rest=(0,_objectWithoutProperties2.default)(props,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);var width=variant==="text"||variant==="danger-text"?null:"100%";var getButtonColors=function getButtonColors(){switch(variant){case"solid":return{bg:theme.colors.background[disabled?"grey400":"base"],border:theme.colors.background[disabled?"grey400":"base"],color:theme.colors.background.white,ripple:"white"};case"text":return{bg:"transparent",border:"transparent",color:theme.colors.font.primary,ripple:theme.colors.background.grey800};case"danger":return{bg:theme.colors.background.danger,border:theme.colors.background.danger,color:theme.colors.background.white,ripple:"white"};case"danger-inverse":return{bg:theme.colors.background.white,border:theme.colors.background.danger,color:theme.colors.background.danger,ripple:theme.colors.background.grey800};case"danger-text":return{bg:"transparent",border:"transparent",color:theme.colors.background.danger,ripple:theme.colors.background.grey800};default:return{bg:theme.colors.background[disabled?"grey400":"base"],border:theme.colors.background[disabled?"grey400":"base"],color:theme.colors.background.white,ripple:"white"};}};var renderOpacity=function renderOpacity(){if(["danger","danger-inverse","danger-text"].includes(variant)&&disabled)return 0.5;return 1;};return _react.default.createElement(_.Touchable,(0,_extends2.default)({rippleColor:getButtonColors().ripple,disabled:disabled||isLoading,bg:getButtonColors().bg,height:48,width:width,borderRadius:8,flexDirection:"row",alignItems:"center",justifyContent:"center",borderColor:getButtonColors().border,borderWidth:1,opacity:renderOpacity()},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:136,columnNumber:5}}),isLoading?_react.default.createElement(_.Container,{flexDirection:"row",__self:_this,__source:{fileName:_jsxFileName,lineNumber:152,columnNumber:9}},_react.default.createElement(_reactNative.ActivityIndicator,{color:getButtonColors().color,__self:_this,__source:{fileName:_jsxFileName,lineNumber:153,columnNumber:11}}),!!loadingText&&_react.default.createElement(_.Typography,(0,_extends2.default)({textAlign:"center",mx:2,color:color||getButtonColors().color,fontSize:fontSize,fontFamily:fontFamily||theme.fonts.sf500},labelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:155,columnNumber:13}}),loadingText)):_react.default.createElement(_react.default.Fragment,null,LeftIcon&&_react.default.createElement(LeftIcon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:169,columnNumber:24}}),_react.default.createElement(_.Typography,(0,_extends2.default)({textAlign:"center",mx:2,color:color||getButtonColors().color,fontSize:fontSize,fontFamily:fontFamily||theme.fonts.sf500},labelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:170,columnNumber:11}}),label),RightIcon&&_react.default.createElement(RightIcon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:180,columnNumber:25}})));};exports.Button=Button;Button.defaultProps={variant:"solid",isLoading:false,loadingText:"",fontSize:"m"};Button.propTypes=(0,_extends2.default)({},_propTypes.default.buttonStyle,_propTypes.default.flexbox,_propTypes.default.space,_propTypes.default.border,_propTypes.default.layout,_propTypes.default.color,{label:_propTypes2.default.string.isRequired,variant:_propTypes2.default.oneOf(["text","solid","danger","danger-inverse","danger-text"]),disabled:_propTypes2.default.bool,labelStyle:_propTypes2.default.object,RightIcon:_propTypes2.default.elementType,LeftIcon:_propTypes2.default.elementType,isLoading:_propTypes2.default.bool,loadingText:_propTypes2.default.string});
@@ -1 +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,"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,"SegmentedTopBar",{enumerable:true,get:function get(){return _SegmentedTopBar.SegmentedTopBar;}});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 _SegmentedTopBar=require("./SegmentedTopBar");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");
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,"AnimatedImage",{enumerable:true,get:function get(){return _AnimatedImage.AnimatedImage;}});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,"SegmentedTopBar",{enumerable:true,get:function get(){return _SegmentedTopBar.SegmentedTopBar;}});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 _SegmentedTopBar=require("./SegmentedTopBar");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");var _AnimatedImage=require("./AnimatedImage");
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bigbinary/neetoui-rn",
3
- "version": "0.0.176",
3
+ "version": "0.0.177",
4
4
  "main": "lib/index.js",
5
5
  "author": "BigBinary",
6
6
  "license": "MIT",
@@ -125,7 +125,7 @@
125
125
  "react-native-reanimated": "^2.7.0",
126
126
  "react-native-screens": "^3.15.0",
127
127
  "react-native-storybook-loader": "^2.0.4",
128
- "react-native-svg": "^12.1.1",
128
+ "react-native-svg": "^12.4.4",
129
129
  "react-native-svg-transformer": "^1.0.0",
130
130
  "react-native-tab-view": "^3.1.1",
131
131
  "react-native-web": "^0.17.5",
@@ -0,0 +1,123 @@
1
+ import React, { useState } from "react";
2
+ import PropTypes from "prop-types";
3
+ import Animated, {
4
+ Easing,
5
+ useAnimatedStyle,
6
+ useSharedValue,
7
+ withTiming,
8
+ } from "react-native-reanimated";
9
+
10
+ import { Container } from "@components";
11
+ import ImagePlaceholder from "@assets/images/image-placeholder.svg";
12
+ import { ActivityIndicator } from "react-native";
13
+ import { theme } from "../theme";
14
+
15
+ /**
16
+ * AnimatedImage can be used to display a placeholder before image is loaded with animation.
17
+ *
18
+ * <div class="screenshots">
19
+ * <img src="screenshots/avatar/images.png" />
20
+ * <img src="screenshots/avatar/texts.png" />
21
+ * </div>
22
+ *
23
+ * ## Usage
24
+ * ```js
25
+ * import * as React from 'react';
26
+ * import { Typography, Avatar } from '@bigbinary/neetoui-rn';
27
+ *
28
+ * export default function Main() {
29
+ * return (
30
+ * <Container>
31
+ * <AnimatedImage
32
+ * imageHeight={139}
33
+ * imageWidth={255}
34
+ * imageUrl="https://picsum.photos/255/139"
35
+ * />
36
+ * </Container>
37
+ * );
38
+ * }
39
+ * ```
40
+ */
41
+
42
+ export const AnimatedImage = ({
43
+ imageHeight = 139,
44
+ imageWidth = 255,
45
+ imageUrl,
46
+ ...rest
47
+ }) => {
48
+ const opacity = useSharedValue(0);
49
+ const [isImageLoaded, setImageLoaded] = useState(false);
50
+
51
+ const profileImageStyle = useAnimatedStyle(() => {
52
+ return {
53
+ opacity: withTiming(opacity.value, {
54
+ duration: 300,
55
+ easing: Easing.bezier(0.25, 0.1, 0.25, 1),
56
+ }),
57
+ height: imageHeight,
58
+ width: imageWidth,
59
+ alignSelf: "center",
60
+ borderRadius: 10,
61
+ };
62
+ });
63
+
64
+ return (
65
+ <>
66
+ <Container
67
+ justifyContent="center"
68
+ alignItems="center"
69
+ borderRadius={10}
70
+ overflow="hidden"
71
+ >
72
+ <Animated.Image
73
+ style={profileImageStyle}
74
+ source={{
75
+ uri: imageUrl,
76
+ headers: {
77
+ Accept: "*/*",
78
+ "Content-Type": "application/json",
79
+ Pragma: "no-cache",
80
+ },
81
+ }}
82
+ onLoad={() => {
83
+ setImageLoaded(true);
84
+ opacity.value = 1;
85
+ }}
86
+ {...rest}
87
+ />
88
+
89
+ {!isImageLoaded && (
90
+ <Container position="absolute">
91
+ <ImagePlaceholder />
92
+ <Container position="absolute" bottom={15} right={15}>
93
+ <ActivityIndicator
94
+ size="small"
95
+ color={theme.colors.font.grey600}
96
+ />
97
+ </Container>
98
+ </Container>
99
+ )}
100
+ </Container>
101
+ </>
102
+ );
103
+ };
104
+
105
+ AnimatedImage.defaultProps = {
106
+ alignItems: "center",
107
+ justifyContent: "center",
108
+ };
109
+
110
+ AnimatedImage.propTypes = {
111
+ /**
112
+ * Height for image.
113
+ */
114
+ imageHeight: PropTypes.number,
115
+ /**
116
+ * Width for image.
117
+ */
118
+ imageWidth: PropTypes.number,
119
+ /**
120
+ * Url to display the Image. It accepts a standard React Native Image source prop Or a function that returns an Image.
121
+ */
122
+ imageUrl: PropTypes.string.isRequired,
123
+ };
@@ -135,7 +135,7 @@ export const Button = props => {
135
135
  return (
136
136
  <Touchable
137
137
  rippleColor={getButtonColors().ripple}
138
- disabled={disabled}
138
+ disabled={disabled || isLoading}
139
139
  bg={getButtonColors().bg}
140
140
  height={48}
141
141
  width={width}
@@ -35,3 +35,4 @@ export { Accordion } from "./Accordion";
35
35
  export { Calendar } from "./Calendar";
36
36
  export { FlashList } from "./FlashList";
37
37
  export { BottomTabBar } from "./BottomTabBar";
38
+ export { AnimatedImage } from "./AnimatedImage";