kasunk99-livestream-core 0.3.39 → 0.3.40

package/dist/components/LiveStreamViewerItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LiveStreamViewerItem.d.ts","sourceRoot":"","sources":["../../src/components/LiveStreamViewerItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkE,MAAM,OAAO,CAAC;AAmBvF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAmB/C,KAAK,yBAAyB,GAAG;IAC/B,MAAM,EAAE,cAAc,CAAC;IACvB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAChD,CAAC;AAmEF,eAAO,MAAM,oBAAoB,uDA0gB/B,CAAC"}
+{"version":3,"file":"LiveStreamViewerItem.d.ts","sourceRoot":"","sources":["../../src/components/LiveStreamViewerItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkE,MAAM,OAAO,CAAC;AAmBvF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAmB/C,KAAK,yBAAyB,GAAG;IAC/B,MAAM,EAAE,cAAc,CAAC;IACvB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAChD,CAAC;AAmEF,eAAO,MAAM,oBAAoB,uDAsiB/B,CAAC"}

package/dist/components/LiveStreamViewerItem.js

@@ -93,10 +93,23 @@ export const LiveStreamViewerItem = memo(function LiveStreamViewerItem({ stream,
         setIsTyping(false);
         setShowEmoji(true);
     }, []);
+    // Switches from emoji panel back to system keyboard
+    const switchToKeyboard = useCallback(() => {
+        setShowEmoji(false);
+        setIsTyping(true);
+    }, []);
+    // Focus TextInput programmatically when switching to keyboard mode (not emoji mode)
+    useEffect(() => {
+        if (isTyping && !showEmoji) {
+            const t = setTimeout(() => textInputRef.current?.focus(), 50);
+            return () => clearTimeout(t);
+        }
+    }, [isTyping, showEmoji]);
     const handleEmojiSelect = useCallback((emoji) => {
         const next = chatInputRef.current + emoji;
         chatInputRef.current = next;
         setChatInput(next);
+        // Input bar is already visible (showEmoji=true), no state change needed
     }, []);
     // Incremented every time the app returns to foreground — forces RTCView to remount,
     // which restarts the Android SurfaceView renderer that freezes during background.
@@ -128,6 +141,7 @@ export const LiveStreamViewerItem = memo(function LiveStreamViewerItem({ stream,
         if (!isActive) {
             Keyboard.dismiss();
             setIsTyping(false);
+            setShowEmoji(false);
         }
     }, [isActive]);
     const seededFromRoomState = useMemo(() => {
@@ -285,6 +299,8 @@ export const LiveStreamViewerItem = memo(function LiveStreamViewerItem({ stream,
         chatInputRef.current = '';
         setChatInput('');
         Keyboard.dismiss();
+        setShowEmoji(false);
+        setIsTyping(false);
     };
     const hostLabel = stream.hostDisplayName || stream.title || 'Live';
     const avatarLetter = hostLabel[0]?.toUpperCase() ?? 'L';
@@ -301,16 +317,16 @@ export const LiveStreamViewerItem = memo(function LiveStreamViewerItem({ stream,
                             ],
                             opacity: anim.interpolate({ inputRange: [0, 0.65, 1], outputRange: [1, 0.85, 0] }),
                         },
-                    ], children: "\u2665" }, id))) }), isTyping ? (_jsxs(View, { style: styles.inputBar, children: [_jsx(TextInput, { ref: textInputRef, style: styles.textInput, value: chatInput, onChangeText: (text) => { chatInputRef.current = text; setChatInput(text); }, placeholder: "Say something...", placeholderTextColor: "rgba(255,255,255,0.40)", editable: canType, onFocus: () => setShowEmoji(false), onSubmitEditing: sendChat, returnKeyType: "send", submitBehavior: "submit", autoFocus: true }), RNGHTouchable ? (_jsx(RNGHTouchable, { onPress: sendChat, activeOpacity: 0.75, style: [styles.sendBtn, (!hasUnsent || !joined) && styles.sendBtnOff], hitSlop: { top: 8, right: 8, bottom: 8, left: 8 }, children: IoniconsComponent
+                    ], children: "\u2665" }, id))) }), isTyping || showEmoji ? (_jsxs(View, { style: styles.inputBar, children: [_jsx(TouchableOpacity, { style: styles.emojiToggleBtn, onPress: showEmoji ? switchToKeyboard : openEmoji, activeOpacity: 0.7, hitSlop: { top: 8, bottom: 8, left: 8, right: 8 }, children: _jsx(Text, { style: [styles.bottomIconGlyph, showEmoji && styles.emojiIconActive], children: showEmoji ? '⌨' : '☺' }) }), _jsx(TextInput, { ref: textInputRef, style: styles.textInput, value: chatInput, onChangeText: (text) => { chatInputRef.current = text; setChatInput(text); }, placeholder: "Say something...", placeholderTextColor: "rgba(255,255,255,0.40)", editable: canType, onFocus: () => setShowEmoji(false), onSubmitEditing: sendChat, returnKeyType: "send", submitBehavior: "submit" }), RNGHTouchable ? (_jsx(RNGHTouchable, { onPress: sendChat, activeOpacity: 0.75, style: [styles.sendBtn, (!hasUnsent || !joined) && styles.sendBtnOff], hitSlop: { top: 8, right: 8, bottom: 8, left: 8 }, children: IoniconsComponent
                             ? _jsx(IoniconsComponent, { name: "send", size: 18, color: "#fff" })
                             : _jsx(Text, { style: styles.sendIcon, children: "\u27A4" }) })) : (_jsx(Pressable, { style: [styles.sendBtn, (!hasUnsent || !joined) && styles.sendBtnOff], onPressIn: sendChat, hitSlop: { top: 8, right: 8, bottom: 8, left: 8 }, children: IoniconsComponent
                             ? _jsx(IoniconsComponent, { name: "send", size: 18, color: "#fff" })
                             : _jsx(Text, { style: styles.sendIcon, children: "\u27A4" }) }))] })) : (
-            // Pill bar — tapping opens the input bar.
+            // Pill bar — shown when neither keyboard nor emoji panel is active
             _jsxs(View, { style: styles.bottomBar, children: [_jsx(TouchableOpacity, { style: [styles.typeTouchable, hasUnsent && styles.typeTouchableFilled], onPress: () => { if (canType) {
                             setShowEmoji(false);
                             setIsTyping(true);
-                        } }, activeOpacity: 0.7, children: _jsx(Text, { style: [styles.typePlaceholder, hasUnsent && styles.typePlaceholderFilled], numberOfLines: 1, children: hasUnsent ? chatInput : (joined && !joining ? 'Say something...' : 'Connecting...') }) }), _jsx(TouchableOpacity, { style: styles.bottomIconBtn, activeOpacity: 0.7, onPress: openEmoji, children: _jsx(Text, { style: [styles.bottomIconGlyph, showEmoji && styles.emojiIconActive], children: "\u263A" }) }), _jsx(TouchableOpacity, { style: styles.likeBtn, onPress: handleLike, activeOpacity: 0.75, children: _jsx(Text, { style: [styles.bottomIconGlyph, styles.heartIcon], children: "\u2665" }) })] })), showEmoji && !isTyping ? (_jsx(View, { style: styles.emojiContainer, children: _jsx(ScrollView, { style: styles.emojiScroll, showsVerticalScrollIndicator: false, keyboardShouldPersistTaps: "always", children: _jsx(View, { style: styles.emojiGrid, children: EMOJIS.map((emoji, idx) => (_jsx(TouchableOpacity, { style: styles.emojiCell, onPress: () => handleEmojiSelect(emoji), activeOpacity: 0.6, children: _jsx(Text, { style: styles.emojiText, children: emoji }) }, idx))) }) }) })) : null, streamEnded && (_jsx(View, { style: styles.endedOverlay, children: _jsxs(View, { style: styles.endedCard, children: [_jsx(Text, { style: styles.endedTitle, children: "Stream ended" }), _jsx(Text, { style: styles.endedSub, children: "The host has ended this live stream" })] }) }))] }));
+                        } }, activeOpacity: 0.7, children: _jsx(Text, { style: [styles.typePlaceholder, hasUnsent && styles.typePlaceholderFilled], numberOfLines: 1, children: hasUnsent ? chatInput : (joined && !joining ? 'Say something...' : 'Connecting...') }) }), _jsx(TouchableOpacity, { style: styles.bottomIconBtn, activeOpacity: 0.7, onPress: openEmoji, children: _jsx(Text, { style: styles.bottomIconGlyph, children: "\u263A" }) }), _jsx(TouchableOpacity, { style: styles.likeBtn, onPress: handleLike, activeOpacity: 0.75, children: _jsx(Text, { style: [styles.bottomIconGlyph, styles.heartIcon], children: "\u2665" }) })] })), showEmoji ? (_jsx(View, { style: styles.emojiContainer, children: _jsx(ScrollView, { style: styles.emojiScroll, showsVerticalScrollIndicator: false, keyboardShouldPersistTaps: "always", children: _jsx(View, { style: styles.emojiGrid, children: EMOJIS.map((emoji, idx) => (_jsx(TouchableOpacity, { style: styles.emojiCell, onPress: () => handleEmojiSelect(emoji), activeOpacity: 0.6, children: _jsx(Text, { style: styles.emojiText, children: emoji }) }, idx))) }) }) })) : null, streamEnded && (_jsx(View, { style: styles.endedOverlay, children: _jsxs(View, { style: styles.endedCard, children: [_jsx(Text, { style: styles.endedTitle, children: "Stream ended" }), _jsx(Text, { style: styles.endedSub, children: "The host has ended this live stream" })] }) }))] }));
 });
 // ─────────────────────────────────────────────────────────────────────────────
 const styles = StyleSheet.create({
@@ -513,6 +529,7 @@ const styles = StyleSheet.create({
     endedTitle: { color: '#fff', fontSize: 22, fontWeight: '700' },
     endedSub: { color: 'rgba(255,255,255,0.5)', fontSize: 14, textAlign: 'center', lineHeight: 20 },
     // ── Emoji picker ────────────────────────────────────────────────────────
+    emojiToggleBtn: { width: 36, height: 40, alignItems: 'center', justifyContent: 'center' },
     emojiIconActive: { color: BRAND_GREEN },
     emojiContainer: {
         height: 260,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kasunk99-livestream-core",
-  "version": "0.3.39",
+  "version": "0.3.40",
   "description": "Reusable livestream viewer/host module for React Native (Expo) — mediasoup + Socket.IO",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",