@bigbinary/neetoui-rn 0.0.35 → 0.0.39

package/lib/components/Avatar.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Avatar=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("prop-types"));var _reactNative=require("react-native");var _=require("./");var _excluded=["name","size","bgColor","fontColor","imageUrl"];var _this=this,_jsxFileName="/Users/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Avatar.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 Avatar=function Avatar(_ref){var name=_ref.name,_ref$size=_ref.size,size=_ref$size===void 0?80:_ref$size,_ref$bgColor=_ref.bgColor,bgColor=_ref$bgColor===void 0?"background.grey200":_ref$bgColor,_ref$fontColor=_ref.fontColor,fontColor=_ref$fontColor===void 0?"font.grey600":_ref$fontColor,imageUrl=_ref.imageUrl,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var acronym=name.split(/\s/).reduce(function(response,word){return response+=word.slice(0,1);},"").slice(0,2);var fontSize=size/2-8;var styles={profileImage:{height:size,width:size,alignSelf:"center",borderRadius:size/2}};return React.createElement(React.Fragment,null,imageUrl?React.createElement(_reactNative.Image,(0,_extends2.default)({style:styles.profileImage,source:{uri:imageUrl}},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:32,columnNumber:9}})):React.createElement(_.Container,(0,_extends2.default)({bg:bgColor,width:size,height:size,borderRadius:size/2},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:38,columnNumber:9}}),React.createElement(_.Typography,{fontFamily:"inter700",fontSize:fontSize>14?fontSize:14,color:fontColor,__self:_this,__source:{fileName:_jsxFileName,lineNumber:45,columnNumber:11}},acronym)));};exports.Avatar=Avatar;Avatar.defaultProps={alignItems:"center",justifyContent:"center"};Avatar.propTypes={name:_propTypes.default.string.isRequired,size:_propTypes.default.number,bgColor:_propTypes.default.string,fontColor:_propTypes.default.string,imageUrl:_propTypes.default.string};
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Avatar=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("prop-types"));var _reactNative=require("react-native");var _=require("./");var _excluded=["name","size","bgColor","fontColor","imageUrl"];var _this=this,_jsxFileName="/Users/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Avatar.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 Avatar=function Avatar(_ref){var name=_ref.name,_ref$size=_ref.size,size=_ref$size===void 0?80:_ref$size,_ref$bgColor=_ref.bgColor,bgColor=_ref$bgColor===void 0?"background.grey200":_ref$bgColor,_ref$fontColor=_ref.fontColor,fontColor=_ref$fontColor===void 0?"font.grey600":_ref$fontColor,imageUrl=_ref.imageUrl,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var acronym=name.split(/\s/).reduce(function(response,word){return response+=word.slice(0,1);},"").slice(0,2);var fontSize=size/2-8;var styles={profileImage:{height:size,width:size,alignSelf:"center",borderRadius:size/2}};return React.createElement(React.Fragment,null,imageUrl?React.createElement(_reactNative.Image,(0,_extends2.default)({style:styles.profileImage,source:{uri:imageUrl}},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:66,columnNumber:9}})):React.createElement(_.Container,(0,_extends2.default)({bg:bgColor,width:size,height:size,borderRadius:size/2},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:72,columnNumber:9}}),React.createElement(_.Typography,{fontFamily:"inter700",fontSize:fontSize>14?fontSize:14,color:fontColor,__self:_this,__source:{fileName:_jsxFileName,lineNumber:79,columnNumber:11}},acronym)));};exports.Avatar=Avatar;Avatar.defaultProps={alignItems:"center",justifyContent:"center"};Avatar.propTypes={name:_propTypes.default.string.isRequired,size:_propTypes.default.number,bgColor:_propTypes.default.string,fontColor:_propTypes.default.string,imageUrl:_propTypes.default.string};

