9ddebad13c
Port of SwiftUI iOS app to Expo/React Native for cross-platform support. - Session list with repository info and status - Chat view with collapsible tool executions - Message input with model/repo/branch selection chips - PR creation flow simulation - Dark theme matching Claude Code aesthetic - KeyboardAvoidingView for proper keyboard handling https://claude.ai/code/session_018qmTB96S8xvNRQFrhcvzJp
68 lines
1.7 KiB
TypeScript
68 lines
1.7 KiB
TypeScript
import React from 'react'
|
|
import { View, TextInput, TouchableOpacity, StyleSheet } from 'react-native'
|
|
import { Ionicons } from '@expo/vector-icons'
|
|
import { Colors, Spacing, Radius } from '../theme/colors'
|
|
|
|
interface Props {
|
|
text: string
|
|
placeholder: string
|
|
onChangeText: (text: string) => void
|
|
onSend: () => void
|
|
}
|
|
|
|
const MessageInputView: React.FC<Props> = ({ text, placeholder, onChangeText, onSend }) => {
|
|
return (
|
|
<View style={styles.container}>
|
|
<View style={styles.inputWrapper}>
|
|
<TextInput
|
|
style={styles.input}
|
|
value={text}
|
|
onChangeText={onChangeText}
|
|
placeholder={placeholder}
|
|
placeholderTextColor={Colors.secondaryText}
|
|
multiline
|
|
maxLength={2000}
|
|
/>
|
|
<TouchableOpacity
|
|
style={[styles.sendButton, { opacity: text.trim() ? 1 : 0.5 }]}
|
|
onPress={onSend}
|
|
disabled={!text.trim()}
|
|
>
|
|
<Ionicons name="arrow-up" size={20} color={Colors.buttonPrimaryText} />
|
|
</TouchableOpacity>
|
|
</View>
|
|
</View>
|
|
)
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
paddingHorizontal: Spacing.MD,
|
|
},
|
|
inputWrapper: {
|
|
flexDirection: 'row',
|
|
alignItems: 'flex-end',
|
|
backgroundColor: Colors.inputBackground,
|
|
borderRadius: Radius.LG,
|
|
paddingHorizontal: Spacing.MD,
|
|
paddingVertical: Spacing.SM,
|
|
gap: Spacing.SM,
|
|
},
|
|
input: {
|
|
flex: 1,
|
|
fontSize: 16,
|
|
color: Colors.primaryText,
|
|
maxHeight: 120,
|
|
},
|
|
sendButton: {
|
|
width: 32,
|
|
height: 32,
|
|
borderRadius: 16,
|
|
backgroundColor: Colors.buttonPrimary,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
})
|
|
|
|
export default MessageInputView
|