@hero-design/rn 8.3.4 → 8.5.0-alpha.0

package/lib/index.js

@@ -8,7 +8,6 @@ var reactNativeVectorIcons = require('react-native-vector-icons');
 var reactNativeSafeAreaContext = require('react-native-safe-area-context');
 var DateTimePicker = require('@react-native-community/datetimepicker');
 var RnSlider = require('@react-native-community/slider');
-var reactNativeGestureHandler = require('react-native-gesture-handler');
 var PagerView = require('react-native-pager-view');
 var events = require('events');
 var reactNativeWebview = require('react-native-webview');
@@ -5636,7 +5635,7 @@ var index$a = components.reduce(function (acc, comp) {
   });
 }, styled);
 
-var StyledWrapper$b = index$a(reactNative.Animated.View)(function () {
+var StyledWrapper$c = index$a(reactNative.Animated.View)(function () {
   return {
     margin: 0,
     padding: 0,
@@ -5710,7 +5709,7 @@ var Collapse = function Collapse(_ref) {
     var height = _ref2.height;
     setContentHeight(height);
   }, []);
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$b, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$c, {
     style: {
       height: collapseAnim
     },
@@ -5723,7 +5722,7 @@ var Collapse = function Collapse(_ref) {
   }, children)));
 };
 
-var StyledWrapper$a = index$a(reactNative.View)(function () {
+var StyledWrapper$b = index$a(reactNative.View)(function () {
   return {};
 });
 var StyledItemWrapper = index$a(reactNative.View)(function (_ref) {
@@ -5776,7 +5775,7 @@ var StyledText$3 = index$a(reactNative.Text)(function (_ref) {
   });
 });
 
-var _excluded$m = ["children", "fontSize", "fontWeight", "intent", "typeface"];
+var _excluded$l = ["children", "fontSize", "fontWeight", "intent", "typeface"];
 var Text = function Text(_ref) {
   var children = _ref.children,
     _ref$fontSize = _ref.fontSize,
@@ -5787,7 +5786,7 @@ var Text = function Text(_ref) {
     intent = _ref$intent === void 0 ? 'body' : _ref$intent,
     _ref$typeface = _ref.typeface,
     typeface = _ref$typeface === void 0 ? 'neutral' : _ref$typeface,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$m);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$l);
   return /*#__PURE__*/React__default["default"].createElement(StyledText$3, _extends$1({}, nativeProps, {
     themeFontSize: fontSize,
     themeFontWeight: fontWeight,
@@ -6266,10 +6265,10 @@ var StyledHeroIcon = index$a(HeroIcon)(function (_ref) {
   };
 });
 
-var _excluded$l = ["style"];
+var _excluded$k = ["style"];
 var AnimatedIcon = function AnimatedIcon(_ref) {
   var style = _ref.style,
-    otherProps = _objectWithoutProperties(_ref, _excluded$l);
+    otherProps = _objectWithoutProperties(_ref, _excluded$k);
   var rotateAnimation = React.useRef(new reactNative.Animated.Value(0));
   React.useEffect(function () {
     var animation = reactNative.Animated.loop(reactNative.Animated.timing(rotateAnimation.current, {
@@ -6375,7 +6374,7 @@ var AccordionItem = function AccordionItem(_ref) {
   }, content));
 };
 
-var _excluded$k = ["key"];
+var _excluded$j = ["key"];
 var Accordion = function Accordion(_ref) {
   var items = _ref.items,
     activeItemKey = _ref.activeItemKey,
@@ -6391,12 +6390,12 @@ var Accordion = function Accordion(_ref) {
     _usePropsOrInternalSt2 = _slicedToArray(_usePropsOrInternalSt, 2),
     _activeItemKey = _usePropsOrInternalSt2[0],
     _onItemPress = _usePropsOrInternalSt2[1];
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$a, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$b, {
     style: style,
     testID: testID
   }, items.map(function (_ref2, index) {
     var key = _ref2.key,
-      props = _objectWithoutProperties(_ref2, _excluded$k);
+      props = _objectWithoutProperties(_ref2, _excluded$j);
     var open = _activeItemKey === key;
     return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
       key: key
@@ -6578,7 +6577,7 @@ var Attachment = function Attachment(_ref) {
   })) : null);
 };
 
-var StyledWrapper$9 = index$a(reactNative.TouchableOpacity)(function (_ref) {
+var StyledWrapper$a = index$a(reactNative.TouchableOpacity)(function (_ref) {
   var themeSize = _ref.themeSize,
     themeIntent = _ref.themeIntent,
     theme = _ref.theme;
@@ -6633,7 +6632,7 @@ var Avatar = function Avatar(_ref) {
     hasImageError = _useState2[0],
     setHasImageError = _useState2[1];
   if (title === undefined && source === undefined) return null;
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$9, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$a, {
     testID: testID,
     onPress: onPress,
     disabled: onPress === undefined,
@@ -6657,7 +6656,7 @@ var Avatar = function Avatar(_ref) {
 };
 
 var VISIBLE_RATIO = 0.7;
-var StyledWrapper$8 = index$a(reactNative.View)(function (_ref) {
+var StyledWrapper$9 = index$a(reactNative.View)(function (_ref) {
   var theme = _ref.theme,
     themeSize = _ref.themeSize,
     themeAvatarCount = _ref.themeAvatarCount;
@@ -6719,7 +6718,7 @@ var AvatarStack = function AvatarStack(_ref) {
     });
     avatars.push(remainingAvatar);
   }
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$8, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$9, {
     themeSize: size,
     themeAvatarCount: avatars.length,
     style: style,
@@ -6778,7 +6777,7 @@ var StyledStatus = index$a(reactNative.Animated.View)(function (_ref3) {
   };
 });
 
-var _excluded$j = ["children", "visible", "intent", "style", "testID"];
+var _excluded$i = ["children", "visible", "intent", "style", "testID"];
 var Status = function Status(_ref) {
   var children = _ref.children,
     _ref$visible = _ref.visible,
@@ -6787,7 +6786,7 @@ var Status = function Status(_ref) {
     intent = _ref$intent === void 0 ? 'danger' : _ref$intent,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$j);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$i);
   var _React$useRef = React__default["default"].useRef(new reactNative.Animated.Value(visible ? 1 : 0)),
     opacity = _React$useRef.current;
   var isFirstRendering = React__default["default"].useRef(true);
@@ -6820,7 +6819,7 @@ var Status = function Status(_ref) {
   }));
 };
 
-var _excluded$i = ["content", "visible", "max", "intent", "style", "testID"];
+var _excluded$h = ["content", "visible", "max", "intent", "style", "testID"];
 var DEFAULT_MAX_NUMBER = 99;
 var getPaddingState = function getPaddingState(content) {
   return content.length > 1 ? 'wideContent' : 'narrowContent';
@@ -6835,7 +6834,7 @@ var Badge = function Badge(_ref) {
     intent = _ref$intent === void 0 ? 'danger' : _ref$intent,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$i);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$h);
   var _React$useRef = React__default["default"].useRef(new reactNative.Animated.Value(visible ? 1 : 0)),
     opacity = _React$useRef.current;
   var isFirstRendering = React__default["default"].useRef(true);
@@ -6939,7 +6938,7 @@ function omit(keys, obj) {
   return result;
 }
 
-var _excluded$h = ["onTabPress", "renderActiveTabOnly", "selectedTabKey", "tabs"];
+var _excluded$g = ["onTabPress", "renderActiveTabOnly", "selectedTabKey", "tabs"];
 var getInactiveIcon = function getInactiveIcon(icon) {
   var inactiveIcon = "".concat(icon, "-outlined");
   return isHeroIcon(inactiveIcon) ? inactiveIcon : icon;
@@ -6950,7 +6949,7 @@ var BottomNavigation = function BottomNavigation(_ref) {
     renderActiveTabOnly = _ref$renderActiveTabO === void 0 ? false : _ref$renderActiveTabO,
     selectedTabKey = _ref.selectedTabKey,
     tabs = _ref.tabs,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$h);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$g);
   var insets = reactNativeSafeAreaContext.useSafeAreaInsets();
   /**
    * List of loaded tabs, tabs will be loaded when navigated to.
@@ -7037,13 +7036,13 @@ var StyledDivider = index$a(reactNative.View)(function (_ref) {
   }, horizontalMargin), verticalMargin);
 });
 
-var _excluded$g = ["marginHorizontal", "marginVertical", "style", "testID"];
+var _excluded$f = ["marginHorizontal", "marginVertical", "style", "testID"];
 var Divider = function Divider(_ref) {
   var marginHorizontal = _ref.marginHorizontal,
     marginVertical = _ref.marginVertical,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$g);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$f);
   return /*#__PURE__*/React__default["default"].createElement(StyledDivider, _extends$1({}, nativeProps, {
     themeMarginHorizontal: marginHorizontal,
     themeMarginVertical: marginVertical,
@@ -7054,7 +7053,7 @@ var Divider = function Divider(_ref) {
 
 var AnimatedPressable$1 = reactNative.Animated.createAnimatedComponent(reactNative.Pressable);
 var AnimatedSafeAreaView = reactNative.Animated.createAnimatedComponent(reactNative.SafeAreaView);
-var StyledWrapper$7 = index$a(reactNative.View)(_objectSpread2(_objectSpread2({}, reactNative.StyleSheet.absoluteFillObject), {}, {
+var StyledWrapper$8 = index$a(reactNative.View)(_objectSpread2(_objectSpread2({}, reactNative.StyleSheet.absoluteFillObject), {}, {
   flexDirection: 'column-reverse'
 }));
 var StyledKeyboardAvoidingView = index$a(reactNative.KeyboardAvoidingView)(function () {
@@ -7173,7 +7172,7 @@ var StyledLoadingDot = index$a(reactNative.View)(function (_ref2) {
   }, themeStyling());
 });
 
-var _excluded$f = ["count", "size", "testID", "themeVariant"];
+var _excluded$e = ["count", "size", "testID", "themeVariant"];
 var AnimatedLoadingIndicatorWrapper = reactNative.Animated.createAnimatedComponent(StyledLoadingIndicatorWrapper);
 var AnimatedLoadingDot = reactNative.Animated.createAnimatedComponent(StyledLoadingDot);
 var renderDotComponent = function renderDotComponent(_ref) {
@@ -7205,7 +7204,7 @@ var LoadingIndicator = function LoadingIndicator(_ref2) {
     size = _ref2$size === void 0 ? 12 : _ref2$size,
     testID = _ref2.testID,
     themeVariant = _ref2.themeVariant,
-    nativeProps = _objectWithoutProperties(_ref2, _excluded$f);
+    nativeProps = _objectWithoutProperties(_ref2, _excluded$e);
   var progressAnimation = React.useRef(new reactNative.Animated.Value(0));
   React.useEffect(function () {
     var animation = reactNative.Animated.loop(reactNative.Animated.timing(progressAnimation.current, {
@@ -7601,11 +7600,11 @@ var Header = function Header(_ref) {
   })) : null), showDivider ? /*#__PURE__*/React__default["default"].createElement(Divider, null) : null);
 };
 
-var _excluded$e = ["scrollEventThrottle"];
+var _excluded$d = ["scrollEventThrottle"];
 var BottomSheetScrollView = function BottomSheetScrollView(_ref) {
   var _ref$scrollEventThrot = _ref.scrollEventThrottle,
     scrollEventThrottle = _ref$scrollEventThrot === void 0 ? 100 : _ref$scrollEventThrot,
-    props = _objectWithoutProperties(_ref, _excluded$e);
+    props = _objectWithoutProperties(_ref, _excluded$d);
   var _useContext = React.useContext(BottomSheetContext),
     setInternalShowDivider = _useContext.setInternalShowDivider;
   var onScrollBeginDrag = React.useCallback(function (e) {
@@ -7713,7 +7712,7 @@ var BottomSheet = function BottomSheet(_ref) {
     transparent: true,
     testID: testID,
     onShow: onOpen
-  }, /*#__PURE__*/React__default["default"].createElement(StyledWrapper$7, {
+  }, /*#__PURE__*/React__default["default"].createElement(StyledWrapper$8, {
     pointerEvents: "box-none"
   }, /*#__PURE__*/React__default["default"].createElement(StyledKeyboardAvoidingView, _extends$1({
     behavior: reactNative.Platform.OS === 'ios' ? 'padding' : 'height'
@@ -7920,7 +7919,7 @@ var borderWidths = {
 var config = _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({}, colors), space), radii), borderWidths);
 var flexPropsKey = ['alignContent', 'alignItems', 'alignSelf', 'display', 'flex', 'flexBasis', 'flexDirection', 'flexGrow', 'flexShrink', 'flexWrap', 'justifyContent'];
 
-var _excluded$d = ["theme"];
+var _excluded$c = ["theme"];
 var getThemeValue = function getThemeValue(theme, key, props) {
   var propConfig = config[key];
   var propValue = props[key];
@@ -7947,18 +7946,18 @@ var mapStylePropToThemeValue = function mapStylePropToThemeValue(theme, props) {
 var configKeys = Object.keys(config);
 var StyledBox = index$a(reactNative.View)(function (_ref5) {
   var theme = _ref5.theme,
-    otherProps = _objectWithoutProperties(_ref5, _excluded$d);
+    otherProps = _objectWithoutProperties(_ref5, _excluded$c);
   var styleProps = pick(configKeys, otherProps);
   var flexProps = pick(_toConsumableArray(flexPropsKey), otherProps);
   return _objectSpread2(_objectSpread2({}, mapStylePropToThemeValue(theme, styleProps)), flexProps);
 });
 
-var _excluded$c = ["children", "style", "testID"];
+var _excluded$b = ["children", "style", "testID"];
 var Box = function Box(_ref) {
   var children = _ref.children,
     style = _ref.style,
     testID = _ref.testID,
-    otherProps = _objectWithoutProperties(_ref, _excluded$c);
+    otherProps = _objectWithoutProperties(_ref, _excluded$b);
   return /*#__PURE__*/React__default["default"].createElement(StyledBox, _extends$1({}, otherProps, {
     style: style,
     testID: testID
@@ -10569,7 +10568,7 @@ var CarouselPaginator = function CarouselPaginator(_ref) {
   }));
 };
 
-var _excluded$b = ["rounded", "size", "testID", "style"];
+var _excluded$a = ["rounded", "size", "testID", "style"];
 var Image = function Image(_ref) {
   var _ref$rounded = _ref.rounded,
     rounded = _ref$rounded === void 0 ? false : _ref$rounded,
@@ -10577,7 +10576,7 @@ var Image = function Image(_ref) {
     size = _ref$size === void 0 ? '6xlarge' : _ref$size,
     testID = _ref.testID,
     style = _ref.style,
-    imageNativeProps = _objectWithoutProperties(_ref, _excluded$b);
+    imageNativeProps = _objectWithoutProperties(_ref, _excluded$a);
   var theme = useTheme();
   var imageSize = theme.__hd__.image.sizes[size];
   return /*#__PURE__*/React__default["default"].createElement(reactNative.Image, _extends$1({
@@ -10662,7 +10661,7 @@ var CarouselItem = function CarouselItem(_ref) {
   }, content, /*#__PURE__*/React__default["default"].createElement(StyledCarouselHeading, null, heading), body ? /*#__PURE__*/React__default["default"].createElement(Typography.Text, null, body) : null));
 };
 
-var _excluded$a = ["items", "onItemIndexChange", "renderActions", "selectedItemIndex", "style"];
+var _excluded$9 = ["items", "onItemIndexChange", "renderActions", "selectedItemIndex", "style"];
 function useStateFromProp(initialValue) {
   var _useState = React.useState(initialValue),
     _useState2 = _slicedToArray(_useState, 2),
@@ -10680,7 +10679,7 @@ var Carousel = function Carousel(_ref) {
     _ref$selectedItemInde = _ref.selectedItemIndex,
     selectedItemIndex = _ref$selectedItemInde === void 0 ? 0 : _ref$selectedItemInde,
     style = _ref.style,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$a);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$9);
   var carouselRef = React.useRef(null);
   var _useStateFromProp = useStateFromProp(selectedItemIndex),
     _useStateFromProp2 = _slicedToArray(_useStateFromProp, 2),
@@ -10780,12 +10779,12 @@ var Indicator = index$a(reactNative.View)(function (_ref2) {
   };
 });
 
-var _excluded$9 = ["intent", "children"];
+var _excluded$8 = ["intent", "children"];
 var DataCard = function DataCard(_ref) {
   var _ref$intent = _ref.intent,
     intent = _ref$intent === void 0 ? 'info' : _ref$intent,
     children = _ref.children,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$9);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$8);
   return /*#__PURE__*/React__default["default"].createElement(StyledDataCard, nativeProps, /*#__PURE__*/React__default["default"].createElement(Indicator, {
     themeIntent: intent,
     testID: "data-card-indicator"
@@ -10803,11 +10802,11 @@ var StyledCard = index$a(reactNative.View)(function (_ref) {
   });
 });
 
-var _excluded$8 = ["intent", "children"];
+var _excluded$7 = ["intent", "children"];
 var Card = function Card(_ref) {
   var intent = _ref.intent,
     children = _ref.children,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$8);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$7);
   return /*#__PURE__*/React__default["default"].createElement(StyledCard, _extends$1({}, nativeProps, {
     themeIntent: intent
   }), children);
@@ -10816,7 +10815,7 @@ var index$8 = Object.assign(Card, {
   Data: DataCard
 });
 
-var StyledWrapper$6 = index$a(reactNative.TouchableOpacity)(function (_ref) {
+var StyledWrapper$7 = index$a(reactNative.TouchableOpacity)(function (_ref) {
   var theme = _ref.theme,
     themeWithBorder = _ref.themeWithBorder,
     themeDisabled = _ref.themeDisabled;
@@ -10873,7 +10872,7 @@ var Checkbox = function Checkbox(_ref) {
     onPress = _ref.onPress,
     style = _ref.style,
     testID = _ref.testID;
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$6, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$7, {
     onPress: onPress,
     disabled: disabled,
     themeDisabled: disabled,
@@ -11041,7 +11040,7 @@ var StyledErrorAndMaxLengthContainer = index$a(reactNative.View)(function () {
   };
 });
 
-var _excluded$7 = ["label", "prefix", "suffix", "style", "textStyle", "testID", "accessibilityLabelledBy", "error", "required", "editable", "disabled", "loading", "maxLength", "helpText", "value", "defaultValue", "renderInputValue"];
+var _excluded$6 = ["label", "prefix", "suffix", "style", "textStyle", "testID", "accessibilityLabelledBy", "error", "required", "editable", "disabled", "loading", "maxLength", "helpText", "value", "defaultValue", "renderInputValue"];
 var getVariant$1 = function getVariant(_ref) {
   var disabled = _ref.disabled,
     error = _ref.error,
@@ -11087,7 +11086,7 @@ var TextInput = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {
     value = _ref2.value,
     defaultValue = _ref2.defaultValue,
     renderInputValue = _ref2.renderInputValue,
-    nativeProps = _objectWithoutProperties(_ref2, _excluded$7);
+    nativeProps = _objectWithoutProperties(_ref2, _excluded$6);
   var displayText = (_ref3 = value !== undefined ? value : defaultValue) !== null && _ref3 !== void 0 ? _ref3 : '';
   var isEmptyValue = displayText.length === 0;
   var actualSuffix = loading ? 'loading' : suffix;
@@ -11673,7 +11672,7 @@ var index$7 = Object.assign(Drawer, {
   Dragable: DragableDrawer
 });
 
-var StyledWrapper$5 = index$a(reactNative.View)(function (_ref) {
+var StyledWrapper$6 = index$a(reactNative.View)(function (_ref) {
   var theme = _ref.theme;
   return {
     display: 'flex',
@@ -11715,7 +11714,7 @@ var Empty = function Empty(_ref) {
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'light' : _ref$variant;
   var theme = useTheme();
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$5, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$6, {
     style: style,
     testID: testID
   }, image !== undefined && /*#__PURE__*/React__default["default"].cloneElement(image, _objectSpread2(_objectSpread2({}, image.props), {}, {
@@ -11765,11 +11764,11 @@ var StyledFABText = index$a(reactNative.Text)(function (_ref3) {
   };
 });
 
-var _excluded$6 = ["active"];
+var _excluded$5 = ["active"];
 var AnimatedIcons = reactNative.Animated.createAnimatedComponent(StyledFABIcon);
 var AnimatedFABIcon = function AnimatedFABIcon(_ref) {
   var active = _ref.active,
-    iconProps = _objectWithoutProperties(_ref, _excluded$6);
+    iconProps = _objectWithoutProperties(_ref, _excluded$5);
   var rotateAnimation = React.useRef(new reactNative.Animated.Value(active ? 1 : 0));
   React.useEffect(function () {
     var animation = reactNative.Animated.timing(rotateAnimation.current, {
@@ -12205,7 +12204,7 @@ var List = {
   BasicItem: BasicListItem
 };
 
-var StyledWrapper$4 = index$a(reactNative.View)(function () {
+var StyledWrapper$5 = index$a(reactNative.View)(function () {
   return {
     alignContent: 'flex-start'
   };
@@ -12383,7 +12382,7 @@ function PinInput(_ref2) {
       reactNative.InteractionManager.runAfterInteractions(focus);
     }
   }, [inputRef]);
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$4, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$5, {
     style: style,
     testID: testID
   }, /*#__PURE__*/React__default["default"].createElement(StyledPinWrapper, null, _toConsumableArray(Array(length).keys()).map(function (index) {
@@ -12500,7 +12499,7 @@ var StyledStrokeEnd = index$a(reactNative.View)(function (_ref6) {
   };
 });
 
-var _excluded$5 = ["value", "renderValue", "intent", "style", "testID"];
+var _excluded$4 = ["value", "renderValue", "intent", "style", "testID"];
 var HalfCircle = function HalfCircle(_ref) {
   var type = _ref.type,
     themeIntent = _ref.themeIntent;
@@ -12521,7 +12520,7 @@ var ProgressCircle = function ProgressCircle(_ref2) {
     intent = _ref2$intent === void 0 ? 'primary' : _ref2$intent,
     style = _ref2.style,
     testID = _ref2.testID,
-    nativeProps = _objectWithoutProperties(_ref2, _excluded$5);
+    nativeProps = _objectWithoutProperties(_ref2, _excluded$4);
   var theme = useTheme$1();
   var radius = theme.__hd__.progress.sizes.circleDiameter / 2;
   var progressAnimatedValue = React.useRef(new reactNative.Animated.Value(0));
@@ -12618,7 +12617,7 @@ var ProgressCircle = function ProgressCircle(_ref2) {
   }, renderValue(value)))));
 };
 
-var StyledWrapper$3 = index$a(reactNative.View)(function (_ref) {
+var StyledWrapper$4 = index$a(reactNative.View)(function (_ref) {
   var theme = _ref.theme,
     themeIntent = _ref.themeIntent;
   return {
@@ -12638,14 +12637,14 @@ var StyledInner = index$a(reactNative.Animated.View)(function (_ref2) {
   };
 });
 
-var _excluded$4 = ["value", "intent", "style", "testID"];
+var _excluded$3 = ["value", "intent", "style", "testID"];
 var ProgressBar = function ProgressBar(_ref) {
   var value = _ref.value,
     _ref$intent = _ref.intent,
     intent = _ref$intent === void 0 ? 'primary' : _ref$intent,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$4);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$3);
   var _useState = React.useState(0),
     _useState2 = _slicedToArray(_useState, 2),
     width = _useState2[0],
@@ -12671,7 +12670,7 @@ var ProgressBar = function ProgressBar(_ref) {
     outputRange: [999, 0],
     extrapolate: 'clamp'
   });
-  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$3, _extends$1({}, nativeProps, {
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$4, _extends$1({}, nativeProps, {
     testID: testID,
     style: style,
     themeIntent: intent
@@ -12836,14 +12835,14 @@ var AnimatedSpinner = function AnimatedSpinner(_ref) {
   }, dotProps))));
 };
 
-var _excluded$3 = ["testID", "size", "intent"];
+var _excluded$2 = ["testID", "size", "intent"];
 var Spinner = function Spinner(_ref) {
   var testID = _ref.testID,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 'medium' : _ref$size,
     _ref$intent = _ref.intent,
     intent = _ref$intent === void 0 ? 'primary' : _ref$intent,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$3);
+    nativeProps = _objectWithoutProperties(_ref, _excluded$2);
   return /*#__PURE__*/React__default["default"].createElement(StyledView$1, nativeProps, /*#__PURE__*/React__default["default"].createElement(StyledSpinnerContainer, {
     testID: testID
   }, /*#__PURE__*/React__default["default"].createElement(AnimatedSpinner, {
@@ -12852,12 +12851,60 @@ var Spinner = function Spinner(_ref) {
   })));
 };
 
+var Buttons = function Buttons(_ref) {
+  var _buttons$length;
+  var buttons = _ref.buttons,
+    isLeftButtons = _ref.isLeftButtons,
+    leftButtonContainerStyle = _ref.leftButtonContainerStyle,
+    rightButtonContainerStyle = _ref.rightButtonContainerStyle,
+    panAnimatedValue = _ref.panAnimatedValue,
+    width = _ref.width,
+    canSwipeLeft = _ref.canSwipeLeft,
+    canSwipeRight = _ref.canSwipeRight,
+    buttonWidth = _ref.buttonWidth;
+  var count = (_buttons$length = buttons === null || buttons === void 0 ? void 0 : buttons.length) !== null && _buttons$length !== void 0 ? _buttons$length : 0;
+  var leftEnd = canSwipeLeft ? -width : 0;
+  var rightEnd = canSwipeRight ? width : 0;
+  var inputRange = isLeftButtons ? [0, rightEnd] : [leftEnd, 0];
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, buttons === null || buttons === void 0 ? void 0 : buttons.map(function (buttonContent, index) {
+    var outputMultiplier = -index / count;
+    var outputRange = isLeftButtons ? [0, rightEnd * outputMultiplier] : [leftEnd * outputMultiplier, 0];
+    var transform = [{
+      translateX: panAnimatedValue.x.interpolate({
+        inputRange: inputRange,
+        outputRange: outputRange,
+        extrapolate: 'clamp'
+      })
+    }];
+    var buttonStyle = [reactNative.StyleSheet.absoluteFill, {
+      width: buttonWidth,
+      transform: transform
+    }, isLeftButtons ? leftButtonContainerStyle : rightButtonContainerStyle];
+    return /*#__PURE__*/React__default["default"].createElement(reactNative.Animated.View, {
+      key: index,
+      style: buttonStyle
+    }, buttonContent);
+  }));
+};
+
 var StyledRectButton = index$a(reactNative.TouchableOpacity)(function (_ref) {
   var theme = _ref.theme,
     themeIntent = _ref.themeIntent;
   return {
     flex: 1,
-    backgroundColor: theme.__hd__.swipeable.colors[themeIntent]
+    backgroundColor: theme.__hd__.swipeable.colors[themeIntent],
+    alignItems: 'center',
+    justifyContent: 'center'
+  };
+});
+var StyledWrapper$3 = index$a(reactNative.View)(function () {
+  return {
+    flexDirection: 'row'
+  };
+});
+var StyledContent = index$a(reactNative.Animated.View)(function () {
+  return {
+    flex: 1
   };
 });
 
@@ -12866,86 +12913,381 @@ var SwipeableAction = function SwipeableAction(_ref) {
     intent = _ref$intent === void 0 ? 'primary' : _ref$intent,
     onPress = _ref.onPress,
     style = _ref.style,
-    children = _ref.children,
-    testID = _ref.testID;
+    testID = _ref.testID,
+    label = _ref.label,
+    icon = _ref.icon;
   return /*#__PURE__*/React__default["default"].createElement(StyledRectButton, {
     onPress: onPress,
     themeIntent: intent,
     style: style,
     testID: testID
-  }, children);
+  }, /*#__PURE__*/React__default["default"].createElement(Icon, {
+    icon: icon,
+    size: "xsmall"
+  }), /*#__PURE__*/React__default["default"].createElement(Typography.Text, {
+    fontSize: "small"
+  }, label));
+};
+
+var _excluded$1 = ["children", "leftActions", "leftContent", "rightActions", "rightContent", "style", "leftActionsWidth", "leftButtonWidth", "onSwipeLeftStart", "onSwipeLeftEnd", "rightActionsWidth", "rightButtonWidth", "onSwipeRightStart", "onSwipeRightEnd", "swipeState", "onStateChange"];
+var swipeStartMinDistance = 15;
+var getReleaseAnimationConfig = function getReleaseAnimationConfig(swipeState, props) {
+  var totalLeftButtonsWidth = props.totalLeftButtonsWidth,
+    totalRightButtonsWidth = props.totalRightButtonsWidth;
+  var swipeReleaseAnimationConfig = {
+    toValue: {
+      x: 0,
+      y: 0
+    },
+    duration: 100,
+    easing: reactNative.Easing.elastic(0.5),
+    useNativeDriver: true
+  };
+  if (swipeState === 'leftOpen') {
+    return _objectSpread2(_objectSpread2({}, swipeReleaseAnimationConfig), {}, {
+      toValue: {
+        x: totalLeftButtonsWidth,
+        y: 0
+      }
+    });
+  }
+  if (swipeState === 'rightOpen') {
+    return _objectSpread2(_objectSpread2({}, swipeReleaseAnimationConfig), {}, {
+      toValue: {
+        x: totalRightButtonsWidth * -1,
+        y: 0
+      }
+    });
+  }
+  return swipeReleaseAnimationConfig;
 };
-
-var _excluded$2 = ["children", "state", "onStateChange", "leftActions", "leftActionsWidth", "rightActions", "rightActionsWidth"];
-var renderActions = function renderActions(actions, width, progress, direction) {
-  var trans = progress.interpolate({
-    inputRange: [0, 1],
-    outputRange: direction === 'left' ? [-width, 0] : [width, 0],
-    extrapolate: 'clamp'
+var getPos = function getPos(_ref) {
+  var swipeState = _ref.swipeState,
+    totalLeftButtonsWidth = _ref.totalLeftButtonsWidth,
+    totalRightButtonsWidth = _ref.totalRightButtonsWidth;
+  if (swipeState === 'leftOpen') {
+    return {
+      x: totalLeftButtonsWidth,
+      y: 0
+    };
+  }
+  if (swipeState === 'rightOpen') {
+    return {
+      x: totalRightButtonsWidth * -1,
+      y: 0
+    };
+  }
+  return {
+    x: 0,
+    y: 0
+  };
+};
+var Swipeable = function Swipeable(_ref2) {
+  var children = _ref2.children,
+    _ref2$leftActions = _ref2.leftActions,
+    leftActions = _ref2$leftActions === void 0 ? [] : _ref2$leftActions,
+    leftContent = _ref2.leftContent,
+    _ref2$rightActions = _ref2.rightActions,
+    rightActions = _ref2$rightActions === void 0 ? [] : _ref2$rightActions,
+    rightContent = _ref2.rightContent,
+    style = _ref2.style,
+    _ref2$leftActionsWidt = _ref2.leftActionsWidth,
+    leftActionsWidth = _ref2$leftActionsWidt === void 0 ? scale(85) : _ref2$leftActionsWidt,
+    _ref2$leftButtonWidth = _ref2.leftButtonWidth,
+    leftButtonWidth = _ref2$leftButtonWidth === void 0 ? scale(85) : _ref2$leftButtonWidth,
+    _ref2$onSwipeLeftStar = _ref2.onSwipeLeftStart,
+    onSwipeLeftStart = _ref2$onSwipeLeftStar === void 0 ? noop : _ref2$onSwipeLeftStar,
+    _ref2$onSwipeLeftEnd = _ref2.onSwipeLeftEnd,
+    onSwipeLeftEnd = _ref2$onSwipeLeftEnd === void 0 ? noop : _ref2$onSwipeLeftEnd,
+    _ref2$rightActionsWid = _ref2.rightActionsWidth,
+    rightActionsWidth = _ref2$rightActionsWid === void 0 ? scale(85) : _ref2$rightActionsWid,
+    _ref2$rightButtonWidt = _ref2.rightButtonWidth,
+    rightButtonWidth = _ref2$rightButtonWidt === void 0 ? scale(85) : _ref2$rightButtonWidt,
+    _ref2$onSwipeRightSta = _ref2.onSwipeRightStart,
+    onSwipeRightStart = _ref2$onSwipeRightSta === void 0 ? noop : _ref2$onSwipeRightSta,
+    _ref2$onSwipeRightEnd = _ref2.onSwipeRightEnd,
+    onSwipeRightEnd = _ref2$onSwipeRightEnd === void 0 ? noop : _ref2$onSwipeRightEnd,
+    _ref2$swipeState = _ref2.swipeState,
+    swipeState = _ref2$swipeState === void 0 ? 'closed' : _ref2$swipeState,
+    _ref2$onStateChange = _ref2.onStateChange,
+    onStateChange = _ref2$onStateChange === void 0 ? noop : _ref2$onStateChange,
+    rest = _objectWithoutProperties(_ref2, _excluded$1);
+  var propsWithDefaultValue = _objectSpread2({
+    children: children,
+    leftActions: leftActions,
+    leftContent: leftContent,
+    rightActions: rightActions,
+    rightContent: rightContent,
+    style: style,
+    leftActionsWidth: leftActionsWidth,
+    leftButtonWidth: leftButtonWidth,
+    onSwipeLeftStart: onSwipeLeftStart,
+    onSwipeLeftEnd: onSwipeLeftEnd,
+    rightActionsWidth: rightActionsWidth,
+    rightButtonWidth: rightButtonWidth,
+    onSwipeRightStart: onSwipeRightStart,
+    onSwipeRightEnd: onSwipeRightEnd,
+    swipeState: swipeState,
+    onStateChange: onStateChange
+  }, rest);
+  var unmountedRef = React__default["default"].useRef(false);
+  React.useEffect(function () {
+    return function () {
+      unmountedRef.current = true;
+    };
+  }, []);
+  var totalLeftButtonsWidth = leftActions.length * leftButtonWidth;
+  var totalRightButtonsWidth = rightActions.length * rightButtonWidth;
+  var _React$useState = React__default["default"].useState(0),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    width = _React$useState2[0],
+    setWidth = _React$useState2[1];
+  var hasLeftButtons = !leftContent && leftActions && leftActions.length > 0;
+  var hasRightButtons = !rightContent && rightActions && rightActions.length > 0;
+  var canSwipeRight = !!leftContent || !!hasLeftButtons;
+  var canSwipeLeft = !!rightContent || !!hasRightButtons;
+  var propsRef = React__default["default"].useRef(undefined);
+  var _React$useState3 = React__default["default"].useState({
+      pan: new reactNative.Animated.ValueXY(getPos({
+        swipeState: swipeState,
+        totalLeftButtonsWidth: totalLeftButtonsWidth,
+        totalRightButtonsWidth: totalRightButtonsWidth
+      })),
+      lastOffset: {
+        x: 0,
+        y: 0
+      },
+      leftActionActivated: false,
+      rightActionActivated: true,
+      swipeState: 'closed'
+    }),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    state = _React$useState4[0],
+    setState = _React$useState4[1];
+  propsRef.current = _objectSpread2(_objectSpread2({}, propsWithDefaultValue), {}, {
+    canSwipeLeft: canSwipeLeft,
+    canSwipeRight: canSwipeRight,
+    totalLeftButtonsWidth: totalLeftButtonsWidth,
+    totalRightButtonsWidth: totalRightButtonsWidth,
+    hasLeftButtons: hasLeftButtons,
+    hasRightButtons: hasRightButtons,
+    unmountedRef: unmountedRef
   });
-  return /*#__PURE__*/React__default["default"].createElement(reactNative.Animated.View, {
-    style: {
-      width: width,
-      flexDirection: 'row',
-      transform: [{
-        translateX: trans
-      }]
-    }
-  }, actions);
-};
-var Swipeable = function Swipeable(_ref) {
-  var children = _ref.children,
-    state = _ref.state,
-    onStateChange = _ref.onStateChange,
-    leftActions = _ref.leftActions,
-    leftActionsWidth = _ref.leftActionsWidth,
-    rightActions = _ref.rightActions,
-    rightActionsWidth = _ref.rightActionsWidth,
-    swipeableProps = _objectWithoutProperties(_ref, _excluded$2);
-  var _useWindowDimensions = reactNative.useWindowDimensions(),
-    width = _useWindowDimensions.width;
-  var swipeableRef = React.useRef(null);
-  var renderLeftActions = React.useCallback(function (progress) {
-    return renderActions(leftActions, leftActionsWidth || width, progress, 'left');
-  }, [leftActions, leftActionsWidth, width]);
-  var renderRightActions = React.useCallback(function (progress) {
-    return renderActions(rightActions, rightActionsWidth || width, progress, 'right');
-  }, [rightActions, rightActionsWidth, width]);
   React.useEffect(function () {
-    if (swipeableRef.current === null) return;
-    switch (state) {
-      case 'leftOpen':
-        swipeableRef.current.openLeft();
-        break;
-      case 'rightOpen':
-        swipeableRef.current.openRight();
-        break;
-      case 'closed':
-        swipeableRef.current.close();
-        break;
+    var animation = null;
+    if (state.swipeState !== swipeState) {
+      animation = animationToNewState(swipeState, state.pan, totalLeftButtonsWidth, totalRightButtonsWidth);
+      animation.start();
     }
-  }, [state]);
-  return /*#__PURE__*/React__default["default"].createElement(reactNativeGestureHandler.GestureHandlerRootView, null, /*#__PURE__*/React__default["default"].createElement(reactNativeGestureHandler.Swipeable, _extends$1({}, swipeableProps, {
-    ref: swipeableRef
-  }, leftActions !== undefined && {
-    renderLeftActions: renderLeftActions
-  }, rightActions !== undefined && {
-    renderRightActions: renderRightActions
-  }, {
-    onSwipeableLeftOpen: function onSwipeableLeftOpen() {
-      return onStateChange === null || onStateChange === void 0 ? void 0 : onStateChange('leftOpen');
+    return function () {
+      if (animation) {
+        animation.stop();
+      }
+    };
+  }, [swipeState]);
+  var transform = [{
+    translateX: state.pan.x.interpolate({
+      inputRange: [canSwipeLeft ? -width : 0, canSwipeRight ? width : 0],
+      outputRange: [canSwipeLeft ? -width + reactNative.StyleSheet.hairlineWidth : 0, canSwipeRight ? width - reactNative.StyleSheet.hairlineWidth : 0],
+      extrapolate: 'clamp'
+    })
+  }];
+  var panResponder = React__default["default"].useRef(reactNative.PanResponder.create({
+    onMoveShouldSetPanResponder: function onMoveShouldSetPanResponder(_, gestureState) {
+      return Math.abs(gestureState.dx) > swipeStartMinDistance;
+    },
+    onMoveShouldSetPanResponderCapture: function onMoveShouldSetPanResponderCapture(_, gestureState) {
+      return Math.abs(gestureState.dx) > swipeStartMinDistance;
+    },
+    onPanResponderGrant: function onPanResponderGrant() {
+      setState(function (prevState) {
+        prevState.pan.setOffset(prevState.lastOffset);
+        return prevState;
+      });
+    },
+    onPanResponderMove: function onPanResponderMove(event, gestureState) {
+      setState(function (prevState) {
+        return hanleOnPanResponderMove(prevState, propsRef.current, event, gestureState);
+      });
     },
-    onSwipeableRightOpen: function onSwipeableRightOpen() {
-      return onStateChange === null || onStateChange === void 0 ? void 0 : onStateChange('rightOpen');
+    onPanResponderRelease: function onPanResponderRelease(event, gestureState) {
+      setState(function (prevState) {
+        return hanleOnPanResponderEnd(prevState, propsRef.current, event, gestureState);
+      });
     },
-    onSwipeableClose: function onSwipeableClose() {
-      return onStateChange === null || onStateChange === void 0 ? void 0 : onStateChange('closed');
+    onPanResponderTerminationRequest: function onPanResponderTerminationRequest() {
+      return false;
+    },
+    onPanResponderTerminate: function onPanResponderTerminate(event, gestureState) {
+      setState(function (prevState) {
+        return hanleOnPanResponderEnd(prevState, propsRef.current, event, gestureState);
+      });
+    }
+  })).current;
+  return /*#__PURE__*/React__default["default"].createElement(StyledWrapper$3, _extends$1({
+    onLayout: function onLayout(event) {
+      var width = event.nativeEvent.layout.width;
+      setWidth(width);
+    },
+    style: [{
+      flexDirection: 'row'
+    }, style]
+  }, panResponder.panHandlers, rest), canSwipeRight && /*#__PURE__*/React__default["default"].createElement(reactNative.Animated.View, {
+    style: [{
+      transform: transform,
+      marginLeft: -width,
+      width: width
+    }]
+  }, leftContent || /*#__PURE__*/React__default["default"].createElement(Buttons, {
+    buttons: leftActions,
+    isLeftButtons: true,
+    panAnimatedValue: state.pan,
+    width: width,
+    canSwipeLeft: canSwipeLeft,
+    canSwipeRight: canSwipeRight,
+    buttonWidth: leftButtonWidth
+  })), /*#__PURE__*/React__default["default"].createElement(StyledContent, {
+    style: {
+      transform: transform
+    }
+  }, children), canSwipeLeft && /*#__PURE__*/React__default["default"].createElement(reactNative.Animated.View, {
+    style: [{
+      transform: transform,
+      marginRight: -width,
+      width: width
+    }]
+  }, rightContent || /*#__PURE__*/React__default["default"].createElement(Buttons, {
+    buttons: rightActions,
+    isLeftButtons: false,
+    panAnimatedValue: state.pan,
+    width: width,
+    canSwipeRight: canSwipeRight,
+    canSwipeLeft: canSwipeLeft,
+    buttonWidth: rightButtonWidth
+  })));
+};
+var animationToNewState = function animationToNewState(swipeState, pan, totalLeftButtonsWidth, totalRightButtonsWidth) {
+  var animationConfig = getReleaseAnimationConfig(swipeState, {
+    totalLeftButtonsWidth: totalLeftButtonsWidth,
+    totalRightButtonsWidth: totalRightButtonsWidth
+  });
+  pan.flattenOffset();
+  return reactNative.Animated.timing(pan, animationConfig);
+};
+var hanleOnPanResponderEnd = function hanleOnPanResponderEnd(state, contextValues, event, gestureState) {
+  var totalLeftButtonsWidth = contextValues.totalLeftButtonsWidth,
+    totalRightButtonsWidth = contextValues.totalRightButtonsWidth,
+    unmountedRef = contextValues.unmountedRef,
+    onSwipeLeftEnd = contextValues.onSwipeLeftEnd,
+    onSwipeRightEnd = contextValues.onSwipeRightEnd,
+    onStateChange = contextValues.onStateChange;
+  var leftActionActivated = state.leftActionActivated,
+    rightActionActivated = state.rightActionActivated,
+    pan = state.pan,
+    swipeState = state.swipeState;
+  var animationConfig = getReleaseAnimationConfig(swipeState, {
+    totalLeftButtonsWidth: totalLeftButtonsWidth,
+    totalRightButtonsWidth: totalRightButtonsWidth
+  });
+  animationToNewState(swipeState, pan, totalLeftButtonsWidth, totalRightButtonsWidth).start(function () {
+    if (unmountedRef.current) {
+      return;
     }
-  }), children));
+    if (leftActionActivated && onSwipeLeftEnd) {
+      onSwipeLeftEnd(event, gestureState);
+    }
+    if (rightActionActivated && onSwipeRightEnd) {
+      onSwipeRightEnd(event, gestureState);
+    }
+    onStateChange(swipeState);
+  });
+  return _objectSpread2(_objectSpread2({}, state), {}, {
+    lastOffset: {
+      x: animationConfig.toValue.x,
+      y: animationConfig.toValue.y
+    },
+    leftActionActivated: false,
+    rightActionActivated: false
+  });
+};
+var hanleOnPanResponderMove = function hanleOnPanResponderMove(state, contextValues, event, gestureState) {
+  var leftActionsWidth = contextValues.leftActionsWidth,
+    rightActionsWidth = contextValues.rightActionsWidth,
+    onSwipeLeftStart = contextValues.onSwipeLeftStart,
+    onSwipeRightStart = contextValues.onSwipeRightStart,
+    canSwipeRight = contextValues.canSwipeRight,
+    canSwipeLeft = contextValues.canSwipeLeft,
+    hasLeftButtons = contextValues.hasLeftButtons,
+    hasRightButtons = contextValues.hasRightButtons;
+  var lastOffset = state.lastOffset,
+    leftActionActivated = state.leftActionActivated,
+    swipeState = state.swipeState,
+    rightActionActivated = state.rightActionActivated;
+  var dx = gestureState.dx,
+    vx = gestureState.vx;
+  var x = dx + lastOffset.x;
+  var isSwipingLeft = vx < 0;
+  var isSwipingRight = vx > 0;
+  var leftActionsActivated = swipeState === 'leftOpen';
+  var rightActionsActivated = swipeState === 'rightOpen';
+  var nextLeftActionActivated = leftActionActivated;
+  var nextLeftButtonsActivated = leftActionsActivated;
+  var nextRightActionActivated = rightActionActivated;
+  var nextRightButtonsActivated = rightActionsActivated;
+  reactNative.Animated.event([null, {
+    dx: state.pan.x,
+    dy: state.pan.y
+  }], {
+    useNativeDriver: false
+  })(event, gestureState);
+  if (!leftActionActivated && canSwipeRight && x >= leftActionsWidth) {
+    nextLeftActionActivated = true;
+    onSwipeRightStart(event, gestureState);
+  }
+  if (leftActionActivated && canSwipeRight && x < leftActionsWidth) {
+    nextLeftActionActivated = false;
+  }
+  if (!rightActionActivated && canSwipeLeft && x <= -rightActionsWidth) {
+    nextRightActionActivated = true;
+    onSwipeLeftStart(event, gestureState);
+  }
+  if (rightActionActivated && canSwipeLeft && x > -rightActionsWidth) {
+    nextRightActionActivated = false;
+  }
+  if (!leftActionsActivated && hasLeftButtons && !isSwipingLeft && x >= leftActionsWidth) {
+    nextLeftButtonsActivated = true;
+  }
+  if (leftActionsActivated && hasLeftButtons && isSwipingLeft) {
+    nextLeftButtonsActivated = false;
+  }
+  if (!rightActionsActivated && hasRightButtons && !isSwipingRight && x <= -rightActionsWidth) {
+    nextRightButtonsActivated = true;
+  }
+  if (rightActionsActivated && hasRightButtons && isSwipingRight) {
+    nextRightButtonsActivated = false;
+  }
+  var needsUpdate = nextLeftActionActivated !== leftActionActivated || nextLeftButtonsActivated !== leftActionsActivated || nextRightActionActivated !== rightActionActivated || nextRightButtonsActivated !== rightActionsActivated;
+  if (needsUpdate) {
+    var nextSwipeState = function () {
+      if (nextLeftButtonsActivated) {
+        return 'leftOpen';
+      } else if (nextRightButtonsActivated) {
+        return 'rightOpen';
+      } else {
+        return 'closed';
+      }
+    }();
+    return _objectSpread2(_objectSpread2({}, state), {}, {
+      leftActionActivated: nextLeftActionActivated,
+      rightActionActivated: nextRightActionActivated,
+      swipeState: nextSwipeState
+    });
+  } else {
+    return state;
+  }
 };
-var index$5 = Object.assign(Swipeable, {
-  Action: SwipeableAction,
-  Content: reactNativeGestureHandler.RectButton
+var index$5 = Object.assign( /*#__PURE__*/React__default["default"].memo(Swipeable), {
+  Action: SwipeableAction
 });
 
 var Circle = index$a(reactNative.View)(function (_ref) {
@@ -14286,7 +14628,7 @@ var StyledText = index$a(reactNative.Text)(function (_ref3) {
   };
 });
 
-var _excluded$1 = ["content", "variant", "intent", "style", "testID"];
+var _excluded = ["content", "variant", "intent", "style", "testID"];
 var Tag = function Tag(_ref) {
   var content = _ref.content,
     _ref$variant = _ref.variant,
@@ -14295,7 +14637,7 @@ var Tag = function Tag(_ref) {
     intent = _ref$intent === void 0 ? 'primary' : _ref$intent,
     style = _ref.style,
     testID = _ref.testID,
-    nativeProps = _objectWithoutProperties(_ref, _excluded$1);
+    nativeProps = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React__default["default"].createElement(StyledView, _extends$1({}, nativeProps, {
     themeIntent: intent,
     themeVariant: variant,
@@ -14856,11 +15198,9 @@ var ToolbarGroup = function ToolbarGroup(_ref) {
   }));
 };
 
-var _excluded = ["children"];
 var Toolbar = function Toolbar(_ref) {
-  var children = _ref.children,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React__default["default"].createElement(ToolbarWrapper, rest, children);
+  var children = _ref.children;
+  return /*#__PURE__*/React__default["default"].createElement(ToolbarWrapper, null, children);
 };
 var index$1 = Object.assign(Toolbar, {
   Group: ToolbarGroup