@bbearai/react-native 0.4.1 → 0.5.0

package/dist/index.js

@@ -11393,7 +11393,7 @@ function shouldShowDeprecationWarning() {
 }
 if (shouldShowDeprecationWarning()) console.warn("\u26A0\uFE0F  Node.js 18 and below are deprecated and will no longer be supported in future versions of @supabase/supabase-js. Please upgrade to Node.js 20 or later. For more information, visit: https://github.com/orgs/supabase/discussions/37217");
 
-// ../core/dist/index.mjs
+// node_modules/@bbearai/core/dist/index.mjs
 var MAX_CONSOLE_LOGS = 50;
 var MAX_NETWORK_REQUESTS = 20;
 var MAX_NAVIGATION_HISTORY = 20;
@@ -14021,10 +14021,19 @@ var import_react_native5 = require("react-native");
 function TestListScreen({ nav }) {
   const { assignments, currentAssignment, refreshAssignments } = useBugBear();
   const [filter, setFilter] = (0, import_react5.useState)("all");
+  const [roleFilter, setRoleFilter] = (0, import_react5.useState)(null);
   const [collapsedFolders, setCollapsedFolders] = (0, import_react5.useState)(/* @__PURE__ */ new Set());
   (0, import_react5.useEffect)(() => {
     refreshAssignments();
   }, []);
+  const availableRoles = (0, import_react5.useMemo)(() => {
+    const roleMap = /* @__PURE__ */ new Map();
+    for (const a of assignments) {
+      if (a.testCase.role) roleMap.set(a.testCase.role.id, a.testCase.role);
+    }
+    return Array.from(roleMap.values());
+  }, [assignments]);
+  const selectedRole = availableRoles.find((r) => r.id === roleFilter);
   const groupedAssignments = (0, import_react5.useMemo)(() => {
     const groups = /* @__PURE__ */ new Map();
     for (const assignment of assignments) {
@@ -14068,16 +14077,39 @@ function TestListScreen({ nav }) {
     });
   }, []);
   const filterAssignment = (a) => {
+    if (roleFilter && a.testCase.role?.id !== roleFilter) return false;
     if (filter === "pending") return a.status === "pending" || a.status === "in_progress";
     if (filter === "completed") return a.status === "passed" || a.status === "failed";
     return true;
   };
-  return /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, null, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.filterBar }, ["all", "pending", "completed"].map((f) => /* @__PURE__ */ import_react5.default.createElement(import_react_native5.TouchableOpacity, { key: f, style: [styles3.filterBtn, filter === f && styles3.filterBtnActive], onPress: () => setFilter(f) }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: [styles3.filterBtnText, filter === f && styles3.filterBtnTextActive] }, f === "all" ? `All (${assignments.length})` : f === "pending" ? `To Do (${assignments.filter((a) => a.status === "pending" || a.status === "in_progress").length})` : `Done (${assignments.filter((a) => a.status === "passed" || a.status === "failed").length})`)))), groupedAssignments.map((folder) => {
+  return /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, null, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.filterBar }, ["all", "pending", "completed"].map((f) => /* @__PURE__ */ import_react5.default.createElement(import_react_native5.TouchableOpacity, { key: f, style: [styles3.filterBtn, filter === f && styles3.filterBtnActive], onPress: () => setFilter(f) }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: [styles3.filterBtnText, filter === f && styles3.filterBtnTextActive] }, f === "all" ? `All (${assignments.length})` : f === "pending" ? `To Do (${assignments.filter((a) => a.status === "pending" || a.status === "in_progress").length})` : `Done (${assignments.filter((a) => a.status === "passed" || a.status === "failed").length})`)))), availableRoles.length >= 2 && /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.roleSection }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, style: styles3.roleBar }, /* @__PURE__ */ import_react5.default.createElement(
+    import_react_native5.TouchableOpacity,
+    {
+      style: [styles3.roleBtn, !roleFilter && styles3.roleBtnActive],
+      onPress: () => setRoleFilter(null)
+    },
+    /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: [styles3.roleBtnText, !roleFilter && styles3.roleBtnTextActive] }, "All Roles")
+  ), availableRoles.map((role) => {
+    const isActive = roleFilter === role.id;
+    return /* @__PURE__ */ import_react5.default.createElement(
+      import_react_native5.TouchableOpacity,
+      {
+        key: role.id,
+        style: [
+          styles3.roleBtn,
+          isActive && { backgroundColor: role.color + "20", borderColor: role.color + "60", borderWidth: 1 }
+        ],
+        onPress: () => setRoleFilter(isActive ? null : role.id)
+      },
+      /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: [styles3.roleDot, { backgroundColor: role.color }] }),
+      /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: [styles3.roleBtnText, isActive && { color: role.color, fontWeight: "600" }] }, role.name)
+    );
+  })), selectedRole?.loginHint && /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: [styles3.loginHint, { backgroundColor: selectedRole.color + "10", borderColor: selectedRole.color + "30" }] }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.loginHintText }, "Log in as: ", selectedRole.loginHint))), groupedAssignments.map((folder) => {
     const folderId = folder.group?.id || "ungrouped";
     const isCollapsed = collapsedFolders.has(folderId);
     const filtered = folder.assignments.filter(filterAssignment);
     if (filtered.length === 0 && filter !== "all") return null;
-    return /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { key: folderId, style: styles3.folder }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.TouchableOpacity, { style: styles3.folderHeader, onPress: () => toggleFolder(folderId) }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.folderToggle }, isCollapsed ? "\u25B6" : "\u25BC"), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.folderName }, folder.group?.name || "Ungrouped"), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.folderProgress }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: [styles3.folderProgressFill, { width: `${Math.round((folder.stats.passed + folder.stats.failed) / folder.stats.total * 100)}%` }] })), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.folderCount }, folder.stats.passed + folder.stats.failed, "/", folder.stats.total)), !isCollapsed && filtered.map((assignment) => {
+    return /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { key: folderId, style: styles3.folder }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.TouchableOpacity, { style: styles3.folderHeader, onPress: () => toggleFolder(folderId) }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.folderToggle }, isCollapsed ? "\u25B6" : "\u25BC"), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.folderName, numberOfLines: 1 }, folder.group?.name || "Ungrouped"), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.folderProgress }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: [styles3.folderProgressFill, { width: `${folder.stats.total > 0 ? Math.round((folder.stats.passed + folder.stats.failed) / folder.stats.total * 100) : 0}%` }] })), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.folderCount }, folder.stats.passed + folder.stats.failed, "/", folder.stats.total)), !isCollapsed && filtered.map((assignment) => {
       const badge = getStatusBadge(assignment.status);
       const isCurrent = currentAssignment?.id === assignment.id;
       return /* @__PURE__ */ import_react5.default.createElement(
@@ -14088,17 +14120,28 @@ function TestListScreen({ nav }) {
           onPress: () => nav.push({ name: "TEST_DETAIL", testId: assignment.id })
         },
         /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.testBadge }, badge.icon),
-        /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.testInfo }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.testTitle, numberOfLines: 1 }, assignment.testCase.title), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.testMetaRow }, assignment.isVerification && /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.retestTag }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.retestTagText }, "Retest")), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.testMeta }, assignment.testCase.key, " \xB7 ", assignment.testCase.priority)))
+        /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.testInfo }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.testTitle, numberOfLines: 1 }, assignment.testCase.title), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.testMetaRow }, assignment.isVerification && /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.retestTag }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.retestTagText }, "Retest")), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.testMeta }, assignment.testCase.testKey, " \xB7 ", assignment.testCase.priority), assignment.testCase.role && /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: styles3.roleBadgeRow }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.testMeta }, " \xB7 "), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.View, { style: [styles3.roleBadgeDot, { backgroundColor: assignment.testCase.role.color }] }), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: [styles3.testMeta, { color: assignment.testCase.role.color, fontWeight: "500" }] }, assignment.testCase.role.name))))
       );
     }));
