@bigbinary/neetoui-rn 0.0.247 → 0.0.248

package/assets/icons/attachment.svg

@@ -0,0 +1,3 @@
+<svg width="12" height="22" viewBox="0 0 12 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 16.1163V6.90698C12 6.48233 11.6504 6.13953 11.2174 6.13953C10.7843 6.13953 10.4348 6.48233 10.4348 6.90698V16.1163C10.4348 18.5158 8.44696 20.4651 6 20.4651C3.55304 20.4651 1.56522 18.5158 1.56522 16.1163V4.34884C1.56522 2.7986 2.85391 1.53488 4.43478 1.53488C6.01565 1.53488 7.30435 2.7986 7.30435 4.34884V15.3488C7.30435 16.0549 6.72 16.6279 6 16.6279C5.28 16.6279 4.69565 16.0549 4.69565 15.3488V5.37209C4.69565 4.94744 4.34609 4.60465 3.91304 4.60465C3.48 4.60465 3.13043 4.94744 3.13043 5.37209V15.3488C3.13043 16.8991 4.41913 18.1628 6 18.1628C7.58087 18.1628 8.86957 16.8991 8.86957 15.3488V4.34884C8.86957 1.9493 6.88174 0 4.43478 0C1.98783 0 0 1.9493 0 4.34884V16.1163C0 19.36 2.69217 22 6 22C9.30783 22 12 19.36 12 16.1163Z" fill="#2F3941"/>
+</svg>

package/assets/icons/canned-response.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10 5H3V21L7.5 18.3H19V11" stroke="#323232" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M21 5H14" stroke="#323232" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M18.999 3L21 5L18.999 7" stroke="#323232" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/assets/icons/expand.svg

@@ -0,0 +1,5 @@
+<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M7.93335 0.93407C7.93335 0.651193 8.16266 0.421875 8.44554 0.421875H13.9089C14.1918 0.421875 14.4211 0.651193 14.4211 0.93407V6.39749C14.4211 6.68036 14.1918 6.90968 13.9089 6.90968C13.6261 6.90968 13.3968 6.68036 13.3968 6.39749V1.44627H8.44554C8.16266 1.44627 7.93335 1.21695 7.93335 0.93407Z" fill="#87929D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M14.2711 0.571893C14.4711 0.771918 14.4711 1.09622 14.2711 1.29625L1.29551 14.2719C1.09549 14.4719 0.771185 14.4719 0.571161 14.2719C0.371136 14.0718 0.371136 13.7475 0.571161 13.5475L13.5468 0.571893C13.7468 0.371869 14.0711 0.371869 14.2711 0.571893Z" fill="#87929D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0.933337 7.93396C1.21621 7.93396 1.44553 8.16328 1.44553 8.44615V13.3974H6.39674C6.67962 13.3974 6.90894 13.6267 6.90894 13.9096C6.90894 14.1924 6.67962 14.4218 6.39674 14.4218H0.933337C0.65046 14.4218 0.421143 14.1924 0.421143 13.9096V8.44615C0.421143 8.16328 0.65046 7.93396 0.933337 7.93396Z" fill="#87929D"/>
+</svg>

package/assets/icons/forward.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13 13.097V16.165C13 17.032 14.029 17.488 14.672 16.906L20.702 11.44C21.15 11.034 21.138 10.327 20.677 9.93697L14.647 4.81897C13.997 4.26697 13 4.72897 13 5.58097V8.01797C7.537 8.01797 3 11.39 3 17V18.129C4.847 14.445 8.687 13.097 13 13.097Z" stroke="#323232" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/assets/icons/minimize.svg

@@ -0,0 +1,6 @@
+<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M1.21802 8.93594C1.21802 8.63854 1.45909 8.39746 1.75648 8.39746H6.06416C6.36154 8.39746 6.60262 8.63854 6.60262 8.93594V13.2437C6.60262 13.5411 6.36154 13.7822 6.06416 13.7822C5.76677 13.7822 5.5257 13.5411 5.5257 13.2437V9.47441H1.75648C1.45909 9.47441 1.21802 9.23333 1.21802 8.93594Z" fill="#87929D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.93592 1.21777C9.2333 1.21777 9.47438 1.45886 9.47438 1.75625V5.52557H13.2436C13.541 5.52557 13.7821 5.76666 13.7821 6.06405C13.7821 6.36144 13.541 6.60252 13.2436 6.60252H8.93592C8.63854 6.60252 8.39746 6.36144 8.39746 6.06405V1.75625C8.39746 1.45886 8.63854 1.21777 8.93592 1.21777Z" fill="#87929D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M14.3423 0.657716C14.5526 0.868003 14.5526 1.20895 14.3423 1.41923L9.31667 6.445C9.10639 6.65529 8.76545 6.65529 8.55517 6.445C8.34489 6.23471 8.34489 5.89377 8.55517 5.68348L13.5808 0.657716C13.7911 0.447428 14.132 0.447428 14.3423 0.657716Z" fill="#87929D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.44483 8.55518C6.65512 8.76546 6.65512 9.10641 6.44483 9.3167L1.41921 14.3425C1.20893 14.5527 0.867993 14.5527 0.657711 14.3425C0.44743 14.1322 0.44743 13.7912 0.657711 13.5809L5.68334 8.55518C5.89362 8.34489 6.23455 8.34489 6.44483 8.55518Z" fill="#87929D"/>
+</svg>

package/assets/icons/note.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18.414 6.414L15.586 3.586C15.211 3.211 14.702 3 14.172 3H7C5.895 3 5 3.895 5 5V19C5 20.105 5.895 21 7 21H17C18.105 21 19 20.105 19 19V7.828C19 7.298 18.789 6.789 18.414 6.414V6.414Z" stroke="#323232" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M19 8H15C14.448 8 14 7.552 14 7V3" stroke="#323232" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/assets/icons/reply.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M15.5 14.5H8.5" stroke="#323232" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M8.5 10.5H15.5" stroke="#323232" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.151 16.396C3.421 15.096 3 13.598 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21C10.402 21 8.904 20.579 7.604 19.849L3 21L4.151 16.396Z" stroke="#323232" stroke-width="1.5882" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/index.d.ts

@@ -318,6 +318,32 @@ type InputProps = {
   textAlignVertical?: string;
 };
 