package/lib/components/Badge.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Badge=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireDefault(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _=require("./");var _excluded=["badgeColor","content","size","fontSize","fontFamily","color"];var _this=this,_jsxFileName="/Users/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Badge.js";var Badge=function Badge(_ref){var _ref$badgeColor=_ref.badgeColor,badgeColor=_ref$badgeColor===void 0?"background.base":_ref$badgeColor,content=_ref.content,_ref$size=_ref.size,size=_ref$size===void 0?21:_ref$size,_ref$fontSize=_ref.fontSize,fontSize=_ref$fontSize===void 0?"xs":_ref$fontSize,_ref$fontFamily=_ref.fontFamily,fontFamily=_ref$fontFamily===void 0?"inter400":_ref$fontFamily,_ref$color=_ref.color,color=_ref$color===void 0?"font.white":_ref$color,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);return _react.default.createElement(_.Container,(0,_extends2.default)({width:size,height:size*0.75,bg:badgeColor,borderRadius:size*0.375,justifyContent:"center",alignItems:"center"},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:15,columnNumber:5}}),content&&_react.default.createElement(_.Typography,{fontSize:fontSize,fontFamily:fontFamily,color:color,__self:_this,__source:{fileName:_jsxFileName,lineNumber:25,columnNumber:9}},content));};exports.Badge=Badge;Badge.propTypes={color:_propTypes.default.string,badgeColor:_propTypes.default.string,content:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.number]),size:_propTypes.default.number,textStyles:_propTypes.default.object,borderRadius:_propTypes.default.number,fontSize:_propTypes.default.string,fontFamily:_propTypes.default.string};
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Badge=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireDefault(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _=require("./");var _excluded=["badgeColor","content","size","fontSize","fontFamily","color"];var _this=this,_jsxFileName="/Users/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Badge.js";var Badge=function Badge(_ref){var _ref$badgeColor=_ref.badgeColor,badgeColor=_ref$badgeColor===void 0?"background.base":_ref$badgeColor,content=_ref.content,_ref$size=_ref.size,size=_ref$size===void 0?21:_ref$size,_ref$fontSize=_ref.fontSize,fontSize=_ref$fontSize===void 0?"xs":_ref$fontSize,_ref$fontFamily=_ref.fontFamily,fontFamily=_ref$fontFamily===void 0?"inter400":_ref$fontFamily,_ref$color=_ref.color,color=_ref$color===void 0?"font.white":_ref$color,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);return size>0&&_react.default.createElement(_.Container,(0,_extends2.default)({width:size+"px",height:size*0.75+"px",bg:badgeColor,borderRadius:size*0.375+"px",justifyContent:"center",alignItems:"center"},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:49,columnNumber:7}}),(content==null?void 0:content.length)>0&&_react.default.createElement(_.Typography,{fontSize:fontSize,fontFamily:fontFamily,color:color,__self:_this,__source:{fileName:_jsxFileName,lineNumber:59,columnNumber:11}},content));};exports.Badge=Badge;Badge.propTypes={color:_propTypes.default.string,badgeColor:_propTypes.default.string,content:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.number]),size:_propTypes.default.number,fontSize:_propTypes.default.string,fontFamily:_propTypes.default.string};

