@servesall/atoms 1.1.16 → 1.1.19

package/dist/bundle.esm.js

@@ -1,7 +1,7 @@
 import React, { useEffect, useState, useRef, useCallback, useMemo } from 'react';
 import styled, { ThemeProvider, ThemeContext } from 'styled-components/native';
 import PropTypes from 'prop-types';
-import { Platform, KeyboardAvoidingView, Dimensions, SafeAreaView, FlatList as FlatList$1, View, StatusBar, Pressable, Keyboard, TouchableHighlight, Image } from 'react-native';
+import { Platform, KeyboardAvoidingView, Keyboard, Dimensions, SafeAreaView, FlatList as FlatList$1, View, StatusBar, Pressable, TouchableHighlight, Image } from 'react-native';
 import Animated, { useSharedValue, useAnimatedStyle, withTiming, Easing, withRepeat, runOnJS, withSequence, withDelay, useAnimatedGestureHandler, withSpring, interpolate, interpolateColor, Extrapolate } from 'react-native-reanimated';
 import { TouchableWithoutFeedback, PanGestureHandler } from 'react-native-gesture-handler';
 import LottieView from 'lottie-react-native';
@@ -544,126 +544,126 @@ SpanText.propTypes = {
   style: PropTypes.object
 };
 
-var _templateObject$m, _templateObject2$d, _templateObject3$6, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
+var _templateObject$m, _templateObject2$d, _templateObject3$6, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26;
 var DEFAULT_FLEX_DIRECTION = Platform.OS === "web" ? "column" : "column";
