@bigbinary/neetoui-rn 0.0.227 → 0.0.229

package/index.d.ts

@@ -23,7 +23,7 @@ import {
   TextInputIOSProps as RNTextInputIOSProps,
   ViewStyle,
   TextStyle,
-  TouchableOpacityProps,
+  TouchableOpacityProps as RNTouchableOpacityProps,
 } from "react-native";
 import { ModalProps } from "react-native-modal";
 import { BottomTabBarProps } from "@react-navigation/bottom-tabs";
@@ -100,13 +100,19 @@ interface TextInputProps
     TypographyProps {}
 interface FlatListProps extends RNFlatListProps, StyleProps {}
 interface ScrollViewProps extends RNScrollViewProps, StyleProps {}
+interface TouchableOpacityProps
+  extends RNTouchableOpacityProps,
+    StyleProps,
+    ButtonStyleProps {
+  children?: React.ReactNode;
+}
 interface TouchableProps extends RippleProps, StyleProps, ButtonStyleProps {
   children?: React.ReactNode;
 }
 
 interface AccordionProps extends ViewProps {
   header?: () => React.ReactNode;
-  headerContainerProps?: TouchableProps;
+  headerContainerProps?: TouchableOpacityProps;
   noBorder?: boolean;
   onStateChanged?: (isExpanded: boolean) => void;
   iconProp?: {

package/lib/components/Accordion.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Accordion=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));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 _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _native=require("styled-components/native");var _=require("./");var _excluded=["header","noBorder","iconProp","onStateChanged","children","position","shouldShowToggle","headerContainerProps"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Accordion.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 AccordionBody=function AccordionBody(_ref){var isExpanded=_ref.isExpanded,children=_ref.children;var animationController=(0,_react.useRef)(new _reactNative.Animated.Value(isExpanded?1:0)).current;var _useState=(0,_react.useState)(0),_useState2=(0,_slicedToArray2.default)(_useState,2),viewHeight=_useState2[0],setViewHeight=_useState2[1];(0,_react.useEffect)(function(){_reactNative.Animated.timing(animationController,{duration:300,toValue:isExpanded?1:0,useNativeDriver:false}).start();},[isExpanded]);var bodyContentHeight=animationController.interpolate({inputRange:[0,1],outputRange:[0,viewHeight]});var getLayout=function getLayout(event){var height=event.nativeEvent.layout.height;setViewHeight(height);};return _react.default.createElement(_reactNative.Animated.View,{style:{height:bodyContentHeight,overflow:"hidden"},__self:_this,__source:{fileName:_jsxFileName,lineNumber:42,columnNumber:5}},_react.default.createElement(_.Container,{position:"absolute",width:"100%",onLayout:getLayout,__self:_this,__source:{fileName:_jsxFileName,lineNumber:43,columnNumber:7}},children));};var Accordion=_react.default.forwardRef(function(_ref2,ref){var header=_ref2.header,_ref2$noBorder=_ref2.noBorder,noBorder=_ref2$noBorder===void 0?false:_ref2$noBorder,_ref2$iconProp=_ref2.iconProp,iconProp=_ref2$iconProp===void 0?{}:_ref2$iconProp,onStateChanged=_ref2.onStateChanged,children=_ref2.children,_ref2$position=_ref2.position,position=_ref2$position===void 0?"bottom":_ref2$position,_ref2$shouldShowToggl=_ref2.shouldShowToggle,shouldShowToggle=_ref2$shouldShowToggl===void 0?true:_ref2$shouldShowToggl,headerContainerProps=_ref2.headerContainerProps,rest=(0,_objectWithoutProperties2.default)(_ref2,_excluded);var name=iconProp.name,Label=iconProp.Label,size=iconProp.size,color=iconProp.color;var theme=(0,_react.useContext)(_native.ThemeContext);var _useState3=(0,_react.useState)(false),_useState4=(0,_slicedToArray2.default)(_useState3,2),isExpanded=_useState4[0],setIsExpanded=_useState4[1];var animationController=(0,_react.useRef)(new _reactNative.Animated.Value(isExpanded?1:0)).current;(0,_react.useEffect)(function(){_reactNative.Animated.timing(animationController,{duration:300,toValue:isExpanded?1:0,useNativeDriver:false}).start(function(){!!onStateChanged&&onStateChanged(isExpanded);});},[isExpanded]);var handleAnimation=function handleAnimation(){setIsExpanded(!isExpanded);};(0,_react.useImperativeHandle)(ref,function(){return{toggleAccordion:handleAnimation,openAccordion:function openAccordion(){return setIsExpanded(true);},closeAccordion:function closeAccordion(){return setIsExpanded(false);}};});var arrowAngle=animationController.interpolate({inputRange:[0,1],outputRange:["0rad",Math.PI+"rad"]});return _react.default.createElement(_.Container,(0,_extends2.default)({},!noBorder&&{borderColor:"border.grey400",borderWidth:1,borderRadius:8},{padding:12,width:"100%"},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:140,columnNumber:7}}),position==="top"&&_react.default.createElement(AccordionBody,{isExpanded:isExpanded,__self:_this,__source:{fileName:_jsxFileName,lineNumber:151,columnNumber:11}},children),_react.default.createElement(_.Touchable,(0,_extends2.default)({rippleOpacity:0,style:styles.accordionContainer,onPress:function onPress(){handleAnimation();}},headerContainerProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:153,columnNumber:9}}),!!header&&_react.default.createElement(_.Container,{flexGrow:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:161,columnNumber:24}},header()),!!shouldShowToggle&&_react.default.createElement(_.Container,{alignItems:"center",flexDirection:"row",justifyContent:"center",px:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:163,columnNumber:13}},Label&&_react.default.createElement(Label,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:169,columnNumber:25}}),_react.default.createElement(_reactNative.Animated.View,{style:{alignItems:"flex-end",transform:[{rotateZ:arrowAngle}]},__self:_this,__source:{fileName:_jsxFileName,lineNumber:170,columnNumber:15}},_react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:176,columnNumber:17}},_react.default.createElement(_reactNativeRemixIcon.default,{color:color!=null?color:theme.colors.font.grey700,name:name!=null?name:"ri-arrow-down-s-line",size:size!=null?size:24,__self:_this,__source:{fileName:_jsxFileName,lineNumber:177,columnNumber:19}}))))),position==="bottom"&&_react.default.createElement(AccordionBody,{isExpanded:isExpanded,__self:_this,__source:{fileName:_jsxFileName,lineNumber:188,columnNumber:11}},children));});exports.Accordion=Accordion;AccordionBody.propTypes={isExpanded:_propTypes.default.bool.isRequired,children:_propTypes.default.element};Accordion.propTypes={header:_propTypes.default.func,headerContainerProps:_propTypes.default.object,children:_propTypes.default.node,noBorder:_propTypes.default.bool,onStateChanged:_propTypes.default.func,iconProp:_propTypes.default.shape({name:_propTypes.default.string,Label:_propTypes.default.elementType,size:_propTypes.default.number,color:_propTypes.default.string}),position:_propTypes.default.string,shouldShowToggle:_propTypes.default.bool};var styles=_reactNative.StyleSheet.create({accordionContainer:{flexDirection:"row",alignItems:"center"}});Accordion.displayName="Accordion";
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Accordion=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _native=_interopRequireWildcard(require("styled-components/native"));var _styledSystem=require("styled-system");var _=require("./");var _excluded=["header","noBorder","iconProp","onStateChanged","children","position","shouldShowToggle","headerContainerProps"];var _templateObject,_this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Accordion.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 TouchableOpacity=_native.default.TouchableOpacity(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2.default)(["\n  ","\n  ","\n  ","\n  ","\n  ","\n  ","\n"])),_styledSystem.buttonStyle,_styledSystem.flexbox,_styledSystem.space,_styledSystem.border,_styledSystem.color,_styledSystem.layout);var AccordionBody=function AccordionBody(_ref){var isExpanded=_ref.isExpanded,children=_ref.children;var animationController=(0,_react.useRef)(new _reactNative.Animated.Value(isExpanded?1:0)).current;var _useState=(0,_react.useState)(0),_useState2=(0,_slicedToArray2.default)(_useState,2),viewHeight=_useState2[0],setViewHeight=_useState2[1];(0,_react.useEffect)(function(){_reactNative.Animated.timing(animationController,{duration:300,toValue:isExpanded?1:0,useNativeDriver:false}).start();},[isExpanded]);var bodyContentHeight=animationController.interpolate({inputRange:[0,1],outputRange:[0,viewHeight]});var getLayout=function getLayout(event){var height=event.nativeEvent.layout.height;setViewHeight(height);};return _react.default.createElement(_reactNative.Animated.View,{style:{height:bodyContentHeight,overflow:"hidden"},__self:_this,__source:{fileName:_jsxFileName,lineNumber:59,columnNumber:5}},_react.default.createElement(_.Container,{position:"absolute",width:"100%",onLayout:getLayout,__self:_this,__source:{fileName:_jsxFileName,lineNumber:60,columnNumber:7}},children));};var Accordion=_react.default.forwardRef(function(_ref2,ref){var header=_ref2.header,_ref2$noBorder=_ref2.noBorder,noBorder=_ref2$noBorder===void 0?false:_ref2$noBorder,_ref2$iconProp=_ref2.iconProp,iconProp=_ref2$iconProp===void 0?{}:_ref2$iconProp,onStateChanged=_ref2.onStateChanged,children=_ref2.children,_ref2$position=_ref2.position,position=_ref2$position===void 0?"bottom":_ref2$position,_ref2$shouldShowToggl=_ref2.shouldShowToggle,shouldShowToggle=_ref2$shouldShowToggl===void 0?true:_ref2$shouldShowToggl,headerContainerProps=_ref2.headerContainerProps,rest=(0,_objectWithoutProperties2.default)(_ref2,_excluded);var name=iconProp.name,Label=iconProp.Label,size=iconProp.size,color=iconProp.color;var theme=(0,_react.useContext)(_native.ThemeContext);var _useState3=(0,_react.useState)(false),_useState4=(0,_slicedToArray2.default)(_useState3,2),isExpanded=_useState4[0],setIsExpanded=_useState4[1];var animationController=(0,_react.useRef)(new _reactNative.Animated.Value(isExpanded?1:0)).current;(0,_react.useEffect)(function(){_reactNative.Animated.timing(animationController,{duration:300,toValue:isExpanded?1:0,useNativeDriver:false}).start(function(){!!onStateChanged&&onStateChanged(isExpanded);});},[isExpanded]);var handleAnimation=function handleAnimation(){setIsExpanded(!isExpanded);};(0,_react.useImperativeHandle)(ref,function(){return{toggleAccordion:handleAnimation,openAccordion:function openAccordion(){return setIsExpanded(true);},closeAccordion:function closeAccordion(){return setIsExpanded(false);}};});var arrowAngle=animationController.interpolate({inputRange:[0,1],outputRange:["0rad",Math.PI+"rad"]});return _react.default.createElement(_.Container,(0,_extends2.default)({},!noBorder&&{borderColor:"border.grey400",borderWidth:1,borderRadius:8},{padding:12,width:"100%"},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:157,columnNumber:7}}),position==="top"&&_react.default.createElement(AccordionBody,{isExpanded:isExpanded,__self:_this,__source:{fileName:_jsxFileName,lineNumber:168,columnNumber:11}},children),_react.default.createElement(TouchableOpacity,(0,_extends2.default)({style:styles.accordionContainer,onPress:function onPress(){handleAnimation();}},headerContainerProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:170,columnNumber:9}}),!!header&&_react.default.createElement(_.Container,{flexGrow:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:177,columnNumber:24}},header()),!!shouldShowToggle&&_react.default.createElement(_.Container,{alignItems:"center",flexDirection:"row",justifyContent:"center",px:1,__self:_this,__source:{fileName:_jsxFileName,lineNumber:179,columnNumber:13}},Label&&_react.default.createElement(Label,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:185,columnNumber:25}}),_react.default.createElement(_reactNative.Animated.View,{style:{alignItems:"flex-end",transform:[{rotateZ:arrowAngle}]},__self:_this,__source:{fileName:_jsxFileName,lineNumber:186,columnNumber:15}},_react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:192,columnNumber:17}},_react.default.createElement(_reactNativeRemixIcon.default,{color:color!=null?color:theme.colors.font.grey700,name:name!=null?name:"ri-arrow-down-s-line",size:size!=null?size:24,__self:_this,__source:{fileName:_jsxFileName,lineNumber:193,columnNumber:19}}))))),position==="bottom"&&_react.default.createElement(AccordionBody,{isExpanded:isExpanded,__self:_this,__source:{fileName:_jsxFileName,lineNumber:204,columnNumber:11}},children));});exports.Accordion=Accordion;AccordionBody.propTypes={isExpanded:_propTypes.default.bool.isRequired,children:_propTypes.default.element};Accordion.propTypes={header:_propTypes.default.func,headerContainerProps:_propTypes.default.object,children:_propTypes.default.node,noBorder:_propTypes.default.bool,onStateChanged:_propTypes.default.func,iconProp:_propTypes.default.shape({name:_propTypes.default.string,Label:_propTypes.default.elementType,size:_propTypes.default.number,color:_propTypes.default.string}),position:_propTypes.default.string,shouldShowToggle:_propTypes.default.bool};var styles=_reactNative.StyleSheet.create({accordionContainer:{flexDirection:"row",alignItems:"center"}});Accordion.displayName="Accordion";

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 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={purple500:"#4557F8",purple700:"#342DF4",purple100:"#F2F4FF"};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":10,"3xs":11,"2xs":12,xs:13,s:14,m:15,l:16,xl:17,"2xl":18,"3xl":20,"4xl":22,"5xl":30}};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 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":10,"3xs":11,"2xs":12,xs:13,s:14,m:15,l:16,xl:17,"2xl":18,"3xl":20,"4xl":22,"5xl":30}};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.227",
+  "version": "0.0.229",
   "main": "lib/index.js",
   "author": "BigBinary",
   "license": "MIT",