package/lib/components/BottomSheet.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.TouchableOpacity=exports.BottomSheet=void 0;var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var React=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _styledSystem=require("styled-system");var _native=_interopRequireDefault(require("styled-components/native"));var _propTypes=_interopRequireDefault(require("prop-types"));var _=require("./");var _reactNativeModal=_interopRequireDefault(require("react-native-modal"));var _templateObject,_this=this,_jsxFileName="/Users/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/BottomSheet.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 TouchableOpacity=_native.default.TouchableOpacity(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2.default)(["\n  ","\n  ","\n  ","\n  ","\n  ","\n  ","\n"])),_styledSystem.buttonStyle,_styledSystem.flexbox,_styledSystem.space,_styledSystem.border,_styledSystem.layout,_styledSystem.color);exports.TouchableOpacity=TouchableOpacity;var Border=function Border(){return React.createElement(_.Container,{bg:"border.primary",height:"1px",width:"100%",__self:_this,__source:{fileName:_jsxFileName,lineNumber:26,columnNumber:10}});};var Title=function Title(_ref){var title=_ref.title,bg=_ref.bg,hide=_ref.hide;var touchY;return React.createElement(React.Fragment,null,React.createElement(_.Container,{bg:bg,onTouchStart:function onTouchStart(e){return touchY=e.nativeEvent.pageY;},onTouchEnd:function onTouchEnd(e){if(e.nativeEvent.pageY-touchY>20)hide();},alignItems:"center",py:20,borderRadius:20,style:{},__self:_this,__source:{fileName:_jsxFileName,lineNumber:33,columnNumber:7}},React.createElement(_.Typography,{color:"font.secondary",fontFamily:"inter700",textStyle:"subtext",__self:_this,__source:{fileName:_jsxFileName,lineNumber:45,columnNumber:9}},title)),React.createElement(Border,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:53,columnNumber:7}}));};Title.propTypes={title:_propTypes.default.string,hide:_propTypes.default.func,bg:_propTypes.default.string};var ContentRow=React.memo(function(_ref2){var label=_ref2.label,onPress=_ref2.onPress,bg=_ref2.bg,isSelected=_ref2.isSelected;return React.createElement(React.Fragment,null,React.createElement(TouchableOpacity,{alignItems:"center",bg:bg,py:12,borderRadius:20,onPress:onPress,__self:_this,__source:{fileName:_jsxFileName,lineNumber:67,columnNumber:7}},React.createElement(_.Typography,{textStyle:"body",fontFamily:isSelected?"inter700":"inter400",__self:_this,__source:{fileName:_jsxFileName,lineNumber:74,columnNumber:9}},label)),React.createElement(Border,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:81,columnNumber:7}}));});ContentRow.displayName="ContentRow";ContentRow.propTypes={label:_propTypes.default.string,onPress:_propTypes.default.func,bg:_propTypes.default.string,isSelected:_propTypes.default.bool};var BottomSheet=function BottomSheet(_ref3){var data=_ref3.data,title=_ref3.title,hide=_ref3.hide,isVisible=_ref3.isVisible,onItemPress=_ref3.onItemPress,selectedItemIndex=_ref3.selectedItemIndex,bg=_ref3.bg;return React.createElement(_reactNativeModal.default,{style:styles.modalStyle,isVisible:isVisible,onBackdropPress:hide,useNativeDriver:true,hideModalContentWhileAnimating:true,__self:_this,__source:{fileName:_jsxFileName,lineNumber:125,columnNumber:5}},React.createElement(_.Container,{bg:bg,flex:1,borderRadius:20,__self:_this,__source:{fileName:_jsxFileName,lineNumber:132,columnNumber:7}},React.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:133,columnNumber:9}},React.createElement(Title,{bg:bg,title:title,hide:hide,__self:_this,__source:{fileName:_jsxFileName,lineNumber:134,columnNumber:11}}),React.createElement(_reactNative.FlatList,{contentContainerStyle:styles.flatListContentContainerStyle,initialNumToRender:data.length,data:data,renderItem:function renderItem(_ref4){var item=_ref4.item,index=_ref4.index;return React.createElement(ContentRow,{isSelected:index===selectedItemIndex,bg:bg,key:index,onPress:function onPress(){hide();onItemPress(index);},label:item,__self:_this,__source:{fileName:_jsxFileName,lineNumber:141,columnNumber:17}});},keyExtractor:function keyExtractor(item,index){return index;},__self:_this,__source:{fileName:_jsxFileName,lineNumber:135,columnNumber:11}}))));};exports.BottomSheet=BottomSheet;BottomSheet.defaultProps={bg:"background.primary"};BottomSheet.propTypes={data:_propTypes.default.array,title:_propTypes.default.string,isVisible:_propTypes.default.bool,hide:_propTypes.default.func,onItemPress:_propTypes.default.func,selectedItemIndex:_propTypes.default.number,bg:_propTypes.default.string};var styles=_reactNative.StyleSheet.create({flatListContentContainerStyle:{paddingBottom:40},modalStyle:{margin:0,alignItems:"flex-end",flexDirection:"row"}});

