Live video on the AT Protocol
1import { X } from "@tamagui/lucide-icons";
2import { Button, View, ViewProps } from "tamagui";
3
4export default function Popup({
5 onClose,
6 containerProps: viewProps,
7 bubbleProps: bubbleProps,
8 children,
9 onPress,
10}: {
11 onClose: () => void;
12 onPress?: () => void;
13 containerProps: ViewProps;
14 bubbleProps: ViewProps;
15 children: React.ReactNode;
16}) {
17 return (
18 <View
19 position="absolute"
20 bottom="$8"
21 f={1}
22 alignItems="center"
23 width="100%"
24 {...viewProps}
25 >
26 <View
27 f={1}
28 alignItems="stretch"
29 padding="$4"
30 borderRadius="$4"
31 onPress={() => {
32 if (onPress) {
33 onPress();
34 }
35 }}
36 position="relative"
37 boxShadow="0 0 10px 0 rgba(0, 0, 0, 0.1)"
38 {...bubbleProps}
39 >
40 <Button
41 position="absolute"
42 top="$0"
43 right="$0"
44 onPress={(e) => {
45 e.stopPropagation();
46 onClose();
47 }}
48 marginRight={-15}
49 marginTop={-5}
50 backgroundColor="transparent"
51 >
52 <X />
53 </Button>
54 {children}
55 </View>
56 </View>
57 );
58}