@kesha-antonov/react-native-chat 5.0.0 → 6.0.0

package/lib/components/FloatingRoundNote.js

@@ -0,0 +1,541 @@
+import { c as _c } from "react/compiler-runtime";
+import React, { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { GestureDetector, useCompetingGestures, usePanGesture, useTapGesture } from 'react-native-gesture-handler';
+import Animated, { cancelAnimation, Easing, ReduceMotion, runOnJS, useAnimatedProps, useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
+import { getExpoVideo, getSvg } from '../optional';
+import { DEFAULT_FLOATING_DOCK, FLOATING_NOTE_HIDDEN_SCALE, FLOATING_NOTE_MS, FLOATING_NOTE_SIZE, clampDrag, dockPoint, dragAlpha, settleFloatingNote } from './floatingNoteMath';
+import { useIsMessageViewable, useMediaPlaybackController, useNowPlaying } from './mediaPlayback';
+import { RING_EDGE_INSET, RING_OPACITY, RING_STROKE } from './roundNoteChrome';
+
+// Both optional, resolved the way MessageVideo and VideoNoteOverlay do: without
+// expo-video there are no round note players to float, and without SVG the
+// floating note simply has no progress ring.
+const expoVideo = getExpoVideo();
+const svg = getSvg();
+const Svg = svg ? svg.Svg ?? svg.default : null;
+const AnimatedCircle = svg?.Circle ? Animated.createAnimatedComponent(svg.Circle) : null;
+
+/** A decelerate curve, used for every floating-note animation. */
+const decelerate = Easing.out(Easing.quad);
+/** A drag starts after 0.3cm of travel; about 11pt. */
+const DRAG_START_DISTANCE = 11;
+
+/*
+ * Where the user last left it, for the next time a note floats. It lasts for the app
+ * session.
+ */
+let lastDock = DEFAULT_FLOATING_DOCK;
+
+/** The progress ring, an arc from 12 o'clock. */
+// Puts the ring on the player's position and runs it to the end. Outside the component: the
+// compiler cannot yet lower `||` or a ternary inside a `try`.
+const syncRing = (player, progress) => {
+  try {
+    const length = player.duration || 0;
+    const time = player.currentTime || 0;
+    progress.set(length > 0 ? Math.min(1, time / length) : 0);
+    if (length > 0 && player.playing) progress.set(withTiming(1, {
+      duration: Math.max(0, length - time) * 1000 / (player.playbackRate || 1),
+      easing: Easing.linear,
+      reduceMotion: ReduceMotion.Never
+    }));
+  } catch {
+    // player released
+  }
+};
+const ProgressRing = t0 => {
+  const $ = _c(4);
+  const {
+    progress
+  } = t0;
+  const radius = FLOATING_NOTE_SIZE / 2 - RING_EDGE_INSET;
+  const circumference = 2 * Math.PI * radius;
+  const arcProps = useAnimatedProps(() => ({
+    strokeDashoffset: circumference * (1 - Math.max(0, Math.min(1, progress.value)))
+  }));
+  let t1;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = [StyleSheet.absoluteFill, styles.ringRotation];
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = [circumference, circumference];
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  let t3;
+  if ($[2] !== arcProps) {
+    t3 = <View style={t1} pointerEvents="none"><Svg width="100%" height="100%"><AnimatedCircle animatedProps={arcProps} cx={FLOATING_NOTE_SIZE / 2} cy={FLOATING_NOTE_SIZE / 2} r={radius} stroke="#FFFFFF" strokeOpacity={RING_OPACITY} strokeWidth={RING_STROKE} strokeLinecap="round" fill="none" strokeDasharray={t2} /></Svg></View>;
+    $[2] = arcProps;
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+  return t3;
+};
+const FloatingNoteView = t0 => {
+  const $ = _c(62);
+  const {
+    entry,
+    isVisible,
+    area,
+    onHidden
+  } = t0;
+  const controller = useMediaPlaybackController();
+  const {
+    messageId,
+    player
+  } = entry;
+  const VideoView = expoVideo.VideoView;
+  const entryRef = useRef(entry);
+  let t1;
+  if ($[0] !== entry) {
+    t1 = () => {
+      entryRef.current = entry;
+    };
+    $[0] = entry;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  useLayoutEffect(t1);
+  let t2;
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => entryRef.current.toggle();
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  const toggle = t2;
+  let t3;
+  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = () => entryRef.current.stop();
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+  const close = t3;
+  const saveDock = _temp;
+  let t4;
+  let t5;
+  if ($[4] !== controller || $[5] !== messageId) {
+    t4 = () => {
+      if (!controller) {
+        return;
+      }
+      controller.setFloatingNote(messageId);
+      return () => {
+        if (controller.getFloatingNote() === messageId) {
+          controller.setFloatingNote(null);
+        }
+      };
+    };
+    t5 = [controller, messageId];
+    $[4] = controller;
+    $[5] = messageId;
+    $[6] = t4;
+    $[7] = t5;
+  } else {
+    t4 = $[6];
+    t5 = $[7];
+  }
+  useEffect(t4, t5);
+  const start = dockPoint(lastDock, area);
+  const x = useSharedValue(start.x);
+  const y = useSharedValue(start.y);
+  const dragStart = useSharedValue({
+    x: 0,
+    y: 0
+  });
+  const fade = useSharedValue(1);
+  const visibility = useSharedValue(0);
+  const areaSV = useSharedValue(area);
+  let t6;
+  let t7;
+  if ($[8] !== area || $[9] !== areaSV || $[10] !== x || $[11] !== y) {
+    t6 = () => {
+      areaSV.value = area;
+      const point = dockPoint(lastDock, area);
+      x.value = point.x;
+      y.value = point.y;
+    };
+    t7 = [area, areaSV, x, y];
+    $[8] = area;
+    $[9] = areaSV;
+    $[10] = x;
+    $[11] = y;
+    $[12] = t6;
+    $[13] = t7;
+  } else {
+    t6 = $[12];
+    t7 = $[13];
+  }
+  useEffect(t6, t7);
+  let t8;
+  let t9;
+  if ($[14] !== isVisible || $[15] !== onHidden || $[16] !== visibility) {
+    t8 = () => {
+      visibility.value = withTiming(isVisible ? 1 : 0, {
+        duration: FLOATING_NOTE_MS,
+        easing: decelerate
+      }, finished => {
+        if (finished && !isVisible) {
+          runOnJS(onHidden)();
+        }
+      });
+    };
+    t9 = [isVisible, visibility, onHidden];
+    $[14] = isVisible;
+    $[15] = onHidden;
+    $[16] = visibility;
+    $[17] = t8;
+    $[18] = t9;
+  } else {
+    t8 = $[17];
+    t9 = $[18];
+  }
+  useEffect(t8, t9);
+  const progress = useSharedValue(0);
+  let t10;
+  let t11;
+  if ($[19] !== player || $[20] !== progress) {
+    t10 = () => {
+      const sync = () => syncRing(player, progress);
+      sync();
+      const timer = setInterval(sync, 250);
+      return () => {
+        clearInterval(timer);
+        cancelAnimation(progress);
+      };
+    };
+    t11 = [player, progress];
+    $[19] = player;
+    $[20] = progress;
+    $[21] = t10;
+    $[22] = t11;
+  } else {
+    t10 = $[21];
+    t11 = $[22];
+  }
+  useEffect(t10, t11);
+  let t12;
+  if ($[23] !== dragStart || $[24] !== x || $[25] !== y) {
+    t12 = () => {
+      dragStart.set({
+        x: x.get(),
+        y: y.get()
+      });
+    };
+    $[23] = dragStart;
+    $[24] = x;
+    $[25] = y;
+    $[26] = t12;
+  } else {
+    t12 = $[26];
+  }
+  let t13;
+  if ($[27] !== areaSV || $[28] !== dragStart || $[29] !== fade || $[30] !== x || $[31] !== y) {
+    t13 = event => {
+      const area_0 = areaSV.get();
+      const next = clampDrag(dragStart.get().x + event.translationX, dragStart.get().y + event.translationY, area_0);
+      x.set(next.x);
+      y.set(next.y);
+      fade.set(dragAlpha(next.x, area_0.width));
+    };
+    $[27] = areaSV;
+    $[28] = dragStart;
+    $[29] = fade;
+    $[30] = x;
+    $[31] = y;
+    $[32] = t13;
+  } else {
+    t13 = $[32];
+  }
+  let t14;
+  if ($[33] !== areaSV || $[34] !== fade || $[35] !== x || $[36] !== y) {
+    t14 = event_0 => {
+      const settle = settleFloatingNote(x.get(), y.get(), event_0.velocityX, areaSV.get(), lastDock);
+      const timing = {
+        duration: FLOATING_NOTE_MS,
+        easing: decelerate
+      };
+      y.set(withTiming(settle.y, timing));
+      if (settle.isClosing) {
+        fade.set(withTiming(0, timing));
+        x.set(withTiming(settle.x, timing, finished_0 => {
+          if (finished_0) {
+            runOnJS(close)();
+          }
+        }));
+        return;
+      }
+      fade.set(withTiming(1, timing));
+      x.set(withTiming(settle.x, timing));
+      runOnJS(saveDock)(settle.dock);
+    };
+    $[33] = areaSV;
+    $[34] = fade;
+    $[35] = x;
+    $[36] = y;
+    $[37] = t14;
+  } else {
+    t14 = $[37];
+  }
+  let t15;
+  if ($[38] !== t12 || $[39] !== t13 || $[40] !== t14) {
+    t15 = {
+      minDistance: DRAG_START_DISTANCE,
+      onActivate: t12,
+      onUpdate: t13,
+      onDeactivate: t14
+    };
+    $[38] = t12;
+    $[39] = t13;
+    $[40] = t14;
+    $[41] = t15;
+  } else {
+    t15 = $[41];
+  }
+  const pan = usePanGesture(t15);
+  let t16;
+  if ($[42] === Symbol.for("react.memo_cache_sentinel")) {
+    t16 = {
+      onDeactivate: event_1 => {
+        if (!event_1.canceled) {
+          runOnJS(toggle)();
+        }
+      }
+    };
+    $[42] = t16;
+  } else {
+    t16 = $[42];
+  }
+  const tap = useTapGesture(t16);
+  const gesture = useCompetingGestures(pan, tap);
+  const containerStyle = useAnimatedStyle(() => ({
+    opacity: visibility.value * fade.value,
+    transform: [{
+      translateX: x.value
+    }, {
+      translateY: y.value
+    }, {
+      scale: FLOATING_NOTE_HIDDEN_SCALE + (1 - FLOATING_NOTE_HIDDEN_SCALE) * visibility.value
+    }]
+  }));
+  let t17;
+  if ($[43] === Symbol.for("react.memo_cache_sentinel")) {
+    t17 = event_2 => {
+      if (event_2.nativeEvent.actionName === "activate") {
+        toggle();
+      } else {
+        if (event_2.nativeEvent.actionName === "close") {
+          close();
+        }
+      }
+    };
+    $[43] = t17;
+  } else {
+    t17 = $[43];
+  }
+  const onAccessibilityAction = t17;
+  let t18;
+  if ($[44] !== containerStyle) {
+    t18 = [styles.floating, containerStyle];
+    $[44] = containerStyle;
+    $[45] = t18;
+  } else {
+    t18 = $[45];
+  }
+  const t19 = entry.isPlaying ? "pause video note" : "play video note";
+  let t20;
+  if ($[46] === Symbol.for("react.memo_cache_sentinel")) {
+    t20 = [{
+      name: "activate"
+    }, {
+      name: "close",
+      label: "close video note"
+    }];
+    $[46] = t20;
+  } else {
+    t20 = $[46];
+  }
+  let t21;
+  if ($[47] === Symbol.for("react.memo_cache_sentinel")) {
+    t21 = {
+      enable: false
+    };
+    $[47] = t21;
+  } else {
+    t21 = $[47];
+  }
+  let t22;
+  if ($[48] !== player) {
+    t22 = <VideoView style={StyleSheet.absoluteFill} player={player} fullscreenOptions={t21} allowsPictureInPicture={false} nativeControls={false} contentFit="cover" />;
+    $[48] = player;
+    $[49] = t22;
+  } else {
+    t22 = $[49];
+  }
+  let t23;
+  if ($[50] !== progress) {
+    t23 = Svg && AnimatedCircle && <ProgressRing progress={progress} />;
+    $[50] = progress;
+    $[51] = t23;
+  } else {
+    t23 = $[51];
+  }
+  let t24;
+  if ($[52] !== t22 || $[53] !== t23) {
+    t24 = <View style={styles.circle}>{t22}{t23}</View>;
+    $[52] = t22;
+    $[53] = t23;
+    $[54] = t24;
+  } else {
+    t24 = $[54];
+  }
+  let t25;
+  if ($[55] !== t18 || $[56] !== t19 || $[57] !== t24) {
+    t25 = <Animated.View style={t18} accessible={true} accessibilityRole="button" accessibilityLabel={t19} accessibilityActions={t20} onAccessibilityAction={onAccessibilityAction} onAccessibilityEscape={close}>{t24}</Animated.View>;
+    $[55] = t18;
+    $[56] = t19;
+    $[57] = t24;
+    $[58] = t25;
+  } else {
+    t25 = $[58];
+  }
+  let t26;
+  if ($[59] !== gesture || $[60] !== t25) {
+    t26 = <GestureDetector gesture={gesture}>{t25}</GestureDetector>;
+    $[59] = gesture;
+    $[60] = t25;
+    $[61] = t26;
+  } else {
+    t26 = $[61];
+  }
+  return t26;
+};
+
+/**
+ * The floating round video: while a round note is
+ * current, playing or paused, and its message has scrolled out of the list, it
+ * floats in a 120pt circle docked to the top right. A tap pauses or resumes it,
+ * it can be dragged and snaps to the side it is let go near, and throwing it
+ * off a side stops the note. It goes away once the message is back on screen,
+ * where the note carries on in its row.
+ *
+ * Drawn over the message list; render it inside the list's area.
+ */
+export function FloatingRoundNote() {
+  const $ = _c(12);
+  const live = useNowPlaying();
+  const round = live?.kind === "round" && live.player ? live : null;
+  const isViewable = useIsMessageViewable(round?.messageId);
+  const isFloating = !!round && isViewable === false;
+  const [shown, setShown] = useState(null);
+  let t0;
+  let t1;
+  if ($[0] !== isFloating || $[1] !== round) {
+    t0 = () => {
+      if (isFloating && round) {
+        setShown(round);
+      }
+    };
+    t1 = [isFloating, round];
+    $[0] = isFloating;
+    $[1] = round;
+    $[2] = t0;
+    $[3] = t1;
+  } else {
+    t0 = $[2];
+    t1 = $[3];
+  }
+  useEffect(t0, t1);
+  let t2;
+  if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => setShown(null);
+    $[4] = t2;
+  } else {
+    t2 = $[4];
+  }
+  const onHidden = t2;
+  const [area, setArea] = useState(null);
+  let t3;
+  if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = event => {
+      const {
+        width,
+        height
+      } = event.nativeEvent.layout;
+      setArea(previous => previous?.width === width && previous?.height === height ? previous : {
+        width,
+        height
+      });
+    };
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  const onLayout = t3;
+  if (!expoVideo?.VideoView) {
+    return null;
+  }
+  const entry = isFloating && round ? round : shown;
+  let t4;
+  if ($[6] !== area || $[7] !== entry || $[8] !== isFloating) {
+    t4 = entry && area && area.width > 0 && <FloatingNoteView key={String(entry.messageId)} entry={entry} isVisible={isFloating} area={area} onHidden={onHidden} />;
+    $[6] = area;
+    $[7] = entry;
+    $[8] = isFloating;
+    $[9] = t4;
+  } else {
+    t4 = $[9];
+  }
+  let t5;
+  if ($[10] !== t4) {
+    t5 = <View style={StyleSheet.absoluteFill} pointerEvents="box-none" onLayout={onLayout}>{t4}</View>;
+    $[10] = t4;
+    $[11] = t5;
+  } else {
+    t5 = $[11];
+  }
+  return t5;
+}
+const styles = StyleSheet.create({
+  floating: {
+    position: 'absolute',
+    left: 0,
+    top: 0,
+    width: FLOATING_NOTE_SIZE,
+    height: FLOATING_NOTE_SIZE,
+    borderRadius: FLOATING_NOTE_SIZE / 2,
+    // A soft shadow, drawn just below and right of it.
+    shadowColor: '#000',
+    shadowOffset: {
+      width: 0,
+      height: 2
+    },
+    shadowOpacity: 0.3,
+    shadowRadius: 4,
+    elevation: 6
+  },
+  circle: {
+    flex: 1,
+    borderRadius: FLOATING_NOTE_SIZE / 2,
+    overflow: 'hidden',
+    backgroundColor: '#000'
+  },
+  ringRotation: {
+    transform: [{
+      rotate: '-90deg'
+    }]
+  }
+});
+function _temp(dock) {
+  lastDock = dock;
+}
+//# sourceMappingURL=FloatingRoundNote.js.map

package/lib/components/FloatingRoundNote.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingRoundNote.js","names":["React","useCallback","useEffect","useLayoutEffect","useRef","useState","StyleSheet","View","GestureDetector","useCompetingGestures","usePanGesture","useTapGesture","Animated","cancelAnimation","Easing","ReduceMotion","runOnJS","useAnimatedProps","useAnimatedStyle","useSharedValue","withTiming","getExpoVideo","getSvg","DEFAULT_FLOATING_DOCK","FLOATING_NOTE_HIDDEN_SCALE","FLOATING_NOTE_MS","FLOATING_NOTE_SIZE","clampDrag","dockPoint","dragAlpha","settleFloatingNote","useIsMessageViewable","useMediaPlaybackController","useNowPlaying","RING_EDGE_INSET","RING_OPACITY","RING_STROKE","expoVideo","svg","Svg","default","AnimatedCircle","Circle","createAnimatedComponent","decelerate","out","quad","DRAG_START_DISTANCE","lastDock","syncRing","player","progress","length","duration","time","currentTime","set","Math","min","playing","max","playbackRate","easing","linear","reduceMotion","Never","ProgressRing","t0","$","_c","radius","circumference","PI","arcProps","strokeDashoffset","value","t1","Symbol","for","absoluteFill","styles","ringRotation","t2","t3","FloatingNoteView","entry","isVisible","area","onHidden","controller","messageId","VideoView","entryRef","current","toggle","stop","close","saveDock","_temp","t4","t5","setFloatingNote","getFloatingNote","start","x","y","dragStart","fade","visibility","areaSV","t6","t7","point","t8","t9","finished","t10","t11","sync","timer","setInterval","clearInterval","t12","get","t13","event","area_0","next","translationX","translationY","width","t14","event_0","settle","velocityX","timing","isClosing","finished_0","dock","t15","minDistance","onActivate","onUpdate","onDeactivate","pan","t16","event_1","canceled","tap","gesture","containerStyle","opacity","transform","translateX","translateY","scale","t17","event_2","nativeEvent","actionName","onAccessibilityAction","t18","floating","t19","isPlaying","t20","name","label","t21","enable","t22","t23","t24","circle","t25","t26","FloatingRoundNote","live","round","kind","isViewable","isFloating","shown","setShown","setArea","height","layout","previous","onLayout","String","create","position","left","top","borderRadius","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","flex","overflow","backgroundColor","rotate"],"sources":["../../src/components/FloatingRoundNote.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react'\nimport { LayoutChangeEvent, StyleSheet, View } from 'react-native'\nimport { GestureDetector, useCompetingGestures, usePanGesture, useTapGesture } from 'react-native-gesture-handler'\nimport Animated, {\n  cancelAnimation,\n  Easing,\n  ReduceMotion,\n  SharedValue,\n  runOnJS,\n  useAnimatedProps,\n  useAnimatedStyle,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated'\n\nimport { getExpoVideo, getSvg } from '../optional'\nimport {\n  DEFAULT_FLOATING_DOCK,\n  FLOATING_NOTE_HIDDEN_SCALE,\n  FLOATING_NOTE_MS,\n  FLOATING_NOTE_SIZE,\n  FloatingArea,\n  FloatingDock,\n  clampDrag,\n  dockPoint,\n  dragAlpha,\n  settleFloatingNote,\n} from './floatingNoteMath'\nimport {\n  NowPlayingEntry,\n  useIsMessageViewable,\n  useMediaPlaybackController,\n  useNowPlaying,\n} from './mediaPlayback'\nimport { RING_EDGE_INSET, RING_OPACITY, RING_STROKE } from './roundNoteChrome'\n\n// Both optional, resolved the way MessageVideo and VideoNoteOverlay do: without\n// expo-video there are no round note players to float, and without SVG the\n// floating note simply has no progress ring.\nconst expoVideo = getExpoVideo()\n\nconst svg = getSvg()\nconst Svg: any = svg ? svg.Svg ?? svg.default : null\nconst AnimatedCircle: any = svg?.Circle ? Animated.createAnimatedComponent(svg.Circle) : null\n\n/** A decelerate curve, used for every floating-note animation. */\nconst decelerate = Easing.out(Easing.quad)\n/** A drag starts after 0.3cm of travel; about 11pt. */\nconst DRAG_START_DISTANCE = 11\n\n/*\n * Where the user last left it, for the next time a note floats. It lasts for the app\n * session.\n */\nlet lastDock: FloatingDock = DEFAULT_FLOATING_DOCK\n\n/** The progress ring, an arc from 12 o'clock. */\n// Puts the ring on the player's position and runs it to the end. Outside the component: the\n// compiler cannot yet lower `||` or a ternary inside a `try`.\nconst syncRing = (player: any, progress: SharedValue<number>) => {\n  try {\n    const length = player.duration || 0\n    const time = player.currentTime || 0\n    progress.set(length > 0 ? Math.min(1, time / length) : 0)\n    if (length > 0 && player.playing)\n      progress.set(withTiming(1, {\n        duration: Math.max(0, length - time) * 1000 / (player.playbackRate || 1),\n        easing: Easing.linear,\n        reduceMotion: ReduceMotion.Never,\n      }))\n  } catch {\n    // player released\n  }\n}\n\nconst ProgressRing = ({ progress }: { progress: SharedValue<number> }) => {\n  const radius = FLOATING_NOTE_SIZE / 2 - RING_EDGE_INSET\n  const circumference = 2 * Math.PI * radius\n  const arcProps = useAnimatedProps(() => ({\n    strokeDashoffset: circumference * (1 - Math.max(0, Math.min(1, progress.value))),\n  }))\n\n  return (\n    <View style={[StyleSheet.absoluteFill, styles.ringRotation]} pointerEvents='none'>\n      <Svg width='100%' height='100%'>\n        <AnimatedCircle\n          animatedProps={arcProps}\n          cx={FLOATING_NOTE_SIZE / 2}\n          cy={FLOATING_NOTE_SIZE / 2}\n          r={radius}\n          stroke='#FFFFFF'\n          strokeOpacity={RING_OPACITY}\n          strokeWidth={RING_STROKE}\n          strokeLinecap='round'\n          fill='none'\n          strokeDasharray={[circumference, circumference]}\n        />\n      </Svg>\n    </View>\n  )\n}\n\ninterface FloatingNoteViewProps {\n  entry: NowPlayingEntry\n  isVisible: boolean\n  area: FloatingArea\n  onHidden: () => void\n}\n\nconst FloatingNoteView = ({ entry, isVisible, area, onHidden }: FloatingNoteViewProps) => {\n  const controller = useMediaPlaybackController()\n  const { messageId, player } = entry as NowPlayingEntry & { player: any }\n  const VideoView = expoVideo.VideoView\n\n  const entryRef = useRef(entry)\n  useLayoutEffect(() => {\n    entryRef.current = entry\n  })\n  const toggle = useCallback(() => entryRef.current.toggle(), [])\n  const close = useCallback(() => entryRef.current.stop(), [])\n  const saveDock = useCallback((dock: FloatingDock) => {\n    lastDock = dock\n  }, [])\n\n  // Lets the row know its picture is drawn here, so on Android it can take\n  // the player back once this view is gone.\n  useEffect(() => {\n    if (!controller)\n      return\n\n    controller.setFloatingNote(messageId)\n    return () => {\n      if (controller.getFloatingNote() === messageId)\n        controller.setFloatingNote(null)\n    }\n  }, [controller, messageId])\n\n  const start = dockPoint(lastDock, area)\n  const x = useSharedValue(start.x)\n  const y = useSharedValue(start.y)\n  const dragStart = useSharedValue({ x: 0, y: 0 })\n  const fade = useSharedValue(1)\n  const visibility = useSharedValue(0)\n  const areaSV = useSharedValue(area)\n\n  // Re-dock when the area changes size (rotation, keyboard), recomputing the\n  // position from the remembered side.\n  useEffect(() => {\n    areaSV.value = area\n    const point = dockPoint(lastDock, area)\n    x.value = point.x\n    y.value = point.y\n  }, [area, areaSV, x, y])\n\n  // Appear and disappear: scale 0.8 <-> 1 with a fade (`runShowHideAnimation`).\n  useEffect(() => {\n    visibility.value = withTiming(isVisible ? 1 : 0, { duration: FLOATING_NOTE_MS, easing: decelerate }, finished => {\n      if (finished && !isVisible)\n        runOnJS(onHidden)()\n    })\n  }, [isVisible, visibility, onHidden])\n\n  // The ring follows playback. expo-video has no progress callback, so, as in the row, the ring\n  // runs to the end on the UI thread and the JS thread puts it back on the player's real\n  // position four times a second.\n  const progress = useSharedValue(0)\n  useEffect(() => {\n    const sync = () => syncRing(player, progress)\n    sync()\n    const timer = setInterval(sync, 250)\n    return () => {\n      clearInterval(timer)\n      cancelAnimation(progress)\n    }\n  }, [player, progress])\n\n  const pan = usePanGesture({\n    minDistance: DRAG_START_DISTANCE,\n    onActivate: () => {\n      dragStart.set({ x: x.get(), y: y.get() })\n    },\n    onUpdate: event => {\n      const area = areaSV.get()\n      const next = clampDrag(dragStart.get().x + event.translationX, dragStart.get().y + event.translationY, area)\n      x.set(next.x)\n      y.set(next.y)\n      fade.set(dragAlpha(next.x, area.width))\n    },\n    onDeactivate: event => {\n      const settle = settleFloatingNote(x.get(), y.get(), event.velocityX, areaSV.get(), lastDock)\n      const timing = { duration: FLOATING_NOTE_MS, easing: decelerate }\n      y.set(withTiming(settle.y, timing))\n      if (settle.isClosing) {\n        // Thrown off the side: slide out, then stop playback\n        // (`animateToBoundsMaybe` -> `close` -> `onCloseRunnable`).\n        fade.set(withTiming(0, timing))\n        x.set(withTiming(settle.x, timing, finished => {\n          if (finished)\n            runOnJS(close)()\n        }))\n        return\n      }\n\n      fade.set(withTiming(1, timing))\n      x.set(withTiming(settle.x, timing))\n      runOnJS(saveDock)(settle.dock)\n    },\n  })\n\n  // A tap without a drag pauses or resumes it.\n  const tap = useTapGesture({\n    onDeactivate: event => {\n      if (!event.canceled)\n        runOnJS(toggle)()\n    },\n  })\n\n  const gesture = useCompetingGestures(pan, tap)\n\n  const containerStyle = useAnimatedStyle(() => ({\n    opacity: visibility.value * fade.value,\n    transform: [\n      { translateX: x.value },\n      { translateY: y.value },\n      { scale: FLOATING_NOTE_HIDDEN_SCALE + (1 - FLOATING_NOTE_HIDDEN_SCALE) * visibility.value },\n    ],\n  }))\n\n  const onAccessibilityAction = useCallback((event: { nativeEvent: { actionName: string } }) => {\n    if (event.nativeEvent.actionName === 'activate')\n      toggle()\n    else if (event.nativeEvent.actionName === 'close')\n      close()\n  }, [toggle, close])\n\n  return (\n    <GestureDetector gesture={gesture}>\n      <Animated.View\n        style={[styles.floating, containerStyle]}\n        accessible\n        accessibilityRole='button'\n        accessibilityLabel={entry.isPlaying ? 'pause video note' : 'play video note'}\n        accessibilityActions={[\n          { name: 'activate' },\n          { name: 'close', label: 'close video note' },\n        ]}\n        onAccessibilityAction={onAccessibilityAction}\n        onAccessibilityEscape={close}\n      >\n        <View style={styles.circle}>\n          <VideoView\n            style={StyleSheet.absoluteFill}\n            player={player}\n            fullscreenOptions={{ enable: false }}\n            allowsPictureInPicture={false}\n            nativeControls={false}\n            contentFit='cover'\n          />\n          {Svg && AnimatedCircle && <ProgressRing progress={progress} />}\n        </View>\n      </Animated.View>\n    </GestureDetector>\n  )\n}\n\n/**\n * The floating round video: while a round note is\n * current, playing or paused, and its message has scrolled out of the list, it\n * floats in a 120pt circle docked to the top right. A tap pauses or resumes it,\n * it can be dragged and snaps to the side it is let go near, and throwing it\n * off a side stops the note. It goes away once the message is back on screen,\n * where the note carries on in its row.\n *\n * Drawn over the message list; render it inside the list's area.\n */\nexport function FloatingRoundNote () {\n  const live = useNowPlaying()\n  const round = live?.kind === 'round' && live.player ? live : null\n  const isViewable = useIsMessageViewable(round?.messageId)\n  // `undefined` means the list has not reported yet: do not float on a guess.\n  const isFloating = !!round && isViewable === false\n\n  // Keep the last note while it animates away.\n  const [shown, setShown] = useState<NowPlayingEntry | null>(null)\n  useEffect(() => {\n    if (isFloating && round)\n      setShown(round)\n  }, [isFloating, round])\n  const onHidden = useCallback(() => setShown(null), [])\n\n  const [area, setArea] = useState<FloatingArea | null>(null)\n  const onLayout = useCallback((event: LayoutChangeEvent) => {\n    const { width, height } = event.nativeEvent.layout\n    setArea(previous => (previous?.width === width && previous?.height === height ? previous : { width, height }))\n  }, [])\n\n  if (!expoVideo?.VideoView)\n    return null\n\n  // While visible, follow the live entry (play state, controls); a different\n  // note becoming current swaps the view, reopening the floating circle.\n  const entry = isFloating && round ? round : shown\n\n  return (\n    <View style={StyleSheet.absoluteFill} pointerEvents='box-none' onLayout={onLayout}>\n      {entry && area && area.width > 0 && (\n        <FloatingNoteView\n          key={String(entry.messageId)}\n          entry={entry}\n          isVisible={isFloating}\n          area={area}\n          onHidden={onHidden}\n        />\n      )}\n    </View>\n  )\n}\n\nconst styles = StyleSheet.create({\n  floating: {\n    position: 'absolute',\n    left: 0,\n    top: 0,\n    width: FLOATING_NOTE_SIZE,\n    height: FLOATING_NOTE_SIZE,\n    borderRadius: FLOATING_NOTE_SIZE / 2,\n    // A soft shadow, drawn just below and right of it.\n    shadowColor: '#000',\n    shadowOffset: { width: 0, height: 2 },\n    shadowOpacity: 0.3,\n    shadowRadius: 4,\n    elevation: 6,\n  },\n  circle: {\n    flex: 1,\n    borderRadius: FLOATING_NOTE_SIZE / 2,\n    overflow: 'hidden',\n    backgroundColor: '#000',\n  },\n  ringRotation: {\n    transform: [{ rotate: '-90deg' }],\n  },\n})\n"],"mappings":"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","ignoreList":[]}

package/lib/components/GlassSurface.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+export interface GlassSurfaceProps {
+    /** The translucent fill; drawn opaque when there is no blur behind it. */
+    color: string;
+    /** The thin light edge around the surface. */
+    borderColor?: string;
+    style?: StyleProp<ViewStyle>;
+}
+/**
+ * A "glass" surface: a blur of what is behind it
+ * under its fill at 85%, with a thin light stroke. Without `expo-blur` the fill is drawn
+ * opaque, as with blur turned off. Fills its parent; give the parent the shape.
+ */
+export declare const GlassSurface: ({ color, borderColor, style }: GlassSurfaceProps) => React.JSX.Element;
+//# sourceMappingURL=GlassSurface.d.ts.map

package/lib/components/GlassSurface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlassSurface.d.ts","sourceRoot":"","sources":["../../src/components/GlassSurface.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,SAAS,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAA;AAMrE,MAAM,WAAW,iBAAiB;IAChC,0EAA0E;IAC1E,KAAK,EAAE,MAAM,CAAA;IACb,8CAA8C;IAC9C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAC7B;AAMD;;;;GAIG;AACH,eAAO,MAAM,YAAY,GAAI,+BAA+B,iBAAiB,sBAgC5E,CAAA"}