package/lib/components/ToggleSwitch.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.ToggleSwitch=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNativeSwitchToggle=_interopRequireDefault(require("react-native-switch-toggle"));var _native=require("styled-components/native");var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _=require("./");var _excluded=["value","onValueChange","label","disabled"];var _this=this,_jsxFileName="/Users/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/ToggleSwitch.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 ToggleSwitch=function ToggleSwitch(_ref){var value=_ref.value,onValueChange=_ref.onValueChange,label=_ref.label,disabled=_ref.disabled,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);var circleColorOn=disabled?theme.colors.background.grey500:theme.colors.background.white;var circleColorOff=disabled?theme.colors.background.menubackground:theme.colors.background.white;return _react.default.createElement(_.Container,(0,_extends2.default)({flexDirection:"row",borderColor:theme.colors.border.primary,alignItems:"center"},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:58,columnNumber:5}}),_react.default.createElement(_.Typography,{flex:0.8,textStyle:"subtext",__self:_this,__source:{fileName:_jsxFileName,lineNumber:64,columnNumber:7}},label),_react.default.createElement(_.Container,{flex:0.2,alignItems:"flex-end",__self:_this,__source:{fileName:_jsxFileName,lineNumber:67,columnNumber:7}},_react.default.createElement(_reactNativeSwitchToggle.default,(0,_extends2.default)({switchOn:value,onPress:function onPress(){return!disabled&&onValueChange();},circleColorOn:circleColorOn,circleColorOff:circleColorOff,backgroundColorOff:theme.colors.background.grey200,backgroundColor:theme.colors.background.grey800,containerStyle:styles.containerStyle,circleStyle:styles.circleStyle},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:68,columnNumber:9}}))));};exports.ToggleSwitch=ToggleSwitch;ToggleSwitch.defaultProps={borderWidth:1,borderRadius:2,p:3};ToggleSwitch.propTypes={label:_propTypes.default.string.isRequired,value:_propTypes.default.bool.isRequired,onValueChange:_propTypes.default.func,disabled:_propTypes.default.bool};var styles=_reactNative.StyleSheet.create({containerStyle:{width:38,height:18,borderRadius:10,padding:2},circleStyle:{width:14,height:14,borderRadius:7}});
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.ToggleSwitch=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNativeSwitchToggle=_interopRequireDefault(require("react-native-switch-toggle"));var _native=require("styled-components/native");var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _=require("./");var _excluded=["value","onValueChange","label","disabled"];var _this=this,_jsxFileName="/Users/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/ToggleSwitch.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 ToggleSwitch=function ToggleSwitch(_ref){var value=_ref.value,onValueChange=_ref.onValueChange,label=_ref.label,disabled=_ref.disabled,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);var circleColorOn=disabled?theme.colors.background.grey500:theme.colors.background.white;var circleColorOff=disabled?theme.colors.background.menubackground:theme.colors.background.white;return _react.default.createElement(_.Container,(0,_extends2.default)({flexDirection:"row",borderColor:theme.colors.border.primary,alignItems:"center"},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:54,columnNumber:5}}),_react.default.createElement(_.Typography,{flex:0.8,textStyle:"subtext",__self:_this,__source:{fileName:_jsxFileName,lineNumber:60,columnNumber:7}},label),_react.default.createElement(_.Container,{flex:0.2,alignItems:"flex-end",__self:_this,__source:{fileName:_jsxFileName,lineNumber:63,columnNumber:7}},_react.default.createElement(_reactNativeSwitchToggle.default,(0,_extends2.default)({switchOn:value,onPress:function onPress(){return!disabled&&onValueChange();},circleColorOn:circleColorOn,circleColorOff:circleColorOff,backgroundColorOff:theme.colors.background.grey200,backgroundColor:theme.colors.background.grey800,containerStyle:styles.containerStyle,circleStyle:styles.circleStyle},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:64,columnNumber:9}}))));};exports.ToggleSwitch=ToggleSwitch;ToggleSwitch.defaultProps={borderWidth:1,borderRadius:2,p:3};ToggleSwitch.propTypes={label:_propTypes.default.string.isRequired,value:_propTypes.default.bool.isRequired,onValueChange:_propTypes.default.func,disabled:_propTypes.default.bool};var styles=_reactNative.StyleSheet.create({containerStyle:{width:38,height:18,borderRadius:10,padding:2},circleStyle:{width:14,height:14,borderRadius:7}});

