@upstep/react-native 0.6.0 → 0.6.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@upstep/react-native",
-  "version": "0.6.0",
+  "version": "0.6.2",
   "description": "Upstep feedback SDK for React Native",
   "main": "./src/index.ts",
   "types": "./src/index.ts",
@@ -16,11 +16,13 @@
   },
   "peerDependencies": {
     "react": ">=18",
-    "react-native": ">=0.73"
+    "react-native": ">=0.73",
+    "react-native-safe-area-context": ">=4"
   },
   "devDependencies": {
     "@types/react": "^19.0.7",
     "@types/react-native": "^0.73.0",
+    "react-native-safe-area-context": "^5.8.0",
     "typescript": "^5.7.3"
   },
   "keywords": [

package/src/FeedbackSheet.tsx

@@ -12,8 +12,9 @@ import {
   ActivityIndicator,
   useColorScheme,
   Platform,
-  SafeAreaView,
+  Linking,
 } from "react-native";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
 import type { Comment, Feedback, FeedbackType, FeedbackWithComments } from "@upstep/types";
 import { useUpstep } from "./FeedbackContext";
 
@@ -65,6 +66,7 @@ export function FeedbackSheet() {
   const p = isDark ? DARK : LIGHT;
 
   const [nav, setNav] = useState<Nav>({ screen: "list" });
+  const insets = useSafeAreaInsets();
 
   // Refresh list every time the modal opens
   useEffect(() => {
@@ -165,8 +167,19 @@ export function FeedbackSheet() {
             )}
           </ScrollView>
 
-          {/* Safe area spacer */}
-          <SafeAreaView />
+          {/* Branding + safe-area bottom padding in one strip */}
+          <TouchableOpacity
+            onPress={() => Linking.openURL("https://upstep.dev")}
+            activeOpacity={0.6}
+            style={[
+              styles.poweredBy,
+              { borderTopColor: p.border, paddingBottom: insets.bottom + 10, backgroundColor: p.bg },
+            ]}
+          >
+            <Text style={[styles.poweredByText, { color: p.textFaint }]}>
+              Powered by <Text style={{ fontWeight: "700" }}>Upstep.dev</Text>
+            </Text>
+          </TouchableOpacity>
         </View>
       </KeyboardAvoidingView>
     </Modal>
@@ -239,12 +252,12 @@ function FeedCard({
           styles.voteBox,
           {
             borderColor: voted ? accent : p.border,
-            backgroundColor: voted ? accent + "1a" : p.bgSoft,
+            backgroundColor: voted ? accent : p.bgSoft,
           },
         ]}
       >
-        <Text style={[styles.voteArrow, { color: accent }]}>▲</Text>
-        <Text style={[styles.voteCount, { color: p.text }]}>{item.upvotes}</Text>
+        <Text style={[styles.voteArrow, { color: voted ? "#fff" : accent }]}>▲</Text>
+        <Text style={[styles.voteCount, { color: voted ? "#fff" : p.text }]}>{item.upvotes}</Text>
       </TouchableOpacity>
 
       <View style={styles.cardBody}>
@@ -547,9 +560,9 @@ const styles = StyleSheet.create({
     backgroundColor: "rgba(0,0,0,0.45)",
   },
 
-  // Sheet container
+  // Sheet container — fixed height so it's always fully open regardless of content
   sheet: {
-    maxHeight: "92%",
+    height: "92%",
     borderTopLeftRadius: 24,
     borderTopRightRadius: 24,
     overflow: "hidden",
@@ -580,8 +593,8 @@ const styles = StyleSheet.create({
   newBtn: { borderRadius: 20, paddingHorizontal: 14, paddingVertical: 7 },
   newBtnText: { color: "#fff", fontSize: 13, fontWeight: "700" },
 
-  // Scroll
-  scroll: { flexGrow: 0 },
+  // Scroll — flex: 1 fills all remaining space after the fixed header
+  scroll: { flex: 1 },
   scrollContent: { flexGrow: 1, padding: 16, paddingBottom: 32 },
 
   // List
@@ -663,6 +676,14 @@ const styles = StyleSheet.create({
   successTitle: { fontSize: 20, fontWeight: "700", textAlign: "center", marginBottom: 6 },
   successSub: { fontSize: 14, textAlign: "center" },
 
+  // Branding
+  poweredBy: {
+    alignItems: "center",
+    paddingVertical: 10,
+    borderTopWidth: StyleSheet.hairlineWidth,
+  },
+  poweredByText: { fontSize: 11 },
+
   // Shared badges
   badge: { paddingHorizontal: 7, paddingVertical: 3, borderRadius: 6 },
   badgeText: { fontSize: 10, fontWeight: "700", letterSpacing: 0.2 },