+type ChatInputProps = {
+  isLoading?: boolean;
+  shouldShowEmailFields?: boolean;
+  value: string;
+  initialSelectedOption?: "REPLY" | "NOTE" | "FORWARD";
+  onOptionChange?: (option: string) => void;
+  onChangeText: (text: string) => void;
+  onForward?: () => void;
+  onCannedResponse?:  () => void;
+  toEmails?: string;
+  onReply?: () => void;
+  onAddNote?: () => void;
+  onAttachment?: () => void;
+  attachmentsCount?: number;
+  Attachments?:  React.FC;
+  showCannedResponsesFor?: Array<"REPLY" | "NOTE" | "FORWARD">;
+  disabled?: boolean;
+};
+
+type LineLoaderProps = {
+  backgroundColor?: string,
+  foregroundColor?: string,
+  height?: number,
+  isLoading?: boolean;
+};
+
 type InputEmailChipProps = {
   disabled?: boolean;
   label?: string;
@@ -554,6 +580,8 @@ export const FlashList: React.FC<FlashListProps>;
 export const FlatList: React.FC<FlatListProps>;
 export const Input: React.FC<InputProps>;
 export const InputEmailChip: React.FC<InputEmailChipProps>;
+export const ChatInput: React.FC<ChatInputProps>;
+export const LineLoader: React.FC<LineLoaderProps>;
 export const ListItem: React.FC<ListItemProps>;
 export const Loader: React.FC<LoaderProps>;
 export const NotificationPreferenceList: React.FC<NotificationPreferenceListProps>;

package/lib/components/Button.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Button=exports.BUTTON_VARIANTS=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 _reactNativeSizeMatters=require("react-native-size-matters");var _native=require("styled-components/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.jsx";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_VARIANTS=Object.freeze({SOLID:"solid",SECONDARY:"secondary",TEXT:"text",DANGER:"danger",DANGER_INVERSE:"danger-inverse",DANGER_TEXT:"danger-text"});exports.BUTTON_VARIANTS=BUTTON_VARIANTS;var Button=_react.default.forwardRef(function(_ref,ref){var variant=_ref.variant,label=_ref.label,labelStyle=_ref.labelStyle,RightIcon=_ref.RightIcon,LeftIcon=_ref.LeftIcon,disabled=_ref.disabled,isLoading=_ref.isLoading,loadingText=_ref.loadingText,fontFamily=_ref.fontFamily,color=_ref.color,fontSize=_ref.fontSize,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);var width=variant==="text"||variant==="danger-text"?null:"100%";var getButtonColors=function getButtonColors(){switch(variant){case BUTTON_VARIANTS.SOLID:return{bg:theme.colors.background[disabled?"grey400":"base"],border:theme.colors.background[disabled?"grey400":"base"],color:theme.colors.background.white,ripple:"white"};case BUTTON_VARIANTS.SECONDARY:return{bg:"transparent",border:theme.colors.background.base,color:theme.colors.font.base,ripple:theme.colors.background.base};case BUTTON_VARIANTS.TEXT:return{bg:"transparent",border:"transparent",color:theme.colors.font.primary,ripple:theme.colors.background.grey800};case BUTTON_VARIANTS.DANGER:return{bg:theme.colors.background.danger,border:theme.colors.background.danger,color:theme.colors.background.white,ripple:"white"};case BUTTON_VARIANTS.DANGER_INVERSE:return{bg:theme.colors.background.white,border:theme.colors.background.danger,color:theme.colors.background.danger,ripple:theme.colors.background.grey800};case BUTTON_VARIANTS.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(["secondary","danger","danger-inverse","danger-text"].includes(variant)&&disabled){return 0.5;}return 1;};return _react.default.createElement(_.Touchable,(0,_extends2.default)({alignItems:"center",bg:getButtonColors().bg,borderColor:getButtonColors().border,borderRadius:(0,_reactNativeSizeMatters.moderateScale)(8),borderWidth:(0,_reactNativeSizeMatters.moderateScale)(1),disabled:disabled||isLoading,flexDirection:"row",height:(0,_reactNativeSizeMatters.moderateScale)(48),justifyContent:"center",opacity:renderOpacity(),px:width===null?(0,_reactNativeSizeMatters.moderateScale)(8):undefined,ref:ref,rippleConfig:{color:getButtonColors().ripple},width:width},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:162,columnNumber:7}}),isLoading?_react.default.createElement(_.Container,{flexDirection:"row",__self:_this,__source:{fileName:_jsxFileName,lineNumber:180,columnNumber:11}},_react.default.createElement(_.Loader,{color:getButtonColors().color,__self:_this,__source:{fileName:_jsxFileName,lineNumber:181,columnNumber:13}}),!!loadingText&&_react.default.createElement(_.Typography,(0,_extends2.default)({color:color||getButtonColors().color,fontFamily:fontFamily||theme.fonts.sf500,fontSize:fontSize,ml:(0,_reactNativeSizeMatters.moderateScale)(8),textAlign:"center"},labelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:183,columnNumber:15}}),loadingText)):_react.default.createElement(_react.default.Fragment,null,LeftIcon&&_react.default.createElement(LeftIcon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:197,columnNumber:26}}),_react.default.createElement(_.Typography,(0,_extends2.default)({color:color||getButtonColors().color,fontFamily:fontFamily||theme.fonts.sf500,fontSize:fontSize,mx:(0,_reactNativeSizeMatters.moderateScale)(2),textAlign:"center"},labelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:198,columnNumber:13}}),label),RightIcon&&_react.default.createElement(RightIcon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:208,columnNumber:27}})));});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(Object.values(BUTTON_VARIANTS)),disabled:_propTypes2.default.bool,labelStyle:_propTypes2.default.object,RightIcon:_propTypes2.default.elementType,LeftIcon:_propTypes2.default.elementType,isLoading:_propTypes2.default.bool,loadingText:_propTypes2.default.string,fontFamily:_propTypes2.default.string,color:_propTypes2.default.string,fontSize:_propTypes2.default.string});Button.displayName="Button";
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Button=exports.BUTTON_VARIANTS=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 _reactNativeSizeMatters=require("react-native-size-matters");var _native=require("styled-components/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.jsx";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_VARIANTS=Object.freeze({SOLID:"solid",SECONDARY:"secondary",TEXT:"text",DANGER:"danger",DANGER_INVERSE:"danger-inverse",DANGER_TEXT:"danger-text"});exports.BUTTON_VARIANTS=BUTTON_VARIANTS;var Button=_react.default.forwardRef(function(_ref,ref){var variant=_ref.variant,label=_ref.label,labelStyle=_ref.labelStyle,RightIcon=_ref.RightIcon,LeftIcon=_ref.LeftIcon,disabled=_ref.disabled,isLoading=_ref.isLoading,loadingText=_ref.loadingText,fontFamily=_ref.fontFamily,color=_ref.color,fontSize=_ref.fontSize,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);var width=variant==="text"||variant==="danger-text"?null:"100%";var getButtonColors=function getButtonColors(){switch(variant){case BUTTON_VARIANTS.SOLID:return{bg:theme.colors.background[disabled?"grey400":"base"],border:theme.colors.background[disabled?"grey400":"base"],color:theme.colors.background.white,ripple:"white"};case BUTTON_VARIANTS.SECONDARY:return{bg:"transparent",border:theme.colors.background.base,color:theme.colors.font.base,ripple:theme.colors.background.base};case BUTTON_VARIANTS.TEXT:return{bg:"transparent",border:"transparent",color:theme.colors.font.primary,ripple:theme.colors.background.grey800};case BUTTON_VARIANTS.DANGER:return{bg:theme.colors.background.danger,border:theme.colors.background.danger,color:theme.colors.background.white,ripple:"white"};case BUTTON_VARIANTS.DANGER_INVERSE:return{bg:theme.colors.background.white,border:theme.colors.background.danger,color:theme.colors.background.danger,ripple:theme.colors.background.grey800};case BUTTON_VARIANTS.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(["text","secondary","danger","danger-inverse","danger-text"].includes(variant)&&disabled){return 0.5;}return 1;};return _react.default.createElement(_.Touchable,(0,_extends2.default)({alignItems:"center",bg:getButtonColors().bg,borderColor:getButtonColors().border,borderRadius:(0,_reactNativeSizeMatters.moderateScale)(8),borderWidth:(0,_reactNativeSizeMatters.moderateScale)(1),disabled:disabled||isLoading,flexDirection:"row",height:(0,_reactNativeSizeMatters.moderateScale)(48),justifyContent:"center",opacity:renderOpacity(),px:width===null?(0,_reactNativeSizeMatters.moderateScale)(8):undefined,ref:ref,rippleConfig:{color:getButtonColors().ripple},width:width},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:166,columnNumber:7}}),isLoading?_react.default.createElement(_.Container,{flexDirection:"row",__self:_this,__source:{fileName:_jsxFileName,lineNumber:184,columnNumber:11}},_react.default.createElement(_.Loader,{color:getButtonColors().color,__self:_this,__source:{fileName:_jsxFileName,lineNumber:185,columnNumber:13}}),!!loadingText&&_react.default.createElement(_.Typography,(0,_extends2.default)({color:color||getButtonColors().color,fontFamily:fontFamily||theme.fonts.sf500,fontSize:fontSize,ml:(0,_reactNativeSizeMatters.moderateScale)(8),textAlign:"center"},labelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:187,columnNumber:15}}),loadingText)):_react.default.createElement(_react.default.Fragment,null,LeftIcon&&_react.default.createElement(LeftIcon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:201,columnNumber:26}}),_react.default.createElement(_.Typography,(0,_extends2.default)({color:color||getButtonColors().color,fontFamily:fontFamily||theme.fonts.sf500,fontSize:fontSize,mx:(0,_reactNativeSizeMatters.moderateScale)(2),textAlign:"center"},labelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:202,columnNumber:13}}),label),RightIcon&&_react.default.createElement(RightIcon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:212,columnNumber:27}})));});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(Object.values(BUTTON_VARIANTS)),disabled:_propTypes2.default.bool,labelStyle:_propTypes2.default.object,RightIcon:_propTypes2.default.elementType,LeftIcon:_propTypes2.default.elementType,isLoading:_propTypes2.default.bool,loadingText:_propTypes2.default.string,fontFamily:_propTypes2.default.string,color:_propTypes2.default.string,fontSize:_propTypes2.default.string});Button.displayName="Button";