package/src/components/Accordion.jsx

@@ -9,9 +9,26 @@ import { Animated, StyleSheet } from "react-native";
 
 import PropTypes from "prop-types";
 import Icon from "react-native-remix-icon";
-import { ThemeContext } from "styled-components/native";
+import styled, { ThemeContext } from "styled-components/native";
+import {
+  buttonStyle,
+  flexbox,
+  space,
+  border,
+  color,
+  layout,
+} from "styled-system";
 
-import { Container, Touchable } from "@components";
+import { Container } from "@components";
+
+const TouchableOpacity = styled.TouchableOpacity`
+  ${buttonStyle}
+  ${flexbox}
+  ${space}
+  ${border}
+  ${color}
+  ${layout}
+`;
 
 const AccordionBody = ({ isExpanded, children }) => {
   const animationController = useRef(
@@ -150,8 +167,7 @@ export const Accordion = React.forwardRef(
         {position === "top" && (
           <AccordionBody isExpanded={isExpanded}>{children}</AccordionBody>
         )}
-        <Touchable
-          rippleOpacity={0}
+        <TouchableOpacity
           style={styles.accordionContainer}
           onPress={() => {
             handleAnimation();
@@ -183,7 +199,7 @@ export const Accordion = React.forwardRef(
               </Animated.View>
             </Container>
           )}
-        </Touchable>
+        </TouchableOpacity>
         {position === "bottom" && (
           <AccordionBody isExpanded={isExpanded}>{children}</AccordionBody>
         )}

package/src/theme/index.js

@@ -34,9 +34,10 @@ const lightBlueVariants = {
 };
 
 const purpleVariants = {
+  purple100: "#F2F4FF",
+  purple200: "#ECF4FF",
   purple500: "#4557F8",
   purple700: "#342DF4",
-  purple100: "#F2F4FF",
 };
 
 const greenVariants = {