feat(components): LiveDot pulsing indicator

src/components/LiveDot.tsx

@@ -0,0 +1,36 @@
+import React from 'react';
+import { StyleSheet, type ViewStyle } from 'react-native';
+import Animated from 'react-native-reanimated';
+import { colors } from '../theme';
+import { usePulseAnimation } from '../hooks/usePulseAnimation';
+
+type Props = {
+  readonly live: boolean;
+  readonly size?: number;
+  readonly testID?: string;
+};
+
+export function LiveDot({ live, size = 8, testID }: Props) {
+  const animatedStyle = usePulseAnimation(live);
+  const dotStyle: ViewStyle = {
+    width: size,
+    height: size,
+    borderRadius: size / 2,
+    backgroundColor: live ? colors.success : colors.textDim,
+  };
+
+  return (
+    <Animated.View
+      accessibilityLabel={live ? 'AO VIVO' : 'INATIVO'}
+      accessibilityRole="image"
+      style={[styles.base, dotStyle, animatedStyle]}
+      testID={testID}
+    />
+  );
+}
+
+const styles = StyleSheet.create({
+  base: {
+    alignSelf: 'center',
+  },
+});