package/lib/components/ChatInput/AttachmentsView.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.AttachmentsView=void 0;var _react=_interopRequireDefault(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _Badge=require("./Badge");var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/ChatInput/AttachmentsView.jsx";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 AttachmentsView=function AttachmentsView(_ref){var isAttachmentsVisible=_ref.isAttachmentsVisible,setIsAttachmentsVisible=_ref.setIsAttachmentsVisible,Attachments=_ref.Attachments,attachmentsCount=_ref.attachmentsCount,isNoteOptionSelected=_ref.isNoteOptionSelected;return isAttachmentsVisible?attachmentsCount!==0&&_react.default.createElement(_reactNativeReanimated.default.View,{entering:_reactNativeReanimated.FadeInUp,key:isAttachmentsVisible,__self:_this,__source:{fileName:_jsxFileName,lineNumber:17,columnNumber:7}},Attachments):_react.default.createElement(_react.default.Fragment,null,attachmentsCount>0&&_react.default.createElement(_reactNativeReanimated.default.View,{alignItems:"flex-start",entering:_reactNativeReanimated.FadeInDown,flexDirection:"row",flexWrap:"wrap",key:isAttachmentsVisible,onTouchStart:function onTouchStart(){return setIsAttachmentsVisible(true);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:24,columnNumber:9}},_react.default.createElement(_Badge.Badge,{isNoteOptionSelected:isNoteOptionSelected,text:"Attachments",__self:_this,__source:{fileName:_jsxFileName,lineNumber:32,columnNumber:11}}),_react.default.createElement(_Badge.Badge,{isNoteOptionSelected:isNoteOptionSelected,text:"+ "+attachmentsCount,__self:_this,__source:{fileName:_jsxFileName,lineNumber:36,columnNumber:11}})));};exports.AttachmentsView=AttachmentsView;AttachmentsView.propTypes={isAttachmentsVisible:_propTypes.default.bool,setIsAttachmentsVisible:_propTypes.default.func,Attachments:_propTypes.default.any,attachmentsCount:_propTypes.default.number,isNoteOptionSelected:_propTypes.default.bool};

package/lib/components/ChatInput/Badge.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Badge=void 0;var _react=_interopRequireDefault(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeSizeMatters=require("react-native-size-matters");var _=require("./..");var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/ChatInput/Badge.jsx";var Badge=function Badge(_ref){var text=_ref.text,isNoteOptionSelected=_ref.isNoteOptionSelected;return _react.default.createElement(_.Container,{alignSelf:"flex-start",bg:isNoteOptionSelected?"white":"background.oldLace",borderRadius:(0,_reactNativeSizeMatters.moderateScale)(20),flexDirection:"row",flexGrow:0,px:(0,_reactNativeSizeMatters.moderateScale)(4),__self:_this,__source:{fileName:_jsxFileName,lineNumber:9,columnNumber:3}},_react.default.createElement(_.Typography,{fontSize:"3xs",__self:_this,__source:{fileName:_jsxFileName,lineNumber:17,columnNumber:5}},text));};exports.Badge=Badge;Badge.propTypes={text:_propTypes.default.string,isNoteOptionSelected:_propTypes.default.bool};

package/lib/components/ChatInput/ChatInput.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.ChatInput=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 _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeSizeMatters=require("react-native-size-matters");var _native=_interopRequireDefault(require("styled-components/native"));var _styledSystem=require("styled-system");var _attachment=_interopRequireDefault(require("../../../assets/icons/attachment.svg"));var _cannedResponse=_interopRequireDefault(require("../../../assets/icons/canned-response.svg"));var _expand=_interopRequireDefault(require("../../../assets/icons/expand.svg"));var _forward=_interopRequireDefault(require("../../../assets/icons/forward.svg"));var _minimize=_interopRequireDefault(require("../../../assets/icons/minimize.svg"));var _note=_interopRequireDefault(require("../../../assets/icons/note.svg"));var _reply=_interopRequireDefault(require("../../../assets/icons/reply.svg"));var _=require("./..");var _AttachmentsView=require("./AttachmentsView");var _EmailFields=require("./EmailFields");var _IconButton=require("./IconButton");var _theme=require("../../theme");var _excluded=["shouldShowEmailFields","value","onChangeText","onForward","onCannedResponse","toEmails","onReply","onAddNote","onAttachment","attachmentsCount","Attachments","showCannedResponsesFor","disabled","isLoading","onOptionChange","initialSelectedOption"];var _labels,_templateObject,_this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/ChatInput/ChatInput.jsx";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 placeholders={reply:"Type here to reply...",note:"Add note here...",forward:"Type here to forward..."};var OPTION_TYPES={REPLY:"REPLY",NOTE:"NOTE",FORWARD:"FORWARD"};var labels=(_labels={},(0,_defineProperty2.default)(_labels,OPTION_TYPES.REPLY,"Reply"),(0,_defineProperty2.default)(_labels,OPTION_TYPES.NOTE,"Add note"),(0,_defineProperty2.default)(_labels,OPTION_TYPES.FORWARD,"Forward"),_labels);var TextInput=_native.default.TextInput(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2.default)(["\n  ","\n  ","\n  ","\n  ","\n  ","\n  ","\n"])),_styledSystem.flexbox,_styledSystem.space,_styledSystem.border,_styledSystem.buttonStyle,_styledSystem.typography,_styledSystem.color);var ChatInput=function ChatInput(_ref){var shouldShowEmailFields=_ref.shouldShowEmailFields,_ref$value=_ref.value,value=_ref$value===void 0?"":_ref$value,_ref$onChangeText=_ref.onChangeText,onChangeText=_ref$onChangeText===void 0?function(){}:_ref$onChangeText,onForward=_ref.onForward,onCannedResponse=_ref.onCannedResponse,initialToEmails=_ref.toEmails,_ref$onReply=_ref.onReply,onReply=_ref$onReply===void 0?function(){}:_ref$onReply,_ref$onAddNote=_ref.onAddNote,onAddNote=_ref$onAddNote===void 0?function(){}:_ref$onAddNote,_ref$onAttachment=_ref.onAttachment,onAttachment=_ref$onAttachment===void 0?function(){}:_ref$onAttachment,attachmentsCount=_ref.attachmentsCount,Attachments=_ref.Attachments,_ref$showCannedRespon=_ref.showCannedResponsesFor,showCannedResponsesFor=_ref$showCannedRespon===void 0?[OPTION_TYPES.REPLY]:_ref$showCannedRespon,disabled=_ref.disabled,_ref$isLoading=_ref.isLoading,isLoading=_ref$isLoading===void 0?true:_ref$isLoading,_ref$onOptionChange=_ref.onOptionChange,onOptionChange=_ref$onOptionChange===void 0?function(){}:_ref$onOptionChange,_ref$initialSelectedO=_ref.initialSelectedOption,initialSelectedOption=_ref$initialSelectedO===void 0?OPTION_TYPES.REPLY:_ref$initialSelectedO,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var inputRef=(0,_react.useRef)();var _useState=(0,_react.useState)(initialSelectedOption),_useState2=(0,_slicedToArray2.default)(_useState,2),selectedOption=_useState2[0],setSelectedOption=_useState2[1];var _useState3=(0,_react.useState)(false),_useState4=(0,_slicedToArray2.default)(_useState3,2),isEmailFieldsVisible=_useState4[0],setIsEmailFieldsVisible=_useState4[1];var _useState5=(0,_react.useState)(false),_useState6=(0,_slicedToArray2.default)(_useState5,2),isAttachmentsVisible=_useState6[0],setIsAttachmentsVisible=_useState6[1];var isReplyOptionSelected=selectedOption===OPTION_TYPES.REPLY;var isNoteOptionSelected=selectedOption===OPTION_TYPES.NOTE;var isForwardOptionSelected=selectedOption===OPTION_TYPES.FORWARD;var _useState7=(0,_react.useState)(initialToEmails!=null?initialToEmails:""),_useState8=(0,_slicedToArray2.default)(_useState7,2),toEmails=_useState8[0],setToEmails=_useState8[1];var _useState9=(0,_react.useState)(""),_useState10=(0,_slicedToArray2.default)(_useState9,2),ccEmails=_useState10[0],setCcEmails=_useState10[1];var _useState11=(0,_react.useState)(""),_useState12=(0,_slicedToArray2.default)(_useState11,2),bccEmails=_useState12[0],setBccEmails=_useState12[1];(0,_react.useEffect)(function(){onOptionChange(selectedOption);},[selectedOption]);(0,_react.useEffect)(function(){setSelectedOption(initialSelectedOption);},[initialSelectedOption]);(0,_react.useEffect)(function(){if(isReplyOptionSelected){setToEmails(initialToEmails!=null?initialToEmails:"");}else{setToEmails("");}},[initialToEmails,isReplyOptionSelected]);var showEmailFieldsAndAttachments=function showEmailFieldsAndAttachments(){setIsAttachmentsVisible(true);setIsEmailFieldsVisible(true);};var hideEmailFieldsAndAttachments=function hideEmailFieldsAndAttachments(){setIsAttachmentsVisible(false);setIsEmailFieldsVisible(false);};var onReplyClickHandler=function onReplyClickHandler(){hideEmailFieldsAndAttachments();inputRef.current.focus();setSelectedOption(OPTION_TYPES.REPLY);};var onAddNoteClickHandler=function onAddNoteClickHandler(){hideEmailFieldsAndAttachments();inputRef.current.focus();setIsEmailFieldsVisible(false);setSelectedOption(OPTION_TYPES.NOTE);};var onAddForwardClickHandler=function onAddForwardClickHandler(){inputRef.current.focus();setIsEmailFieldsVisible(true);setIsAttachmentsVisible(false);setSelectedOption(OPTION_TYPES.FORWARD);};var onAddAttachmentsClickHandler=function onAddAttachmentsClickHandler(){if(!isAttachmentsVisible&&attachmentsCount>0){}else{onAttachment();}setIsEmailFieldsVisible(false);setIsAttachmentsVisible(true);};var onActionHandler=(0,_react.useCallback)(function(){var _OPTION_TYPES$REPLY$O;(_OPTION_TYPES$REPLY$O={},(0,_defineProperty2.default)(_OPTION_TYPES$REPLY$O,OPTION_TYPES.REPLY,function(){onReply({toEmails:toEmails,ccEmails:ccEmails,bccEmails:bccEmails});}),(0,_defineProperty2.default)(_OPTION_TYPES$REPLY$O,OPTION_TYPES.NOTE,function(){onAddNote({toEmails:toEmails,ccEmails:ccEmails,bccEmails:bccEmails});}),(0,_defineProperty2.default)(_OPTION_TYPES$REPLY$O,OPTION_TYPES.FORWARD,function(){onForward({toEmails:toEmails,ccEmails:ccEmails,bccEmails:bccEmails});}),_OPTION_TYPES$REPLY$O)[selectedOption]();},[bccEmails,ccEmails,onAddNote,onForward,onReply,selectedOption,toEmails]);var shouldExpandAndMinimizeButton=attachmentsCount>0||toEmails;return _react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:232,columnNumber:5}},_react.default.createElement(_.LineLoader,{backgroundColor:_theme.theme.colors.background.grey400,isLoading:isLoading,__self:_this,__source:{fileName:_jsxFileName,lineNumber:233,columnNumber:7}}),_react.default.createElement(_.Container,{bg:isNoteOptionSelected?"background.oldLace":"transparent",p:(0,_reactNativeSizeMatters.moderateScale)(5),pt:0,px:(0,_reactNativeSizeMatters.moderateScale)(16),__self:_this,__source:{fileName:_jsxFileName,lineNumber:237,columnNumber:7}},_react.default.createElement(_.Container,{pt:(0,_reactNativeSizeMatters.moderateScale)(8),__self:_this,__source:{fileName:_jsxFileName,lineNumber:243,columnNumber:9}},_react.default.createElement(_EmailFields.EmailFields,{bccEmails:bccEmails,ccEmails:ccEmails,isEmailFieldsVisible:isEmailFieldsVisible,setBccEmails:setBccEmails,setCcEmails:setCcEmails,setIsEmailFieldsVisible:setIsEmailFieldsVisible,setToEmails:setToEmails,shouldShowEmailFields:shouldShowEmailFields,toEmails:toEmails,__self:_this,__source:{fileName:_jsxFileName,lineNumber:244,columnNumber:11}}),_react.default.createElement(_.Container,{flexDirection:"row",justifyContent:"space-between",__self:_this,__source:{fileName:_jsxFileName,lineNumber:255,columnNumber:11}},_react.default.createElement(TextInput,(0,_extends2.default)({multiline:true,flex:1,placeholder:placeholders[selectedOption],py:(0,_reactNativeSizeMatters.moderateScale)(12),ref:inputRef,value:value,onChangeText:onChangeText,onTouchStart:hideEmailFieldsAndAttachments},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:256,columnNumber:13}})),_react.default.createElement(_.Container,{alignSelf:"center",__self:_this,__source:{fileName:_jsxFileName,lineNumber:267,columnNumber:13}},shouldExpandAndMinimizeButton&&(isEmailFieldsVisible||isAttachmentsVisible?_react.default.createElement(_IconButton.IconButton,{Icon:_minimize.default,height:(0,_reactNativeSizeMatters.moderateScale)(30),pt:(0,_reactNativeSizeMatters.moderateScale)(8),width:(0,_reactNativeSizeMatters.moderateScale)(30),onPress:hideEmailFieldsAndAttachments,__self:_this,__source:{fileName:_jsxFileName,lineNumber:270,columnNumber:19}}):_react.default.createElement(_IconButton.IconButton,{Icon:_expand.default,height:(0,_reactNativeSizeMatters.moderateScale)(30),pt:(0,_reactNativeSizeMatters.moderateScale)(8),width:(0,_reactNativeSizeMatters.moderateScale)(30),onPress:showEmailFieldsAndAttachments,__self:_this,__source:{fileName:_jsxFileName,lineNumber:278,columnNumber:19}})))),_react.default.createElement(_AttachmentsView.AttachmentsView,{Attachments:Attachments,attachmentsCount:attachmentsCount,isAttachmentsVisible:isAttachmentsVisible,isNoteOptionSelected:isNoteOptionSelected,setIsAttachmentsVisible:setIsAttachmentsVisible,__self:_this,__source:{fileName:_jsxFileName,lineNumber:288,columnNumber:11}}),_react.default.createElement(_.Container,{alignItems:"center",flexDirection:"row",justifyContent:"space-between",mt:(0,_reactNativeSizeMatters.moderateScale)(10),__self:_this,__source:{fileName:_jsxFileName,lineNumber:295,columnNumber:11}},_react.default.createElement(_.Container,{flexDirection:"row",justifyContent:"space-between",__self:_this,__source:{fileName:_jsxFileName,lineNumber:301,columnNumber:13}},_react.default.createElement(_IconButton.IconButton,{Icon:_reply.default,opacity:isReplyOptionSelected?1:0.5,pl:(0,_reactNativeSizeMatters.moderateScale)(10),onPress:onReplyClickHandler,__self:_this,__source:{fileName:_jsxFileName,lineNumber:302,columnNumber:15}}),_react.default.createElement(_IconButton.IconButton,{Icon:_note.default,opacity:isNoteOptionSelected?1:0.5,onPress:onAddNoteClickHandler,__self:_this,__source:{fileName:_jsxFileName,lineNumber:308,columnNumber:15}}),onForward&&_react.default.createElement(_IconButton.IconButton,{Icon:_forward.default,opacity:isForwardOptionSelected?1:0.5,onPress:onAddForwardClickHandler,__self:_this,__source:{fileName:_jsxFileName,lineNumber:314,columnNumber:17}}),_react.default.createElement(_.Container,{bg:"background.grey400",mx:(0,_reactNativeSizeMatters.moderateScale)(5),p:(0,_reactNativeSizeMatters.moderateScale)(0.4),__self:_this,__source:{fileName:_jsxFileName,lineNumber:320,columnNumber:15}}),onCannedResponse&&showCannedResponsesFor.includes(selectedOption)&&_react.default.createElement(_IconButton.IconButton,{Icon:_cannedResponse.default,opacity:0.5,onPress:onCannedResponse,__self:_this,__source:{fileName:_jsxFileName,lineNumber:327,columnNumber:19}}),_react.default.createElement(_IconButton.IconButton,{Icon:_attachment.default,opacity:0.5,onPress:onAddAttachmentsClickHandler,__self:_this,__source:{fileName:_jsxFileName,lineNumber:333,columnNumber:15}})),_react.default.createElement(_.Button,{disabled:disabled,height:(0,_reactNativeSizeMatters.moderateScale)(30),label:labels[selectedOption],pr:0,variant:"text",labelStyle:{mx:(0,_reactNativeSizeMatters.moderateScale)(0)},onPress:onActionHandler,__self:_this,__source:{fileName:_jsxFileName,lineNumber:339,columnNumber:13}})))));};exports.ChatInput=ChatInput;ChatInput.propTypes={isLoading:_propTypes.default.bool,shouldShowEmailFields:_propTypes.default.bool,value:_propTypes.default.string,initialSelectedOption:_propTypes.default.oneOf(Object.values(OPTION_TYPES)),onOptionChange:_propTypes.default.func,onChangeText:_propTypes.default.func,onForward:_propTypes.default.func,onCannedResponse:_propTypes.default.func,toEmails:_propTypes.default.string,onReply:_propTypes.default.func,onAddNote:_propTypes.default.func,onAttachment:_propTypes.default.func,attachmentsCount:_propTypes.default.number,Attachments:_propTypes.default.any,showCannedResponsesFor:_propTypes.default.arrayOf(_propTypes.default.string),disabled:_propTypes.default.bool};

package/lib/components/ChatInput/EmailFields.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.EmailFields=void 0;var _react=_interopRequireDefault(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _reactNativeSizeMatters=require("react-native-size-matters");var _2=require("./..");var _Badge=require("./Badge");var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/ChatInput/EmailFields.jsx";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 EmailFields=function EmailFields(_ref){var _;var shouldShowEmailFields=_ref.shouldShowEmailFields,setIsEmailFieldsVisible=_ref.setIsEmailFieldsVisible,isEmailFieldsVisible=_ref.isEmailFieldsVisible,ccEmails=_ref.ccEmails,toEmails=_ref.toEmails,bccEmails=_ref.bccEmails,setBccEmails=_ref.setBccEmails,setCcEmails=_ref.setCcEmails,setToEmails=_ref.setToEmails;var firstToEmail=(_=(toEmails.trim()?toEmails.split(","):[])[0])!=null?_:"";var totalEmailsMinus1=(toEmails.trim()?toEmails.split(","):[]).length+(ccEmails.trim()?ccEmails.split(","):[]).length+(bccEmails.trim()?bccEmails.split(","):[]).length-1;if(!shouldShowEmailFields)return null;return isEmailFieldsVisible?_react.default.createElement(_reactNativeReanimated.default.View,{entering:_reactNativeReanimated.FadeInDown,key:isEmailFieldsVisible,pb:(0,_reactNativeSizeMatters.moderateScale)(10),__self:_this,__source:{fileName:_jsxFileName,lineNumber:33,columnNumber:5}},_react.default.createElement(_2.InputEmailChip,{disabled:false,emails:toEmails.trim()?toEmails.split(","):[],label:"To:",onUpdate:function onUpdate(emails){setToEmails(emails.join(","));},__self:_this,__source:{fileName:_jsxFileName,lineNumber:38,columnNumber:7}}),_react.default.createElement(_2.InputEmailChip,{disabled:false,emails:ccEmails.trim()?ccEmails.split(","):[],label:"Cc:",onUpdate:function onUpdate(emails){setCcEmails(emails.join(","));},__self:_this,__source:{fileName:_jsxFileName,lineNumber:46,columnNumber:7}}),_react.default.createElement(_2.InputEmailChip,{disabled:false,emails:bccEmails.trim()?bccEmails.split(","):[],label:"Bcc:",onUpdate:function onUpdate(emails){setBccEmails(emails.join(","));},__self:_this,__source:{fileName:_jsxFileName,lineNumber:54,columnNumber:7}})):_react.default.createElement(_reactNativeReanimated.default.View,{alignItems:"flex-start",entering:_reactNativeReanimated.FadeInUp,flexDirection:"row",flexWrap:"wrap",key:isEmailFieldsVisible,onTouchStart:function onTouchStart(){return setIsEmailFieldsVisible(true);},__self:_this,__source:{fileName:_jsxFileName,lineNumber:64,columnNumber:5}},toEmails.length>0&&_react.default.createElement(_react.default.Fragment,null,_react.default.createElement(_Badge.Badge,{text:"To "+firstToEmail,__self:_this,__source:{fileName:_jsxFileName,lineNumber:74,columnNumber:11}}),totalEmailsMinus1>1&&_react.default.createElement(_Badge.Badge,{text:"+ "+totalEmailsMinus1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:75,columnNumber:37}})));};exports.EmailFields=EmailFields;EmailFields.propTypes={shouldShowEmailFields:_propTypes.default.bool,isEmailFieldsVisible:_propTypes.default.bool,setIsEmailFieldsVisible:_propTypes.default.func,ccEmails:_propTypes.default.string,toEmails:_propTypes.default.string,bccEmails:_propTypes.default.string,setBccEmails:_propTypes.default.func,setCcEmails:_propTypes.default.func,setToEmails:_propTypes.default.func};

package/lib/components/ChatInput/IconButton.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.IconButton=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 _reactNativeSizeMatters=require("react-native-size-matters");var _=require("./..");var _excluded=["Icon"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/ChatInput/IconButton.jsx";var IconButton=function IconButton(_ref){var Icon=_ref.Icon,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);return _react.default.createElement(_.Touchable,(0,_extends2.default)({alignItems:"center",height:(0,_reactNativeSizeMatters.moderateScale)(22),px:(0,_reactNativeSizeMatters.moderateScale)(18),width:(0,_reactNativeSizeMatters.moderateScale)(22)},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:9,columnNumber:3}}),_react.default.createElement(Icon,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:16,columnNumber:6}}));};exports.IconButton=IconButton;IconButton.propTypes={Icon:_propTypes.default.elementType};

package/lib/components/InputEmailChip.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.InputEmailChip=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeSizeMatters=require("react-native-size-matters");var _native=require("styled-components/native");var _=require("./");var _utils=require("../utils/utils");var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/InputEmailChip.jsx";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 gap=(0,_reactNativeSizeMatters.moderateScale)(4);var chipWrapperStyle={pt:gap};var getChipContainerStyle=function getChipContainerStyle(isReadyForDeletion){return{borderColor:isReadyForDeletion?"border.danger":"border.grey200"};};var InputEmailChip=function InputEmailChip(_ref){var disabled=_ref.disabled,label=_ref.label,_ref$emails=_ref.emails,emails=_ref$emails===void 0?[]:_ref$emails,onUpdate=_ref.onUpdate,_ref$delimiters=_ref.delimiters,delimiters=_ref$delimiters===void 0?[" ",","]:_ref$delimiters;var theme=(0,_react.useContext)(_native.ThemeContext);var inputRef=(0,_react.useRef)();var _useState=(0,_react.useState)(""),_useState2=(0,_slicedToArray2.default)(_useState,2),textValue=_useState2[0],setTextValue=_useState2[1];var _useState3=(0,_react.useState)(false),_useState4=(0,_slicedToArray2.default)(_useState3,2),shouldShowInput=_useState4[0],setShouldShowInput=_useState4[1];var _useState5=(0,_react.useState)(-1),_useState6=(0,_slicedToArray2.default)(_useState5,2),emailIndexForDeletion=_useState6[0],setEmailIndexForDeletion=_useState6[1];var handleKeyPress=function handleKeyPress(event){var _ref2=event.nativeEvent||{},key=_ref2.key;if(!(textValue===""&&key==="Backspace"&&emails.length>0))return;if(emailIndexForDeletion===-1){setEmailIndexForDeletion(emails.length-1);}else{removeEmail({lastOne:true});setEmailIndexForDeletion(-1);}};var handleSubmitEditing=function handleSubmitEditing(event){var _ref3=event.nativeEvent||{},text=_ref3.text;setEmailIndexForDeletion(-1);checkAndUpdateEmails(text);};var handleTextChange=function handleTextChange(text){if(!(0,_utils.endsWithChars)(text,delimiters)){setEmailIndexForDeletion(-1);setTextValue(text);return;}checkAndUpdateEmails(text);};var handleInputTouchStart=function handleInputTouchStart(){return setEmailIndexForDeletion(-1);};var handleTouchStart=function handleTouchStart(){var _inputRef$current;if(!((_inputRef$current=inputRef.current)!=null&&_inputRef$current.isFocused())){var _inputRef$current2;(_inputRef$current2=inputRef.current)==null?void 0:_inputRef$current2.focus();}};var handleOnFocus=function handleOnFocus(){return setShouldShowInput(true);};var handleOnBlur=function handleOnBlur(){if(textValue.trim()===""){setShouldShowInput(false);}};var handleOnEndEditing=function handleOnEndEditing(event){checkAndUpdateEmails(event.nativeEvent.text);};var checkAndUpdateEmails=function checkAndUpdateEmails(text){var emailCandidate=(0,_utils.trimChars)(text,delimiters);if(emailCandidate!==""&&(0,_utils.isValidEmail)(emailCandidate)&&!emails.includes(emailCandidate)){var _emails=[].concat((0,_toConsumableArray2.default)(emails),[emailCandidate]);setTextValue("");onUpdate&&onUpdate(_emails);}else{setTextValue(text);}};var removeEmail=function removeEmail(_ref4){var email=_ref4.email,_ref4$lastOne=_ref4.lastOne,lastOne=_ref4$lastOne===void 0?false:_ref4$lastOne;var indexOfEmail=lastOne?emails.length-1:emails.indexOf(email);if(indexOfEmail!==-1){var _emails=(0,_toConsumableArray2.default)(emails);_emails.splice(indexOfEmail,1);onUpdate&&onUpdate(_emails);}};var inputProps={autoCorrect:false,fontSize:"xs",returnKeyType:"done",autoCapitalize:"none",keyboardType:"email-address",padding:0,minHeight:(0,_reactNativeSizeMatters.moderateScale)(26),selectionColor:emailIndexForDeletion===-1?theme.colors.font.base:"transparent"};return _react.default.createElement(_.Container,{flexDirection:"row",minHeight:(0,_reactNativeSizeMatters.moderateScale)(30),py:(0,_reactNativeSizeMatters.moderateScale)(2),width:"100%",__self:_this,__source:{fileName:_jsxFileName,lineNumber:125,columnNumber:5}},!!label&&_react.default.createElement(_.Typography,{color:disabled?"font.grey400":"font.grey600",fontSize:"xs",mr:(0,_reactNativeSizeMatters.moderateScale)(8),mt:_reactNative.Platform.select({android:(0,_reactNativeSizeMatters.moderateScale)(10),ios:(0,_reactNativeSizeMatters.moderateScale)(8)}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:132,columnNumber:9}},label),_react.default.createElement(_.Container,{alignItems:"center",flex:1,flexDirection:"row",flexWrap:"wrap",__self:_this,__source:{fileName:_jsxFileName,lineNumber:144,columnNumber:7}},emails.map(function(email,index){return _react.default.createElement(_.Container,(0,_extends2.default)({key:email},chipWrapperStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:151,columnNumber:11}}),_react.default.createElement(_.Chip,{isDisabled:disabled,label:email,containerStyle:getChipContainerStyle(index===emailIndexForDeletion),onClose:disabled?null:function(){return removeEmail({email:email});},__self:_this,__source:{fileName:_jsxFileName,lineNumber:152,columnNumber:13}}));}),!disabled&&_react.default.createElement(_.Container,(0,_extends2.default)({alignItems:"center",flex:1,justifyContent:"center",minWidth:(0,_reactNativeSizeMatters.moderateScale)(160),paddingTop:_reactNative.Platform.select({ios:gap,android:(0,_reactNativeSizeMatters.moderateScale)(7)})},shouldShowInput||emails.length===0?{}:{height:0},{__self:_this,__source:{fileName:_jsxFileName,lineNumber:163,columnNumber:11}}),_react.default.createElement(_.Input,{noBorder:true,disabled:disabled,value:textValue,inputProps:(0,_extends2.default)({},inputProps,{ref:inputRef,onKeyPress:handleKeyPress,onSubmitEditing:handleSubmitEditing,onTouchStart:handleInputTouchStart,onFocus:handleOnFocus,onBlur:handleOnBlur,onEndEditing:handleOnEndEditing}),onChangeText:handleTextChange,__self:_this,__source:{fileName:_jsxFileName,lineNumber:174,columnNumber:13}}))),!disabled&&_react.default.createElement(_reactNative.TextInput,{editable:false,pointerEvents:shouldShowInput?"box-none":"auto",style:styles.touchableTextInputWrapper,onTouchStart:handleTouchStart,__self:_this,__source:{fileName:_jsxFileName,lineNumber:194,columnNumber:9}}));};exports.InputEmailChip=InputEmailChip;var styles=_reactNative.StyleSheet.create({touchableTextInputWrapper:{position:"absolute",top:0,bottom:0,left:0,right:0}});InputEmailChip.propTypes={disabled:_propTypes.default.bool,label:_propTypes.default.string,emails:_propTypes.default.arrayOf(_propTypes.default.string),delimiters:_propTypes.default.arrayOf(_propTypes.default.string),onUpdate:_propTypes.default.func};
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.InputEmailChip=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));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 _reactNativeSizeMatters=require("react-native-size-matters");var _native=require("styled-components/native");var _=require("./");var _utils=require("../utils/utils");var _excluded=["disabled","label","emails","onUpdate","delimiters"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/InputEmailChip.jsx";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 gap=(0,_reactNativeSizeMatters.moderateScale)(4);var chipWrapperStyle={pt:gap};var getChipContainerStyle=function getChipContainerStyle(isReadyForDeletion){return{borderColor:isReadyForDeletion?"border.danger":"border.grey200"};};var InputEmailChip=function InputEmailChip(_ref){var disabled=_ref.disabled,label=_ref.label,_ref$emails=_ref.emails,emails=_ref$emails===void 0?[]:_ref$emails,onUpdate=_ref.onUpdate,_ref$delimiters=_ref.delimiters,delimiters=_ref$delimiters===void 0?[" ",","]:_ref$delimiters,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);var inputRef=(0,_react.useRef)();var _useState=(0,_react.useState)(""),_useState2=(0,_slicedToArray2.default)(_useState,2),textValue=_useState2[0],setTextValue=_useState2[1];var _useState3=(0,_react.useState)(false),_useState4=(0,_slicedToArray2.default)(_useState3,2),shouldShowInput=_useState4[0],setShouldShowInput=_useState4[1];var _useState5=(0,_react.useState)(-1),_useState6=(0,_slicedToArray2.default)(_useState5,2),emailIndexForDeletion=_useState6[0],setEmailIndexForDeletion=_useState6[1];var handleKeyPress=function handleKeyPress(event){var _ref2=event.nativeEvent||{},key=_ref2.key;if(!(textValue===""&&key==="Backspace"&&emails.length>0))return;if(emailIndexForDeletion===-1){setEmailIndexForDeletion(emails.length-1);}else{removeEmail({lastOne:true});setEmailIndexForDeletion(-1);}};var handleSubmitEditing=function handleSubmitEditing(event){var _ref3=event.nativeEvent||{},text=_ref3.text;setEmailIndexForDeletion(-1);checkAndUpdateEmails(text);};var handleTextChange=function handleTextChange(text){if(!(0,_utils.endsWithChars)(text,delimiters)){setEmailIndexForDeletion(-1);setTextValue(text);return;}checkAndUpdateEmails(text);};var handleInputTouchStart=function handleInputTouchStart(){return setEmailIndexForDeletion(-1);};var handleTouchStart=function handleTouchStart(){var _inputRef$current;if(!((_inputRef$current=inputRef.current)!=null&&_inputRef$current.isFocused())){var _inputRef$current2;(_inputRef$current2=inputRef.current)==null?void 0:_inputRef$current2.focus();}};var handleOnFocus=function handleOnFocus(){return setShouldShowInput(true);};var handleOnBlur=function handleOnBlur(){if(textValue.trim()===""){setShouldShowInput(false);}};var handleOnEndEditing=function handleOnEndEditing(event){checkAndUpdateEmails(event.nativeEvent.text);};var checkAndUpdateEmails=function checkAndUpdateEmails(text){var emailCandidate=(0,_utils.trimChars)(text,delimiters);if(emailCandidate!==""&&(0,_utils.isValidEmail)(emailCandidate)&&!emails.includes(emailCandidate)){var _emails=[].concat((0,_toConsumableArray2.default)(emails),[emailCandidate]);setTextValue("");onUpdate&&onUpdate(_emails);}else{setTextValue(text);}};var removeEmail=function removeEmail(_ref4){var email=_ref4.email,_ref4$lastOne=_ref4.lastOne,lastOne=_ref4$lastOne===void 0?false:_ref4$lastOne;var indexOfEmail=lastOne?emails.length-1:emails.indexOf(email);if(indexOfEmail!==-1){var _emails=(0,_toConsumableArray2.default)(emails);_emails.splice(indexOfEmail,1);onUpdate&&onUpdate(_emails);}};var inputProps={autoCorrect:false,fontSize:"xs",returnKeyType:"done",autoCapitalize:"none",keyboardType:"email-address",padding:0,minHeight:(0,_reactNativeSizeMatters.moderateScale)(26),selectionColor:emailIndexForDeletion===-1?theme.colors.font.base:"transparent"};return _react.default.createElement(_.Container,(0,_extends2.default)({flexDirection:"row",minHeight:(0,_reactNativeSizeMatters.moderateScale)(30),py:(0,_reactNativeSizeMatters.moderateScale)(2),width:"100%"},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:126,columnNumber:5}}),!!label&&_react.default.createElement(_.Typography,{color:disabled?"font.grey400":"font.grey600",fontSize:"xs",textAlign:"left",width:(0,_reactNativeSizeMatters.moderateScale)(40),mt:_reactNative.Platform.select({android:(0,_reactNativeSizeMatters.moderateScale)(10),ios:(0,_reactNativeSizeMatters.moderateScale)(8)}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:134,columnNumber:9}},label),_react.default.createElement(_.Container,{alignItems:"center",flex:1,flexDirection:"row",flexWrap:"wrap",__self:_this,__source:{fileName:_jsxFileName,lineNumber:147,columnNumber:7}},emails.map(function(email,index){return _react.default.createElement(_.Container,(0,_extends2.default)({key:email},chipWrapperStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:154,columnNumber:11}}),_react.default.createElement(_.Chip,{isDisabled:disabled,label:email,containerStyle:(0,_extends2.default)({},getChipContainerStyle(index===emailIndexForDeletion),{height:(0,_reactNativeSizeMatters.moderateScale)(25)}),onClose:disabled?null:function(){return removeEmail({email:email});},__self:_this,__source:{fileName:_jsxFileName,lineNumber:155,columnNumber:13}}));}),!disabled&&_react.default.createElement(_.Container,(0,_extends2.default)({alignItems:"center",flex:1,justifyContent:"center",minWidth:(0,_reactNativeSizeMatters.moderateScale)(160),paddingTop:_reactNative.Platform.select({ios:gap,android:(0,_reactNativeSizeMatters.moderateScale)(7)})},shouldShowInput||emails.length===0?{}:{height:0},{__self:_this,__source:{fileName:_jsxFileName,lineNumber:167,columnNumber:11}}),_react.default.createElement(_.Input,{noBorder:true,disabled:disabled,value:textValue,containerProps:{borderRadius:0},inputProps:(0,_extends2.default)({},inputProps,{ref:inputRef,onKeyPress:handleKeyPress,onSubmitEditing:handleSubmitEditing,onTouchStart:handleInputTouchStart,onFocus:handleOnFocus,onBlur:handleOnBlur,onEndEditing:handleOnEndEditing,borderBottomWidth:(0,_reactNativeSizeMatters.moderateScale)(2),borderColor:"background.grey200"}),onChangeText:handleTextChange,__self:_this,__source:{fileName:_jsxFileName,lineNumber:178,columnNumber:13}}))),!disabled&&_react.default.createElement(_reactNative.TextInput,{editable:false,pointerEvents:shouldShowInput?"box-none":"auto",style:styles.touchableTextInputWrapper,onTouchStart:handleTouchStart,__self:_this,__source:{fileName:_jsxFileName,lineNumber:203,columnNumber:9}}));};exports.InputEmailChip=InputEmailChip;var styles=_reactNative.StyleSheet.create({touchableTextInputWrapper:{position:"absolute",top:0,bottom:0,left:0,right:0}});InputEmailChip.propTypes={disabled:_propTypes.default.bool,label:_propTypes.default.string,emails:_propTypes.default.arrayOf(_propTypes.default.string),delimiters:_propTypes.default.arrayOf(_propTypes.default.string),onUpdate:_propTypes.default.func};

package/lib/components/LineLoader.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.LineLoader=void 0;var _react=_interopRequireDefault(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _native=_interopRequireWildcard(require("react-content-loader/native"));var _reactNativeSizeMatters=require("react-native-size-matters");var _theme=require("../theme");var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/LineLoader.jsx";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 LineLoader=function LineLoader(_ref){var isLoading=_ref.isLoading,_ref$backgroundColor=_ref.backgroundColor,backgroundColor=_ref$backgroundColor===void 0?_theme.theme.colors.background.primary:_ref$backgroundColor,_ref$foregroundColor=_ref.foregroundColor,foregroundColor=_ref$foregroundColor===void 0?_theme.theme.colors.background.base:_ref$foregroundColor,_ref$height=_ref.height,height=_ref$height===void 0?(0,_reactNativeSizeMatters.moderateScale)(1.5):_ref$height;return _react.default.createElement(_native.default,{animate:isLoading,backgroundColor:backgroundColor,foregroundColor:foregroundColor,height:height,interval:0,key:isLoading,speed:1,width:"100%",__self:_this,__source:{fileName:_jsxFileName,lineNumber:15,columnNumber:3}},_react.default.createElement(_native.Rect,{height:height,width:"100%",x:0,y:0,__self:_this,__source:{fileName:_jsxFileName,lineNumber:25,columnNumber:5}}));};exports.LineLoader=LineLoader;LineLoader.propTypes={isLoading:_propTypes.default.bool,backgroundColor:_propTypes.default.string,foregroundColor:_propTypes.default.string,height:_propTypes.default.number};

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,"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,"InputEmailChip",{enumerable:true,get:function get(){return _InputEmailChip.InputEmailChip;}});Object.defineProperty(exports,"ListItem",{enumerable:true,get:function get(){return _ListItem.ListItem;}});Object.defineProperty(exports,"Loader",{enumerable:true,get:function get(){return _Loader.Loader;}});Object.defineProperty(exports,"MultiSelect",{enumerable:true,get:function get(){return _MultiSelect.MultiSelect;}});Object.defineProperty(exports,"NotificationPreferenceList",{enumerable:true,get:function get(){return _NotificationPreferenceList.NotificationPreferenceList;}});Object.defineProperty(exports,"OnBoarding",{enumerable:true,get:function get(){return _OnBoarding.OnBoarding;}});Object.defineProperty(exports,"OrganizationItem",{enumerable:true,get:function get(){return _OrganizationItem.OrganizationItem;}});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,"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 _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");var _NotificationPreferenceList=require("./NotificationPreferenceList");var _OrganizationItem=require("./OrganizationItem");var _Loader=require("./Loader");var _InputEmailChip=require("./InputEmailChip");
+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,"ChatInput",{enumerable:true,get:function get(){return _ChatInput.ChatInput;}});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,"InputEmailChip",{enumerable:true,get:function get(){return _InputEmailChip.InputEmailChip;}});Object.defineProperty(exports,"LineLoader",{enumerable:true,get:function get(){return _LineLoader.LineLoader;}});Object.defineProperty(exports,"ListItem",{enumerable:true,get:function get(){return _ListItem.ListItem;}});Object.defineProperty(exports,"Loader",{enumerable:true,get:function get(){return _Loader.Loader;}});Object.defineProperty(exports,"MultiSelect",{enumerable:true,get:function get(){return _MultiSelect.MultiSelect;}});Object.defineProperty(exports,"NotificationPreferenceList",{enumerable:true,get:function get(){return _NotificationPreferenceList.NotificationPreferenceList;}});Object.defineProperty(exports,"OnBoarding",{enumerable:true,get:function get(){return _OnBoarding.OnBoarding;}});Object.defineProperty(exports,"OrganizationItem",{enumerable:true,get:function get(){return _OrganizationItem.OrganizationItem;}});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,"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 _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");var _NotificationPreferenceList=require("./NotificationPreferenceList");var _OrganizationItem=require("./OrganizationItem");var _ChatInput=require("./ChatInput/ChatInput");var _Loader=require("./Loader");var _InputEmailChip=require("./InputEmailChip");var _LineLoader=require("./LineLoader");

package/lib/theme/index.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.theme=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _reactNativeSizeMatters=require("react-native-size-matters");var defaultColors={white:"#ffffff",base:"#4557F8",danger:"#D95D4E",menubackground:"#F6F6FA"};var toastBorderColors={success:"#00BA88",error:"#F56A58",info:"#276EF1",warning:"#F3CD82"};var greyVariants={grey:"#828282",grey100:"#f8f9f9",grey200:"#e9ebed",grey300:"#d8dcde",grey400:"#c2c8cc",grey500:"#87929d",grey600:"#68737d",grey700:"#49545C",grey800:"#2f3941"};var darkBlueVariant={darkBlue100:"#0B4885"};var lightBlueVariants={lightBlue100:"#EAF3FC",lightBlue400:"#4558F9"};var purpleVariants={purple100:"#F2F4FF",purple200:"#ECF4FF",purple500:"#4557F8",purple700:"#342DF4"};var greenVariants={green500:"#34C759",green600:"#33C8A0",green700:"#00BA88",green800:"#00956D"};var colors={font:(0,_extends2.default)({primary:"#2F3941",secondary:"#49545C"},defaultColors,greyVariants,lightBlueVariants,darkBlueVariant,purpleVariants,greenVariants),background:(0,_extends2.default)({parentView:"#ffffff",primary:"#ffffff",secondary:"#F6F6FA"},defaultColors,greyVariants,lightBlueVariants,darkBlueVariant,purpleVariants,greenVariants),border:(0,_extends2.default)({primary:"#E9EBED",secondary:"#C2C8CC"},greyVariants,lightBlueVariants,darkBlueVariant,defaultColors,purpleVariants),toast:(0,_extends2.default)({},toastBorderColors)};var baseTheme={colors:colors,fonts:{sf400:"SFProText-Regular",sf500:"SFProText-Medium",sf600:"SFProText-Semibold",sf700:"SFProText-Bold"},lineHeights:[24],fontSizes:{"4xs":(0,_reactNativeSizeMatters.moderateScale)(10),"3xs":(0,_reactNativeSizeMatters.moderateScale)(11),"2xs":(0,_reactNativeSizeMatters.moderateScale)(12),xs:(0,_reactNativeSizeMatters.moderateScale)(13),s:(0,_reactNativeSizeMatters.moderateScale)(14),m:(0,_reactNativeSizeMatters.moderateScale)(15),l:(0,_reactNativeSizeMatters.moderateScale)(16),xl:(0,_reactNativeSizeMatters.moderateScale)(17),"2xl":(0,_reactNativeSizeMatters.moderateScale)(18),"3xl":(0,_reactNativeSizeMatters.moderateScale)(20),"4xl":(0,_reactNativeSizeMatters.moderateScale)(22),"5xl":(0,_reactNativeSizeMatters.moderateScale)(30)},space:new Array(100).fill(0).map(function(_,index){return index+1;})};baseTheme.lineHeights.note=baseTheme.lineHeights[0]+"px";var theme=(0,_extends2.default)({},baseTheme,{textStyles:{defaultTextStyle:{color:baseTheme.colors.font.grey800,fontSize:baseTheme.fontSizes.s,fontFamily:baseTheme.fonts.sf400},header:{color:baseTheme.colors.font.primary,fontSize:baseTheme.fontSizes["3xl"],fontFamily:baseTheme.fonts.sf600},modalHeader:{color:baseTheme.colors.font.primary,fontSize:baseTheme.fontSizes["xl"],fontFamily:baseTheme.fonts.sf600},body:{color:baseTheme.colors.font.grey500,fontSize:baseTheme.fontSizes.s},subtext:{color:baseTheme.colors.font.primary,fontSize:baseTheme.fontSizes["2xs"]},solid:{color:baseTheme.colors.font.white},inverse:{color:baseTheme.colors.font.base},text:{color:baseTheme.colors.font.base}},buttons:{solid:{border:2,borderColor:baseTheme.colors.background.base,backgroundColor:baseTheme.colors.background.base},inverse:{border:2,borderColor:baseTheme.colors.border.base,backgroundColor:baseTheme.colors.background.white},text:{color:baseTheme.colors.font.grey800,backgroundColor:baseTheme.colors.background.white}}});exports.theme=theme;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.theme=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _reactNativeSizeMatters=require("react-native-size-matters");var defaultColors={white:"#ffffff",base:"#4557F8",danger:"#D95D4E",menubackground:"#F6F6FA"};var toastBorderColors={success:"#00BA88",error:"#F56A58",info:"#276EF1",warning:"#F3CD82"};var greyVariants={grey:"#828282",grey100:"#f8f9f9",grey200:"#e9ebed",grey300:"#d8dcde",grey400:"#c2c8cc",grey500:"#87929d",grey600:"#68737d",grey700:"#49545C",grey800:"#2f3941"};var darkBlueVariant={darkBlue100:"#0B4885"};var lightBlueVariants={lightBlue100:"#EAF3FC",lightBlue400:"#4558F9"};var purpleVariants={purple100:"#F2F4FF",purple200:"#ECF4FF",purple500:"#4557F8",purple700:"#342DF4"};var greenVariants={green500:"#34C759",green600:"#33C8A0",green700:"#00BA88",green800:"#00956D"};var colors={font:(0,_extends2.default)({primary:"#2F3941",secondary:"#49545C"},defaultColors,greyVariants,lightBlueVariants,darkBlueVariant,purpleVariants,greenVariants),background:(0,_extends2.default)({parentView:"#ffffff",primary:"#ffffff",secondary:"#F6F6FA",oldLace:"#FDF6E5"},defaultColors,greyVariants,lightBlueVariants,darkBlueVariant,purpleVariants,greenVariants),border:(0,_extends2.default)({primary:"#E9EBED",secondary:"#C2C8CC"},greyVariants,lightBlueVariants,darkBlueVariant,defaultColors,purpleVariants),toast:(0,_extends2.default)({},toastBorderColors)};var baseTheme={colors:colors,fonts:{sf400:"SFProText-Regular",sf500:"SFProText-Medium",sf600:"SFProText-Semibold",sf700:"SFProText-Bold"},lineHeights:[24],fontSizes:{"4xs":(0,_reactNativeSizeMatters.moderateScale)(10),"3xs":(0,_reactNativeSizeMatters.moderateScale)(11),"2xs":(0,_reactNativeSizeMatters.moderateScale)(12),xs:(0,_reactNativeSizeMatters.moderateScale)(13),s:(0,_reactNativeSizeMatters.moderateScale)(14),m:(0,_reactNativeSizeMatters.moderateScale)(15),l:(0,_reactNativeSizeMatters.moderateScale)(16),xl:(0,_reactNativeSizeMatters.moderateScale)(17),"2xl":(0,_reactNativeSizeMatters.moderateScale)(18),"3xl":(0,_reactNativeSizeMatters.moderateScale)(20),"4xl":(0,_reactNativeSizeMatters.moderateScale)(22),"5xl":(0,_reactNativeSizeMatters.moderateScale)(30)},space:new Array(100).fill(0).map(function(_,index){return index+1;})};baseTheme.lineHeights.note=baseTheme.lineHeights[0]+"px";var theme=(0,_extends2.default)({},baseTheme,{textStyles:{defaultTextStyle:{color:baseTheme.colors.font.grey800,fontSize:baseTheme.fontSizes.s,fontFamily:baseTheme.fonts.sf400},header:{color:baseTheme.colors.font.primary,fontSize:baseTheme.fontSizes["3xl"],fontFamily:baseTheme.fonts.sf600},modalHeader:{color:baseTheme.colors.font.primary,fontSize:baseTheme.fontSizes["xl"],fontFamily:baseTheme.fonts.sf600},body:{color:baseTheme.colors.font.grey500,fontSize:baseTheme.fontSizes.s},subtext:{color:baseTheme.colors.font.primary,fontSize:baseTheme.fontSizes["2xs"]},solid:{color:baseTheme.colors.font.white},inverse:{color:baseTheme.colors.font.base},text:{color:baseTheme.colors.font.base}},buttons:{solid:{border:2,borderColor:baseTheme.colors.background.base,backgroundColor:baseTheme.colors.background.base},inverse:{border:2,borderColor:baseTheme.colors.border.base,backgroundColor:baseTheme.colors.background.white},text:{color:baseTheme.colors.font.grey800,backgroundColor:baseTheme.colors.background.white}}});exports.theme=theme;

package/package.json

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

package/src/components/Button.jsx

@@ -147,9 +147,13 @@ export const Button = React.forwardRef(
 
     const renderOpacity = () => {
       if (
-        ["secondary", "danger", "danger-inverse", "danger-text"].includes(
-          variant
-        ) &&
+        [
+          "text",
+          "secondary",
+          "danger",
+          "danger-inverse",
+          "danger-text",
+        ].includes(variant) &&
         disabled
       ) {
         return 0.5;

package/src/components/ChatInput/AttachmentsView.jsx

@@ -0,0 +1,51 @@
+import React from "react";
+
+import PropTypes from "prop-types";
+import Animated, { FadeInDown, FadeInUp } from "react-native-reanimated";
+
+import { Badge } from "./Badge";
+
+export const AttachmentsView = ({
+  isAttachmentsVisible,
+  setIsAttachmentsVisible,
+  Attachments,
+  attachmentsCount,
+  isNoteOptionSelected,
+}) =>
+  isAttachmentsVisible ? (
+    attachmentsCount !== 0 && (
+      <Animated.View entering={FadeInUp} key={isAttachmentsVisible}>
+        {Attachments}
+      </Animated.View>
+    )
+  ) : (
+    <>
+      {attachmentsCount > 0 && (
+        <Animated.View
+          alignItems="flex-start"
+          entering={FadeInDown}
+          flexDirection="row"
+          flexWrap="wrap"
+          key={isAttachmentsVisible}
+          onTouchStart={() => setIsAttachmentsVisible(true)}
+        >
+          <Badge
+            isNoteOptionSelected={isNoteOptionSelected}
+            text="Attachments"
+          />
+          <Badge
+            isNoteOptionSelected={isNoteOptionSelected}
+            text={`+ ${attachmentsCount}`}
+          />
+        </Animated.View>
+      )}
+    </>
+  );
+
+AttachmentsView.propTypes = {
+  isAttachmentsVisible: PropTypes.bool,
+  setIsAttachmentsVisible: PropTypes.func,
+  Attachments: PropTypes.any,
+  attachmentsCount: PropTypes.number,
+  isNoteOptionSelected: PropTypes.bool,
+};

package/src/components/ChatInput/Badge.jsx

@@ -0,0 +1,24 @@
+import React from "react";
+
+import PropTypes from "prop-types";
+import { moderateScale } from "react-native-size-matters";
+
+import { Container, Typography } from "@components";
+
+export const Badge = ({ text, isNoteOptionSelected }) => (
+  <Container
+    alignSelf="flex-start"
+    bg={isNoteOptionSelected ? "white" : "background.oldLace"}
+    borderRadius={moderateScale(20)}
+    flexDirection="row"
+    flexGrow={0}
+    px={moderateScale(4)}
+  >
+    <Typography fontSize="3xs">{text}</Typography>
+  </Container>
+);
+
+Badge.propTypes = {
+  text: PropTypes.string,
+  isNoteOptionSelected: PropTypes.bool,
+};

package/src/components/ChatInput/ChatInput.jsx

@@ -0,0 +1,422 @@
+import React, { useEffect, useRef, useCallback, useState } from "react";
+
+import PropTypes from "prop-types";
+import { moderateScale } from "react-native-size-matters";
+import styled from "styled-components/native";
+import {
+  flexbox,
+  space,
+  border,
+  buttonStyle,
+  typography,
+  color,
+} from "styled-system";
+
+import AttachmentSVG from "@assets/icons/attachment.svg";
+import CannedResponseSVG from "@assets/icons/canned-response.svg";
+import ExpandSVG from "@assets/icons/expand.svg";
+import ForwardSVG from "@assets/icons/forward.svg";
+import MinimizeSVG from "@assets/icons/minimize.svg";
+import NoteSVG from "@assets/icons/note.svg";
+import ReplySVG from "@assets/icons/reply.svg";
+import { Container, LineLoader, Button } from "@components";
+
+import { AttachmentsView } from "./AttachmentsView";
+import { EmailFields } from "./EmailFields";
+import { IconButton } from "./IconButton";
+
+import { theme } from "../../theme";
+
+const placeholders = {
+  reply: "Type here to reply...",
+  note: "Add note here...",
+  forward: "Type here to forward...",
+};
+
+// eslint-disable-next-line @bigbinary/neeto/no-dangling-constants
+const OPTION_TYPES = {
+  REPLY: "REPLY",
+  NOTE: "NOTE",
+  FORWARD: "FORWARD",
+};
+
+const labels = {
+  [OPTION_TYPES.REPLY]: "Reply",
+  [OPTION_TYPES.NOTE]: "Add note",
+  [OPTION_TYPES.FORWARD]: "Forward",
+};
+
+const TextInput = styled.TextInput`
+  ${flexbox}
+  ${space}
+  ${border}
+  ${buttonStyle}
+  ${typography}
+  ${color}
+`;
+/**
+ * ChatInput component supports various options like `REPLY`, `NOTE` and `FORWARD`.
+ * This component supports below props categories from [styled-system ](/styled-system).
+ * <ul>
+ * <li>flexbox</li>
+ * <li>space</li>
+ * <li>border</li>
+ * <li>buttonStyle</li>
+ * <li>brandLeft</li>
+ * <li>typography</li>
+ * </ul>
+ *
+ * <div class="screenshots">
+ *   <img src="screenshots/chatInput/chatInput.png" />
+ * </div>
+ *
+ * ## Usage
+ * ```js
+ * import * as React from 'react';
+ * import { Typography, ChatInput, Container } from '@bigbinary/neetoui-rn';
+ *
+ * export default function Main() {
+ *  const [value, setValue] = React.useState(
+ *    "Hey Oliver, We are working on this issue. We will keep you update");
+ *
+ *  return (
+ *    <Container flex={1}>
+ *      <Container alignItems="center" flex={1} justifyContent="center">
+ *        <Typography> Desk Example</Typography>
+ *      </Container>
+ *      <Container align-self="end">
+ *        <ChatInput
+ *          shouldShowEmailFields
+ *          attachmentsCount={2}
+ *          toEmails="oliver@example.com"
+ *          value={value}
+ *          Attachments={
+ *            <Container alignItems="flex-start">
+ *              <AnimatedImage
+ *                imageHeight={30}
+ *                imageUrl="https://picsum.photos/255/139"
+ *                imageWidth={30}
+ *                resizeMode="cover"
+ *              />
+ *            </Container>
+ *          }
+ *          onChangeText={setValue}
+ *          onCannedResponse={() => {
+ *            alert("On Canned Response");
+ *          }}
+ *          onForward={() => {
+ *            alert("On Forward");
+ *          }}
+ *        />
+ *      </Container>
+ *    </Container>
+ *  );
+ * }
+ * ```
+ */
+
+export const ChatInput = ({
+  shouldShowEmailFields,
+  value = "",
+  onChangeText = () => {},
+  onForward,
+  onCannedResponse,
+  toEmails: initialToEmails,
+  onReply = () => {},
+  onAddNote = () => {},
+  onAttachment = () => {},
+  attachmentsCount,
+  Attachments,
+  showCannedResponsesFor = [OPTION_TYPES.REPLY],
+  disabled,
+  isLoading = true,
+  onOptionChange = () => {},
+  initialSelectedOption = OPTION_TYPES.REPLY,
+  ...rest
+}) => {
+  const inputRef = useRef();
+
+  const [selectedOption, setSelectedOption] = useState(initialSelectedOption);
+  const [isEmailFieldsVisible, setIsEmailFieldsVisible] = useState(false);
+  const [isAttachmentsVisible, setIsAttachmentsVisible] = useState(false);
+
+  const isReplyOptionSelected = selectedOption === OPTION_TYPES.REPLY;
+  const isNoteOptionSelected = selectedOption === OPTION_TYPES.NOTE;
+  const isForwardOptionSelected = selectedOption === OPTION_TYPES.FORWARD;
+
+  const [toEmails, setToEmails] = useState(initialToEmails ?? "");
+  const [ccEmails, setCcEmails] = useState("");
+  const [bccEmails, setBccEmails] = useState("");
+
+  useEffect(() => {
+    onOptionChange(selectedOption);
+  }, [selectedOption]);
+
+  useEffect(() => {
+    setSelectedOption(initialSelectedOption);
+  }, [initialSelectedOption]);
+
+  useEffect(() => {
+    if (isReplyOptionSelected) {
+      setToEmails(initialToEmails ?? "");
+    } else {
+      setToEmails("");
+    }
+  }, [initialToEmails, isReplyOptionSelected]);
+
+  const showEmailFieldsAndAttachments = () => {
+    setIsAttachmentsVisible(true);
+    setIsEmailFieldsVisible(true);
+  };
+
+  const hideEmailFieldsAndAttachments = () => {
+    setIsAttachmentsVisible(false);
+    setIsEmailFieldsVisible(false);
+  };
+
+  const onReplyClickHandler = () => {
+    hideEmailFieldsAndAttachments();
+    inputRef.current.focus();
+    setSelectedOption(OPTION_TYPES.REPLY);
+  };
+
+  const onAddNoteClickHandler = () => {
+    hideEmailFieldsAndAttachments();
+    inputRef.current.focus();
+    setIsEmailFieldsVisible(false);
+    setSelectedOption(OPTION_TYPES.NOTE);
+  };
+
+  const onAddForwardClickHandler = () => {
+    inputRef.current.focus();
+    setIsEmailFieldsVisible(true);
+    setIsAttachmentsVisible(false);
+    setSelectedOption(OPTION_TYPES.FORWARD);
+  };
+
+  const onAddAttachmentsClickHandler = () => {
+    if (!isAttachmentsVisible && attachmentsCount > 0) {
+      // When attachments are not visible but there are few attachments then we no need to show the upload modal.
+    } else {
+      onAttachment();
+    }
+    setIsEmailFieldsVisible(false);
+    setIsAttachmentsVisible(true);
+  };
+
+  const onActionHandler = useCallback(() => {
+    ({
+      [OPTION_TYPES.REPLY]: () => {
+        onReply({ toEmails, ccEmails, bccEmails });
+      },
+      [OPTION_TYPES.NOTE]: () => {
+        onAddNote({ toEmails, ccEmails, bccEmails });
+      },
+      [OPTION_TYPES.FORWARD]: () => {
+        onForward({ toEmails, ccEmails, bccEmails });
+      },
+    }[selectedOption]());
+  }, [
+    bccEmails,
+    ccEmails,
+    onAddNote,
+    onForward,
+    onReply,
+    selectedOption,
+    toEmails,
+  ]);
+
+  const shouldExpandAndMinimizeButton = attachmentsCount > 0 || toEmails;
+
+  return (
+    <Container>
+      <LineLoader
+        backgroundColor={theme.colors.background.grey400}
+        isLoading={isLoading}
+      />
+      <Container
+        bg={isNoteOptionSelected ? "background.oldLace" : "transparent"}
+        p={moderateScale(5)}
+        pt={0}
+        px={moderateScale(16)}
+      >
+        <Container pt={moderateScale(8)}>
+          <EmailFields
+            bccEmails={bccEmails}
+            ccEmails={ccEmails}
+            isEmailFieldsVisible={isEmailFieldsVisible}
+            setBccEmails={setBccEmails}
+            setCcEmails={setCcEmails}
+            setIsEmailFieldsVisible={setIsEmailFieldsVisible}
+            setToEmails={setToEmails}
+            shouldShowEmailFields={shouldShowEmailFields}
+            toEmails={toEmails}
+          />
+          <Container flexDirection="row" justifyContent="space-between">
+            <TextInput
+              multiline
+              flex={1}
+              placeholder={placeholders[selectedOption]}
+              py={moderateScale(12)}
+              ref={inputRef}
+              value={value}
+              onChangeText={onChangeText}
+              onTouchStart={hideEmailFieldsAndAttachments}
+              {...rest}
+            />
+            <Container alignSelf="center">
+              {shouldExpandAndMinimizeButton &&
+                (isEmailFieldsVisible || isAttachmentsVisible ? (
+                  <IconButton
+                    Icon={MinimizeSVG}
+                    height={moderateScale(30)}
+                    pt={moderateScale(8)}
+                    width={moderateScale(30)}
+                    onPress={hideEmailFieldsAndAttachments}
+                  />
+                ) : (
+                  <IconButton
+                    Icon={ExpandSVG}
+                    height={moderateScale(30)}
+                    pt={moderateScale(8)}
+                    width={moderateScale(30)}
+                    onPress={showEmailFieldsAndAttachments}
+                  />
+                ))}
+            </Container>
+          </Container>
+          <AttachmentsView
+            Attachments={Attachments}
+            attachmentsCount={attachmentsCount}
+            isAttachmentsVisible={isAttachmentsVisible}
+            isNoteOptionSelected={isNoteOptionSelected}
+            setIsAttachmentsVisible={setIsAttachmentsVisible}
+          />
+          <Container
+            alignItems="center"
+            flexDirection="row"
+            justifyContent="space-between"
+            mt={moderateScale(10)}
+          >
+            <Container flexDirection="row" justifyContent="space-between">
+              <IconButton
+                Icon={ReplySVG}
+                opacity={isReplyOptionSelected ? 1 : 0.5}
+                pl={moderateScale(10)}
+                onPress={onReplyClickHandler}
+              />
+              <IconButton
+                Icon={NoteSVG}
+                opacity={isNoteOptionSelected ? 1 : 0.5}
+                onPress={onAddNoteClickHandler}
+              />
+              {onForward && (
+                <IconButton
+                  Icon={ForwardSVG}
+                  opacity={isForwardOptionSelected ? 1 : 0.5}
+                  onPress={onAddForwardClickHandler}
+                />
+              )}
+              <Container
+                bg="background.grey400"
+                mx={moderateScale(5)}
+                p={moderateScale(0.4)}
+              />
+              {onCannedResponse &&
+                showCannedResponsesFor.includes(selectedOption) && (
+                  <IconButton
+                    Icon={CannedResponseSVG}
+                    opacity={0.5}
+                    onPress={onCannedResponse}
+                  />
+                )}
+              <IconButton
+                Icon={AttachmentSVG}
+                opacity={0.5}
+                onPress={onAddAttachmentsClickHandler}
+              />
+            </Container>
+            <Button
+              disabled={disabled}
+              height={moderateScale(30)}
+              label={labels[selectedOption]}
+              pr={0}
+              variant="text"
+              labelStyle={{
+                mx: moderateScale(0),
+              }}
+              onPress={onActionHandler}
+            />
+          </Container>
+        </Container>
+      </Container>
+    </Container>
+  );
+};
+
+ChatInput.propTypes = {
+  /**
+   * If true, Shows loader
+   */
+  isLoading: PropTypes.bool,
+  /**
+   * If true, Shows to, cc and bcc email inputs.
+   */
+  shouldShowEmailFields: PropTypes.bool,
+  /**
+   * Value to make input component controllable.
+   */
+  value: PropTypes.string,
+  /**
+   * To set the initial selected option
+   */
+  initialSelectedOption: PropTypes.oneOf(Object.values(OPTION_TYPES)),
+  /**
+   * Callback to be called when user selection option.
+   */
+  onOptionChange: PropTypes.func,
+  /**
+   * Callback to be called when the input text changes.
+   */
+  onChangeText: PropTypes.func,
+  /**
+   * Callback to be called on click of forward icon.
+   */
+  onForward: PropTypes.func,
+  /**
+   * Callback to be called on click of canned responses icon.
+   */
+  onCannedResponse: PropTypes.func,
+  /**
+   * Email list separated by comma.
+   */
+  toEmails: PropTypes.string,
+  /**
+   * Callback to be called on click of reply icon.
+   */
+  onReply: PropTypes.func,
+  /**
+   * Callback to be called on click of add note icon.
+   */
+  onAddNote: PropTypes.func,
+  /**
+   * Callback to be called on click of attachment icon.
+   */
+  onAttachment: PropTypes.func,
+  /**
+   * Count of attachments.
+   */
+  attachmentsCount: PropTypes.number,
+  /**
+   * Component to render attachments.
+   */
+  Attachments: PropTypes.any,
+  /**
+   * Array for options to show canned responses. Example: ["reply","notes","forward"]
+   */
+  showCannedResponsesFor: PropTypes.arrayOf(PropTypes.string),
+  /**
+   * If true, Disables the reply, forward and add note button.
+   */
+  disabled: PropTypes.bool,
+};

package/src/components/ChatInput/EmailFields.jsx

@@ -0,0 +1,92 @@
+import React from "react";
+
+import PropTypes from "prop-types";
+import Animated, { FadeInDown, FadeInUp } from "react-native-reanimated";
+import { moderateScale } from "react-native-size-matters";
+
+import { InputEmailChip } from "@components";
+
+import { Badge } from "./Badge";
+
+export const EmailFields = ({
+  shouldShowEmailFields,
+  setIsEmailFieldsVisible,
+  isEmailFieldsVisible,
+  ccEmails,
+  toEmails,
+  bccEmails,
+  setBccEmails,
+  setCcEmails,
+  setToEmails,
+}) => {
+  const firstToEmail = (toEmails.trim() ? toEmails.split(",") : [])[0] ?? "";
+
+  const totalEmailsMinus1 =
+    (toEmails.trim() ? toEmails.split(",") : []).length +
+    (ccEmails.trim() ? ccEmails.split(",") : []).length +
+    (bccEmails.trim() ? bccEmails.split(",") : []).length -
+    1;
+
+  if (!shouldShowEmailFields) return null;
+
+  return isEmailFieldsVisible ? (
+    <Animated.View
+      entering={FadeInDown}
+      key={isEmailFieldsVisible}
+      pb={moderateScale(10)}
+    >
+      <InputEmailChip
+        disabled={false}
+        emails={toEmails.trim() ? toEmails.split(",") : []}
+        label="To:"
+        onUpdate={emails => {
+          setToEmails(emails.join(","));
+        }}
+      />
+      <InputEmailChip
+        disabled={false}
+        emails={ccEmails.trim() ? ccEmails.split(",") : []}
+        label="Cc:"
+        onUpdate={emails => {
+          setCcEmails(emails.join(","));
+        }}
+      />
+      <InputEmailChip
+        disabled={false}
+        emails={bccEmails.trim() ? bccEmails.split(",") : []}
+        label="Bcc:"
+        onUpdate={emails => {
+          setBccEmails(emails.join(","));
+        }}
+      />
+    </Animated.View>
+  ) : (
+    <Animated.View
+      alignItems="flex-start"
+      entering={FadeInUp}
+      flexDirection="row"
+      flexWrap="wrap"
+      key={isEmailFieldsVisible}
+      onTouchStart={() => setIsEmailFieldsVisible(true)}
+    >
+      {toEmails.length > 0 && (
+        <>
+          <Badge text={`To ${firstToEmail}`} />
+          {totalEmailsMinus1 > 1 && <Badge text={`+ ${totalEmailsMinus1}`} />}
+        </>
+      )}
+    </Animated.View>
+  );
+};
+
+EmailFields.propTypes = {
+  shouldShowEmailFields: PropTypes.bool,
+  isEmailFieldsVisible: PropTypes.bool,
+  setIsEmailFieldsVisible: PropTypes.func,
+  ccEmails: PropTypes.string,
+  toEmails: PropTypes.string,
+  bccEmails: PropTypes.string,
+  setBccEmails: PropTypes.func,
+  setCcEmails: PropTypes.func,
+  setToEmails: PropTypes.func,
+};

package/src/components/ChatInput/IconButton.jsx

@@ -0,0 +1,22 @@
+import React from "react";
+
+import PropTypes from "prop-types";
+import { moderateScale } from "react-native-size-matters";
+
+import { Touchable } from "@components";
+
+export const IconButton = ({ Icon, ...rest }) => (
+  <Touchable
+    alignItems="center"
+    height={moderateScale(22)}
+    px={moderateScale(18)}
+    width={moderateScale(22)}
+    {...rest}
+  >
+    {<Icon />}
+  </Touchable>
+);
+
+IconButton.propTypes = {
+  Icon: PropTypes.elementType,
+};

package/src/components/InputEmailChip.jsx

@@ -25,6 +25,7 @@ export const InputEmailChip = ({
   emails = [],
   onUpdate,
   delimiters = [" ", ","],
+  ...rest
 }) => {
   const theme = useContext(ThemeContext);
   const inputRef = useRef();
@@ -80,7 +81,7 @@ export const InputEmailChip = ({
   };
 
   const handleOnEndEditing = event => {
-      checkAndUpdateEmails(event.nativeEvent.text);
+    checkAndUpdateEmails(event.nativeEvent.text);
   };
 
   const checkAndUpdateEmails = text => {
@@ -127,12 +128,14 @@ export const InputEmailChip = ({
       minHeight={moderateScale(30)}
       py={moderateScale(2)}
       width="100%"
+      {...rest}
     >
       {!!label && (
         <Typography
           color={disabled ? "font.grey400" : "font.grey600"}
           fontSize="xs"
-          mr={moderateScale(8)}
+          textAlign="left"
+          width={moderateScale(40)}
           mt={Platform.select({
             android: moderateScale(10),
             ios: moderateScale(8),
@@ -152,9 +155,10 @@ export const InputEmailChip = ({
             <Chip
               isDisabled={disabled}
               label={email}
-              containerStyle={getChipContainerStyle(
-                index === emailIndexForDeletion
-              )}
+              containerStyle={{
+                ...getChipContainerStyle(index === emailIndexForDeletion),
+                height: moderateScale(25),
+              }}
               onClose={disabled ? null : () => removeEmail({ email })}
             />
           </Container>
@@ -175,6 +179,9 @@ export const InputEmailChip = ({
               noBorder
               disabled={disabled}
               value={textValue}
+              containerProps={{
+                borderRadius: 0,
+              }}
               inputProps={{
                 ...inputProps,
                 ref: inputRef,
@@ -184,6 +191,8 @@ export const InputEmailChip = ({
                 onFocus: handleOnFocus,
                 onBlur: handleOnBlur,
                 onEndEditing: handleOnEndEditing,
+                borderBottomWidth: moderateScale(2),
+                borderColor: "background.grey200",
               }}
               onChangeText={handleTextChange}
             />

package/src/components/LineLoader.jsx

@@ -0,0 +1,46 @@
+import React from "react";
+
+import PropTypes from "prop-types";
+import ContentLoader, { Rect } from "react-content-loader/native";
+import { moderateScale } from "react-native-size-matters";
+
+import { theme } from "../theme";
+
+export const LineLoader = ({
+  isLoading,
+  backgroundColor = theme.colors.background.primary,
+  foregroundColor = theme.colors.background.base,
+  height = moderateScale(1.5),
+}) => (
+  <ContentLoader
+    animate={isLoading}
+    backgroundColor={backgroundColor}
+    foregroundColor={foregroundColor}
+    height={height}
+    interval={0}
+    key={isLoading}
+    speed={1}
+    width="100%"
+  >
+    <Rect height={height} width="100%" x={0} y={0} />
+  </ContentLoader>
+);
+
+LineLoader.propTypes = {
+  /**
+   * Shows loader when true.
+   */
+  isLoading: PropTypes.bool,
+  /**
+   * Custom background color of loader.
+   */
+  backgroundColor: PropTypes.string,
+  /**
+   * Custom foreground color of loader.
+   */
+  foregroundColor: PropTypes.string,
+  /**
+   * Height of loader.
+   */
+  height: PropTypes.number,
+};

package/src/components/index.js

@@ -37,5 +37,7 @@ export { BottomTabBar } from "./BottomTabBar";
 export { AnimatedImage } from "./AnimatedImage";
 export { NotificationPreferenceList } from "./NotificationPreferenceList";
 export { OrganizationItem } from "./OrganizationItem";
+export { ChatInput } from "./ChatInput/ChatInput";
 export { Loader } from "./Loader";
 export { InputEmailChip } from "./InputEmailChip";
+export { LineLoader } from "./LineLoader";

package/src/theme/index.js

@@ -64,6 +64,7 @@ const colors = {
     parentView: "#ffffff",
     primary: "#ffffff",
     secondary: "#F6F6FA",
+    oldLace: "#FDF6E5",
     ...defaultColors,
     ...greyVariants,
     ...lightBlueVariants,