package/lib/components/index.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});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,"Button",{enumerable:true,get:function get(){return _Button.Button;}});Object.defineProperty(exports,"Container",{enumerable:true,get:function get(){return _Container.Container;}});Object.defineProperty(exports,"FAB",{enumerable:true,get:function get(){return _FAB.FAB;}});Object.defineProperty(exports,"Input",{enumerable:true,get:function get(){return _Input.Input;}});Object.defineProperty(exports,"ToggleSwitch",{enumerable:true,get:function get(){return _ToggleSwitch.ToggleSwitch;}});Object.defineProperty(exports,"Typography",{enumerable:true,get:function get(){return _Typography.Typography;}});var _Button=require("./Button");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");
+Object.defineProperty(exports,"__esModule",{value:true});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,"Container",{enumerable:true,get:function get(){return _Container.Container;}});Object.defineProperty(exports,"FAB",{enumerable:true,get:function get(){return _FAB.FAB;}});Object.defineProperty(exports,"Input",{enumerable:true,get:function get(){return _Input.Input;}});Object.defineProperty(exports,"ToggleSwitch",{enumerable:true,get:function get(){return _ToggleSwitch.ToggleSwitch;}});Object.defineProperty(exports,"Typography",{enumerable:true,get:function get(){return _Typography.Typography;}});var _Button=require("./Button");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 _BottomSheet=require("./BottomSheet");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigbinary/neetoui-rn",
-  "version": "0.0.35",
+  "version": "0.0.39",
   "main": "lib/index.js",
   "author": "BigBinary",
   "license": "MIT",
