@servesall/atoms 1.1.6 → 1.1.7

package/dist/bundle.umd.js

@@ -920,29 +920,16 @@
         hasError = _ref.hasError;
     var widthActive = Animated.useSharedValue(0);
     var animatedStyleWidthActive = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return active ? {
-          width: Animated.withTiming(widthActive.value, {
-            duration: 350
-          })
-        } : {
-          width: Animated.withTiming(0, {
-            duration: 350
-          })
-        };
-      };
-
-      _f._closure = {
-        active: active,
-        withTiming: Animated.withTiming,
-        widthActive: widthActive
+      return active ? {
+        width: Animated.withTiming(widthActive.value, {
+          duration: 350
+        })
+      } : {
+        width: Animated.withTiming(0, {
+          duration: 350
+        })
       };
-      _f.asString = "function _f(){const{active,withTiming,widthActive}=jsThis._closure;{return active?{width:withTiming(widthActive.value,{duration:350})}:{width:withTiming(0,{duration:350})};}}";
-      _f.__workletHash = 6082653035732;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Inputs/Animated/LineAnimation/index.js (19:52)";
-      _f.__optimalization = 2;
-      return _f;
-    }());
+    });
     return /*#__PURE__*/React__default["default"].createElement(Row, null, /*#__PURE__*/React__default["default"].createElement(BorderIdle$1, {
       color: !hasError ? borderColorIdle : borderColorError,
       onLayout: function onLayout(e) {
@@ -962,28 +949,13 @@
         active = _ref.active;
     var bottom = Animated.useSharedValue(active ? 50 : 4);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          bottom: Animated.withTiming(bottom.value, {
-            duration: 250,
-            easing: Animated.Easing.bezier(0.19, 1.0, 0.22, 1.0)
-          })
-        };
-      };
-
-      _f._closure = {
-        withTiming: Animated.withTiming,
-        bottom: bottom,
-        Easing: {
-          bezier: Animated.Easing.bezier
-        }
+      return {
+        bottom: Animated.withTiming(bottom.value, {
+          duration: 250,
+          easing: Animated.Easing.bezier(0.19, 1.0, 0.22, 1.0)
+        })
       };
-      _f.asString = "function _f(){const{withTiming,bottom,Easing}=jsThis._closure;{return{bottom:withTiming(bottom.value,{duration:250,easing:Easing.bezier(0.19,1.0,0.22,1.0)})};}}";
-      _f.__workletHash = 551286745489;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Inputs/Animated/Placeholder/index.js (12:41)";
-      _f.__optimalization = 2;
-      return _f;
-    }());
+    });
     React.useEffect(function () {
       if (active) {
         bottom.value = 50;
@@ -1102,21 +1074,10 @@
 
     var fade = Animated.useSharedValue(7);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          opacity: fade.value
-        };
-      };
-
-      _f._closure = {
-        fade: fade
+      return {
+        opacity: fade.value
       };
-      _f.asString = "function _f(){const{fade}=jsThis._closure;{return{opacity:fade.value};}}";
-      _f.__workletHash = 16298690497334;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Inputs/AnimatedPlaceholder/AnimatedItem.js (14:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
 
     var runNewChild = function runNewChild() {
       setChildNumber(function (prevChildNumber) {
@@ -1127,24 +1088,13 @@
     React.useEffect(function () {
       fade.value = Animated.withRepeat(Animated.withTiming(0, {
         duration: 2000
-      }, function () {
-        var _f = function _f(finished, currentValue) {
-          if (finished) {
-            if (currentValue === 0) {
-              Animated.runOnJS(runNewChild)();
-            }
+      }, function (finished, currentValue) {
+        if (finished) {
+          if (currentValue === 0) {
+            Animated.runOnJS(runNewChild)();
           }
-        };
-
-        _f._closure = {
-          runOnJS: Animated.runOnJS,
-          runNewChild: runNewChild
-        };
-        _f.asString = "function _f(finished,currentValue){const{runOnJS,runNewChild}=jsThis._closure;{if(finished){if(currentValue===0){runOnJS(runNewChild)();}}}}";
-        _f.__workletHash = 54360799953;
-        _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Inputs/AnimatedPlaceholder/AnimatedItem.js (28:40)";
-        return _f;
-      }()), -1, true);
+        }
+      }), -1, true);
     }, []);
     return /*#__PURE__*/React__default["default"].createElement(Animated__default["default"].View, {
       style: [{
@@ -1276,28 +1226,13 @@
         active = _ref.active;
     var top = Animated.useSharedValue(active ? 10 : 30);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          top: Animated.withTiming(top.value, {
-            duration: 250,
-            easing: Animated.Easing.bezier(0.19, 1.0, 0.22, 1.0)
-          })
-        };
-      };
-
-      _f._closure = {
-        withTiming: Animated.withTiming,
-        top: top,
-        Easing: {
-          bezier: Animated.Easing.bezier
-        }
+      return {
+        top: Animated.withTiming(top.value, {
+          duration: 250,
+          easing: Animated.Easing.bezier(0.19, 1.0, 0.22, 1.0)
+        })
       };
-      _f.asString = "function _f(){const{withTiming,top,Easing}=jsThis._closure;{return{top:withTiming(top.value,{duration:250,easing:Easing.bezier(0.19,1.0,0.22,1.0)})};}}";
-      _f.__workletHash = 3739814920853;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Inputs/InputNormal/Placeholder/index.js (12:41)";
-      _f.__optimalization = 2;
-      return _f;
-    }());
+    });
     React.useEffect(function () {
       if (active) {
         top.value = 10;
@@ -1426,29 +1361,16 @@
         borderColorActive = _ref.borderColorActive;
     var widthActive = Animated.useSharedValue(0);
     var animatedStyleWidthActive = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return active ? {
-          width: Animated.withTiming(widthActive.value, {
-            duration: 350
-          })
-        } : {
-          width: Animated.withTiming(0, {
-            duration: 350
-          })
-        };
+      return active ? {
+        width: Animated.withTiming(widthActive.value, {
+          duration: 350
+        })
+      } : {
+        width: Animated.withTiming(0, {
+          duration: 350
+        })
       };
-
-      _f._closure = {
-        active: active,
-        withTiming: Animated.withTiming,
-        widthActive: widthActive
-      };
-      _f.asString = "function _f(){const{active,withTiming,widthActive}=jsThis._closure;{return active?{width:withTiming(widthActive.value,{duration:350})}:{width:withTiming(0,{duration:350})};}}";
-      _f.__workletHash = 6082653035732;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/TextButton/LineAnimation/index.js (13:52)";
-      _f.__optimalization = 2;
-      return _f;
-    }());
+    });
     return /*#__PURE__*/React__default["default"].createElement(Row, null, /*#__PURE__*/React__default["default"].createElement(BorderIdle, {
       color: borderColorIdle,
       onLayout: function onLayout(e) {
@@ -1523,24 +1445,13 @@
         hitSlop = _ref$hitSlop === void 0 ? 0 : _ref$hitSlop;
     var scale = Animated.useSharedValue(1);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          opacity: scale.value,
-          transform: [{
-            scale: scale.value
-          }]
-        };
+      return {
+        opacity: scale.value,
+        transform: [{
+          scale: scale.value
+        }]
       };
-
-      _f._closure = {
-        scale: scale
-      };
-      _f.asString = "function _f(){const{scale}=jsThis._closure;{return{opacity:scale.value,transform:[{scale:scale.value}]};}}";
-      _f.__workletHash = 15781601983731;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/RoundedButton/index.js (21:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     return /*#__PURE__*/React__default["default"].createElement(Animated__default["default"].View, {
       style: [animatedStyle]
     }, /*#__PURE__*/React__default["default"].createElement(ButtonStyle$4, {
@@ -1586,24 +1497,13 @@
         size = _ref$size === void 0 ? "big" : _ref$size;
     var scale = Animated.useSharedValue(1);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          opacity: scale.value,
-          transform: [{
-            scale: scale.value
-          }]
-        };
+      return {
+        opacity: scale.value,
+        transform: [{
+          scale: scale.value
+        }]
       };
-
-      _f._closure = {
-        scale: scale
-      };
-      _f.asString = "function _f(){const{scale}=jsThis._closure;{return{opacity:scale.value,transform:[{scale:scale.value}]};}}";
-      _f.__workletHash = 15781601983731;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/RoundButton/index.js (20:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     return /*#__PURE__*/React__default["default"].createElement(Animated__default["default"].View, {
       style: [{
         flex: 1
@@ -1646,40 +1546,18 @@
     var scale = Animated.useSharedValue(1);
     var width = Animated.useSharedValue(80);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          opacity: scale.value,
-          transform: [{
-            scale: scale.value
-          }]
-        };
+      return {
+        opacity: scale.value,
+        transform: [{
+          scale: scale.value
+        }]
       };
-
-      _f._closure = {
-        scale: scale
-      };
-      _f.asString = "function _f(){const{scale}=jsThis._closure;{return{opacity:scale.value,transform:[{scale:scale.value}]};}}";
-      _f.__workletHash = 15781601983731;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/FloatingButton/FloatingButton.js (24:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     var animatedWidth = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          width: width.value
-        };
+      return {
+        width: width.value
       };
-
-      _f._closure = {
-        width: width
-      };
-      _f.asString = "function _f(){const{width}=jsThis._closure;{return{width:width.value};}}";
-      _f.__workletHash = 11755410798377;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/FloatingButton/FloatingButton.js (35:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     React.useEffect(function () {
       if (active) {
         setTimeout(function () {
@@ -1740,46 +1618,21 @@
     var left = Animated.useSharedValue(30);
     var bottom = Animated.useSharedValue(30);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          opacity: scale.value,
-          transform: [{
-            scale: scale.value
-          }]
-        };
+      return {
+        opacity: scale.value,
+        transform: [{
+          scale: scale.value
+        }]
       };
-
-      _f._closure = {
-        scale: scale
-      };
-      _f.asString = "function _f(){const{scale}=jsThis._closure;{return{opacity:scale.value,transform:[{scale:scale.value}]};}}";
-      _f.__workletHash = 15781601983731;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/FloatingButton/index.js (35:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     var animatedAbsolute = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          minWidth: width.value,
-          height: height.value,
-          left: left.value,
-          bottom: bottom.value
-        };
-      };
-
-      _f._closure = {
-        width: width,
-        height: height,
-        left: left,
-        bottom: bottom
+      return {
+        minWidth: width.value,
+        height: height.value,
+        left: left.value,
+        bottom: bottom.value
       };
-      _f.asString = "function _f(){const{width,height,left,bottom}=jsThis._closure;{return{minWidth:width.value,height:height.value,left:left.value,bottom:bottom.value};}}";
-      _f.__workletHash = 14161176176375;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/FloatingButton/index.js (46:44)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     React.useEffect(function () {
       scale.value = Animated.withTiming(1, {
         duration: 450,
@@ -1879,40 +1732,18 @@
     var scale = Animated.useSharedValue(1);
     var width = Animated.useSharedValue(70);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          opacity: scale.value,
-          transform: [{
-            scale: scale.value
-          }]
-        };
-      };
-
-      _f._closure = {
-        scale: scale
+      return {
+        opacity: scale.value,
+        transform: [{
+          scale: scale.value
+        }]
       };
-      _f.asString = "function _f(){const{scale}=jsThis._closure;{return{opacity:scale.value,transform:[{scale:scale.value}]};}}";
-      _f.__workletHash = 15781601983731;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/AnimatedButton/FloatingButton.js (29:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     var animatedWidth = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          width: width.value
-        };
+      return {
+        width: width.value
       };
-
-      _f._closure = {
-        width: width
-      };
-      _f.asString = "function _f(){const{width}=jsThis._closure;{return{width:width.value};}}";
-      _f.__workletHash = 11755410798377;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/AnimatedButton/FloatingButton.js (40:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     React.useEffect(function () {
       setTimeout(function () {
         return width.value = Animated.withTiming(leftElement ? reactNative.Dimensions.get("window").width / 2 : reactNative.Dimensions.get("window").width - 60, {
@@ -1972,48 +1803,22 @@
     var left = Animated.useSharedValue(0);
     var bottom = Animated.useSharedValue(10);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          opacity: scale.value,
-          transform: [{
-            scale: scale.value
-          }]
-        };
-      };
-
-      _f._closure = {
-        scale: scale
+      return {
+        opacity: scale.value,
+        transform: [{
+          scale: scale.value
+        }]
       };
-      _f.asString = "function _f(){const{scale}=jsThis._closure;{return{opacity:scale.value,transform:[{scale:scale.value}]};}}";
-      _f.__workletHash = 15781601983731;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/AnimatedButton/index.js (33:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     var animatedAbsolute = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          minWidth: width.value,
-          height: height.value,
-          right: right.value,
-          left: left.value,
-          bottom: bottom.value
-        };
-      };
-
-      _f._closure = {
-        width: width,
-        height: height,
-        right: right,
-        left: left,
-        bottom: bottom
+      return {
+        minWidth: width.value,
+        height: height.value,
+        right: right.value,
+        left: left.value,
+        bottom: bottom.value
       };
-      _f.asString = "function _f(){const{width,height,right,left,bottom}=jsThis._closure;{return{minWidth:width.value,height:height.value,right:right.value,left:left.value,bottom:bottom.value};}}";
-      _f.__workletHash = 2397013298280;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/AnimatedButton/index.js (44:44)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     React.useEffect(function () {
       scale.value = Animated.withTiming(1, {
         duration: 450,
@@ -2106,40 +1911,18 @@
     var scale = Animated.useSharedValue(1);
     var width = Animated.useSharedValue("100%");
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          opacity: scale.value,
-          transform: [{
-            scale: scale.value
-          }]
-        };
-      };
-
-      _f._closure = {
-        scale: scale
+      return {
+        opacity: scale.value,
+        transform: [{
+          scale: scale.value
+        }]
       };
-      _f.asString = "function _f(){const{scale}=jsThis._closure;{return{opacity:scale.value,transform:[{scale:scale.value}]};}}";
-      _f.__workletHash = 15781601983731;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/FeedbackButton/FloatingButton.js (28:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     var animatedWidth = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          width: width.value
-        };
-      };
-
-      _f._closure = {
-        width: width
+      return {
+        width: width.value
       };
-      _f.asString = "function _f(){const{width}=jsThis._closure;{return{width:width.value};}}";
-      _f.__workletHash = 11755410798377;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/FeedbackButton/FloatingButton.js (39:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     React.useEffect(function () {
       if (loading) {
         width.value = Animated.withTiming(70, {
@@ -2190,46 +1973,21 @@
     var right = Animated.useSharedValue(0);
     var left = Animated.useSharedValue(0);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          opacity: scale.value,
-          transform: [{
-            scale: scale.value
-          }]
-        };
-      };
-
-      _f._closure = {
-        scale: scale
+      return {
+        opacity: scale.value,
+        transform: [{
+          scale: scale.value
+        }]
       };
-      _f.asString = "function _f(){const{scale}=jsThis._closure;{return{opacity:scale.value,transform:[{scale:scale.value}]};}}";
-      _f.__workletHash = 15781601983731;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/FeedbackButton/index.js (32:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     var animatedAbsolute = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          minWidth: width.value,
-          height: height.value,
-          right: right.value,
-          left: left.value
-        };
-      };
-
-      _f._closure = {
-        width: width,
-        height: height,
-        right: right,
-        left: left
+      return {
+        minWidth: width.value,
+        height: height.value,
+        right: right.value,
+        left: left.value
       };
-      _f.asString = "function _f(){const{width,height,right,left}=jsThis._closure;{return{minWidth:width.value,height:height.value,right:right.value,left:left.value};}}";
-      _f.__workletHash = 15930704015288;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/FeedbackButton/index.js (43:44)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     React.useEffect(function () {
       if (loading) {
         width.value = Animated.withTiming(reactNative.Dimensions.get("window").width, {
@@ -3726,46 +3484,21 @@
     var left = Animated.useSharedValue(0);
     var bottom = Animated.useSharedValue(10);
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          transform: [{
-            translateY: translateY.value
-          }],
-          width: "100%"
-        };
+      return {
+        transform: [{
+          translateY: translateY.value
+        }],
+        width: "100%"
       };
-
-      _f._closure = {
-        translateY: translateY
-      };
-      _f.asString = "function _f(){const{translateY}=jsThis._closure;{return{transform:[{translateY:translateY.value}],width:\"100%\"};}}";
-      _f.__workletHash = 232655703170;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/AnimatedRoundedButton/index.js (31:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     var animatedAbsolute = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          height: height.value,
-          right: right.value,
-          left: left.value,
-          bottom: bottom.value
-        };
+      return {
+        height: height.value,
+        right: right.value,
+        left: left.value,
+        bottom: bottom.value
       };
-
-      _f._closure = {
-        height: height,
-        right: right,
-        left: left,
-        bottom: bottom
-      };
-      _f.asString = "function _f(){const{height,right,left,bottom}=jsThis._closure;{return{height:height.value,right:right.value,left:left.value,bottom:bottom.value};}}";
-      _f.__workletHash = 12878771773755;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/Buttons/AnimatedRoundedButton/index.js (42:44)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     React.useEffect(function () {
       translateY.value = Animated.withTiming(0, {
         duration: 450,
@@ -52575,156 +52308,56 @@
 
     var x = Animated.useSharedValue(0);
     var gestureHandler = Animated.useAnimatedGestureHandler({
-      onStart: function () {
-        var _f = function _f(_, ctx) {
-          ctx.startX = x.value;
-        };
-
-        _f._closure = {
-          x: x
-        };
-        _f.asString = "function _f(_,ctx){const{x}=jsThis._closure;{ctx.startX=x.value;}}";
-        _f.__workletHash = 5300485379009;
-        _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/SlideToConfirm/index.js (46:13)";
-        return _f;
-      }(),
-      onActive: function () {
-        var _f = function _f(event, ctx) {
-          if (event.translationY > 60 || event.translationY < -60) {
-            x.value = Animated.withSpring(0);
-          } else {
-            if (ctx.startX + event.translationX > width - WIDTH_TO_REMOVE) {
-              x.value = width - WIDTH_FINAL;
-              Animated.runOnJS(setToggled)(true);
-            } else {
-              x.value = ctx.startX + event.translationX;
-            }
-          }
-        };
-
-        _f._closure = {
-          x: x,
-          withSpring: Animated.withSpring,
-          width: width,
-          WIDTH_TO_REMOVE: WIDTH_TO_REMOVE,
-          WIDTH_FINAL: WIDTH_FINAL,
-          runOnJS: Animated.runOnJS,
-          setToggled: setToggled
-        };
-        _f.asString = "function _f(event,ctx){const{x,withSpring,width,WIDTH_TO_REMOVE,WIDTH_FINAL,runOnJS,setToggled}=jsThis._closure;{if(event.translationY>60||event.translationY<-60){x.value=withSpring(0);}else{if(ctx.startX+event.translationX>width-WIDTH_TO_REMOVE){x.value=width-WIDTH_FINAL;runOnJS(setToggled)(true);}else{x.value=ctx.startX+event.translationX;}}}}";
-        _f.__workletHash = 16638915014400;
-        _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/SlideToConfirm/index.js (49:14)";
-        return _f;
-      }(),
-      onEnd: function () {
-        var _f = function _f(_) {
-          if (toggled) {
+      onStart: function onStart(_, ctx) {
+        ctx.startX = x.value;
+      },
+      onActive: function onActive(event, ctx) {
+        if (event.translationY > 60 || event.translationY < -60) {
+          x.value = Animated.withSpring(0);
+        } else {
+          if (ctx.startX + event.translationX > width - WIDTH_TO_REMOVE) {
             x.value = width - WIDTH_FINAL;
+            Animated.runOnJS(setToggled)(true);
           } else {
-            x.value = Animated.withSpring(0);
+            x.value = ctx.startX + event.translationX;
           }
-        };
-
-        _f._closure = {
-          toggled: toggled,
-          x: x,
-          width: width,
-          WIDTH_FINAL: WIDTH_FINAL,
-          withSpring: Animated.withSpring
-        };
-        _f.asString = "function _f(_){const{toggled,x,width,WIDTH_FINAL,withSpring}=jsThis._closure;{if(toggled){x.value=width-WIDTH_FINAL;}else{x.value=withSpring(0);}}}";
-        _f.__workletHash = 9307804739149;
-        _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/SlideToConfirm/index.js (61:11)";
-        return _f;
-      }()
+        }
+      },
+      onEnd: function onEnd(_) {
+        if (toggled) {
+          x.value = width - WIDTH_FINAL;
+        } else {
+          x.value = Animated.withSpring(0);
+        }
+      }
     });
     var animatedStyle = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          transform: [{
-            translateX: x.value
-          }]
-        };
-      };
-
-      _f._closure = {
-        x: x
+      return {
+        transform: [{
+          translateX: x.value
+        }]
       };
-      _f.asString = "function _f(){const{x}=jsThis._closure;{return{transform:[{translateX:x.value}]};}}";
-      _f.__workletHash = 5278836605383;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/SlideToConfirm/index.js (70:41)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     var InterpolateXInput = [0, width];
     var colorWave = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          width: x.value + BTN_WIDTH + BTN_PADDING,
-          opacity: Animated.interpolate(x.value, InterpolateXInput, [0, 1])
-        };
+      return {
+        width: x.value + BTN_WIDTH + BTN_PADDING,
+        opacity: Animated.interpolate(x.value, InterpolateXInput, [0, 1])
       };
-
-      _f._closure = {
-        x: x,
-        BTN_WIDTH: BTN_WIDTH,
-        BTN_PADDING: BTN_PADDING,
-        interpolate: Animated.interpolate,
-        InterpolateXInput: InterpolateXInput
-      };
-      _f.asString = "function _f(){const{x,BTN_WIDTH,BTN_PADDING,interpolate,InterpolateXInput}=jsThis._closure;{return{width:x.value+BTN_WIDTH+BTN_PADDING,opacity:interpolate(x.value,InterpolateXInput,[0,1])};}}";
-      _f.__workletHash = 1719171425649;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/SlideToConfirm/index.js (82:37)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     var animatedBorder = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          borderColor: Animated.interpolateColor(x.value, [0, width - WIDTH_FINAL], [theme.color7, borderColor])
-        };
-      };
-
-      _f._closure = {
-        interpolateColor: Animated.interpolateColor,
-        x: x,
-        width: width,
-        WIDTH_FINAL: WIDTH_FINAL,
-        theme: {
-          color7: theme.color7
-        },
-        borderColor: borderColor
+      return {
+        borderColor: Animated.interpolateColor(x.value, [0, width - WIDTH_FINAL], [theme.color7, borderColor])
       };
-      _f.asString = "function _f(){const{interpolateColor,x,width,WIDTH_FINAL,theme,borderColor}=jsThis._closure;{return{borderColor:interpolateColor(x.value,[0,width-WIDTH_FINAL],[theme.color7,borderColor])};}}";
-      _f.__workletHash = 2946001185610;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/SlideToConfirm/index.js (89:42)";
-      _f.__optimalization = 2;
-      return _f;
-    }());
+    });
     var animatedText = Animated.useAnimatedStyle(function () {
-      var _f = function _f() {
-        return {
-          opacity: Animated.interpolate(x.value, InterpolateXInput, [1, 0], Animated.Extrapolate.CLAMP),
-          transform: [{
-            translateX: x.value
-          }]
-        };
+      return {
+        opacity: Animated.interpolate(x.value, InterpolateXInput, [1, 0], Animated.Extrapolate.CLAMP),
+        transform: [{
+          translateX: x.value
+        }]
       };
-
-      _f._closure = {
-        interpolate: Animated.interpolate,
-        x: x,
-        InterpolateXInput: InterpolateXInput,
-        Extrapolate: {
-          CLAMP: Animated.Extrapolate.CLAMP
-        }
-      };
-      _f.asString = "function _f(){const{interpolate,x,InterpolateXInput,Extrapolate}=jsThis._closure;{return{opacity:interpolate(x.value,InterpolateXInput,[1,0],Extrapolate.CLAMP),transform:[{translateX:x.value}]};}}";
-      _f.__workletHash = 460398395074;
-      _f.__location = "/Users/tom/Desktop/GitHub/atoms/src/SlideToConfirm/index.js (99:40)";
-      _f.__optimalization = 3;
-      return _f;
-    }());
+    });
     return /*#__PURE__*/React__default["default"].createElement(Wrapper$1, {
       onLayout: onLayout
     }, /*#__PURE__*/React__default["default"].createElement(RoundWrapper, {