-  }), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.TouchableOpacity, { style: styles3.refreshBtn, onPress: refreshAssignments }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.refreshText }, "\u21BB Refresh")));
+  }), /* @__PURE__ */ import_react5.default.createElement(import_react_native5.TouchableOpacity, { style: styles3.refreshBtn, onPress: refreshAssignments }, /* @__PURE__ */ import_react5.default.createElement(import_react_native5.Text, { style: styles3.refreshText }, "\u21BB", " Refresh")));
 }
 var styles3 = import_react_native5.StyleSheet.create({
-  filterBar: { flexDirection: "row", gap: 8, marginBottom: 16 },
+  filterBar: { flexDirection: "row", gap: 8, marginBottom: 8 },
   filterBtn: { paddingHorizontal: 12, paddingVertical: 6, borderRadius: 8, backgroundColor: colors.card, borderWidth: 1, borderColor: colors.border },
   filterBtnActive: { backgroundColor: colors.blue, borderColor: colors.blue },
   filterBtnText: { fontSize: 12, color: colors.textSecondary },
   filterBtnTextActive: { color: "#fff", fontWeight: "600" },
+  roleSection: { marginBottom: 12 },
+  roleBar: { flexDirection: "row", marginBottom: 6 },
+  roleBtn: { flexDirection: "row", alignItems: "center", gap: 5, paddingHorizontal: 10, paddingVertical: 4, borderRadius: 6, marginRight: 6, borderWidth: 1, borderColor: "transparent" },
+  roleBtnActive: { backgroundColor: colors.card, borderColor: colors.border },
+  roleBtnText: { fontSize: 11, color: colors.textMuted },
+  roleBtnTextActive: { color: colors.textPrimary, fontWeight: "600" },
+  roleDot: { width: 6, height: 6, borderRadius: 3 },
+  loginHint: { borderRadius: 6, padding: 8, borderWidth: 1 },
+  loginHintText: { fontSize: 11, color: colors.textSecondary },
+  roleBadgeRow: { flexDirection: "row", alignItems: "center", gap: 3 },
+  roleBadgeDot: { width: 5, height: 5, borderRadius: 3 },
   folder: { marginBottom: 12 },
   folderHeader: { flexDirection: "row", alignItems: "center", gap: 8, paddingVertical: 8, paddingHorizontal: 4 },
   folderToggle: { fontSize: 10, color: colors.textMuted, width: 14 },
@@ -14111,7 +14154,7 @@ var styles3 = import_react_native5.StyleSheet.create({
   testBadge: { fontSize: 16, marginRight: 10, width: 20 },
   testInfo: { flex: 1 },
   testTitle: { fontSize: 14, color: colors.textPrimary, marginBottom: 2 },
-  testMetaRow: { flexDirection: "row", alignItems: "center", gap: 6 },
+  testMetaRow: { flexDirection: "row", alignItems: "center", gap: 6, flexWrap: "wrap" },
   retestTag: { backgroundColor: "#422006", borderWidth: 1, borderColor: "#854d0e", borderRadius: 4, paddingHorizontal: 5, paddingVertical: 1 },
   retestTagText: { fontSize: 10, fontWeight: "600", color: "#fbbf24" },
   testMeta: { fontSize: 11, color: colors.textDim },

package/dist/index.mjs

@@ -11360,7 +11360,7 @@ function shouldShowDeprecationWarning() {
 }
 if (shouldShowDeprecationWarning()) console.warn("\u26A0\uFE0F  Node.js 18 and below are deprecated and will no longer be supported in future versions of @supabase/supabase-js. Please upgrade to Node.js 20 or later. For more information, visit: https://github.com/orgs/supabase/discussions/37217");
 
-// ../core/dist/index.mjs
+// node_modules/@bbearai/core/dist/index.mjs
 var MAX_CONSOLE_LOGS = 50;
 var MAX_NETWORK_REQUESTS = 20;
 var MAX_NAVIGATION_HISTORY = 20;
@@ -13220,7 +13220,7 @@ import {
   Image as Image3,
   TouchableOpacity as TouchableOpacity12,
   Modal as Modal2,
-  ScrollView as ScrollView2,
+  ScrollView as ScrollView3,
   StyleSheet as StyleSheet14,
   Dimensions as Dimensions2,
   KeyboardAvoidingView,
@@ -13999,14 +13999,23 @@ var styles2 = StyleSheet3.create({
 
 // src/widget/screens/TestListScreen.tsx
 import React4, { useState as useState3, useMemo as useMemo2, useCallback as useCallback3, useEffect as useEffect4 } from "react";
-import { View as View3, Text as Text3, TouchableOpacity as TouchableOpacity3, StyleSheet as StyleSheet4 } from "react-native";
+import { View as View3, Text as Text3, TouchableOpacity as TouchableOpacity3, StyleSheet as StyleSheet4, ScrollView } from "react-native";
 function TestListScreen({ nav }) {
   const { assignments, currentAssignment, refreshAssignments } = useBugBear();
   const [filter, setFilter] = useState3("all");
+  const [roleFilter, setRoleFilter] = useState3(null);
   const [collapsedFolders, setCollapsedFolders] = useState3(/* @__PURE__ */ new Set());
   useEffect4(() => {
     refreshAssignments();
   }, []);
+  const availableRoles = useMemo2(() => {
+    const roleMap = /* @__PURE__ */ new Map();
+    for (const a of assignments) {
+      if (a.testCase.role) roleMap.set(a.testCase.role.id, a.testCase.role);
+    }
+    return Array.from(roleMap.values());
+  }, [assignments]);
+  const selectedRole = availableRoles.find((r) => r.id === roleFilter);
   const groupedAssignments = useMemo2(() => {
     const groups = /* @__PURE__ */ new Map();
     for (const assignment of assignments) {
@@ -14050,16 +14059,39 @@ function TestListScreen({ nav }) {
     });
   }, []);
   const filterAssignment = (a) => {
+    if (roleFilter && a.testCase.role?.id !== roleFilter) return false;
     if (filter === "pending") return a.status === "pending" || a.status === "in_progress";
     if (filter === "completed") return a.status === "passed" || a.status === "failed";
     return true;
   };
-  return /* @__PURE__ */ React4.createElement(View3, null, /* @__PURE__ */ React4.createElement(View3, { style: styles3.filterBar }, ["all", "pending", "completed"].map((f) => /* @__PURE__ */ React4.createElement(TouchableOpacity3, { key: f, style: [styles3.filterBtn, filter === f && styles3.filterBtnActive], onPress: () => setFilter(f) }, /* @__PURE__ */ React4.createElement(Text3, { style: [styles3.filterBtnText, filter === f && styles3.filterBtnTextActive] }, f === "all" ? `All (${assignments.length})` : f === "pending" ? `To Do (${assignments.filter((a) => a.status === "pending" || a.status === "in_progress").length})` : `Done (${assignments.filter((a) => a.status === "passed" || a.status === "failed").length})`)))), groupedAssignments.map((folder) => {
+  return /* @__PURE__ */ React4.createElement(View3, null, /* @__PURE__ */ React4.createElement(View3, { style: styles3.filterBar }, ["all", "pending", "completed"].map((f) => /* @__PURE__ */ React4.createElement(TouchableOpacity3, { key: f, style: [styles3.filterBtn, filter === f && styles3.filterBtnActive], onPress: () => setFilter(f) }, /* @__PURE__ */ React4.createElement(Text3, { style: [styles3.filterBtnText, filter === f && styles3.filterBtnTextActive] }, f === "all" ? `All (${assignments.length})` : f === "pending" ? `To Do (${assignments.filter((a) => a.status === "pending" || a.status === "in_progress").length})` : `Done (${assignments.filter((a) => a.status === "passed" || a.status === "failed").length})`)))), availableRoles.length >= 2 && /* @__PURE__ */ React4.createElement(View3, { style: styles3.roleSection }, /* @__PURE__ */ React4.createElement(ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, style: styles3.roleBar }, /* @__PURE__ */ React4.createElement(
+    TouchableOpacity3,
+    {
+      style: [styles3.roleBtn, !roleFilter && styles3.roleBtnActive],
+      onPress: () => setRoleFilter(null)
+    },
+    /* @__PURE__ */ React4.createElement(Text3, { style: [styles3.roleBtnText, !roleFilter && styles3.roleBtnTextActive] }, "All Roles")
+  ), availableRoles.map((role) => {
+    const isActive = roleFilter === role.id;
+    return /* @__PURE__ */ React4.createElement(
+      TouchableOpacity3,
+      {
+        key: role.id,
+        style: [
+          styles3.roleBtn,
+          isActive && { backgroundColor: role.color + "20", borderColor: role.color + "60", borderWidth: 1 }
+        ],
+        onPress: () => setRoleFilter(isActive ? null : role.id)
+      },
+      /* @__PURE__ */ React4.createElement(View3, { style: [styles3.roleDot, { backgroundColor: role.color }] }),
+      /* @__PURE__ */ React4.createElement(Text3, { style: [styles3.roleBtnText, isActive && { color: role.color, fontWeight: "600" }] }, role.name)
+    );
+  })), selectedRole?.loginHint && /* @__PURE__ */ React4.createElement(View3, { style: [styles3.loginHint, { backgroundColor: selectedRole.color + "10", borderColor: selectedRole.color + "30" }] }, /* @__PURE__ */ React4.createElement(Text3, { style: styles3.loginHintText }, "Log in as: ", selectedRole.loginHint))), groupedAssignments.map((folder) => {
     const folderId = folder.group?.id || "ungrouped";
     const isCollapsed = collapsedFolders.has(folderId);
     const filtered = folder.assignments.filter(filterAssignment);
     if (filtered.length === 0 && filter !== "all") return null;
-    return /* @__PURE__ */ React4.createElement(View3, { key: folderId, style: styles3.folder }, /* @__PURE__ */ React4.createElement(TouchableOpacity3, { style: styles3.folderHeader, onPress: () => toggleFolder(folderId) }, /* @__PURE__ */ React4.createElement(Text3, { style: styles3.folderToggle }, isCollapsed ? "\u25B6" : "\u25BC"), /* @__PURE__ */ React4.createElement(Text3, { style: styles3.folderName }, folder.group?.name || "Ungrouped"), /* @__PURE__ */ React4.createElement(View3, { style: styles3.folderProgress }, /* @__PURE__ */ React4.createElement(View3, { style: [styles3.folderProgressFill, { width: `${Math.round((folder.stats.passed + folder.stats.failed) / folder.stats.total * 100)}%` }] })), /* @__PURE__ */ React4.createElement(Text3, { style: styles3.folderCount }, folder.stats.passed + folder.stats.failed, "/", folder.stats.total)), !isCollapsed && filtered.map((assignment) => {
+    return /* @__PURE__ */ React4.createElement(View3, { key: folderId, style: styles3.folder }, /* @__PURE__ */ React4.createElement(TouchableOpacity3, { style: styles3.folderHeader, onPress: () => toggleFolder(folderId) }, /* @__PURE__ */ React4.createElement(Text3, { style: styles3.folderToggle }, isCollapsed ? "\u25B6" : "\u25BC"), /* @__PURE__ */ React4.createElement(Text3, { style: styles3.folderName, numberOfLines: 1 }, folder.group?.name || "Ungrouped"), /* @__PURE__ */ React4.createElement(View3, { style: styles3.folderProgress }, /* @__PURE__ */ React4.createElement(View3, { style: [styles3.folderProgressFill, { width: `${folder.stats.total > 0 ? Math.round((folder.stats.passed + folder.stats.failed) / folder.stats.total * 100) : 0}%` }] })), /* @__PURE__ */ React4.createElement(Text3, { style: styles3.folderCount }, folder.stats.passed + folder.stats.failed, "/", folder.stats.total)), !isCollapsed && filtered.map((assignment) => {
       const badge = getStatusBadge(assignment.status);
       const isCurrent = currentAssignment?.id === assignment.id;
       return /* @__PURE__ */ React4.createElement(
@@ -14070,17 +14102,28 @@ function TestListScreen({ nav }) {
           onPress: () => nav.push({ name: "TEST_DETAIL", testId: assignment.id })
         },
         /* @__PURE__ */ React4.createElement(Text3, { style: styles3.testBadge }, badge.icon),
-        /* @__PURE__ */ React4.createElement(View3, { style: styles3.testInfo }, /* @__PURE__ */ React4.createElement(Text3, { style: styles3.testTitle, numberOfLines: 1 }, assignment.testCase.title), /* @__PURE__ */ React4.createElement(View3, { style: styles3.testMetaRow }, assignment.isVerification && /* @__PURE__ */ React4.createElement(View3, { style: styles3.retestTag }, /* @__PURE__ */ React4.createElement(Text3, { style: styles3.retestTagText }, "Retest")), /* @__PURE__ */ React4.createElement(Text3, { style: styles3.testMeta }, assignment.testCase.key, " \xB7 ", assignment.testCase.priority)))
+        /* @__PURE__ */ React4.createElement(View3, { style: styles3.testInfo }, /* @__PURE__ */ React4.createElement(Text3, { style: styles3.testTitle, numberOfLines: 1 }, assignment.testCase.title), /* @__PURE__ */ React4.createElement(View3, { style: styles3.testMetaRow }, assignment.isVerification && /* @__PURE__ */ React4.createElement(View3, { style: styles3.retestTag }, /* @__PURE__ */ React4.createElement(Text3, { style: styles3.retestTagText }, "Retest")), /* @__PURE__ */ React4.createElement(Text3, { style: styles3.testMeta }, assignment.testCase.testKey, " \xB7 ", assignment.testCase.priority), assignment.testCase.role && /* @__PURE__ */ React4.createElement(View3, { style: styles3.roleBadgeRow }, /* @__PURE__ */ React4.createElement(Text3, { style: styles3.testMeta }, " \xB7 "), /* @__PURE__ */ React4.createElement(View3, { style: [styles3.roleBadgeDot, { backgroundColor: assignment.testCase.role.color }] }), /* @__PURE__ */ React4.createElement(Text3, { style: [styles3.testMeta, { color: assignment.testCase.role.color, fontWeight: "500" }] }, assignment.testCase.role.name))))
       );
     }));
-  }), /* @__PURE__ */ React4.createElement(TouchableOpacity3, { style: styles3.refreshBtn, onPress: refreshAssignments }, /* @__PURE__ */ React4.createElement(Text3, { style: styles3.refreshText }, "\u21BB Refresh")));
+  }), /* @__PURE__ */ React4.createElement(TouchableOpacity3, { style: styles3.refreshBtn, onPress: refreshAssignments }, /* @__PURE__ */ React4.createElement(Text3, { style: styles3.refreshText }, "\u21BB", " Refresh")));
 }
 var styles3 = StyleSheet4.create({
-  filterBar: { flexDirection: "row", gap: 8, marginBottom: 16 },
+  filterBar: { flexDirection: "row", gap: 8, marginBottom: 8 },
   filterBtn: { paddingHorizontal: 12, paddingVertical: 6, borderRadius: 8, backgroundColor: colors.card, borderWidth: 1, borderColor: colors.border },
   filterBtnActive: { backgroundColor: colors.blue, borderColor: colors.blue },
   filterBtnText: { fontSize: 12, color: colors.textSecondary },
   filterBtnTextActive: { color: "#fff", fontWeight: "600" },
+  roleSection: { marginBottom: 12 },
+  roleBar: { flexDirection: "row", marginBottom: 6 },
+  roleBtn: { flexDirection: "row", alignItems: "center", gap: 5, paddingHorizontal: 10, paddingVertical: 4, borderRadius: 6, marginRight: 6, borderWidth: 1, borderColor: "transparent" },
+  roleBtnActive: { backgroundColor: colors.card, borderColor: colors.border },
+  roleBtnText: { fontSize: 11, color: colors.textMuted },
+  roleBtnTextActive: { color: colors.textPrimary, fontWeight: "600" },
+  roleDot: { width: 6, height: 6, borderRadius: 3 },
+  loginHint: { borderRadius: 6, padding: 8, borderWidth: 1 },
+  loginHintText: { fontSize: 11, color: colors.textSecondary },
+  roleBadgeRow: { flexDirection: "row", alignItems: "center", gap: 3 },
+  roleBadgeDot: { width: 5, height: 5, borderRadius: 3 },
   folder: { marginBottom: 12 },
   folderHeader: { flexDirection: "row", alignItems: "center", gap: 8, paddingVertical: 8, paddingHorizontal: 4 },
   folderToggle: { fontSize: 10, color: colors.textMuted, width: 14 },
@@ -14093,7 +14136,7 @@ var styles3 = StyleSheet4.create({
   testBadge: { fontSize: 16, marginRight: 10, width: 20 },
   testInfo: { flex: 1 },
   testTitle: { fontSize: 14, color: colors.textPrimary, marginBottom: 2 },
-  testMetaRow: { flexDirection: "row", alignItems: "center", gap: 6 },
+  testMetaRow: { flexDirection: "row", alignItems: "center", gap: 6, flexWrap: "wrap" },
   retestTag: { backgroundColor: "#422006", borderWidth: 1, borderColor: "#854d0e", borderRadius: 4, paddingHorizontal: 5, paddingVertical: 1 },
   retestTagText: { fontSize: 10, fontWeight: "600", color: "#fbbf24" },
   testMeta: { fontSize: 11, color: colors.textDim },
@@ -14188,10 +14231,10 @@ import { View as View5, Text as Text5, TouchableOpacity as TouchableOpacity5, St
 
 // src/widget/ImagePreviewStrip.tsx
 import React5 from "react";
-import { View as View4, Text as Text4, TouchableOpacity as TouchableOpacity4, ScrollView, Image, ActivityIndicator, StyleSheet as StyleSheet5 } from "react-native";
+import { View as View4, Text as Text4, TouchableOpacity as TouchableOpacity4, ScrollView as ScrollView2, Image, ActivityIndicator, StyleSheet as StyleSheet5 } from "react-native";
 function ImagePreviewStrip({ images, onRemove }) {
   if (images.length === 0) return null;
-  return /* @__PURE__ */ React5.createElement(ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, style: styles4.strip }, images.map((img) => /* @__PURE__ */ React5.createElement(View4, { key: img.id, style: styles4.thumbContainer }, /* @__PURE__ */ React5.createElement(Image, { source: { uri: img.localUri }, style: styles4.thumb }), img.status === "uploading" && /* @__PURE__ */ React5.createElement(View4, { style: styles4.thumbOverlay }, /* @__PURE__ */ React5.createElement(ActivityIndicator, { size: "small", color: "#fff" })), img.status === "error" && /* @__PURE__ */ React5.createElement(View4, { style: [styles4.thumbOverlay, styles4.thumbOverlayError] }, /* @__PURE__ */ React5.createElement(Text4, { style: styles4.thumbErrorText }, "!")), /* @__PURE__ */ React5.createElement(TouchableOpacity4, { style: styles4.thumbRemove, onPress: () => onRemove(img.id) }, /* @__PURE__ */ React5.createElement(Text4, { style: styles4.thumbRemoveText }, "\u2715")))));
+  return /* @__PURE__ */ React5.createElement(ScrollView2, { horizontal: true, showsHorizontalScrollIndicator: false, style: styles4.strip }, images.map((img) => /* @__PURE__ */ React5.createElement(View4, { key: img.id, style: styles4.thumbContainer }, /* @__PURE__ */ React5.createElement(Image, { source: { uri: img.localUri }, style: styles4.thumb }), img.status === "uploading" && /* @__PURE__ */ React5.createElement(View4, { style: styles4.thumbOverlay }, /* @__PURE__ */ React5.createElement(ActivityIndicator, { size: "small", color: "#fff" })), img.status === "error" && /* @__PURE__ */ React5.createElement(View4, { style: [styles4.thumbOverlay, styles4.thumbOverlayError] }, /* @__PURE__ */ React5.createElement(Text4, { style: styles4.thumbErrorText }, "!")), /* @__PURE__ */ React5.createElement(TouchableOpacity4, { style: styles4.thumbRemove, onPress: () => onRemove(img.id) }, /* @__PURE__ */ React5.createElement(Text4, { style: styles4.thumbRemoveText }, "\u2715")))));
 }
 var styles4 = StyleSheet5.create({
   strip: {
@@ -15157,7 +15200,7 @@ function BugBearButton({
         style: styles13.modalOverlay
       },
       /* @__PURE__ */ React14.createElement(View13, { style: styles13.modalContainer }, /* @__PURE__ */ React14.createElement(View13, { style: styles13.header }, /* @__PURE__ */ React14.createElement(View13, { style: styles13.headerLeft }, canGoBack ? /* @__PURE__ */ React14.createElement(View13, { style: styles13.headerNavRow }, /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: () => nav.pop(), style: styles13.backButton }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.backText }, "\u2190 Back")), /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: () => nav.reset(), style: styles13.homeButton }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.homeText }, "\u{1F3E0}"))) : /* @__PURE__ */ React14.createElement(View13, { style: styles13.headerTitleRow }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.headerTitle }, "BugBear"), testerInfo && /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: () => push({ name: "PROFILE" }) }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.headerName }, testerInfo.name, " \u270E")))), getHeaderTitle() ? /* @__PURE__ */ React14.createElement(Text13, { style: styles13.headerScreenTitle, numberOfLines: 1 }, getHeaderTitle()) : null, /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: handleClose, style: styles13.closeButton }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.closeText }, "\u2715"))), /* @__PURE__ */ React14.createElement(
-        ScrollView2,
+        ScrollView3,
         {
           style: styles13.content,
           contentContainerStyle: styles13.contentContainer,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbearai/react-native",
-  "version": "0.4.1",
+  "version": "0.5.0",
   "description": "BugBear React Native components for mobile apps",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -49,7 +49,7 @@
     }
   },
   "devDependencies": {
-    "@bbearai/core": "^0.3.0",
+    "@bbearai/core": "^0.4.0",
     "@eslint/js": "^9.39.2",
     "@types/react": "^18.2.0",
     "eslint": "^9.39.2",