@@ -47,6 +47,7 @@
   "peerDependencies": {},
   "dependencies": {
     "@styled-system/prop-types": "^5.1.5",
+    "react-native-modal": "^13.0.0",
     "react-native-switch-toggle": "^2.2.1",
     "styled-components": "^5.3.3",
     "styled-system": "^5.1.5"

package/src/components/Avatar.js

@@ -4,6 +4,40 @@ import { Image } from "react-native";
 
 import { Typography, Container } from "@components";
 
+/**
+ * Avatars can be used to represent people in a graphical way.
+ *
+ * <div class="screenshots">
+ *   <img src="screenshots/avatar/bgcolors.png" />
+ *   <img src="screenshots/avatar/fontcolors.png" />
+ * </div>
+ *
+ * <div class="screenshots">
+ *   <img src="screenshots/avatar/imagesizes.png" />
+ *   <img src="screenshots/avatar/textsizes.png" />
+ * </div>
+ *
+ *  ## Usage
+ * ```js
+ * import * as React from 'react';
+ * import { Typography, Avatar } from '@bigbinary/neetoui-rn';
+ *
+ * export default function Main() {
+ *  return (
+ *    <Container>
+ *     <Avatar
+ *      size={42}
+ *      name="Oliver Smith"
+ *      bgColor="background.black"
+ *      fontColor="font.white"
+ *      imageUrl="https://www.himalmag.com/wp-content/uploads/2019/07/sample-profile-picture.png"
+ *     />
+ *   </Container>
+ *  );
+ * }
+ * ```
+ */
+
 export const Avatar = ({
   name,
   size = 80,
@@ -61,9 +95,24 @@ Avatar.defaultProps = {
 };
 
 Avatar.propTypes = {
+  /**
+   * Name to obtain user initials to show as the text in the Avatar.
+   */
   name: PropTypes.string.isRequired,
+  /**
+   * Size of the avatar.
+   */
   size: PropTypes.number,
+  /**
+   * Custom color for the avatar.
+   */
   bgColor: PropTypes.string,
+  /**
+   * Custom color for the text.
+   */
   fontColor: PropTypes.string,
+  /**
+   * Image to display for the Avatar. It accepts a standard React Native Image source prop Or a function that returns an Image.
+   */
   imageUrl: PropTypes.string,
 };

package/src/components/Badge.js

@@ -2,6 +2,39 @@ import React from "react";
 import PropTypes from "prop-types";
 import { Typography, Container } from "@components";
 
+/**
+ *
+ * This component supports below props categories from [styled-system ](/styled-system).
+ * <ul>
+ * <li>flexbox</li>
+ * <li>space</li>
+ * <li>border</li>
+ * <li>color</li>
+ * <li>layout</li>
+ * </ul>
+ *
+ *  ## Usage
+ * ```js
+ * import * as React from 'react';
+ * import { Badge, Container } from '@bigbinary/neetoui-rn';
+ *
+ * export default function Main() {
+ *  return (
+ *    <Container>
+ *       <Badge
+ *          content="test"
+ *          size={32}
+ *          fontSize="12px"
+ *          badgeColor="background.secondary"
+ *          color="font.secondary"
+ *        />
+ *    </Container>
+ *  );
+ * }
+ * ```
+ *
+ */
+
 export const Badge = ({
   badgeColor = "background.base",
   content,
@@ -12,31 +45,49 @@ export const Badge = ({
   ...rest
 }) => {
   return (
-    <Container
-      width={size}
-      height={size * 0.75}
-      bg={badgeColor}
-      borderRadius={size * 0.375}
-      justifyContent="center"
-      alignItems="center"
-      {...rest}
-    >
-      {content && (
-        <Typography fontSize={fontSize} fontFamily={fontFamily} color={color}>
-          {content}
-        </Typography>
-      )}
-    </Container>
+    size > 0 && (
+      <Container
+        width={`${size}px`}
+        height={`${size * 0.75}px`}
+        bg={badgeColor}
+        borderRadius={`${size * 0.375}px`}
+        justifyContent="center"
+        alignItems="center"
+        {...rest}
+      >
+        {content?.length > 0 && (
+          <Typography fontSize={fontSize} fontFamily={fontFamily} color={color}>
+            {content}
+          </Typography>
+        )}
+      </Container>
+    )
   );
 };
 
 Badge.propTypes = {
+  /**
+   * Custom badge content color.
+   */
   color: PropTypes.string,
+  /**
+   * Custom badge background color.
+   */
   badgeColor: PropTypes.string,
+  /**
+   * To change content of the badge
+   */
   content: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  /**
+   * Custom badge size.
+   */
   size: PropTypes.number,
-  textStyles: PropTypes.object,
-  borderRadius: PropTypes.number,
+  /**
+   * Custom font-size for badge content.
+   */
   fontSize: PropTypes.string,
+  /**
+   * Custom font-family for badge content.
+   */
   fontFamily: PropTypes.string,
 };

package/src/components/BottomSheet.js

@@ -0,0 +1,207 @@
+import * as React from "react";
+import { StyleSheet, FlatList } from "react-native";
+import {
+  flexbox,
+  space,
+  border,
+  buttonStyle,
+  color,
+  layout,
+} from "styled-system";
+import styled from "styled-components/native";
+import PropTypes from "prop-types";
+import { Typography, Container } from "@components";
+import Modal from "react-native-modal";
+
+export const TouchableOpacity = styled.TouchableOpacity`
+  ${buttonStyle}
+  ${flexbox}
+  ${space}
+  ${border}
+  ${layout}
+  ${color}
+`;
+
+const Border = () => {
+  return <Container bg="border.primary" height="1px" width="100%" />;
+};
+
+const Title = ({ title, bg, hide }) => {
+  let touchY;
+  return (
+    <>
+      <Container
+        bg={bg}
+        onTouchStart={e => (touchY = e.nativeEvent.pageY)}
+        onTouchEnd={e => {
+          // Swipe Down Detection
+          if (e.nativeEvent.pageY - touchY > 20) hide();
+        }}
+        alignItems="center"
+        py={20}
+        borderRadius={20}
+        style={{}}
+      >
+        <Typography
+          color="font.secondary"
+          fontFamily="inter700"
+          textStyle="subtext"
+        >
+          {title}
+        </Typography>
+      </Container>
+      <Border />
+    </>
+  );
+};
+
+Title.propTypes = {
+  title: PropTypes.string,
+  hide: PropTypes.func,
+  bg: PropTypes.string,
+};
+
+const ContentRow = React.memo(({ label, onPress, bg, isSelected }) => {
+  return (
+    <>
+      <TouchableOpacity
+        alignItems="center"
+        bg={bg}
+        py={12}
+        borderRadius={20}
+        onPress={onPress}
+      >
+        <Typography
+          textStyle="body"
+          fontFamily={isSelected ? "inter700" : "inter400"}
+        >
+          {label}
+        </Typography>
+      </TouchableOpacity>
+      <Border />
+    </>
+  );
+});
+ContentRow.displayName = "ContentRow";
+ContentRow.propTypes = {
+  label: PropTypes.string,
+  onPress: PropTypes.func,
+  bg: PropTypes.string,
+  isSelected: PropTypes.bool,
+};
+
+/**
+ * BottomSheet can be used to select an item from list of items. Like a DropDown
+ *
+ * ## Usage
+ * ```js
+ * import * as React from 'react';
+ * import { Typography, Container } from '@bigbinary/neetoui-rn';
+ *
+ * export default function Main() {
+ *  return (
+ *    <Container>
+ *     <Typography>
+ *         This is basic example of Typography
+ *      </Typography>
+ *     </Container>
+ *  );
+ * }
+ * ```
+ *
+ * @extends StyledSystems props /styled-system
+ */
+
+export const BottomSheet = ({
+  data,
+  title,
+  hide,
+  isVisible,
+  onItemPress,
+  selectedItemIndex,
+  bg,
+}) => {
+  return (
+    <Modal
+      style={styles.modalStyle}
+      isVisible={isVisible}
+      onBackdropPress={hide}
+      useNativeDriver
+      hideModalContentWhileAnimating
+    >
+      <Container bg={bg} flex={1} borderRadius={20}>
+        <Container>
+          <Title bg={bg} title={title} hide={hide}></Title>
+          <FlatList
+            contentContainerStyle={styles.flatListContentContainerStyle}
+            initialNumToRender={data.length}
+            data={data}
+            renderItem={({ item, index }) => {
+              return (
+                <ContentRow
+                  isSelected={index === selectedItemIndex}
+                  bg={bg}
+                  key={index}
+                  onPress={() => {
+                    hide();
+                    onItemPress(index);
+                  }}
+                  label={item}
+                />
+              );
+            }}
+            keyExtractor={(item, index) => {
+              return index;
+            }}
+          />
+        </Container>
+      </Container>
+    </Modal>
+  );
+};
+
+BottomSheet.defaultProps = {
+  bg: "background.primary",
+};
+
+BottomSheet.propTypes = {
+  /**
+   * List of items.
+   */
+  data: PropTypes.array,
+  /**
+   * Title to be displayed in the bottom sheet header.
+   */
+  title: PropTypes.string,
+  /**
+   * If true bottom sheet will be shown.
+   */
+  isVisible: PropTypes.bool,
+  /**
+   * Callback that will be called on while hiding the bottom sheet.
+   */
+  hide: PropTypes.func,
+  /**
+   * Callback which returns the index of selected item.
+   */
+  onItemPress: PropTypes.func,
+  /**
+   * Index of selected Item.
+   */
+  selectedItemIndex: PropTypes.number,
+  /**
+   * Background color.
+   */
+  bg: PropTypes.string,
+};
+
+const styles = StyleSheet.create({
+  flatListContentContainerStyle: {
+    paddingBottom: 40,
+  },
+  modalStyle: {
+    margin: 0,
+    alignItems: "flex-end",
+    flexDirection: "row",
+  },
+});

package/src/components/ToggleSwitch.js

@@ -9,8 +9,6 @@ import { Typography, Container } from "@components";
 /**
  * ToggleSwitch component is a simple switch toggle component from react-native-switch-toggle along with a label which describes what is being switched ON/OFF.
  *
- * This component supports below props categories from [styled-system ](/styled-system).
- *
  * <div class="screenshots">
  *   <img src="screenshots/toggleswitch/switchstyles.png" />
  * </div>
@@ -34,8 +32,6 @@ import { Typography, Container } from "@components";
  *  );
  * }
  * ```
- *
- * @extends StyledSystems props /styled-system
  */
 
 export const ToggleSwitch = ({

package/src/components/index.js

@@ -6,3 +6,4 @@ export { FAB } from "./FAB";
 export { ToggleSwitch } from "./ToggleSwitch";
 export { Avatar } from "./Avatar";
 export { Badge } from "./Badge";
+export { BottomSheet } from "./BottomSheet";