-var CenterElement = styled.View(_templateObject$m || (_templateObject$m = _taggedTemplateLiteral(["\n  align-items: center;\n  justify-content: center;\n  flex: 1;\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+var CenterElement = styled.View(_templateObject$m || (_templateObject$m = _taggedTemplateLiteral(["\n  align-items: center;\n  justify-content: center;\n  flex: 1;\n  flexdirection: ", ";\n  ", ";\n"])), function (props) {
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var CenterLeftElement = styled.View(_templateObject2$d || (_templateObject2$d = _taggedTemplateLiteral(["\n  align-items: ", ";\n  justify-content: ", ";\n  flex: 1;\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
-  return (props.flexDirection || DEFAULT_FLEX_DIRECTION) === "row" ? "center" : "flex-start";
+  return (props.direction || DEFAULT_FLEX_DIRECTION) === "row" ? "center" : "flex-start";
 }, function (props) {
-  return (props.flexDirection || DEFAULT_FLEX_DIRECTION) === "row" ? "flex-start" : "center";
+  return (props.direction || DEFAULT_FLEX_DIRECTION) === "row" ? "flex-start" : "center";
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var CenterRightElement = styled.View(_templateObject3$6 || (_templateObject3$6 = _taggedTemplateLiteral(["\n  align-items: ", ";\n  justify-content: ", ";\n  flex: 1;\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
-  return (props.flexDirection || DEFAULT_FLEX_DIRECTION) === "row" ? "center" : "flex-end";
+  return (props.direction || DEFAULT_FLEX_DIRECTION) === "row" ? "center" : "flex-end";
 }, function (props) {
-  return (props.flexDirection || DEFAULT_FLEX_DIRECTION) === "row" ? "flex-end" : "center";
+  return (props.direction || DEFAULT_FLEX_DIRECTION) === "row" ? "flex-end" : "center";
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var MarginElement = styled.View(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  margin: ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.margin;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var MarginHorizontalElement = styled.View(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  margin: 0 ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.margin;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var MarginVerticalElement = styled.View(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  margin: ", " 0;\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.margin;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var MarginBottomElement = styled.View(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin-bottom: ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.margin;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var MarginTopElement = styled.View(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  margin-top: ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.margin;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var MarginRightElement = styled.View(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  margin-right: ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.margin;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var MarginLeftElement = styled.View(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  margin-left: ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.margin;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var PaddingElement = styled.View(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  padding: ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.padding;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var PaddingHorizontalElement = styled.View(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  padding: 0 ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.padding;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var PaddingVerticalElement = styled.View(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  padding: ", " 0;\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.padding;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var PaddingTopElement = styled.View(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n  padding-top: ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.padding;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var PaddingBottomElement = styled.View(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n  padding-bottom: ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.padding;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var PaddingLeftElement = styled.View(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n  padding-left: ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.padding;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var PaddingRightElement = styled.View(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n  padding-right: ", ";\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
   return props.theme.padding;
 }, function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
@@ -671,25 +671,49 @@ var RowElement = styled.View(_templateObject18 || (_templateObject18 = _taggedTe
   return props.style;
 });
 var StretchElement = styled.View(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n  align-items: stretch;\n  align-self: stretch;\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
 var BoxElement = styled.View(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n  flex: 1;\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+  return props.direction || DEFAULT_FLEX_DIRECTION;
 }, function (props) {
   return props.style;
 });
-var FullScreenElement = styled.View(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  z-index: 11;\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+var BorderBottomElement = styled.View(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n  border-bottom-width: 2px;\n  border-color: ", ";\n  ", ";\n"])), function (props) {
+  return props.theme.color7;
 }, function (props) {
   return props.style;
 });
-var WebSmallWrapperElement = styled.View(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n  flex-direction: ", ";\n  width: 500px;\n  ", ";\n"])), function (props) {
-  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
+var BorderTopElement = styled.View(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n  border-top-width: 2px;\n  border-color: ", ";\n  ", ";\n"])), function (props) {
+  return props.theme.color7;
 }, function (props) {
   return props.style;
 });
+var BorderBoxElement = styled.View(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n  border-width: 2px;\n  border-color: ", ";\n  border-radius: ", ";\n  ", ";\n"])), function (props) {
+  return props.theme.color7;
+}, function (props) {
+  return props.theme.borderRadiusSmall;
+}, function (props) {
+  return props.style;
+});
+var FullScreenElement = styled.View(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  z-index: 11;\n  flex-direction: ", ";\n  ", ";\n"])), function (props) {
+  return props.direction || DEFAULT_FLEX_DIRECTION;
+}, function (props) {
+  return props.style;
+});
+var WebSmallWrapperElement = styled.View(_templateObject25 || (_templateObject25 = _taggedTemplateLiteral(["\n  flex-direction: ", ";\n  width: 500px;\n  ", ";\n"])), function (props) {
+  return props.direction || DEFAULT_FLEX_DIRECTION;
+}, function (props) {
+  return props.style;
+});
+var ImageWrapperElement = styled.View(_templateObject26 || (_templateObject26 = _taggedTemplateLiteral(["\n  border-radius: ", ";\n  background-color: ", ";\n  overflow: hidden;\n  ", ";\n"])), function (props) {
+  return props.theme.borderRadiusSmall;
+}, function (props) {
+  return props.theme.color7;
+}, function (props) {
+  return props.styles;
+});
 
 var Center = function Center(_ref) {
   var children = _ref.children,
@@ -698,7 +722,7 @@ var Center = function Center(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(CenterElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -709,7 +733,7 @@ var CenterLeft = function CenterLeft(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(CenterLeftElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -720,7 +744,7 @@ var CenterRight = function CenterRight(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(CenterRightElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -731,7 +755,7 @@ var Margin = function Margin(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(MarginElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -742,7 +766,7 @@ var MarginHorizontal = function MarginHorizontal(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(MarginHorizontalElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -753,7 +777,7 @@ var MarginVertical = function MarginVertical(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(MarginVerticalElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -764,7 +788,7 @@ var MarginBottom = function MarginBottom(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(MarginBottomElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -775,7 +799,7 @@ var MarginTop = function MarginTop(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(MarginTopElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -786,7 +810,7 @@ var MarginRight = function MarginRight(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(MarginRightElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -797,7 +821,7 @@ var MarginLeft = function MarginLeft(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(MarginLeftElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -808,7 +832,7 @@ var Padding = function Padding(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(PaddingElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -819,7 +843,7 @@ var PaddingHorizontal = function PaddingHorizontal(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(PaddingHorizontalElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -830,7 +854,7 @@ var PaddingVertical = function PaddingVertical(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(PaddingVerticalElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -841,7 +865,7 @@ var PaddingTop = function PaddingTop(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(PaddingTopElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -852,7 +876,7 @@ var PaddingBottom = function PaddingBottom(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(PaddingBottomElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -863,7 +887,7 @@ var PaddingLeft = function PaddingLeft(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(PaddingLeftElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -874,7 +898,7 @@ var PaddingRight = function PaddingRight(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(PaddingRightElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -893,7 +917,7 @@ var Stretch = function Stretch(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(StretchElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -912,7 +936,7 @@ var WebSmallWrapper = function WebSmallWrapper(_ref) {
       direction = _ref$direction === void 0 ? false : _ref$direction;
   return /*#__PURE__*/React.createElement(WebSmallWrapperElement, {
     style: style,
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -927,7 +951,7 @@ var Box = function Box(_ref) {
     style: _objectSpread2({
       backgroundColor: color
     }, style),
-    flexDirection: direction
+    direction: direction
   }, children);
 };
 
@@ -945,7 +969,40 @@ var RoundedTopBox = function RoundedTopBox(_ref) {
       borderTopRightRadius: 30,
       overflow: "hidden"
     }, style),
-    flexDirection: direction
+    direction: direction
+  }, children);
+};
+
+var BorderBottom = function BorderBottom(_ref) {
+  var children = _ref.children,
+      style = _ref.style;
+  return /*#__PURE__*/React.createElement(BorderBottomElement, {
+    style: _objectSpread2({}, style)
+  }, children);
+};
+
+var BorderTop = function BorderTop(_ref) {
+  var children = _ref.children,
+      style = _ref.style;
+  return /*#__PURE__*/React.createElement(BorderTopElement, {
+    style: _objectSpread2({}, style)
+  }, children);
+};
+
+var BorderBox = function BorderBox(_ref) {
+  var children = _ref.children,
+      style = _ref.style;
+  return /*#__PURE__*/React.createElement(BorderBoxElement, {
+    style: _objectSpread2({}, style)
+  }, children);
+};
+
+var ImageWrapper = function ImageWrapper(_ref) {
+  var children = _ref.children;
+      _ref.box;
+      var style = _ref.style;
+  return /*#__PURE__*/React.createElement(ImageWrapperElement, {
+    style: _objectSpread2({}, style)
   }, children);
 };
 
@@ -1356,7 +1413,9 @@ var Input = function Input(_ref) {
       _ref$isLeftBound = _ref.isLeftBound,
       isLeftBound = _ref$isLeftBound === void 0 ? false : _ref$isLeftBound,
       _ref$euro = _ref.euro,
-      euro = _ref$euro === void 0 ? false : _ref$euro;
+      euro = _ref$euro === void 0 ? false : _ref$euro,
+      _ref$focused = _ref.focused,
+      focused = _ref$focused === void 0 ? function () {} : _ref$focused;
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -1369,25 +1428,44 @@ var Input = function Input(_ref) {
       setTextValue = _useState4[1];
 
   var inputRef = useRef();
+  useEffect(function () {
+    focused();
+  }, [isFocused]);
   useEffect(function () {
     textChange(textValue);
   }, [textValue]);
+  useEffect(function () {
+    defaultValue && setTextValue(defaultValue);
+  }, [defaultValue]);
   useEffect(function () {
     var _inputRef$current;
 
     autoFocus && ((_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus());
   }, [autoFocus]);
+
+  function blurTextInput() {
+    var _inputRef$current2;
+
+    (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.blur();
+  }
+
+  useEffect(function () {
+    var keyboardDidHideSubscription = Keyboard.addListener("keyboardDidHide", blurTextInput);
+    return function () {
+      keyboardDidHideSubscription === null || keyboardDidHideSubscription === void 0 ? void 0 : keyboardDidHideSubscription.remove();
+    };
+  }, []);
   return /*#__PURE__*/React.createElement(KeyboardAvoidingView, {
     behavior: Platform.OS === "ios" ? "padding" : "height",
     keyboardVerticalOffset: keyboardVerticalOffset
   }, /*#__PURE__*/React.createElement(InputWrapper$1, {
     onPress: function onPress() {
-      var _inputRef$current2;
+      var _inputRef$current3;
 
       _onPress();
 
       editable && setIsFocused(true);
-      editable && ((_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.focus());
+      editable && ((_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.focus());
     }
   }, /*#__PURE__*/React.createElement(BorderWrapper$2, {
     isRightBound: isRightBound,
@@ -1424,7 +1502,8 @@ var Input = function Input(_ref) {
     editable: editable,
     active: isFocused,
     style: style,
-    returnKeyType: "done"
+    returnKeyType: "done",
+    onSubmitEditing: blurTextInput
   }))))));
 };
 
@@ -1692,7 +1771,15 @@ var TextBtn = function TextBtn(_ref) {
 var _templateObject$f, _templateObject2$6;
 styled.View(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral([""])));
 var ButtonStyle$4 = styled.Pressable(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteral(["\n  min-height: ", ";\n  width: 100%;\n  border-radius: ", ";\n  background-color: ", ";\n  ", ";\n"])), function (props) {
-  return props.size === "big" ? "60px" : "54px";
+  if (props.size === "big") {
+    return "60px";
+  } else if (props.size === "small") {
+    return "54px";
+  } else if (props.size === "xsmall") {
+    return "44px";
+  } else {
+    return "54px";
+  }
 }, function (props) {
   return props.smallBorder ? props.theme.borderRadiusSmall : props.theme.borderRadiusMedium;
 }, function (props) {
@@ -1749,7 +1836,15 @@ var RoundedBtn$1 = function RoundedBtn(_ref) {
 var _templateObject$e, _templateObject2$5;
 styled.View(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral([""])));
 var ButtonStyle$3 = styled.Pressable(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral(["\n  min-height: ", ";\n  border-radius: 50px;\n  background-color: ", ";\n  opacity: ", ";\n  ", ";\n"])), function (props) {
-  return props.size === "big" ? "70px" : "56px";
+  if (props.size === "big") {
+    return "70px";
+  } else if (props.size === "small") {
+    return "56px";
+  } else if (props.size === "xsmall") {
+    return "40px";
+  } else {
+    return "70px";
+  }
 }, function (props) {
   return props.color;
 }, function (props) {
@@ -51962,12 +52057,12 @@ function Switch(_ref2) {
 
 var _templateObject$1, _templateObject2$1, _templateObject3;
 var Wrapper$1 = styled.View(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n  flex: 1;\n"])));
-var RoundWrapper = styled(Animated.View)(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n  width: 100%;\n  border-radius: ", ";\n  overflow: hidden;\n  padding: 8px;\n  border-width: 2px;\n  ", ";\n"])), function (props) {
+styled(Animated.View)(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n  width: 100%;\n  border-radius: ", ";\n  overflow: hidden;\n  padding: 8px;\n  border-width: 2px;\n  ", ";\n"])), function (props) {
   return props.theme.borderRadius;
 }, function (props) {
   return props.style;
 });
-var RoundSlider = styled.View(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: 62px;\n  height: 52px;\n  background-color: ", ";\n  border-radius: ", ";\n  border-width: 2px;\n  ", ";\n"])), function (props) {
+var RoundSlider = styled(Animated.View)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: 62px;\n  height: 52px;\n  background-color: ", ";\n  border-radius: ", ";\n  border-width: 2px;\n  ", ";\n"])), function (props) {
   return props.theme.color1;
 }, function (props) {
   return props.theme.borderRadiusMedium;
@@ -52063,8 +52158,14 @@ var SwipeButton = function SwipeButton(_ref) {
   });
   return /*#__PURE__*/React.createElement(Wrapper$1, {
     onLayout: onLayout
-  }, /*#__PURE__*/React.createElement(RoundWrapper, {
-    style: [animatedBorder]
+  }, /*#__PURE__*/React.createElement(Animated.View, {
+    style: [animatedBorder, {
+      width: "100%",
+      borderRadius: parseInt(theme.borderRadiusMedium, 10),
+      overflow: "hidden",
+      padding: 8,
+      borderWidth: 2
+    }]
   }, /*#__PURE__*/React.createElement(Animated.View, {
     style: [colorWave, {
       position: "absolute",
@@ -54059,4 +54160,4 @@ function NewCustomer(_ref2) {
   }));
 }
 
-export { AnimatedButton$1 as AnimatedButton, AnimatedPlaceholder, AnimatedRoundedButton, BottomNavBar, Box, Center, CenterLeft, CenterRight, NewCustomer as CountryList, Error, ErrorText, AnimatedButton as FeedbackButton, FlatList, RoundBtn$1 as FloatingBtn, FullScreen, H1Text as H1, H2Text as H2, H3Text as H3, H4Text as H4, H5Text as H5, Header, Icon, Input$1 as Input, Input as InputNormal, InputOtp, InputPhone, Loader, Margin, MarginBottom, MarginHorizontal, MarginLeft, MarginRight, MarginTop, MarginVertical, pText as P, Padding, PaddingBottom, PaddingHorizontal, PaddingLeft, PaddingRight, PaddingTop, PaddingVertical, RoundBtn$3 as RoundBtn, RoundedBtn$1 as RoundedBtn, RoundedTopBox, Row, SpanText as Span, Stretch, Success, SwipeButton, Switch, TextBtn, ThemeWrapper, WebSmallWrapper, useThemeContext };
+export { AnimatedButton$1 as AnimatedButton, AnimatedPlaceholder, AnimatedRoundedButton, BorderBottom, BorderBox, BorderTop, BottomNavBar, Box, Center, CenterLeft, CenterRight, NewCustomer as CountryList, Error, ErrorText, AnimatedButton as FeedbackButton, FlatList, RoundBtn$1 as FloatingBtn, FullScreen, H1Text as H1, H2Text as H2, H3Text as H3, H4Text as H4, H5Text as H5, Header, Icon, ImageWrapper, Input$1 as Input, Input as InputNormal, InputOtp, InputPhone, Loader, Margin, MarginBottom, MarginHorizontal, MarginLeft, MarginRight, MarginTop, MarginVertical, pText as P, Padding, PaddingBottom, PaddingHorizontal, PaddingLeft, PaddingRight, PaddingTop, PaddingVertical, RoundBtn$3 as RoundBtn, RoundedBtn$1 as RoundedBtn, RoundedTopBox, Row, SpanText as Span, Stretch, Success, SwipeButton, Switch, TextBtn, ThemeWrapper, WebSmallWrapper, useThemeContext };