@bigbinary/neetoui-rn 0.0.36 → 0.0.37

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/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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigbinary/neetoui-rn",
-  "version": "0.0.36",
+  "version": "0.0.37",
   "main": "lib/index.js",
   "author": "BigBinary",
   "license": "MIT",

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/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 = ({