@fluid-app/portal-sdk 0.1.199 → 0.1.201

package/dist/{ContactsScreen-Cheiwaxn.cjs → ContactsScreen-Bw2GcYtk.cjs}

@@ -1,10 +1,10 @@
 require("./chunk-9hOWP6kD.cjs");
-require("./countries-api-context-G-NW4BoH.cjs");
+require("./src-BNcNh8fM.cjs");
 require("./src-D57IFKXU.cjs");
 require("./scroll-arrows-CzWtSS8l.cjs");
 require("./ScreenHeaderContext-BXgWydjB.cjs");
 require("./dist-CN_rfvBt.cjs");
-const require_ContactsScreen = require("./ContactsScreen-DvohvoOE.cjs");
+const require_ContactsScreen = require("./ContactsScreen-BQ6pvYOa.cjs");
 require("./SearchSort-CUDMZIkf.cjs");
 require("./InfiniteScrollSentinel-CU801UfD.cjs");
 require("./dist-bL3uiYn3.cjs");

package/dist/{ContactsScreen-BtBNMZzG.mjs → ContactsScreen-BzRFTCBS.mjs}

@@ -1,5 +1,5 @@
 import { r as __exportAll } from "./es-BeIE2Uzn.mjs";
-import { n as useCountriesApi } from "./countries-api-context-Dob_AzPO.mjs";
+import { k as useCountriesApi, y as getContrastingTextColor } from "./src-BjCPR0aG.mjs";
 import { t as parseApiErrors } from "./parse-api-errors-BLAAn3cQ.mjs";
 import { n as usePortalTenantClient } from "./PortalTenantClientProvider-4ZmY6hac.mjs";
 import { $ as DropdownMenuSeparator, $t as BreadcrumbPage, A as Select, C as Skeleton, D as SheetHeader, E as SheetFooter, Et as CardContent, G as FormMessage, H as FormField, J as DropdownMenuContent, L as Input, M as SelectItem, N as SelectTrigger, O as SheetTitle, P as SelectValue, Qt as BreadcrumbList, T as SheetContent, U as FormItem, V as FormControl, W as FormLabel, Xt as BreadcrumbItem, Y as DropdownMenuItem, Yt as Breadcrumb, Zt as BreadcrumbLink, an as AlertDialog, b as fluidToast, bn as useZodForm, cn as AlertDialogContent, ct as DialogFooter, d as Table$1, dn as AlertDialogHeader, en as BreadcrumbSeparator, f as TableBody, fn as AlertDialogTitle, ft as DialogTitle, g as TableRow, h as TableHeader, i as TooltipTrigger, in as AvatarImage, it as Dialog, j as SelectContent, ln as AlertDialogDescription, lt as DialogHeader, m as TableHead, n as TooltipContent, nn as Avatar, on as AlertDialogAction, ot as DialogContent, p as TableCell, pn as Button, q as DropdownMenu, r as TooltipProvider, rn as AvatarFallback, rt as DropdownMenuTrigger, sn as AlertDialogCancel, t as Tooltip, un as AlertDialogFooter, w as Sheet, wt as Card, xn as cn, y as Spinner } from "./src-BTbz18gY.mjs";
@@ -273,9 +273,14 @@ function RepContactCard({ contact, selected, onToggleSelect, onRowClick, onEditC
 									title: groupTitle,
 									children: [groupLabels.length > 0 ? groupLabels.slice(0, 2).map((label, index) => {
 										const group = groupsByName.get(label);
+										const backgroundColor = group?.avatar_background ?? "var(--color-muted)";
+										const textColor = group?.avatar_background ? getContrastingTextColor(group.avatar_background) : null;
 										return /* @__PURE__ */ jsxs("span", {
-											className: "text-foreground border-border inline-flex max-w-[min(100%,10rem)] shrink items-center gap-1 truncate rounded-full border px-2 py-0.5 font-normal capitalize",
-											style: { backgroundColor: group?.avatar_background ?? "var(--color-muted)" },
+											className: cn("border-border inline-flex max-w-[min(100%,10rem)] shrink items-center gap-1 truncate rounded-full border px-2 py-0.5 font-normal capitalize", !textColor && "text-foreground"),
+											style: {
+												backgroundColor,
+												...textColor ? { color: textColor } : {}
+											},
 											title: label,
 											children: [group?.avatar && /* @__PURE__ */ jsx("span", { children: group.avatar }), /* @__PURE__ */ jsx("span", {
 												className: "truncate",
@@ -2658,16 +2663,21 @@ function GroupsSection({ contactTags, availableGroups = [], onManageGroups, onAd
 					const group = getGroupDetails(tag);
 					const backgroundColor = group?.avatar_background ?? "var(--color-muted)";
 					const emoji = group?.avatar;
+					const textColor = group?.avatar_background ? getContrastingTextColor(group.avatar_background) : null;
 					return /* @__PURE__ */ jsxs("span", {
-						className: "text-foreground border-border inline-flex items-center gap-2 rounded-full border px-3 py-1.5 text-xs",
-						style: { backgroundColor },
+						className: cn("border-border inline-flex items-center gap-2 rounded-full border px-3 py-1.5 text-xs", !textColor && "text-foreground"),
+						style: {
+							backgroundColor,
+							...textColor ? { color: textColor } : {}
+						},
 						children: [
 							emoji && /* @__PURE__ */ jsx("span", { children: emoji }),
 							tag,
 							/* @__PURE__ */ jsx("button", {
 								type: "button",
 								onClick: () => onRemoveGroup(tag),
-								className: "text-foreground bg-background/25 hover:bg-background/50 flex h-4 w-4 items-center justify-center rounded-full transition-colors",
+								className: "bg-background/25 hover:bg-background/50 flex h-4 w-4 items-center justify-center rounded-full transition-colors",
+								style: textColor ? { color: textColor } : void 0,
 								"aria-label": `Remove ${tag}`,
 								children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" })
 							})
@@ -4592,4 +4602,4 @@ const contactsScreenPropertySchema = {
 //#endregion
 export { ContactsScreen_exports as n, contactsScreenPropertySchema as r, ContactsScreen as t };
 
-//# sourceMappingURL=ContactsScreen-BtBNMZzG.mjs.map
+//# sourceMappingURL=ContactsScreen-BzRFTCBS.mjs.map