yeet

design/components/Button/native/ButtonEllipsis.native.tsx

@@ -0,0 +1,98 @@
+// Metro module 4615 (f4616).
+import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
+import ReanimatedRexport, { useSharedValue, cancelAnimation, useAnimatedStyle, Easing } from "../../../../modules/reanimated/ReanimatedRexport";
+import { createStyles } from "../../Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import * as _timing from "../../../animation/reanimated/timing/timing";
+import { useForegroundColor } from "./ButtonHooks.native";
+import { useMountLayoutEffect } from "../../../../hooks/useMountEffect";
+let c2814_5, useStyles, withEllipsisAnimation, __initData;
+const EllipsisCircle = function EllipsisCircle(props) {
+  const { variant, size, offset } = props;
+  const styles = useStyles(size, offset, useForegroundColor(variant));
+  const sharedValue = useSharedValue(0.4);
+  const sharedValue2 = useSharedValue(0.75);
+  useMountLayoutEffect(() => {
+    sharedValue.set(_ReanimatedRexport.withDelay(166.66666666666666 * offset, _ReanimatedRexport.withRepeat(_timing.withTiming(1, c2814_5, "animate-always"), -1, true)));
+    sharedValue2.set(_ReanimatedRexport.withDelay(166.66666666666666 * offset, _ReanimatedRexport.withRepeat(_timing.withTiming(1, c2814_5, "animate-always"), -1, true)));
+    return () => {
+      cancelAnimation(sharedValue);
+      cancelAnimation(sharedValue2);
+    };
+  });
+  const w = () => ({
+    opacity: sharedValue.get(),
+    transform: [{
+      scale: sharedValue2.get()
+    }]
+  });
+  w.__closure = {
+    opacity: sharedValue,
+    scale: sharedValue2
+  };
+  w.__workletHash = 13371762734705;
+  w.__initData = __initData;
+  return <ReanimatedRexport.View style={[styles.circle, useAnimatedStyle(w)]} />;
+};
+c2814_5 = {
+  duration: 500,
+  easing: Easing.inOut(Easing.quad)
+};
+useStyles = createStyles((a0, a1, a2) => {
+  let r0, width;
+  L7: {
+    if (a0 === "lg") {
+      r0 = 4;
+      width = 8;
+    } else {
+      if (a0 !== "md" && a0 !== "sm") {
+        r0 = 4;
+        width = void 0;
+        if (a0 !== "xs") {
+          break L7;
+        }
+        r0 = 3;
+        width = 5;
+        break L7;
+      }
+      r0 = 4;
+      width = 6;
+    }
+  }
+  return {
+    circle: {
+      width,
+      height: width,
+      borderRadius: Module712.radii.round,
+      marginEnd: a1 !== 2 ? r0 : 0,
+      backgroundColor: a2
+    }
+  };
+});
+const withEllipsisAnimation2 = function withEllipsisAnimation(a0, a1) {
+  return _ReanimatedRexport.withDelay(166.66666666666666 * a0, _ReanimatedRexport.withRepeat(_timing.withTiming(a1, c2814_5, "animate-always"), -1, true));
+};
+withEllipsisAnimation2.__closure = {
+  ELLIPSIS_APPEAR_DURATION: 500,
+  withDelay: _ReanimatedRexport.withDelay,
+  withRepeat: _ReanimatedRexport.withRepeat,
+  withTiming: _timing.withTiming,
+  ELLIPSIS_APPEAR_TIMING: c2814_5
+};
+withEllipsisAnimation2.__workletHash = 2181731162311;
+withEllipsisAnimation2.__initData = {
+  code: "function withEllipsisAnimation_ButtonEllipsisNativeTsx1(offset,value){const{ELLIPSIS_APPEAR_DURATION,withDelay,withRepeat,withTiming,ELLIPSIS_APPEAR_TIMING}=this.__closure;const animationTimeMs=ELLIPSIS_APPEAR_DURATION;const animationStaggerTimeMs=animationTimeMs/3;return withDelay(offset*animationStaggerTimeMs,withRepeat(withTiming(value,ELLIPSIS_APPEAR_TIMING,'animate-always'),-1,true));}"
+};
+withEllipsisAnimation = withEllipsisAnimation2;
+__initData = {
+  code: "function ButtonEllipsisNativeTsx2(){const{opacity,scale}=this.__closure;return{opacity:opacity.get(),transform:[{scale:scale.get()}]};}"
+};
+export function Ellipsis(props) {
+  return <ReanimatedRexport.View style={{
+    flexDirection: "row"
+  }}>
+    <EllipsisCircle offset={0} {...props} />
+    <EllipsisCircle offset={1} {...props} />
+    <EllipsisCircle offset={2} {...props} />
+  </ReanimatedRexport.View>;
+}