@fluid-app/portal-sdk 0.1.286 → 0.1.288

package/dist/ContactsScreen-D8M6J3nC.cjs

@@ -0,0 +1,3405 @@
+const require_chunk = require("./chunk-9hOWP6kD.cjs");
+const require_countries_api_context = require("./countries-api-context-C0C0K9gJ.cjs");
+const require_PortalTenantClientProvider = require("./PortalTenantClientProvider-CVv-4rQ9.cjs");
+const require_static_dict_adapter = require("./static-dict-adapter-D1ErNskC.cjs");
+const require_src = require("./src-B0ut9PTw.cjs");
+const require_parse_task_body = require("./parse-task-body-41D9d0mr.cjs");
+const require_ScreenHeaderContext = require("./ScreenHeaderContext-CsfhnuJk.cjs");
+const require_query_keys = require("./query-keys-D3lK70Ea.cjs");
+const require_dist = require("./dist-DQ-PaPl7.cjs");
+const require_dist$1 = require("./dist-PK-HEsOm.cjs");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let _tanstack_react_query = require("@tanstack/react-query");
+let react_jsx_runtime = require("react/jsx-runtime");
+let lucide_react = require("lucide-react");
+let react_hook_form = require("react-hook-form");
+let zod = require("zod");
+//#region ../../platform/api-client-core/src/parse-api-errors.ts
+/**
+* Framework-agnostic API error parsing utilities.
+*
+* Extracts structured field-level errors from API responses and formats
+* them into human-readable messages. Works with ApiError from this package
+* as well as any error object that has `status`, `data`, and optional `message`.
+*/
+/**
+* Converts snake_case or camelCase field names to Title Case
+*/
+function formatFieldName(field) {
+	return field.replace(/_/g, " ").replace(/([A-Z])/g, " $1").split(" ").map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" ").trim();
+}
+/**
+* Type guard to check if an error looks like an API error
+*/
+function isApiLikeError(error) {
+	if (!error || typeof error !== "object") return false;
+	const err = error;
+	return typeof err.status === "number" && "data" in err && (typeof err.message === "string" || err.message === void 0);
+}
+/**
+* Extracts field-level errors from API error data
+*/
+function extractFieldErrors(data) {
+	const errors = [];
+	if (!data || typeof data !== "object") return errors;
+	const errorObj = data;
+	for (const [key, value] of Object.entries(errorObj)) if (Array.isArray(value) && value.length > 0) errors.push({
+		field: formatFieldName(key),
+		messages: value.map((item) => typeof item === "string" ? item : JSON.stringify(item))
+	});
+	else if (typeof value === "string" && value.length > 0) errors.push({
+		field: formatFieldName(key),
+		messages: [value]
+	});
+	else if (value && typeof value === "object" && !Array.isArray(value)) extractFieldErrors(value).forEach((nestedError) => {
+		errors.push({
+			field: `${formatFieldName(key)} → ${nestedError.field}`,
+			messages: nestedError.messages
+		});
+	});
+	return errors;
+}
+/**
+* Formats field errors into a readable description string
+*/
+function formatErrorDescription(errors) {
+	if (errors.length === 0) return "";
+	if (errors.length === 1) {
+		const err = errors[0];
+		if (!err) return "";
+		const message = err.messages[0] || "is invalid";
+		return `${err.field} ${message}`;
+	}
+	if (errors.length <= 3) return errors.map((e) => `${e.field} ${e.messages[0] || "is invalid"}`).join("\n");
+	const shown = errors.slice(0, 3).map((e) => `${e.field} ${e.messages[0] || "is invalid"}`).join("\n");
+	const remaining = errors.length - 3;
+	return `${shown}\n...and ${remaining} more ${remaining === 1 ? "error" : "errors"}`;
+}
+/**
+* Parses an error and returns a human-readable description string.
+*
+* Handles:
+* - API-like errors with structured field-level data
+* - API-like errors with a top-level message
+* - Standard Error instances
+* - Falls back to the provided fallback string
+*
+* @param error - The error to parse (ApiError, Error, or unknown)
+* @param fallback - Optional fallback description if error cannot be parsed
+* @returns A human-readable error description, or undefined if nothing could be extracted
+*/
+function parseApiErrors(error, fallback) {
+	if (isApiLikeError(error)) {
+		if (error.data) {
+			const fieldErrors = extractFieldErrors(error.data);
+			if (fieldErrors.length > 0) return formatErrorDescription(fieldErrors);
+		}
+		if (error.message) return error.message;
+	} else if (error instanceof Error) return error.message;
+	return fallback;
+}
+//#endregion
+//#region ../../contacts/core/src/translation-api-context.ts
+const { Provider: ContactsProvider, useTranslation } = require_static_dict_adapter.createTranslationContext("Contacts");
+const ContactsTranslationProvider = ContactsProvider;
+const useContactsTranslation = useTranslation;
+//#endregion
+//#region ../../contacts/ui/src/screens/ContactCreateScreen.tsx
+function ContactCreateScreen({ onNavigateToList, onSubmit, isPending, children }) {
+	const { t } = useContactsTranslation();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_ScreenHeaderContext.ScreenHeaderActions, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+			variant: "outline",
+			onClick: onNavigateToList,
+			disabled: isPending,
+			children: t("cancel")
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+			onClick: onSubmit,
+			disabled: isPending,
+			children: isPending ? t("adding") : t("add_contact")
+		})] }),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ScreenHeaderContext.ScreenHeaderBreadcrumbs, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Breadcrumb, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.BreadcrumbList, {
+			className: "text-lg",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.BreadcrumbItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.BreadcrumbLink, {
+					href: "#",
+					onClick: (e) => {
+						e.preventDefault();
+						onNavigateToList();
+					},
+					children: t("breadcrumb")
+				}) }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.BreadcrumbSeparator, {}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.BreadcrumbItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.BreadcrumbPage, {
+					className: "font-semibold",
+					children: t("breadcrumb_new")
+				}) })
+			]
+		}) }) }),
+		children
+	] });
+}
+//#endregion
+//#region ../../contacts/core/src/contacts-api-context.ts
+const ContactsApiContext = (0, react.createContext)(null);
+const ContactsApiProvider = ContactsApiContext.Provider;
+function useContactsDomainApi() {
+	const api = (0, react.useContext)(ContactsApiContext);
+	if (!api) throw new Error("useContactsDomainApi must be used within a ContactsApiProvider");
+	return api;
+}
+function useContactsCrud() {
+	return useContactsDomainApi().contacts;
+}
+function useNotesApi() {
+	return useContactsDomainApi().notes;
+}
+function useTasksApi() {
+	return useContactsDomainApi().tasks;
+}
+/** Returns GroupsApi if the provider supplies one, otherwise null. */
+function useGroupsApi() {
+	return useContactsDomainApi().groups ?? null;
+}
+//#endregion
+//#region ../../contacts/core/src/query-keys.ts
+const CONTACTS_QUERY_KEYS = {
+	all: (prefix) => [prefix],
+	list: (prefix) => [...CONTACTS_QUERY_KEYS.all(prefix), "list"],
+	detail: (prefix, id) => [
+		...CONTACTS_QUERY_KEYS.all(prefix),
+		"detail",
+		id
+	]
+};
+const contactsKeys = {
+	activities: (contactId) => [
+		"portal-contacts",
+		"activities",
+		contactId
+	],
+	tasks: (contactId) => [
+		"portal-contacts",
+		"tasks",
+		contactId
+	],
+	notes: (contactId) => [
+		"portal-contacts",
+		"notes",
+		contactId
+	],
+	orders: (contactId) => [
+		"rep-contacts",
+		"orders",
+		contactId
+	],
+	subscriptionOrders: (contactId) => [
+		"rep-contacts",
+		"subscription-orders",
+		contactId
+	],
+	groups: () => ["portal-contacts", "groups"]
+};
+//#endregion
+//#region ../../contacts/core/src/hooks/use-infinite-contacts.ts
+function useInfiniteContacts(params) {
+	const api = useContactsCrud();
+	return (0, _tanstack_react_query.useInfiniteQuery)({
+		queryKey: [...CONTACTS_QUERY_KEYS.list("contacts"), params],
+		queryFn: ({ pageParam }) => api.listContacts({
+			...params,
+			page: pageParam
+		}),
+		getNextPageParam: (lastPage) => {
+			const currentPage = lastPage.meta.current_page;
+			if (currentPage == null) return void 0;
+			if (lastPage.meta.next_cursor) return currentPage + 1;
+			if (lastPage.meta.total_pages != null && currentPage < lastPage.meta.total_pages) return currentPage + 1;
+		},
+		initialPageParam: 1
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/hooks/groups/use-groups.ts
+function useGroups() {
+	const api = useGroupsApi();
+	return (0, _tanstack_react_query.useQuery)({
+		queryKey: contactsKeys.groups(),
+		queryFn: () => api.listGroups(),
+		enabled: !!api,
+		select: (data) => data.groups
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/contacts/rep-layout/utils.ts
+function getDisplayName(contact) {
+	if (contact.full_name && contact.full_name.trim().length > 0) return contact.full_name;
+	const parts = [contact.first_name, contact.last_name].filter(Boolean);
+	if (parts.length > 0) return parts.join(" ");
+	if (contact.email) return contact.email;
+	return "Contact";
+}
+function getInitials(name) {
+	const parts = name.trim().split(/\s+/);
+	return ((parts[0]?.[0] ?? "") + (parts.length > 1 ? parts[parts.length - 1]?.[0] ?? "" : "")).toUpperCase() || "?";
+}
+/** Lowercase relative label derived from `contact.updated_at`.
+*  Returns null if the timestamp is missing or unparseable. Lowercase on
+*  purpose so callers can compose phrases like "Last updated 3 days ago"
+*  without an awkward "Last updated Today". */
+function getRelativeUpdated(contact) {
+	const updated = typeof contact.updated_at === "string" ? contact.updated_at : null;
+	if (!updated) return null;
+	const date = new Date(updated);
+	if (Number.isNaN(date.getTime())) return null;
+	const diffMs = Date.now() - date.getTime();
+	const diffDays = Math.floor(diffMs / (1e3 * 60 * 60 * 24));
+	if (diffDays <= 0) return "today";
+	if (diffDays === 1) return "yesterday";
+	if (diffDays < 7) return `${diffDays} days ago`;
+	if (diffDays < 30) {
+		const weeks = Math.floor(diffDays / 7);
+		return weeks === 1 ? "1 week ago" : `${weeks} weeks ago`;
+	}
+	if (diffDays < 365) {
+		const months = Math.floor(diffDays / 30);
+		return months === 1 ? "1 month ago" : `${months} months ago`;
+	}
+	const years = Math.floor(diffDays / 365);
+	return years === 1 ? "1 year ago" : `${years} years ago`;
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/contacts/rep-layout/ContactsSidebarRow.tsx
+function ContactsSidebarRow({ contact, isSelected, onSelect }) {
+	const name = getDisplayName(contact);
+	const id = String(contact.id);
+	const secondary = contact.email ?? contact.status?.trim() ?? null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		type: "button",
+		onClick: () => onSelect(id),
+		"aria-current": isSelected ? "true" : void 0,
+		className: require_src.cn("group flex w-full items-center gap-3.5 rounded-xl px-3 py-3 text-left transition-colors", isSelected ? "bg-muted" : "hover:bg-muted/60"),
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: require_src.cn("text-muted-foreground relative flex size-12 shrink-0 items-center justify-center overflow-hidden rounded-xl text-base font-semibold transition-colors", isSelected ? "bg-background" : "bg-muted"),
+				children: contact.avatar_url ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+					alt: name,
+					src: contact.avatar_url,
+					className: "size-12 object-cover"
+				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					"aria-hidden": "true",
+					children: getInitials(name)
+				})
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "min-w-0 flex-1",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-foreground block truncate text-sm font-semibold tracking-tight",
+					children: name
+				}), secondary && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-muted-foreground mt-0.5 block truncate text-sm",
+					children: secondary
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRight, {
+				className: require_src.cn("size-4 shrink-0 transition-all", isSelected ? "text-foreground" : "text-muted-foreground/60 opacity-0 group-hover:translate-x-0.5 group-hover:opacity-100"),
+				"aria-hidden": "true"
+			})
+		]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/contacts/rep-layout/ContactsSidebar.tsx
+const DEBOUNCE_MS = 200;
+function useBuiltInFilters() {
+	const { t } = useContactsTranslation();
+	return (0, react.useMemo)(() => [
+		{
+			id: "all",
+			label: t("filter_all"),
+			value: { kind: "all" }
+		},
+		{
+			id: "status:lead",
+			label: t("filter_leads"),
+			value: {
+				kind: "status",
+				status: "lead"
+			}
+		},
+		{
+			id: "status:customer",
+			label: t("filter_customers"),
+			value: {
+				kind: "status",
+				status: "customer"
+			}
+		}
+	], [t]);
+}
+function filterId(value) {
+	if (value.kind === "all") return "all";
+	if (value.kind === "status") return `status:${value.status}`;
+	return `group:${value.tag}`;
+}
+function ContactsSidebar({ selectedContactId, onSelect, onAdd }) {
+	const { t } = useContactsTranslation();
+	const builtInFilters = useBuiltInFilters();
+	const [searchInput, setSearchInput] = (0, react.useState)("");
+	const [debouncedSearch, setDebouncedSearch] = (0, react.useState)("");
+	const [filter, setFilter] = (0, react.useState)({ kind: "all" });
+	(0, react.useEffect)(() => {
+		const handle = window.setTimeout(() => {
+			setDebouncedSearch(searchInput.trim());
+		}, DEBOUNCE_MS);
+		return () => window.clearTimeout(handle);
+	}, [searchInput]);
+	const { data: groups = [] } = useGroups();
+	const { data, isLoading, isFetchingNextPage, hasNextPage, fetchNextPage, isError } = useInfiniteContacts((0, react.useMemo)(() => ({
+		search_query: debouncedSearch || void 0,
+		tags: filter.kind === "group" ? [filter.tag] : void 0,
+		sort_by: "full_name",
+		sort_direction: "asc",
+		per_page: 50
+	}), [debouncedSearch, filter]));
+	const contacts = (0, react.useMemo)(() => data?.pages.flatMap((page) => page.contacts ?? []) ?? [], [data]);
+	const visibleContacts = (0, react.useMemo)(() => {
+		if (filter.kind === "status") return contacts.filter((c) => c.status === filter.status);
+		return contacts;
+	}, [contacts, filter]);
+	const sentinelRef = (0, react.useRef)(null);
+	const hasAutoSelectedRef = (0, react.useRef)(false);
+	(0, react.useEffect)(() => {
+		if (hasAutoSelectedRef.current) return;
+		if (selectedContactId) {
+			hasAutoSelectedRef.current = true;
+			return;
+		}
+		if (isLoading || visibleContacts.length === 0) return;
+		if (!(typeof window === "undefined" || window.matchMedia("(min-width: 768px)").matches)) {
+			hasAutoSelectedRef.current = true;
+			return;
+		}
+		const first = visibleContacts[0];
+		if (first) {
+			hasAutoSelectedRef.current = true;
+			onSelect(String(first.id));
+		}
+	}, [
+		selectedContactId,
+		isLoading,
+		visibleContacts,
+		onSelect
+	]);
+	(0, react.useEffect)(() => {
+		const sentinel = sentinelRef.current;
+		if (!sentinel || !hasNextPage) return;
+		const observer = new IntersectionObserver((entries) => {
+			if (entries[0]?.isIntersecting && !isFetchingNextPage) fetchNextPage();
+		});
+		observer.observe(sentinel);
+		return () => observer.disconnect();
+	}, [
+		hasNextPage,
+		isFetchingNextPage,
+		fetchNextPage
+	]);
+	const activeFilterId = filterId(filter);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "border-border/50 border-b px-6 py-3",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex items-center gap-3",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "bg-muted focus-within:ring-foreground/20 flex min-w-0 flex-1 items-center gap-2 rounded-lg px-3 py-1.5 transition focus-within:ring-2",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Search, {
+						className: "text-muted-foreground size-3.5 shrink-0",
+						"aria-hidden": "true"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+						value: searchInput,
+						onChange: (e) => setSearchInput(e.target.value),
+						placeholder: t("search_placeholder"),
+						type: "search",
+						className: "placeholder:text-muted-foreground/80 h-auto flex-1 border-0 bg-transparent p-0 text-xs font-medium shadow-none focus-visible:ring-0",
+						"aria-label": t("search_placeholder")
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					onClick: onAdd,
+					className: "bg-primary text-primary-foreground hover:bg-primary/90 inline-flex shrink-0 items-center gap-1.5 rounded-lg px-3 py-1.5 text-xs font-semibold transition-colors",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, {
+						className: "size-3.5",
+						"aria-hidden": "true"
+					}), t("add")]
+				})]
+			})
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FilterPills, {
+			activeId: activeFilterId,
+			builtInFilters,
+			groups: groups.map((g) => g.name),
+			onChange: setFilter
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "flex-1 overflow-y-auto px-3 pb-8",
+			children: isError ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "text-muted-foreground px-4 py-8 text-center text-sm",
+				children: t("error_loading_list")
+			}) : isLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SidebarSkeleton, {}) : visibleContacts.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "space-y-2",
+				children: [hasNextPage || isFetchingNextPage ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "text-muted-foreground px-4 py-8 text-center text-sm",
+					children: t("searching")
+				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "text-muted-foreground px-4 py-8 text-center text-sm",
+					children: debouncedSearch ? t("no_contacts_search", { term: debouncedSearch }) : filter.kind === "all" ? t("no_contacts_yet") : t("no_contacts_filter")
+				}), hasNextPage && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					ref: sentinelRef,
+					"aria-hidden": "true",
+					className: "h-4"
+				})]
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "space-y-1",
+				children: [
+					visibleContacts.map((contact) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactsSidebarRow, {
+						contact,
+						isSelected: String(contact.id) === selectedContactId,
+						onSelect
+					}, contact.id)),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						ref: sentinelRef,
+						"aria-hidden": "true",
+						className: "h-4"
+					}),
+					isFetchingNextPage && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "text-muted-foreground py-3 text-center text-xs",
+						children: t("loading_more")
+					})
+				]
+			})
+		})
+	] });
+}
+function FilterPills({ activeId, builtInFilters, groups, onChange }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "overflow-x-auto pt-4 pb-4 [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "flex gap-1.5 px-6",
+			children: (0, react.useMemo)(() => [...builtInFilters, ...groups.map((tag) => ({
+				id: `group:${tag}`,
+				label: tag,
+				value: {
+					kind: "group",
+					tag
+				}
+			}))], [builtInFilters, groups]).map(({ id, label, value }) => {
+				const isActive = id === activeId;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					onClick: () => onChange(value),
+					"aria-pressed": isActive,
+					className: require_src.cn("shrink-0 rounded-full px-4 py-1.5 text-sm font-semibold capitalize transition-colors", isActive ? "bg-primary text-primary-foreground" : "border-border/50 bg-muted text-foreground hover:bg-muted/70 border"),
+					children: label
+				}, id);
+			})
+		})
+	});
+}
+function SidebarSkeleton() {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "space-y-1.5 px-1",
+		children: [
+			0,
+			1,
+			2,
+			3,
+			4
+		].map((i) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-center gap-3 rounded-xl px-3 py-3",
+			"aria-hidden": "true",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted size-12 shrink-0 animate-pulse rounded-xl" }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex-1 space-y-2",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-3.5 w-3/5 animate-pulse rounded" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-3 w-4/5 animate-pulse rounded" })]
+			})]
+		}, i))
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/shared/components/contacts/contactDetailsForm.tsx
+const DEFAULT_COUNTRIES = [];
+const statusOptions = [
+	{
+		name: "New",
+		value: "new"
+	},
+	{
+		name: "Active",
+		value: "active"
+	},
+	{
+		name: "Inactive",
+		value: "inactive"
+	},
+	{
+		name: "Cold",
+		value: "cold"
+	},
+	{
+		name: "Lead",
+		value: "lead"
+	},
+	{
+		name: "Customer",
+		value: "customer"
+	}
+];
+const ContactDetailsForm = ({ className, countries = DEFAULT_COUNTRIES, renderAvatarPicker }) => {
+	const { control, watch, setValue } = (0, react_hook_form.useFormContext)();
+	const currentStatus = (0, react_hook_form.useWatch)({
+		control,
+		name: "status"
+	});
+	const avatarUrl = watch("avatar_url") ?? null;
+	const effectiveStatusOptions = (0, react.useMemo)(() => {
+		if (currentStatus && typeof currentStatus === "string" && !statusOptions.some((o) => o.value === currentStatus)) return [{
+			name: currentStatus.charAt(0).toUpperCase() + currentStatus.slice(1).replace(/_/g, " "),
+			value: currentStatus
+		}, ...statusOptions];
+		return statusOptions;
+	}, [currentStatus]);
+	const initials = [watch("first_name")?.[0] ?? "", watch("last_name")?.[0] ?? ""].filter(Boolean).join("").toUpperCase() || "?";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: require_src.cn("space-y-6", className),
+		children: [renderAvatarPicker && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex flex-col items-center gap-3",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "border-border bg-background relative h-20 w-20 shrink-0 overflow-hidden rounded-full border-2",
+				children: avatarUrl ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+					src: avatarUrl,
+					alt: "",
+					className: "h-full w-full object-cover"
+				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "text-muted-foreground flex h-full w-full items-center justify-center text-lg font-semibold",
+					children: initials
+				})
+			}), renderAvatarPicker({
+				value: avatarUrl,
+				onChange: (url) => setValue("avatar_url", url ?? "", { shouldDirty: true })
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "grid grid-cols-1 gap-6 lg:grid-cols-2",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormField, {
+					control,
+					name: "first_name",
+					render: ({ field }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.FormItem, { children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormLabel, {
+							className: "font-inter text-foreground font-medium",
+							children: "First Name"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormControl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+							placeholder: "Enter first name",
+							...field,
+							value: field.value ?? "",
+							className: "ring-input"
+						}) }),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormMessage, {})
+					] })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormField, {
+					control,
+					name: "last_name",
+					render: ({ field }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.FormItem, { children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormLabel, {
+							className: "font-inter text-foreground font-medium",
+							children: "Last Name"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormControl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+							placeholder: "Enter last name",
+							...field,
+							value: field.value ?? "",
+							className: "ring-input"
+						}) }),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormMessage, {})
+					] })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormField, {
+					control,
+					name: "email",
+					render: ({ field }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.FormItem, { children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormLabel, {
+							className: "font-inter text-foreground font-medium",
+							children: "Email"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormControl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+							placeholder: "Enter email address",
+							type: "email",
+							...field,
+							value: field.value ?? "",
+							className: "ring-input"
+						}) }),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormMessage, {})
+					] })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormField, {
+					control,
+					name: "phone",
+					render: ({ field }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.FormItem, { children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormLabel, {
+							className: "font-inter text-foreground font-medium",
+							children: "Phone"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormControl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+							placeholder: "Enter phone number",
+							...field,
+							value: field.value ?? "",
+							className: "ring-input"
+						}) }),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormMessage, {})
+					] })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormField, {
+					control,
+					name: "status",
+					render: ({ field }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.FormItem, { children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormLabel, {
+							className: "font-inter text-foreground font-medium",
+							children: "Status"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.Select, {
+							value: field.value ?? "",
+							onValueChange: field.onChange,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormControl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectTrigger, {
+								className: "w-full",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectValue, { placeholder: "Select status" })
+							}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectContent, {
+								position: "popper",
+								sideOffset: 4,
+								children: effectiveStatusOptions.map((opt) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectItem, {
+									value: opt.value,
+									children: opt.name
+								}, opt.value))
+							})]
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormMessage, {})
+					] })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormField, {
+					control,
+					name: "address",
+					render: ({ field }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.FormItem, {
+						className: "lg:col-span-2",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormLabel, {
+								className: "font-inter text-foreground font-medium",
+								children: "Full Address"
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormControl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+								placeholder: "Enter street address",
+								...field,
+								value: field.value ?? "",
+								className: "ring-input"
+							}) }),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormMessage, {})
+						]
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormField, {
+					control,
+					name: "city",
+					render: ({ field }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.FormItem, { children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormLabel, {
+							className: "font-inter text-foreground font-medium",
+							children: "City"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormControl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+							placeholder: "Enter city",
+							...field,
+							value: field.value ?? "",
+							className: "ring-input"
+						}) }),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormMessage, {})
+					] })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormField, {
+					control,
+					name: "state",
+					render: ({ field }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.FormItem, { children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormLabel, {
+							className: "font-inter text-foreground font-medium",
+							children: "State/Province"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormControl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+							placeholder: "Enter state or province",
+							...field,
+							value: field.value ?? "",
+							className: "ring-input"
+						}) }),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormMessage, {})
+					] })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormField, {
+					control,
+					name: "postal_code",
+					render: ({ field }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.FormItem, { children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormLabel, {
+							className: "font-inter text-foreground font-medium",
+							children: "Postal Code"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormControl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+							placeholder: "Enter postal code",
+							...field,
+							value: field.value ?? "",
+							className: "ring-input"
+						}) }),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormMessage, {})
+					] })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormField, {
+					control,
+					name: "country_code",
+					render: ({ field }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.FormItem, { children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormLabel, {
+							className: "font-inter text-foreground font-medium",
+							children: "Country"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.Select, {
+							value: field.value ?? "",
+							onValueChange: field.onChange,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormControl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectTrigger, {
+								className: "w-full",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectValue, { placeholder: "Select country" })
+							}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectContent, {
+								position: "popper",
+								sideOffset: 4,
+								children: countries.map((opt) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectItem, {
+									value: opt.value,
+									children: opt.name
+								}, opt.value))
+							})]
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.FormMessage, {})
+					] })
+				})
+			]
+		})]
+	});
+};
+//#endregion
+//#region ../../contacts/ui/src/shared/hooks/useContactDetail.ts
+function useContactDetail(contactId, queryKeyPrefix = "contacts") {
+	const api = useContactsCrud();
+	return (0, _tanstack_react_query.useQuery)({
+		queryKey: CONTACTS_QUERY_KEYS.detail(queryKeyPrefix, contactId),
+		queryFn: () => api.getContact(contactId),
+		enabled: !!contactId
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/shared/hooks/useUpdateContactMutation.ts
+function useUpdateContactMutation(contactId, queryKeyPrefix = "contacts", options) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const api = useContactsCrud();
+	return (0, _tanstack_react_query.useMutation)({
+		mutationFn: ({ id, data }) => api.updateContact(id, data),
+		onSuccess: () => {
+			require_src.fluidToast({
+				title: "Contact updated successfully",
+				type: "success"
+			});
+			queryClient.invalidateQueries({ queryKey: CONTACTS_QUERY_KEYS.all(queryKeyPrefix) });
+			options?.onSuccess?.();
+		},
+		onError: (error) => {
+			require_src.fluidToast({
+				title: "Failed to save contact",
+				type: "error",
+				description: parseApiErrors(error)
+			});
+			options?.onError?.(error);
+		}
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/shared/hooks/useDeleteContactMutation.ts
+function useDeleteContactMutation(queryKeyPrefix = "contacts", options) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const api = useContactsCrud();
+	return (0, _tanstack_react_query.useMutation)({
+		mutationFn: (contactId) => api.deleteContact(contactId),
+		onSuccess: () => {
+			require_src.fluidToast({
+				title: "Contact deleted successfully",
+				type: "success"
+			});
+			queryClient.invalidateQueries({ queryKey: CONTACTS_QUERY_KEYS.all(queryKeyPrefix) });
+			options?.onSuccess?.();
+		},
+		onError: (error) => {
+			require_src.fluidToast({
+				title: "Failed to delete contact",
+				type: "error",
+				description: parseApiErrors(error)
+			});
+			options?.onError?.(error);
+		}
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/shared/schemas/contactFormSchema.ts
+/**
+* Form schema for creating a contact.
+* Matches CompanyContactCreate / ContactCreate from the OpenAPI spec.
+*
+* @see CompanyContactCreate in company_contacts.d.ts
+* @see ContactCreate in users_contacts.d.ts
+*/
+const createContactFormSchema = zod.z.object({
+	first_name: zod.z.string().min(1, { message: "First name is required" }),
+	last_name: zod.z.string().min(1, { message: "Last name is required" }),
+	status: zod.z.string().nullable().optional(),
+	email: zod.z.string().email().or(zod.z.literal("")).nullable().optional(),
+	phone: zod.z.string().nullable().optional(),
+	address: zod.z.string().nullable().optional(),
+	city: zod.z.string().nullable().optional(),
+	state: zod.z.string().nullable().optional(),
+	postal_code: zod.z.string().nullable().optional(),
+	country_code: zod.z.coerce.string().nullable().optional(),
+	language_code: zod.z.coerce.string().nullable().optional(),
+	affiliate: zod.z.record(zod.z.string(), zod.z.unknown()).nullable().optional(),
+	metadata: zod.z.record(zod.z.string(), zod.z.unknown()).optional()
+});
+/**
+* Form schema for editing a contact.
+* Same fields as create plus id. Uses .passthrough() so extra fields
+* from the Contact read model (full_name, avatar_url, etc.) don't
+* cause validation failures.
+*
+* @see CompanyContactUpdate in company_contacts.d.ts
+*/
+const editContactFormSchema = createContactFormSchema.passthrough();
+//#endregion
+//#region ../../contacts/ui/src/shared/hooks/useContactDetailPage.ts
+const mutableKeys = Object.keys(createContactFormSchema.shape);
+function useContactDetailPage(contactId, options) {
+	const queryKeyPrefix = options?.queryKeyPrefix ?? "contacts";
+	const { data, isLoading } = useContactDetail(contactId, queryKeyPrefix);
+	const { data: countries } = (0, _tanstack_react_query.useQuery)({
+		queryKey: ["countries"],
+		queryFn: options?.getCountries ?? (() => Promise.resolve([])),
+		enabled: !!options?.getCountries
+	});
+	const countryOptions = (0, react.useMemo)(() => [...countries?.map((c) => ({
+		name: c.name,
+		value: c.iso ?? c.id.toString()
+	})) ?? []].sort((a, b) => a.name.localeCompare(b.name)), [countries]);
+	const contact = data?.contact;
+	const methods = require_src.useZodForm(editContactFormSchema, {
+		values: (0, react.useMemo)(() => {
+			if (!contact) return void 0;
+			return {
+				...contact,
+				country_code: contact.country?.iso ?? contact.country_id?.toString() ?? null
+			};
+		}, [contact]),
+		mode: "onBlur"
+	});
+	const updateMutation = useUpdateContactMutation(contactId, queryKeyPrefix, { onSuccess: () => {
+		methods.reset(methods.getValues());
+		options?.onSaveSuccess?.();
+	} });
+	const deleteMutation = useDeleteContactMutation(queryKeyPrefix, { onSuccess: () => {
+		options?.onDeleteSuccess?.();
+	} });
+	const onSave = (0, react.useCallback)(() => {
+		methods.handleSubmit((formData) => {
+			const payload = {};
+			for (const key of mutableKeys) if (key in formData) payload[key] = formData[key];
+			updateMutation.mutate({
+				id: contactId,
+				data: payload
+			});
+		}, (errors) => {
+			require_src.fluidToast({
+				title: "Please fix the form errors before saving",
+				description: Object.entries(errors).map(([field, err]) => {
+					const msg = typeof err?.message === "string" ? err.message : "invalid";
+					return `${field.replace(/_/g, " ")}: ${msg}`;
+				}).join(", ") || void 0,
+				type: "error"
+			});
+		})();
+	}, [
+		methods,
+		updateMutation,
+		contactId
+	]);
+	const onDelete = (0, react.useCallback)(() => {
+		deleteMutation.mutate(contactId);
+	}, [deleteMutation, contactId]);
+	return {
+		contact,
+		isLoading,
+		methods,
+		countryOptions,
+		isDirty: methods.formState.isDirty,
+		isSubmitting: updateMutation.isPending,
+		isDeleting: deleteMutation.isPending,
+		onSave,
+		onDelete
+	};
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/hooks/contacts/use-contact-tasks.ts
+function useContactTasks(contactId) {
+	const api = useTasksApi();
+	return (0, _tanstack_react_query.useQuery)({
+		queryKey: contactsKeys.tasks(contactId),
+		queryFn: () => api.listTasks(contactId),
+		enabled: !!contactId,
+		select: (data) => data.tasks
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/hooks/notes/use-contact-notes.ts
+function useContactNotes(contactId) {
+	const api = useNotesApi();
+	return (0, _tanstack_react_query.useQuery)({
+		queryKey: contactsKeys.notes(contactId),
+		queryFn: () => api.listNotes(contactId),
+		enabled: !!contactId,
+		select: (data) => data.notes
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/shared/components/contacts/statusBadge.tsx
+const statusStyles = {
+	new: "border-[var(--status-new-border)] bg-[var(--status-new)] text-[var(--status-new-foreground)]",
+	active: "border-[var(--status-active-border)] bg-[var(--status-active)] text-[var(--status-active-foreground)]",
+	inactive: "border-border bg-muted text-muted-foreground",
+	lead: "border-[var(--status-lead-border)] bg-[var(--status-lead)] text-[var(--status-lead-foreground)]",
+	customer: "border-[var(--status-customer-border)] bg-[var(--status-customer)] text-[var(--status-customer-foreground)]",
+	success: "border-[var(--badge-success-border)] bg-[var(--badge-success)] text-[var(--badge-success-foreground)]",
+	warning: "border-[var(--badge-warning-border)] bg-[var(--badge-warning)] text-[var(--badge-warning-foreground)]",
+	danger: "border-[var(--badge-danger-border)] bg-[var(--badge-danger)] text-[var(--badge-danger-foreground)]",
+	info: "border-[var(--badge-info-border)] bg-[var(--badge-info)] text-[var(--badge-info-foreground)]",
+	neutral: "border-border bg-muted text-muted-foreground",
+	notice: "border-[var(--badge-notice-border)] bg-[var(--badge-notice)] text-[var(--badge-notice-foreground)]",
+	accent: "border-[var(--badge-accent-border)] bg-[var(--badge-accent)] text-[var(--badge-accent-foreground)]"
+};
+const defaultStyle = "border-border bg-muted text-muted-foreground";
+function getStatusStyle(status) {
+	return statusStyles[status] ?? defaultStyle;
+}
+function StatusBadge({ status, label, className }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: require_src.cn("inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold capitalize", getStatusStyle(status), className),
+		children: label ?? status
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/contacts/rep-layout/ContactDetailHero.tsx
+function ContactDetailHero({ contact, tasksCount, notesCount }) {
+	const { t } = useContactsTranslation();
+	const name = getDisplayName(contact);
+	const status = contact.status?.trim();
+	const lastUpdated = getRelativeUpdated(contact);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col gap-6 md:flex-row md:items-center md:justify-between md:gap-8",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex flex-col items-start gap-4 md:flex-row md:items-center md:gap-5",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "bg-muted relative flex size-20 shrink-0 items-center justify-center overflow-hidden rounded-2xl md:size-24",
+				children: contact.avatar_url ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+					alt: name,
+					src: contact.avatar_url,
+					className: "size-full object-cover"
+				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					"aria-hidden": "true",
+					className: "text-muted-foreground text-2xl font-bold tracking-tight md:text-3xl",
+					children: getInitials(name)
+				})
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "min-w-0 flex-1",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+					className: "text-foreground text-2xl leading-tight font-bold tracking-tight md:text-3xl",
+					children: name
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "mt-2.5 flex flex-wrap items-center gap-2",
+					children: [
+						status && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StatusBadge, { status }),
+						status && lastUpdated && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							"aria-hidden": "true",
+							className: "text-muted-foreground/40 text-sm",
+							children: "·"
+						}),
+						lastUpdated && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-muted-foreground text-sm",
+							children: t("last_updated", { date: lastUpdated })
+						})
+					]
+				})]
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex shrink-0 items-center gap-6 md:gap-8",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Stat, {
+					label: t("tab_tasks"),
+					value: tasksCount,
+					icon: lucide_react.ListTodo
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "bg-border h-10 w-px",
+					"aria-hidden": "true"
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Stat, {
+					label: t("tab_notes"),
+					value: notesCount,
+					icon: lucide_react.StickyNote
+				})
+			]
+		})]
+	});
+}
+function Stat({ label, value, icon: Icon }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col items-start gap-1",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "text-muted-foreground flex items-center gap-1.5",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+				className: "size-3.5",
+				"aria-hidden": true
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-xs font-medium",
+				children: label
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "text-foreground text-2xl font-bold tracking-tight tabular-nums",
+			children: value
+		})]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/contacts/rep-layout/ContactInfoRow.tsx
+function buildAddressLine(contact) {
+	const parts = [
+		contact.address,
+		contact.city,
+		contact.state,
+		contact.postal_code
+	].filter((part) => Boolean(part?.trim()));
+	if (parts.length === 0) return null;
+	return parts.join(", ");
+}
+function ContactInfoRow({ contact, onEditEmpty }) {
+	const { t } = useContactsTranslation();
+	const address = buildAddressLine(contact);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "border-border/50 divide-border/50 mt-6 divide-y overflow-hidden rounded-2xl border",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(InfoRow, {
+				icon: lucide_react.Mail,
+				label: t("label_email"),
+				value: contact.email,
+				href: contact.email ? `mailto:${contact.email}` : void 0,
+				onEditEmpty
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(InfoRow, {
+				icon: lucide_react.Phone,
+				label: t("label_phone"),
+				value: contact.phone,
+				href: contact.phone ? `tel:${contact.phone}` : void 0,
+				onEditEmpty
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(InfoRow, {
+				icon: lucide_react.MapPin,
+				label: t("label_address"),
+				value: address,
+				href: address ? `https://www.google.com/maps/search/?api=1&query=${encodeURIComponent(address)}` : void 0,
+				external: true,
+				onEditEmpty
+			})
+		]
+	});
+}
+function InfoRow({ icon: Icon, label, value, href, external = false, onEditEmpty }) {
+	const { t } = useContactsTranslation();
+	const trimmed = value?.trim();
+	const isEmpty = !trimmed;
+	const [copied, setCopied] = (0, react.useState)(false);
+	const handleCopy = () => {
+		if (!trimmed) return;
+		if (typeof navigator === "undefined" || !navigator.clipboard) return;
+		navigator.clipboard.writeText(trimmed).then(() => {
+			setCopied(true);
+			window.setTimeout(() => setCopied(false), 1500);
+		}).catch(() => {});
+	};
+	if (isEmpty) {
+		const addText = t("add_field", { field: label });
+		if (!onEditEmpty) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-center gap-3 px-4 py-2.5 md:px-5",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "border-border/50 text-muted-foreground/50 flex size-9 shrink-0 items-center justify-center rounded-full border-2 border-dashed",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						className: "size-4",
+						"aria-hidden": true
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "min-w-0 flex-1",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "text-muted-foreground text-xs font-medium",
+						children: label
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "text-muted-foreground/70 truncate text-sm italic",
+						children: addText
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, {
+					className: "text-muted-foreground/40 size-4 shrink-0",
+					"aria-hidden": true
+				})
+			]
+		});
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+			type: "button",
+			onClick: onEditEmpty,
+			"aria-label": addText,
+			className: "hover:bg-muted/60 group flex w-full items-center gap-3 px-4 py-2.5 text-left transition-colors md:px-5",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "border-border/50 text-muted-foreground/50 group-hover:border-foreground/30 group-hover:text-muted-foreground flex size-9 shrink-0 items-center justify-center rounded-full border-2 border-dashed transition-colors",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						className: "size-4",
+						"aria-hidden": true
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "min-w-0 flex-1",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "text-muted-foreground text-xs font-medium",
+						children: label
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "text-muted-foreground/70 group-hover:text-muted-foreground truncate text-sm italic transition-colors",
+						children: addText
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, {
+					className: "text-muted-foreground/40 group-hover:text-foreground size-4 shrink-0 transition-colors",
+					"aria-hidden": true
+				})
+			]
+		});
+	}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "hover:bg-muted/60 group flex items-center transition-colors",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("a", {
+			href,
+			...external ? {
+				target: "_blank",
+				rel: "noopener noreferrer"
+			} : {},
+			className: "flex min-w-0 flex-1 items-center gap-3 px-4 py-2.5 md:px-5",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "bg-muted text-muted-foreground group-hover:bg-muted/70 group-hover:text-foreground flex size-9 shrink-0 items-center justify-center rounded-full transition-colors",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+					className: "size-4",
+					"aria-hidden": true
+				})
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "min-w-0 flex-1",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "text-muted-foreground text-xs font-medium",
+					children: label
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "text-foreground truncate text-sm font-semibold",
+					children: trimmed
+				})]
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			onClick: handleCopy,
+			"aria-label": copied ? t("copied_field", { field: label }) : t("copy_field", { field: label }),
+			className: "text-muted-foreground hover:bg-muted hover:text-foreground mr-3 flex size-8 shrink-0 items-center justify-center rounded-md transition-colors",
+			children: copied ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Check, {
+				className: "text-primary size-3.5",
+				"aria-hidden": true
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Copy, {
+				className: "size-3.5",
+				"aria-hidden": true
+			})
+		})]
+	});
+}
+//#endregion
+//#region ../../contacts/core/src/iso-date.ts
+/**
+* Format a date as YYYY-MM-DD in the renderer's local timezone, optionally
+* shifted by `offsetDays`. Use this for due-date inputs where "today" must
+* resolve to the user's local calendar date — never `toISOString().slice(0, 10)`,
+* which returns the UTC date and silently rolls over a day for users east/west
+* of UTC at the wrong hours.
+*/
+function isoDate(offsetDays, now = /* @__PURE__ */ new Date()) {
+	const d = new Date(now);
+	d.setDate(d.getDate() + offsetDays);
+	return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-${String(d.getDate()).padStart(2, "0")}`;
+}
+/**
+* Return a Date pinned to local midnight of the calendar day represented by
+* `input`. Use this whenever you need to compare two due dates by calendar day
+* (overdue / today / tomorrow / future).
+*
+* Why not just `new Date(input)`?  `new Date("YYYY-MM-DD")` parses the string
+* as UTC midnight, which lands on the *previous* calendar day in any UTC−
+* timezone — a task due "May 1" then reads as April 30 for a user in the
+* Americas, classifying it as "Overdue" all day. Parse the date components
+* directly so the calendar-day intent of the string is preserved.
+*/
+function startOfLocalDay(input) {
+	if (typeof input === "string") {
+		const match = /^(\d{4})-(\d{2})-(\d{2})/.exec(input);
+		if (match?.[1] && match[2] && match[3]) return new Date(Number(match[1]), Number(match[2]) - 1, Number(match[3]));
+	}
+	const d = typeof input === "string" ? new Date(input) : input;
+	return new Date(d.getFullYear(), d.getMonth(), d.getDate());
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/hooks/contacts/use-toggle-task-completion.ts
+function useToggleTaskCompletion(contactId) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const api = useTasksApi();
+	return (0, _tanstack_react_query.useMutation)({
+		mutationFn: ({ taskId, isCompleted }) => api.updateTask(taskId, contactId, { completed_at: isCompleted ? null : (/* @__PURE__ */ new Date()).toISOString() }),
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: contactsKeys.tasks(contactId) });
+		},
+		onError: (error) => {
+			require_src.fluidToast({
+				title: "Failed to update task",
+				type: "error",
+				description: parseApiErrors(error)
+			});
+		}
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/hooks/contacts/use-delete-contact-task.ts
+function useDeleteContactTask(contactId, options) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const api = useTasksApi();
+	return (0, _tanstack_react_query.useMutation)({
+		mutationFn: (taskId) => api.deleteTask(taskId, contactId),
+		onSuccess: () => {
+			require_src.fluidToast({
+				title: "Task deleted",
+				type: "success"
+			});
+			queryClient.invalidateQueries({ queryKey: contactsKeys.tasks(contactId) });
+			options?.onSuccess?.();
+		},
+		onError: (error) => {
+			require_src.fluidToast({
+				title: "Failed to delete task",
+				type: "error",
+				description: parseApiErrors(error)
+			});
+		}
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/hooks/contacts/use-update-contact-task.ts
+function useUpdateContactTask(contactId, options) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const api = useTasksApi();
+	return (0, _tanstack_react_query.useMutation)({
+		mutationFn: ({ taskId, input }) => api.updateTask(taskId, contactId, input),
+		onSuccess: () => {
+			require_src.fluidToast({
+				title: "Task updated",
+				type: "success"
+			});
+			queryClient.invalidateQueries({ queryKey: contactsKeys.tasks(contactId) });
+			options?.onSuccess?.();
+		},
+		onError: (error) => {
+			require_src.fluidToast({
+				title: "Failed to update task",
+				type: "error",
+				description: parseApiErrors(error)
+			});
+		}
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/utils/format-date.ts
+function formatDateForDisplay(dateStr) {
+	return new Date(dateStr).toLocaleDateString("en-US", {
+		month: "short",
+		day: "numeric",
+		year: "numeric"
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/editor/note-task-editor.tsx
+function extractTitleAndBody(editor) {
+	if (!editor) return {
+		title: "",
+		body: ""
+	};
+	const doc = editor.state.doc;
+	let title = "";
+	const bodyParts = [];
+	doc.forEach((node) => {
+		if (node.type.name === "heading" && !title) title = node.textContent.trim();
+		else {
+			const text = node.textContent.trim();
+			if (text) bodyParts.push(text);
+		}
+	});
+	return {
+		title,
+		body: bodyParts.join("\n")
+	};
+}
+function extractBodyOnly(editor) {
+	if (!editor) return "";
+	const parts = [];
+	editor.state.doc.forEach((node) => {
+		const text = node.textContent.trim();
+		if (text) parts.push(text);
+	});
+	return parts.join("\n");
+}
+function NoteTaskEditor({ titlePlaceholder = "New Note", bodyPlaceholder = "Start writing...", onChange, className, initialTitle, initialBody, showDueDate = false, initialDueDate, showTitle = true, editorClassName }) {
+	const [dueDate, setDueDate] = (0, react.useState)(initialDueDate);
+	const dueDateRef = (0, react.useRef)(initialDueDate);
+	const dateInputRef = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		dueDateRef.current = dueDate;
+	}, [dueDate]);
+	const initialContent = showTitle ? initialTitle || initialBody ? `<h1>${initialTitle ?? ""}</h1>${initialBody ?? ""}` : void 0 : initialBody || void 0;
+	const editor = require_dist.useEditor({
+		extensions: [
+			require_dist.StarterKit.configure({
+				heading: showTitle ? false : { levels: [] },
+				bulletList: {
+					keepMarks: true,
+					keepAttributes: false
+				},
+				orderedList: {
+					keepMarks: true,
+					keepAttributes: false
+				}
+			}),
+			...showTitle ? [require_dist.Heading.configure({ levels: [1] })] : [],
+			require_dist.Placeholder.configure({ placeholder: ({ node }) => {
+				if (node.type.name === "heading") return titlePlaceholder;
+				return bodyPlaceholder;
+			} }),
+			require_dist$1.TextAlign.configure({
+				types: showTitle ? ["heading", "paragraph"] : ["paragraph"],
+				alignments: [
+					"left",
+					"center",
+					"right",
+					"justify"
+				]
+			}),
+			require_dist$1.Underline
+		],
+		content: initialContent ?? (showTitle ? {
+			type: "doc",
+			content: [{
+				type: "heading",
+				attrs: { level: 1 }
+			}]
+		} : void 0),
+		onUpdate: ({ editor }) => {
+			if (showTitle) {
+				const { title, body } = extractTitleAndBody(editor);
+				onChange?.({
+					title,
+					body,
+					dueDate: dueDateRef.current
+				});
+			} else {
+				const body = extractBodyOnly(editor);
+				onChange?.({
+					title: "",
+					body,
+					dueDate: dueDateRef.current
+				});
+			}
+		}
+	});
+	const fireOnChange = () => {
+		if (!editor || !onChange) return;
+		if (showTitle) {
+			const { title, body } = extractTitleAndBody(editor);
+			onChange({
+				title,
+				body,
+				dueDate
+			});
+		} else onChange({
+			title: "",
+			body: extractBodyOnly(editor),
+			dueDate
+		});
+	};
+	(0, react.useEffect)(() => {
+		fireOnChange();
+	}, [editor]);
+	(0, react.useEffect)(() => {
+		fireOnChange();
+	}, [dueDate]);
+	const buttonBase = "flex h-7 w-7 items-center justify-center rounded text-xs transition-colors";
+	const buttonActive = "bg-muted text-primary";
+	const buttonInactive = "text-muted-foreground hover:bg-muted/50";
+	const toolbarSeparator = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-border mx-1 h-5 w-px" });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: require_src.cn("border-border/50 flex flex-col overflow-hidden rounded-lg border", className),
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "border-border/50 bg-muted/50 flex items-center gap-0.5 border-b px-2 py-1.5",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: () => editor?.chain().focus().toggleBold().run(),
+						disabled: !editor?.can().chain().focus().toggleBold().run(),
+						className: require_src.cn(buttonBase, "font-bold", editor?.isActive("bold") ? buttonActive : buttonInactive),
+						title: "Bold",
+						children: "B"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: () => editor?.chain().focus().toggleItalic().run(),
+						disabled: !editor?.can().chain().focus().toggleItalic().run(),
+						className: require_src.cn(buttonBase, "italic", editor?.isActive("italic") ? buttonActive : buttonInactive),
+						title: "Italic",
+						children: "I"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: () => editor?.chain().focus().toggleUnderline().run(),
+						disabled: !editor?.can().chain().focus().toggleUnderline().run(),
+						className: require_src.cn(buttonBase, "underline", editor?.isActive("underline") ? buttonActive : buttonInactive),
+						title: "Underline",
+						children: "U"
+					}),
+					toolbarSeparator,
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: () => editor?.chain().focus().setTextAlign("left").run(),
+						className: require_src.cn(buttonBase, editor?.isActive({ textAlign: "left" }) ? buttonActive : buttonInactive),
+						title: "Align left",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.AlignLeft, { className: "h-3.5 w-3.5" })
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: () => editor?.chain().focus().setTextAlign("center").run(),
+						className: require_src.cn(buttonBase, editor?.isActive({ textAlign: "center" }) ? buttonActive : buttonInactive),
+						title: "Align center",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.AlignCenter, { className: "h-3.5 w-3.5" })
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: () => editor?.chain().focus().setTextAlign("right").run(),
+						className: require_src.cn(buttonBase, editor?.isActive({ textAlign: "right" }) ? buttonActive : buttonInactive),
+						title: "Align right",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.AlignRight, { className: "h-3.5 w-3.5" })
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: () => editor?.chain().focus().setTextAlign("justify").run(),
+						className: require_src.cn(buttonBase, editor?.isActive({ textAlign: "justify" }) ? buttonActive : buttonInactive),
+						title: "Justify",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.AlignJustify, { className: "h-3.5 w-3.5" })
+					}),
+					toolbarSeparator,
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: () => editor?.chain().focus().toggleBulletList().run(),
+						className: require_src.cn(buttonBase, editor?.isActive("bulletList") ? buttonActive : buttonInactive),
+						title: "Bullet list",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.List, { className: "h-3.5 w-3.5" })
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: () => editor?.chain().focus().toggleOrderedList().run(),
+						className: require_src.cn(buttonBase, editor?.isActive("orderedList") ? buttonActive : buttonInactive),
+						title: "Ordered list",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ListOrdered, { className: "h-3.5 w-3.5" })
+					}),
+					showDueDate && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [toolbarSeparator, dueDate ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "bg-primary/10 flex items-center gap-1 rounded px-2 py-1",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Calendar, { className: "text-primary h-3.5 w-3.5" }),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "text-primary text-xs font-medium",
+								children: formatDateForDisplay(dueDate)
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								type: "button",
+								onClick: () => setDueDate(void 0),
+								className: "text-primary/60 hover:text-primary ml-1",
+								title: "Remove due date",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.X, { className: "h-3 w-3" })
+							})
+						]
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+						type: "button",
+						onClick: () => dateInputRef.current?.showPicker(),
+						className: "text-muted-foreground hover:bg-muted hover:text-foreground flex h-7 cursor-pointer items-center gap-1 rounded px-2 text-xs font-medium transition-colors",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Calendar, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: "Due date" })]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						ref: dateInputRef,
+						type: "date",
+						className: "invisible absolute h-0 w-0",
+						onChange: (e) => {
+							if (e.target.value) setDueDate((/* @__PURE__ */ new Date(e.target.value + "T00:00:00")).toISOString());
+						}
+					})] })] })
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_dist.EditorContent, {
+				editor,
+				className: editorClassName ?? "min-h-[60vh] flex-1 overflow-y-auto p-4"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: `
+        .ProseMirror {
+          outline: none;
+        }
+
+        .ProseMirror h1 {
+          font-size: 1.5rem;
+          font-weight: 600;
+          line-height: 1.3;
+          margin-bottom: 0.5rem;
+        }
+
+        .ProseMirror h1.is-empty::before,
+        .ProseMirror p.is-empty::before {
+          color: var(--color-muted-foreground);
+          content: attr(data-placeholder);
+          float: left;
+          height: 0;
+          pointer-events: none;
+        }
+
+        .ProseMirror ul {
+          list-style-type: disc;
+          padding-left: 1.5rem;
+          margin: 0.5rem 0;
+        }
+
+        .ProseMirror ol {
+          list-style-type: decimal;
+          padding-left: 1.5rem;
+          margin: 0.5rem 0;
+        }
+
+        .ProseMirror li {
+          margin: 0.25rem 0;
+          display: list-item;
+        }
+
+        .ProseMirror li > p {
+          margin: 0;
+        }
+      ` })
+		]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/editor/note-task-modal.tsx
+function NoteTaskModal({ open, onOpenChange, mode, type, initialTitle = "", initialBody = "", initialDueDate, showDueDate = false, onSave, isPending = false, isCompleted, onToggleComplete, isTogglePending = false }) {
+	const [title, setTitle] = (0, react.useState)(initialTitle);
+	const [body, setBody] = (0, react.useState)(initialBody);
+	const dateInputRef = (0, react.useRef)(null);
+	const [dueDate, setDueDate] = (0, react.useState)(initialDueDate);
+	const typeLabel = type === "note" ? "Note" : "Task";
+	const sheetTitle = mode === "edit" ? `Edit ${typeLabel}` : `New ${typeLabel}`;
+	const requiresBody = type === "note";
+	const canSave = !!title.trim() && (!requiresBody || !!body.trim()) && !isPending;
+	const handleSave = () => {
+		if (!canSave) return;
+		onSave({
+			title: title.trim(),
+			body,
+			dueDate
+		});
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Sheet, {
+		open,
+		onOpenChange,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.SheetContent, {
+			className: "flex w-full flex-col sm:max-w-lg",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SheetHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SheetTitle, { children: sheetTitle }) }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex min-h-0 flex-1 flex-col gap-3",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+							placeholder: `${typeLabel} title`,
+							value: title,
+							onChange: (e) => setTitle(e.target.value),
+							autoFocus: true
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(NoteTaskEditor, {
+							showTitle: false,
+							bodyPlaceholder: "Start writing...",
+							initialBody,
+							editorClassName: "min-h-[200px] flex-1 overflow-y-auto p-4",
+							onChange: (content) => {
+								setBody(content.body);
+							}
+						}),
+						showDueDate && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "flex items-center gap-2",
+							children: dueDate ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "bg-primary/10 inline-flex items-center gap-1.5 rounded-md px-2.5 py-1.5",
+								children: [
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Calendar, { className: "text-primary h-3.5 w-3.5" }),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+										className: "text-primary text-sm font-medium",
+										children: ["Due ", formatDateForDisplay(dueDate)]
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										type: "button",
+										onClick: () => setDueDate(void 0),
+										className: "text-primary/60 hover:text-primary ml-1",
+										title: "Remove due date",
+										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.X, { className: "h-3 w-3" })
+									})
+								]
+							}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "relative",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+									type: "button",
+									onClick: () => dateInputRef.current?.showPicker(),
+									className: "text-muted-foreground hover:text-foreground hover:bg-muted inline-flex cursor-pointer items-center gap-1.5 rounded-md px-2.5 py-1.5 text-sm font-medium transition-colors",
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Calendar, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: "Add due date" })]
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									ref: dateInputRef,
+									type: "date",
+									className: "invisible absolute h-0 w-0",
+									onChange: (e) => {
+										if (e.target.value) setDueDate((/* @__PURE__ */ new Date(e.target.value + "T00:00:00")).toISOString());
+									}
+								})]
+							})
+						})
+					]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.SheetFooter, {
+					className: "flex-row justify-end gap-2 border-t pt-4",
+					children: [
+						mode === "edit" && onToggleComplete && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+							variant: "outline",
+							onClick: onToggleComplete,
+							disabled: isTogglePending,
+							className: "mr-auto",
+							children: isCompleted ? "Mark Incomplete" : "Mark Complete"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+							variant: "outline",
+							onClick: () => onOpenChange(false),
+							children: "Cancel"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+							onClick: handleSave,
+							disabled: !canSave,
+							children: isPending ? "Saving..." : "Save"
+						})
+					]
+				})
+			]
+		})
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/tasks/task-list.tsx
+function formatDueDate$1(dateStr) {
+	return new Date(dateStr).toLocaleDateString("en-US", {
+		month: "short",
+		day: "numeric",
+		year: "numeric"
+	});
+}
+function formatRelativeTime(dateStr, t) {
+	const date = new Date(dateStr);
+	const diffMs = (/* @__PURE__ */ new Date()).getTime() - date.getTime();
+	const diffDays = Math.floor(diffMs / (1e3 * 60 * 60 * 24));
+	if (diffDays === 0) return date.toLocaleTimeString("en-US", {
+		hour: "numeric",
+		minute: "2-digit"
+	});
+	if (diffDays === 1) return t("task_yesterday");
+	return diffDays === 1 ? t("task_days_ago_one") : t("task_days_ago_other", { count: diffDays });
+}
+function classifyDue(dueAt, isCompleted, t) {
+	if (isCompleted) return {
+		label: t("task_due", { date: formatDueDate$1(dueAt) }),
+		tone: "done"
+	};
+	const due = startOfLocalDay(dueAt);
+	const today = startOfLocalDay(/* @__PURE__ */ new Date());
+	const tomorrow = new Date(today);
+	tomorrow.setDate(today.getDate() + 1);
+	const dueTime = due.getTime();
+	if (dueTime < today.getTime()) return {
+		label: t("task_overdue_due", { date: formatDueDate$1(dueAt) }),
+		tone: "overdue"
+	};
+	if (dueTime === today.getTime()) return {
+		label: t("quick_today"),
+		tone: "today"
+	};
+	if (dueTime === tomorrow.getTime()) return {
+		label: t("quick_tomorrow"),
+		tone: "tomorrow"
+	};
+	return {
+		label: formatDueDate$1(dueAt),
+		tone: "future"
+	};
+}
+const DUE_TONE_CLASS = {
+	overdue: "bg-destructive/10 text-destructive",
+	today: "bg-primary/10 text-primary",
+	tomorrow: "bg-primary/10 text-primary",
+	future: "bg-muted text-muted-foreground",
+	done: "bg-muted text-muted-foreground"
+};
+function TaskCard({ task, toggleCompletion, onEdit, onDeleteClick }) {
+	const { t } = useContactsTranslation();
+	const isCompleted = !!task.completed_at;
+	const { title, body: bodyText } = require_parse_task_body.parseTaskBody(task.body ?? "");
+	const timestamp = task.created_at ? formatRelativeTime(task.created_at, t) : "";
+	const due = task.due_at ? classifyDue(task.due_at, isCompleted, t) : null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		role: "button",
+		tabIndex: 0,
+		onClick: () => onEdit(task),
+		onKeyDown: (e) => {
+			if (e.key === "Enter" || e.key === " ") {
+				e.preventDefault();
+				onEdit(task);
+			}
+		},
+		className: "group border-border/50 hover:border-foreground/20 hover:bg-muted/40 relative cursor-pointer rounded-xl border p-4 transition-all hover:shadow-sm",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-start gap-3",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				onClick: (e) => {
+					e.stopPropagation();
+					toggleCompletion.mutate({
+						taskId: task.id,
+						isCompleted
+					});
+				},
+				disabled: toggleCompletion.isPending,
+				className: "mt-0.5 shrink-0 transition-transform hover:scale-110 disabled:cursor-not-allowed disabled:opacity-50",
+				"aria-label": isCompleted ? t("mark_as_open") : t("mark_as_completed"),
+				children: isCompleted ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.CircleCheck, {
+					className: "text-primary size-5",
+					"aria-hidden": "true"
+				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "border-muted-foreground/40 group-hover:border-primary size-5 rounded-full border-2 transition-colors" })
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "min-w-0 flex-1",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h4", {
+						className: require_src.cn("text-foreground line-clamp-2 text-sm leading-snug font-semibold", isCompleted && "text-muted-foreground line-through"),
+						children: title
+					}),
+					bodyText && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: require_src.cn("text-muted-foreground mt-1 line-clamp-2 text-xs leading-relaxed", isCompleted && "line-through"),
+						children: bodyText
+					}),
+					(due || timestamp) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "mt-2.5 flex flex-wrap items-center gap-1.5",
+						children: [due && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: require_src.cn("inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-xs font-medium", DUE_TONE_CLASS[due.tone]),
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Calendar, {
+								className: "size-3",
+								"aria-hidden": "true"
+							}), due.label]
+						}), timestamp && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-muted-foreground/60 text-xs",
+							children: timestamp
+						})]
+					})
+				]
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "absolute top-3 right-3 opacity-0 transition-opacity group-hover:opacity-100 focus-within:opacity-100",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DropdownMenuTrigger, {
+				asChild: true,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+					variant: "ghost",
+					size: "icon-xs",
+					onClick: (e) => e.stopPropagation(),
+					"aria-label": t("task_actions"),
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.EllipsisVertical, { className: "size-4" })
+				})
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DropdownMenuContent, {
+				align: "end",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DropdownMenuItem, {
+					className: "text-destructive",
+					onClick: (e) => {
+						e.stopPropagation();
+						onDeleteClick(task);
+					},
+					children: t("delete")
+				})
+			})] })
+		})]
+	});
+}
+function TaskList({ tasks, isLoading, contactId }) {
+	const { t } = useContactsTranslation();
+	const [taskToDelete, setTaskToDelete] = (0, react.useState)(null);
+	const [editingTask, setEditingTask] = (0, react.useState)(null);
+	const toggleCompletion = useToggleTaskCompletion(contactId);
+	const deleteTask = useDeleteContactTask(contactId, { onSuccess: () => setTaskToDelete(null) });
+	const updateTask = useUpdateContactTask(contactId, { onSuccess: () => setEditingTask(null) });
+	const handleSave = (data) => {
+		if (!editingTask) return;
+		const taskBody = data.body ? `${data.title}\n\n${data.body}` : data.title;
+		updateTask.mutate({
+			taskId: editingTask.id,
+			input: {
+				body: taskBody,
+				due_at: data.dueDate ?? null
+			}
+		});
+	};
+	const editingParsed = editingTask ? require_parse_task_body.parseTaskBody(editingTask.body ?? "") : null;
+	const handleModalOpenChange = (open) => {
+		if (!open) setEditingTask(null);
+	};
+	if (isLoading) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "flex flex-col gap-3",
+		children: [
+			1,
+			2,
+			3
+		].map((i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "border-border/50 bg-muted/50 h-32 animate-pulse rounded-xl border" }, i))
+	});
+	if (tasks.length === 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, {});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "space-y-4",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-col gap-3",
+				children: tasks.map((task) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TaskCard, {
+					task,
+					toggleCompletion,
+					onEdit: setEditingTask,
+					onDeleteClick: setTaskToDelete
+				}, task.id))
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(NoteTaskModal, {
+				open: editingTask !== null,
+				onOpenChange: handleModalOpenChange,
+				mode: "edit",
+				type: "task",
+				initialTitle: editingParsed?.title ?? "",
+				initialBody: editingParsed?.body ?? "",
+				initialDueDate: editingTask?.due_at ?? void 0,
+				showDueDate: true,
+				onSave: handleSave,
+				isPending: updateTask.isPending,
+				isCompleted: editingTask ? !!editingTask.completed_at : void 0,
+				onToggleComplete: editingTask ? () => toggleCompletion.mutate({
+					taskId: editingTask.id,
+					isCompleted: !!editingTask.completed_at
+				}, { onSuccess: () => setEditingTask(null) }) : void 0,
+				isTogglePending: toggleCompletion.isPending
+			}, editingTask?.id ?? "edit"),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialog, {
+				open: taskToDelete !== null,
+				onOpenChange: (open) => {
+					if (!open) setTaskToDelete(null);
+				},
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AlertDialogContent, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AlertDialogHeader, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogTitle, { children: t("delete_task_title") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogDescription, { children: t("delete_task_confirm") })] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AlertDialogFooter, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogCancel, { children: t("cancel") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogAction, {
+					variant: "destructive",
+					onClick: () => {
+						if (taskToDelete) deleteTask.mutate(taskToDelete.id);
+					},
+					children: t("delete")
+				})] })] })
+			})
+		]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/hooks/contacts/use-create-contact-task.ts
+function useCreateContactTask(contactId, options) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const api = useTasksApi();
+	return (0, _tanstack_react_query.useMutation)({
+		mutationFn: (input) => api.createTask(contactId, input),
+		onSuccess: () => {
+			require_src.fluidToast({
+				title: "Task created",
+				type: "success"
+			});
+			queryClient.invalidateQueries({ queryKey: contactsKeys.tasks(contactId) });
+			options?.onSuccess?.();
+		},
+		onError: (error) => {
+			require_src.fluidToast({
+				title: "Failed to create task",
+				type: "error",
+				description: parseApiErrors(error)
+			});
+		}
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/tasks/inline-task-composer.tsx
+const QUICK_DATES = [
+	{
+		key: "today",
+		offsetDays: 0
+	},
+	{
+		key: "tomorrow",
+		offsetDays: 1
+	},
+	{
+		key: "next_week",
+		offsetDays: 7
+	}
+];
+function InlineTaskComposer({ contactId }) {
+	const { t } = useContactsTranslation();
+	const [isOpen, setIsOpen] = (0, react.useState)(false);
+	const [body, setBody] = (0, react.useState)("");
+	const [dueDate, setDueDate] = (0, react.useState)(null);
+	const inputRef = (0, react.useRef)(null);
+	const createTask = useCreateContactTask(contactId, { onSuccess: () => {
+		setBody("");
+		setDueDate(null);
+		setIsOpen(false);
+	} });
+	(0, react.useEffect)(() => {
+		if (isOpen) inputRef.current?.focus();
+	}, [isOpen]);
+	const quickDates = (0, react.useMemo)(() => QUICK_DATES.map((q) => ({
+		key: q.key,
+		iso: isoDate(q.offsetDays)
+	})), []);
+	const quickLabels = {
+		today: t("quick_today"),
+		tomorrow: t("quick_tomorrow"),
+		next_week: t("quick_next_week")
+	};
+	const close = () => {
+		setIsOpen(false);
+		setBody("");
+		setDueDate(null);
+	};
+	const submit = () => {
+		const trimmed = body.trim();
+		if (!trimmed || createTask.isPending) return;
+		createTask.mutate({
+			body: trimmed,
+			due_at: dueDate
+		});
+	};
+	const canSubmit = body.trim().length > 0 && !createTask.isPending;
+	if (!isOpen) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		type: "button",
+		onClick: () => setIsOpen(true),
+		className: "border-border/50 text-muted-foreground hover:border-foreground/30 hover:bg-muted/40 hover:text-foreground flex w-full items-center gap-3 rounded-xl border border-dashed px-5 py-4 text-sm font-medium transition-colors",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, {
+			className: "size-4",
+			"aria-hidden": "true"
+		}), t("new_task")]
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "border-border/50 focus-within:border-foreground/30 rounded-xl border p-3 transition-colors",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-start gap-3",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "border-muted-foreground/50 mt-1.5 size-5 shrink-0 rounded-full border-2",
+					"aria-hidden": "true"
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+					ref: inputRef,
+					value: body,
+					onChange: (e) => setBody(e.target.value),
+					onKeyDown: (e) => {
+						if (e.key === "Enter" && !e.shiftKey) {
+							e.preventDefault();
+							submit();
+						} else if (e.key === "Escape") {
+							e.preventDefault();
+							close();
+						}
+					},
+					placeholder: t("task_describe_placeholder"),
+					"aria-label": t("task_description_aria"),
+					className: "placeholder:text-muted-foreground/80 text-foreground flex-1 border-0 bg-transparent text-sm font-medium outline-none"
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					onClick: close,
+					"aria-label": t("task_discard_aria"),
+					className: "text-muted-foreground hover:bg-muted hover:text-foreground -mt-0.5 -mr-0.5 flex size-7 shrink-0 items-center justify-center rounded-md transition-colors",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.X, { className: "size-4" })
+				})
+			]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "mt-3 flex items-center gap-1.5 pl-8",
+			children: [
+				quickDates.map((q) => {
+					const isActive = dueDate === q.iso;
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: () => setDueDate(isActive ? null : q.iso),
+						"aria-pressed": isActive,
+						className: require_src.cn("shrink-0 rounded-full px-3 py-1 text-xs font-medium transition-colors", isActive ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground hover:bg-muted/70"),
+						children: quickLabels[q.key]
+					}, q.key);
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "ml-auto" }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					onClick: submit,
+					disabled: !canSubmit,
+					className: "bg-primary text-primary-foreground hover:bg-primary/90 disabled:bg-muted disabled:text-muted-foreground inline-flex shrink-0 items-center gap-1.5 rounded-full px-4 py-1.5 text-xs font-semibold transition-colors disabled:cursor-not-allowed",
+					children: createTask.isPending ? t("adding") : t("add_task")
+				})
+			]
+		})]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/hooks/notes/use-delete-contact-note.ts
+function useDeleteContactNote(contactId, options) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const api = useNotesApi();
+	return (0, _tanstack_react_query.useMutation)({
+		mutationFn: (noteId) => api.deleteNote(noteId, contactId),
+		onSuccess: () => {
+			require_src.fluidToast({
+				title: "Note deleted",
+				type: "success"
+			});
+			queryClient.invalidateQueries({ queryKey: contactsKeys.notes(contactId) });
+			options?.onSuccess?.();
+		},
+		onError: (error) => {
+			require_src.fluidToast({
+				title: "Failed to delete note",
+				type: "error",
+				description: parseApiErrors(error)
+			});
+		}
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/hooks/notes/use-update-contact-note.ts
+function useUpdateContactNote(contactId, options) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const api = useNotesApi();
+	return (0, _tanstack_react_query.useMutation)({
+		mutationFn: ({ noteId, input }) => api.updateNote(noteId, contactId, input),
+		onSuccess: () => {
+			require_src.fluidToast({
+				title: "Note updated",
+				type: "success"
+			});
+			queryClient.invalidateQueries({ queryKey: contactsKeys.notes(contactId) });
+			options?.onSuccess?.();
+		},
+		onError: (error) => {
+			require_src.fluidToast({
+				title: "Failed to update note",
+				type: "error",
+				description: parseApiErrors(error)
+			});
+		}
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/hooks/notes/use-create-contact-note.ts
+function useCreateContactNote(contactId, options) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const api = useNotesApi();
+	return (0, _tanstack_react_query.useMutation)({
+		mutationFn: (input) => api.createNote(contactId, input),
+		onSuccess: () => {
+			require_src.fluidToast({
+				title: "Note created",
+				type: "success"
+			});
+			queryClient.invalidateQueries({ queryKey: contactsKeys.notes(contactId) });
+			options?.onSuccess?.();
+		},
+		onError: (error) => {
+			require_src.fluidToast({
+				title: "Failed to create note",
+				type: "error",
+				description: parseApiErrors(error)
+			});
+		}
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/notes/inline-note-composer.tsx
+function detectMacPlatform() {
+	if (typeof navigator === "undefined") return false;
+	const platform = navigator.userAgentData?.platform ?? navigator.userAgent ?? "";
+	return /Mac|iPhone|iPad/i.test(platform);
+}
+function InlineNoteComposer({ contactId }) {
+	const { t } = useContactsTranslation();
+	const [body, setBody] = (0, react.useState)("");
+	const [isFocused, setIsFocused] = (0, react.useState)(false);
+	const [isMac, setIsMac] = (0, react.useState)(false);
+	const textareaRef = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		setIsMac(detectMacPlatform());
+	}, []);
+	const createNote = useCreateContactNote(contactId, { onSuccess: () => {
+		setBody("");
+		textareaRef.current?.blur();
+	} });
+	const submit = () => {
+		const trimmed = body.trim();
+		if (!trimmed || createNote.isPending) return;
+		const firstLine = trimmed.split("\n")[0]?.slice(0, 120) ?? "Note";
+		createNote.mutate({
+			title: firstLine,
+			body: trimmed
+		});
+	};
+	const canSubmit = body.trim().length > 0 && !createNote.isPending;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: require_src.cn("border-border/50 focus-within:border-foreground/30 rounded-2xl border p-4 transition-colors", isFocused && "border-foreground/30"),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+			ref: textareaRef,
+			value: body,
+			onChange: (e) => setBody(e.target.value),
+			onFocus: () => setIsFocused(true),
+			onBlur: () => setIsFocused(false),
+			onKeyDown: (e) => {
+				if ((e.metaKey || e.ctrlKey) && e.key === "Enter") {
+					e.preventDefault();
+					submit();
+				}
+			},
+			placeholder: t("note_placeholder"),
+			"aria-label": t("note_body_aria"),
+			rows: 3,
+			className: "placeholder:text-muted-foreground text-foreground min-h-[80px] w-full resize-none border-0 bg-transparent text-sm leading-relaxed outline-none"
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "mt-3 flex items-center justify-between gap-3",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-muted-foreground text-xs",
+				children: isMac ? t("tip_save_shortcut_mac") : t("tip_save_shortcut_other")
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				onClick: submit,
+				disabled: !canSubmit,
+				className: "bg-primary text-primary-foreground hover:bg-primary/90 disabled:bg-muted disabled:text-muted-foreground inline-flex shrink-0 items-center gap-1.5 rounded-full px-4 py-1.5 text-xs font-semibold transition-colors disabled:cursor-not-allowed",
+				children: createNote.isPending ? t("adding") : t("add_note")
+			})]
+		})]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/notes/notes-list.tsx
+function formatDueDate(dateStr) {
+	return new Date(dateStr).toLocaleDateString("en-US", {
+		month: "short",
+		day: "numeric",
+		year: "numeric"
+	});
+}
+function formatRelativeNote(dateStr, t) {
+	const date = new Date(dateStr);
+	const diffMs = (/* @__PURE__ */ new Date()).getTime() - date.getTime();
+	const diffDays = Math.floor(diffMs / (1e3 * 60 * 60 * 24));
+	if (diffDays === 0) return date.toLocaleTimeString("en-US", {
+		hour: "numeric",
+		minute: "2-digit"
+	});
+	if (diffDays === 1) return t("task_yesterday");
+	if (diffDays < 7) return t("task_days_ago_other", { count: diffDays });
+	return formatDueDate(dateStr);
+}
+function NoteCard({ note, onEdit, onDelete }) {
+	const { t } = useContactsTranslation();
+	const assetCount = note.assets?.length ?? 0;
+	const showTitle = !!note.title?.trim() && note.title.trim() !== note.body?.trim();
+	const dueDateValue = note.due_at ?? note.due_date ?? null;
+	const createdLabel = note.created_at ? formatRelativeNote(note.created_at, t) : null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		role: "button",
+		tabIndex: 0,
+		onClick: () => onEdit(note),
+		onKeyDown: (e) => {
+			if (e.key === "Enter" || e.key === " ") {
+				e.preventDefault();
+				onEdit(note);
+			}
+		},
+		className: "group border-border/50 hover:border-foreground/20 hover:bg-muted/40 relative cursor-pointer rounded-xl border p-4 transition-all hover:shadow-sm",
+		children: [
+			showTitle && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h4", {
+				className: "text-foreground line-clamp-1 text-sm font-semibold",
+				children: note.title
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: require_src.cn("text-foreground line-clamp-4 text-sm leading-relaxed whitespace-pre-wrap", showTitle && "text-muted-foreground mt-1"),
+				children: note.body
+			}),
+			(createdLabel || dueDateValue || assetCount > 0) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "mt-2.5 flex flex-wrap items-center gap-3",
+				children: [
+					createdLabel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-muted-foreground/70 text-xs",
+						children: createdLabel
+					}),
+					dueDateValue && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "bg-primary/10 text-primary inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-xs font-medium",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Calendar, {
+							className: "size-3",
+							"aria-hidden": "true"
+						}), t("task_due", { date: formatDueDate(dueDateValue) })]
+					}),
+					assetCount > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "text-muted-foreground inline-flex items-center gap-1 text-xs",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Paperclip, {
+							className: "size-3",
+							"aria-hidden": "true"
+						}), assetCount === 1 ? t("attachment_one") : t("attachment_other", { count: assetCount })]
+					})
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "absolute top-3 right-3 opacity-0 transition-opacity group-hover:opacity-100 focus-within:opacity-100",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DropdownMenuTrigger, {
+					asChild: true,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+						variant: "ghost",
+						size: "icon-xs",
+						onClick: (e) => e.stopPropagation(),
+						"aria-label": t("note_actions"),
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.EllipsisVertical, { className: "size-4" })
+					})
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DropdownMenuContent, {
+					align: "end",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DropdownMenuItem, {
+						className: "text-destructive",
+						onClick: (e) => {
+							e.stopPropagation();
+							onDelete(note);
+						},
+						children: t("delete")
+					})
+				})] })
+			})
+		]
+	});
+}
+function NotesList({ notes, isLoading, contactId }) {
+	const { t } = useContactsTranslation();
+	const [noteToDelete, setNoteToDelete] = (0, react.useState)(null);
+	const [editingNote, setEditingNote] = (0, react.useState)(null);
+	const deleteNote = useDeleteContactNote(contactId, { onSuccess: () => setNoteToDelete(null) });
+	const updateNote = useUpdateContactNote(contactId, { onSuccess: () => setEditingNote(null) });
+	const handleEditSave = (data) => {
+		if (!editingNote) return;
+		updateNote.mutate({
+			noteId: editingNote.id,
+			input: {
+				title: data.title,
+				body: data.body
+			}
+		});
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "space-y-4",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(InlineNoteComposer, { contactId }),
+			isLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-col gap-3",
+				children: [
+					1,
+					2,
+					3
+				].map((i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "border-border/50 bg-muted/50 h-20 animate-pulse rounded-xl border" }, i))
+			}) : notes.length === 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-col gap-3",
+				children: notes.map((note) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NoteCard, {
+					note,
+					onEdit: setEditingNote,
+					onDelete: setNoteToDelete
+				}, note.id))
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(NoteTaskModal, {
+				open: editingNote !== null,
+				onOpenChange: (open) => {
+					if (!open) setEditingNote(null);
+				},
+				mode: "edit",
+				type: "note",
+				initialTitle: editingNote?.title ?? "",
+				initialBody: editingNote?.body ?? "",
+				onSave: handleEditSave,
+				isPending: updateNote.isPending
+			}, editingNote?.id ?? "edit"),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialog, {
+				open: !!noteToDelete,
+				onOpenChange: (open) => {
+					if (!open) setNoteToDelete(null);
+				},
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AlertDialogContent, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AlertDialogHeader, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogTitle, { children: t("delete_note_title") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogDescription, { children: t("delete_note_irreversible") })] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AlertDialogFooter, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogCancel, { children: t("cancel") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogAction, {
+					variant: "destructive",
+					onClick: () => {
+						if (noteToDelete) deleteNote.mutate(noteToDelete.id);
+					},
+					children: t("delete")
+				})] })] })
+			})
+		]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/contacts/rep-layout/ContactDetailTabs.tsx
+const VISIBLE_TABS = ["Tasks", "Notes"];
+function ContactDetailTabs({ contactId, tasks, isLoadingTasks, notes, isLoadingNotes, activeTab, onTabChange }) {
+	const { t } = useContactsTranslation();
+	const tabLabels = {
+		Tasks: t("tab_tasks"),
+		Notes: t("tab_notes")
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "mt-8",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "border-border/50 flex items-center gap-1 border-b",
+			children: VISIBLE_TABS.map((tab) => {
+				const count = tab === "Tasks" ? tasks.length : notes.length;
+				const isActive = activeTab === tab;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					onClick: () => onTabChange(tab),
+					className: require_src.cn("relative flex items-center gap-1.5 px-3 py-2.5 text-sm font-semibold transition-colors", isActive ? "text-foreground" : "text-muted-foreground hover:text-foreground"),
+					children: [
+						tabLabels[tab],
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: require_src.cn("rounded-full px-1.5 text-xs leading-5 font-bold", isActive ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground"),
+							children: count
+						}),
+						isActive && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "bg-primary absolute inset-x-0 -bottom-px h-0.5",
+							"aria-hidden": "true"
+						})
+					]
+				}, tab);
+			})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "pt-6",
+			children: [activeTab === "Tasks" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "space-y-4",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(InlineTaskComposer, { contactId }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TaskList, {
+					tasks,
+					isLoading: isLoadingTasks,
+					contactId,
+					hideHeader: true
+				})]
+			}), activeTab === "Notes" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NotesList, {
+				notes,
+				isLoading: isLoadingNotes,
+				contactId
+			})]
+		})]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/contacts/rep-layout/ContactDetailPane.tsx
+function ContactDetailPane({ contactId, queryKeyPrefix, getCountries, onBack }) {
+	const { t } = useContactsTranslation();
+	const { contact, isLoading, methods, countryOptions, isDirty, isSubmitting, isDeleting, onSave, onDelete } = useContactDetailPage(contactId, {
+		queryKeyPrefix,
+		getCountries,
+		onDeleteSuccess: onBack,
+		onSaveSuccess: () => setEditProfileOpen(false)
+	});
+	const { data: tasks = [], isLoading: isLoadingTasks } = useContactTasks(contactId);
+	const { data: notes = [], isLoading: isLoadingNotes } = useContactNotes(contactId);
+	const [confirmDelete, setConfirmDelete] = (0, react.useState)(false);
+	const [activeTab, setActiveTab] = (0, react.useState)("Tasks");
+	const [editProfileOpen, setEditProfileOpen] = (0, react.useState)(false);
+	const handleConfirmDelete = (0, react.useCallback)(() => {
+		setConfirmDelete(false);
+		onDelete();
+	}, [onDelete]);
+	if (isLoading) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactDetailSkeleton, { onBack });
+	if (!contact) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex h-full flex-1 flex-col",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DetailTopBar, {
+			onBack,
+			phone: null,
+			email: null,
+			onDelete: null,
+			onEditProfile: null
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "mx-auto flex max-w-md flex-col items-center px-6 py-16 text-center",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+				className: "text-foreground text-base font-semibold",
+				children: t("error_loading")
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-muted-foreground mt-2 text-sm",
+				children: t("error_loading_description")
+			})]
+		})]
+	});
+	const fullName = getDisplayName(contact);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_hook_form.FormProvider, {
+		...methods,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex h-full flex-1 flex-col",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DetailTopBar, {
+					onBack,
+					phone: contact.phone ?? null,
+					email: contact.email ?? null,
+					onDelete: () => setConfirmDelete(true),
+					onEditProfile: () => setEditProfileOpen(true)
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "flex-1 overflow-y-auto",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "mx-auto w-full max-w-[900px] px-6 pt-8 pb-16 md:px-8 md:pt-10",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactDetailHero, {
+								contact,
+								tasksCount: tasks.length,
+								notesCount: notes.length
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactInfoRow, {
+								contact,
+								onEditEmpty: () => setEditProfileOpen(true)
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactDetailTabs, {
+								contactId,
+								tasks,
+								isLoadingTasks,
+								notes,
+								isLoadingNotes,
+								activeTab,
+								onTabChange: setActiveTab
+							})
+						]
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Dialog, {
+					open: editProfileOpen,
+					onOpenChange: (open) => {
+						if (!open && isSubmitting) return;
+						setEditProfileOpen(open);
+					},
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DialogContent, {
+						className: "max-h-[90vh] max-w-2xl overflow-y-auto",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogTitle, { children: t("edit_contact_name", { name: fullName }) }) }),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactDetailsForm, { countries: countryOptions }),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DialogFooter, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+								type: "button",
+								variant: "secondary",
+								onClick: () => setEditProfileOpen(false),
+								disabled: isSubmitting,
+								children: t("cancel")
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.Button, {
+								type: "button",
+								onClick: onSave,
+								disabled: !isDirty || isSubmitting,
+								"aria-busy": isSubmitting,
+								children: [isSubmitting && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Spinner, { className: "size-4" }), isSubmitting ? t("saving") : t("save_changes")]
+							})] })
+						]
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialog, {
+					open: confirmDelete,
+					onOpenChange: setConfirmDelete,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AlertDialogContent, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AlertDialogHeader, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogTitle, { children: t("delete_name", { name: fullName }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogDescription, { children: t("delete_confirm_permanent") })] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AlertDialogFooter, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogCancel, {
+						disabled: isDeleting,
+						children: t("cancel")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AlertDialogAction, {
+						variant: "destructive",
+						onClick: handleConfirmDelete,
+						disabled: isDeleting,
+						children: isDeleting ? t("deleting") : t("delete_contact")
+					})] })] })
+				})
+			]
+		})
+	});
+}
+function DetailTopBar({ onBack, phone, email, onDelete, onEditProfile }) {
+	const { t } = useContactsTranslation();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "border-border/50 bg-background/90 sticky top-0 z-10 flex items-center justify-between border-b px-4 py-3 backdrop-blur md:px-8",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-center gap-3",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				onClick: onBack,
+				className: "text-muted-foreground hover:bg-muted hover:text-foreground flex size-8 items-center justify-center rounded-full transition-colors md:hidden",
+				"aria-label": t("back_to_contacts"),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronLeft, { className: "size-4" })
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-muted-foreground hidden text-xs font-semibold tracking-widest uppercase md:inline",
+				children: t("contact_label")
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-center gap-1",
+			children: [
+				onEditProfile && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					onClick: onEditProfile,
+					className: "text-muted-foreground hover:bg-muted hover:text-foreground flex size-8 items-center justify-center rounded-full transition-colors",
+					"aria-label": t("edit_profile"),
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Pencil, {
+						className: "size-4",
+						"aria-hidden": "true"
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ActionLink, {
+					href: phone ? `tel:${phone}` : null,
+					label: t("label_call"),
+					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Phone, {
+						className: "size-4",
+						"aria-hidden": "true"
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ActionLink, {
+					href: email ? `mailto:${email}` : null,
+					label: t("label_email"),
+					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Mail, {
+						className: "size-4",
+						"aria-hidden": "true"
+					})
+				}),
+				onDelete && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "bg-border mx-1 h-5 w-px",
+					"aria-hidden": "true"
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DropdownMenuTrigger, {
+					asChild: true,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "text-muted-foreground hover:bg-muted hover:text-foreground flex size-8 items-center justify-center rounded-full transition-colors",
+						"aria-label": t("more_actions"),
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.MoreHorizontal, { className: "size-4" })
+					})
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DropdownMenuContent, {
+					align: "end",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DropdownMenuItem, {
+						className: "text-destructive",
+						onClick: onDelete,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Trash2, {
+							className: "size-4",
+							"aria-hidden": "true"
+						}), t("delete_contact")]
+					})
+				})] })] })
+			]
+		})]
+	});
+}
+function ActionLink({ href, label, icon }) {
+	const baseClass = "flex size-8 items-center justify-center rounded-full transition-colors";
+	if (!href) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		"aria-label": `${label} (unavailable)`,
+		className: require_src.cn(baseClass, "text-muted-foreground/40 cursor-default"),
+		children: icon
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+		href,
+		"aria-label": label,
+		className: require_src.cn(baseClass, "text-muted-foreground hover:bg-muted hover:text-foreground"),
+		children: icon
+	});
+}
+function ContactDetailSkeleton({ onBack }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex h-full flex-1 flex-col",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DetailTopBar, {
+			onBack,
+			phone: null,
+			email: null,
+			onDelete: null,
+			onEditProfile: null
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "mx-auto w-full max-w-[900px] flex-1 space-y-6 px-6 pt-8 pb-16 md:px-8 md:pt-10",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex items-start gap-5",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted size-20 animate-pulse rounded-xl" }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "flex-1 space-y-3",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-7 w-48 animate-pulse rounded" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-4 w-24 animate-pulse rounded" })]
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-24 animate-pulse rounded-xl" }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-64 animate-pulse rounded-xl" })
+			]
+		})]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/contacts/rep-layout/ContactsEmptyState.tsx
+function ContactsEmptyState() {
+	const { t } = useContactsTranslation();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "hidden h-full flex-1 flex-col items-center justify-center px-8 text-center md:flex",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "bg-muted text-muted-foreground flex size-16 items-center justify-center rounded-xl",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Users, {
+					className: "size-7",
+					"aria-hidden": "true"
+				})
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+				className: "text-foreground mt-5 text-base font-semibold",
+				children: t("empty_select_contact")
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-muted-foreground mt-1 max-w-xs text-sm",
+				children: t("empty_select_description")
+			})
+		]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/portal/components/contacts/rep-layout/RepContactsLayout.tsx
+function RepContactsLayout({ selectedContactId, onSelect, onAdd, queryKeyPrefix, getCountries }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "bg-background flex h-full overflow-hidden",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("aside", {
+			className: require_src.cn("border-border/50 bg-background w-full shrink-0 overflow-hidden border-r md:flex md:w-[420px] md:flex-col", selectedContactId ? "hidden" : "flex flex-col"),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactsSidebar, {
+				selectedContactId,
+				onSelect,
+				onAdd
+			})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("main", {
+			className: require_src.cn("bg-background relative flex-1 md:flex md:flex-col", selectedContactId ? "flex flex-col" : "hidden md:flex"),
+			children: selectedContactId ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactDetailPane, {
+				contactId: selectedContactId,
+				queryKeyPrefix,
+				getCountries,
+				onBack: () => onSelect(null)
+			}, selectedContactId) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactsEmptyState, {})
+		})]
+	});
+}
+//#endregion
+//#region ../../contacts/ui/src/shared/hooks/useCreateContactMutation.ts
+function useCreateContactMutation(queryKeyPrefix = "contacts", options) {
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const api = useContactsCrud();
+	return (0, _tanstack_react_query.useMutation)({
+		mutationFn: (data) => api.createContact(data),
+		onSuccess: (data) => {
+			require_src.fluidToast({
+				title: "Contact created successfully",
+				type: "success"
+			});
+			queryClient.invalidateQueries({ queryKey: CONTACTS_QUERY_KEYS.all(queryKeyPrefix) });
+			options?.onSuccess?.(data);
+		},
+		onError: (error) => {
+			if (options?.onError) options.onError(error);
+			else require_src.fluidToast({
+				title: "Failed to create contact",
+				type: "error",
+				description: parseApiErrors(error)
+			});
+		}
+	});
+}
+//#endregion
+//#region ../../api-clients/portal-tenant-contacts/src/namespaces/portal_tenant_contacts.ts
+/**
+* List contacts with cursor pagination
+* Returns a paginated list of contacts belonging to the authenticated member.
+*
+* @param client - Fetch client instance
+* @param [params] - params
+*/
+async function contacts_list(client, params) {
+	return client.get(`/api/contacts`, params);
+}
+/**
+* Create a new contact
+* Creates a new contact for the authenticated member.
+*
+* @param client - Fetch client instance
+* @param body - body
+*/
+async function contacts_create(client, body) {
+	return client.post(`/api/contacts`, body);
+}
+/**
+* Get a specific contact
+* Returns a single contact by ID.
+*
+* @param client - Fetch client instance
+* @param id - id
+*/
+async function contacts_show(client, id) {
+	return client.get(`/api/contacts/${id}`);
+}
+/**
+* Update a contact
+* Updates an existing contact's attributes.
+*
+* @param client - Fetch client instance
+* @param id - id
+* @param body - body
+*/
+async function contacts_update(client, id, body) {
+	return client.patch(`/api/contacts/${id}`, body);
+}
+/**
+* Delete a contact
+* Soft-deletes a contact by ID.
+*
+* @param client - Fetch client instance
+* @param id - id
+*/
+async function contacts_destroy(client, id) {
+	return client.delete(`/api/contacts/${id}`);
+}
+/**
+* Delete multiple contacts
+* Soft-deletes multiple contacts by their IDs.
+*
+* @param client - Fetch client instance
+* @param body - body
+*/
+async function contacts_bulk_destroy(client, body) {
+	return client.delete(`/api/contacts/bulk`, { body });
+}
+/**
+* List contact groups
+* Returns a paginated list of contact groups belonging to the authenticated member.
+*
+* @param client - Fetch client instance
+* @param [params] - params
+*/
+async function contacts_groups_list(client, params) {
+	return client.get(`/api/contacts/groups`, params);
+}
+/**
+* Create a new group
+* Creates a new contact group for the authenticated member.
+*
+* @param client - Fetch client instance
+* @param body - body
+*/
+async function contacts_groups_create(client, body) {
+	return client.post(`/api/contacts/groups`, body);
+}
+/**
+* Update a group
+* Updates an existing contact group.
+*
+* @param client - Fetch client instance
+* @param id - id
+* @param body - body
+*/
+async function contacts_groups_update(client, id, body) {
+	return client.patch(`/api/contacts/groups/${id}`, body);
+}
+/**
+* Delete a group
+* Removes a contact group.
+*
+* @param client - Fetch client instance
+* @param id - id
+*/
+async function contacts_groups_destroy(client, id) {
+	return client.delete(`/api/contacts/groups/${id}`);
+}
+/**
+* List notes for a contact
+* Returns notes attached to a contact.
+*
+* @param client - Fetch client instance
+* @param contact_id - contact_id
+* @param [params] - params
+*/
+async function contacts_notes_list(client, contact_id, params) {
+	return client.get(`/api/contacts/${contact_id}/notes`, params);
+}
+/**
+* Create a note for a contact
+* Adds a new note to a contact.
+*
+* @param client - Fetch client instance
+* @param contact_id - contact_id
+* @param body - body
+*/
+async function contacts_notes_create(client, contact_id, body) {
+	return client.post(`/api/contacts/${contact_id}/notes`, body);
+}
+/**
+* List tasks for a contact
+* Returns tasks assigned to a contact.
+*
+* @param client - Fetch client instance
+* @param contact_id - contact_id
+* @param [params] - params
+*/
+async function contacts_tasks_list(client, contact_id, params) {
+	return client.get(`/api/contacts/${contact_id}/tasks`, params);
+}
+/**
+* Create a task for a contact
+* Adds a new task to a contact.
+*
+* @param client - Fetch client instance
+* @param contact_id - contact_id
+* @param body - body
+*/
+async function contacts_tasks_create(client, contact_id, body) {
+	return client.post(`/api/contacts/${contact_id}/tasks`, body);
+}
+/**
+* Update a note
+* Updates an existing note on a contact.
+*
+* @param client - Fetch client instance
+* @param contact_id - contact_id
+* @param id - id
+* @param body - body
+*/
+async function contacts_notes_update(client, contact_id, id, body) {
+	return client.patch(`/api/contacts/${contact_id}/notes/${id}`, body);
+}
+/**
+* Delete a note
+* Removes a note from a contact.
+*
+* @param client - Fetch client instance
+* @param contact_id - contact_id
+* @param id - id
+*/
+async function contacts_notes_destroy(client, contact_id, id) {
+	return client.delete(`/api/contacts/${contact_id}/notes/${id}`);
+}
+/**
+* Update a task
+* Updates an existing task on a contact.
+*
+* @param client - Fetch client instance
+* @param contact_id - contact_id
+* @param id - id
+* @param body - body
+*/
+async function contacts_tasks_update(client, contact_id, id, body) {
+	return client.patch(`/api/contacts/${contact_id}/tasks/${id}`, body);
+}
+/**
+* Delete a task
+* Removes a task from a contact.
+*
+* @param client - Fetch client instance
+* @param contact_id - contact_id
+* @param id - id
+*/
+async function contacts_tasks_destroy(client, contact_id, id) {
+	return client.delete(`/api/contacts/${contact_id}/tasks/${id}`);
+}
+//#endregion
+//#region src/adapters/contacts-api-adapter.ts
+const EMPTY_META = {
+	total_count: 0,
+	total_pages: 0,
+	current_page: 1,
+	next_cursor: null
+};
+function paginationFromBff(meta, itemCount, currentPage, pageSize) {
+	if (!meta) return EMPTY_META;
+	const nextCursor = meta.pagination?.next_cursor ?? null;
+	const hasNext = !!nextCursor;
+	const totalCount = meta.total_count ?? (hasNext ? (currentPage + 1) * pageSize : (currentPage - 1) * pageSize + itemCount);
+	return {
+		total_count: totalCount,
+		total_pages: Math.max(1, Math.ceil(totalCount / pageSize)),
+		current_page: currentPage,
+		next_cursor: nextCursor,
+		request_id: meta.request_id ?? void 0,
+		timestamp: meta.timestamp ?? void 0
+	};
+}
+/** BFF Contact → core Contact. Fills missing fields with safe defaults. */
+function mapContact(raw) {
+	return {
+		id: raw.id,
+		full_name: `${raw.first_name ?? ""} ${raw.last_name ?? ""}`.trim(),
+		first_name: raw.first_name ?? null,
+		last_name: raw.last_name ?? null,
+		email: raw.email ?? null,
+		phone: raw.phone ?? null,
+		status: raw.status ?? null,
+		address: raw.address ?? null,
+		city: raw.city ?? null,
+		state: raw.state ?? null,
+		postal_code: raw.postal_code ?? null,
+		avatar_url: raw.avatar_url ?? null,
+		country: raw.country ?? null,
+		tags: raw.tags ?? [],
+		metadata: {},
+		created_at: raw.created_at,
+		updated_at: raw.updated_at
+	};
+}
+/** BFF Note → core ContactNote. */
+function mapNote(raw) {
+	return {
+		id: raw.id,
+		title: raw.title ?? "",
+		body: raw.body ?? "",
+		note_type: null,
+		due_date: null,
+		due_time: null,
+		pinned: null,
+		created_at: raw.created_at,
+		updated_at: raw.updated_at,
+		contact_id: raw.contact_id ?? 0,
+		assets: []
+	};
+}
+/** BFF Task → core ContactTask. */
+function mapTask(raw) {
+	return {
+		id: raw.id,
+		body: raw.title ?? "",
+		due_at: raw.due_date ?? null,
+		completed_at: raw.completed_at ?? (raw.completed ? (/* @__PURE__ */ new Date()).toISOString() : null),
+		created_at: raw.created_at,
+		contact_id: raw.contact_id ?? null
+	};
+}
+/**
+* The contacts-ui sends offset pagination params (page, per_page, sort_by,
+* sort_direction, search, status). The BFF expects cursor pagination
+* (page[cursor], page[limit], search, tags). Translate between the two.
+*
+* `cursorCache` maps page numbers → cursor tokens so page-2+ requests can
+* resolve to the correct cursor. The cache is populated from BFF responses.
+*/
+function mapListParams(params, cursorCache) {
+	if (!params) return void 0;
+	const mapped = {};
+	if (params.per_page || params.limit) mapped["page[limit]"] = params.per_page ?? params.limit;
+	const page = params.page ?? 1;
+	if (page > 1) {
+		const cursor = cursorCache.get(page);
+		if (cursor) mapped["page[cursor]"] = cursor;
+	}
+	if (params.search_query || params.search || params.query) mapped.search = params.search_query ?? params.search ?? params.query;
+	if (params.tags) mapped.tags = params.tags;
+	return mapped;
+}
+function createContactsAdapter(client) {
+	const cursorCache = /* @__PURE__ */ new Map();
+	return {
+		getContact: async (id) => {
+			return { contact: mapContact((await contacts_show(client, id)).contact) };
+		},
+		listContacts: async (params) => {
+			const raw = params;
+			const page = raw?.page ?? 1;
+			const pageSize = raw?.per_page ?? 25;
+			const body = await contacts_list(client, mapListParams(raw, cursorCache));
+			const meta = body.meta;
+			const nextCursor = (meta?.pagination)?.next_cursor;
+			if (nextCursor) cursorCache.set(page + 1, nextCursor);
+			const contacts = (body.contacts ?? []).map(mapContact);
+			return {
+				contacts,
+				meta: paginationFromBff(meta, contacts.length, page, pageSize)
+			};
+		},
+		createContact: async (data) => {
+			return contacts_create(client, { contact: data });
+		},
+		updateContact: async (id, data) => {
+			return contacts_update(client, id, { contact: data });
+		},
+		deleteContact: async (id) => {
+			return contacts_destroy(client, id);
+		},
+		bulkDeleteContacts: async (ids) => {
+			return contacts_bulk_destroy(client, { ids });
+		}
+	};
+}
+function createNotesAdapter(client) {
+	return {
+		listNotes: async (contactId) => {
+			return { notes: ((await contacts_notes_list(client, contactId)).notes ?? []).map(mapNote) };
+		},
+		createNote: async (contactId, input) => {
+			return contacts_notes_create(client, contactId, { note: input });
+		},
+		updateNote: async (noteId, contactId, input) => {
+			return contacts_notes_update(client, contactId, noteId, { note: input });
+		},
+		deleteNote: async (noteId, contactId) => {
+			return contacts_notes_destroy(client, contactId, noteId);
+		}
+	};
+}
+function createTasksAdapter(client) {
+	return {
+		listTasks: async (contactId) => {
+			return { tasks: ((await contacts_tasks_list(client, contactId)).tasks ?? []).map(mapTask) };
+		},
+		createTask: async (contactId, input) => {
+			return contacts_tasks_create(client, contactId, { task: {
+				title: input.body,
+				due_date: input.due_at
+			} });
+		},
+		updateTask: async (taskId, contactId, input) => {
+			return contacts_tasks_update(client, contactId, taskId, { task: {
+				title: input.body ?? void 0,
+				completed: input.completed_at !== void 0 ? input.completed_at !== null : void 0,
+				due_date: input.due_at
+			} });
+		},
+		deleteTask: async (taskId, contactId) => {
+			return contacts_tasks_destroy(client, contactId, taskId);
+		}
+	};
+}
+/** BFF Group → core ContactGroup. */
+function mapGroup(raw) {
+	return {
+		id: raw.id,
+		name: raw.name ?? "",
+		avatar: raw.avatar ?? null,
+		avatar_background: raw.avatar_background ?? null,
+		created_at: raw.created_at,
+		updated_at: raw.updated_at
+	};
+}
+function createGroupsAdapter(client) {
+	return {
+		listGroups: async () => {
+			return { groups: ((await contacts_groups_list(client)).groups ?? []).map(mapGroup) };
+		},
+		createGroup: async (input) => {
+			return { group: mapGroup((await contacts_groups_create(client, { group: input })).group) };
+		},
+		updateGroup: async (groupId, input) => {
+			return { group: mapGroup((await contacts_groups_update(client, groupId, { group: input })).group) };
+		},
+		deleteGroup: async (groupId) => {
+			return contacts_groups_destroy(client, groupId);
+		}
+	};
+}
+/**
+* Creates a composite ContactsDomainApi backed by the portal-tenant
+* Contacts BFF endpoints.
+*/
+function createPortalContactsDomainApiAdapter(client) {
+	return {
+		contacts: createContactsAdapter(client),
+		notes: createNotesAdapter(client),
+		tasks: createTasksAdapter(client),
+		groups: createGroupsAdapter(client)
+	};
+}
+//#endregion
+//#region src/contacts/PortalContactsApiProvider.tsx
+function PortalContactsApiProvider({ children }) {
+	const client = require_PortalTenantClientProvider.usePortalTenantClient();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactsApiProvider, {
+		value: (0, react.useMemo)(() => createPortalContactsDomainApiAdapter(client), [client]),
+		children
+	});
+}
+//#endregion
+//#region ../../contacts/core/src/translation-adapter.ts
+const contactsDomain = require_static_dict_adapter.createDomainTranslations({
+	fallback: {
+		breadcrumb: "Contacts",
+		breadcrumb_new: "New Contact",
+		contact_label: "Contact",
+		add: "Add",
+		add_contact: "Add Contact",
+		adding: "Adding...",
+		update_contact: "Update Contact",
+		saving: "Saving",
+		cancel: "Cancel",
+		save: "Save",
+		delete: "Delete",
+		delete_name: "Delete {{name}}?",
+		delete_confirm_permanent: "This permanently removes the contact and all of their notes, tasks, and activity. This can't be undone.",
+		delete_contact: "Delete contact",
+		deleting: "Deleting...",
+		search_placeholder: "Search contacts",
+		error_loading: "Couldn't load contact",
+		error_loading_description: "This contact may have been deleted, you may not have permission to view it, or there was a network error. Try selecting them again.",
+		error_loading_list: "Couldn't load contacts. Pull down to retry.",
+		error_generic: "Something went wrong. Please try again later.",
+		loading: "Loading...",
+		loading_more: "Loading more...",
+		searching: "Searching...",
+		people_count: "{{count}} people across your network",
+		person_count: "{{count}} person across your network",
+		no_contacts_search: "No contacts match \"{{term}}\".",
+		no_contacts_yet: "No contacts yet.",
+		no_contacts_filter: "No contacts match this filter.",
+		empty_select_contact: "Select a contact",
+		empty_select_description: "Pick someone from your list on the left to see their details, notes, and tasks.",
+		tab_tasks: "Tasks",
+		tab_notes: "Notes",
+		edit_profile: "Edit profile",
+		editing_name: "Editing {{name}}",
+		profile_edit_description: "Update details below. Your contact card above is paused while you edit.",
+		new_task: "New task",
+		last_updated: "Last updated {{date}}",
+		label_email: "Email",
+		label_phone: "Phone",
+		label_address: "Address",
+		label_call: "Call",
+		not_set: "Not set",
+		more_actions: "More actions",
+		back_to_contacts: "Back to contacts",
+		back_to_tasks: "Back to Tasks",
+		filter_all: "All",
+		filter_leads: "Leads",
+		filter_customers: "Customers",
+		note_placeholder: "Leave a note about this contact…",
+		note_body_aria: "Note body",
+		add_note: "Add note",
+		tip_save_shortcut_mac: "Tip: ⌘ + Enter to save",
+		tip_save_shortcut_other: "Tip: Ctrl + Enter to save",
+		task_describe_placeholder: "Describe the task…",
+		task_description_aria: "Task description",
+		task_discard_aria: "Discard task",
+		add_task: "Add task",
+		quick_today: "Today",
+		quick_tomorrow: "Tomorrow",
+		quick_next_week: "Next week",
+		edit_contact_name: "Edit {{name}}",
+		save_changes: "Save changes",
+		add_field: "Add {{field}}",
+		copy_field: "Copy {{field}}",
+		copied_field: "Copied {{field}}",
+		attachment_one: "1 attachment",
+		attachment_other: "{{count}} attachments",
+		note_actions: "Note actions",
+		delete_note_title: "Delete note?",
+		delete_note_irreversible: "This action cannot be undone.",
+		task_yesterday: "Yesterday",
+		task_days_ago_one: "1 day ago",
+		task_days_ago_other: "{{count}} days ago",
+		task_overdue_due: "Overdue · {{date}}",
+		task_due: "Due {{date}}",
+		mark_as_open: "Mark as open",
+		mark_as_completed: "Mark as completed",
+		task_actions: "Task actions",
+		delete_task_title: "Delete task?",
+		delete_task_confirm: "Are you sure you want to delete this task? This action cannot be undone."
+	},
+	loaders: {
+		de: () => Promise.resolve().then(() => require("./de-CPL2Xpzo.cjs")).then((m) => m.default),
+		el: () => Promise.resolve().then(() => require("./el-Q7NXrBp2.cjs")).then((m) => m.default),
+		es: () => Promise.resolve().then(() => require("./es-ju_cXEC3.cjs")).then((m) => m.default),
+		fr: () => Promise.resolve().then(() => require("./fr-Dvolparc.cjs")).then((m) => m.default),
+		he: () => Promise.resolve().then(() => require("./he-Bbmjw5fF.cjs")).then((m) => m.default),
+		hu: () => Promise.resolve().then(() => require("./hu-CDjT6dvP.cjs")).then((m) => m.default),
+		id: () => Promise.resolve().then(() => require("./id-DYzJCnYl.cjs")).then((m) => m.default),
+		it: () => Promise.resolve().then(() => require("./it-xV1fUEa8.cjs")).then((m) => m.default),
+		ja: () => Promise.resolve().then(() => require("./ja-lkX4NFcg.cjs")).then((m) => m.default),
+		ko: () => Promise.resolve().then(() => require("./ko-0v_pgldp.cjs")).then((m) => m.default),
+		nl: () => Promise.resolve().then(() => require("./nl-BtDjIzc7.cjs")).then((m) => m.default),
+		pl: () => Promise.resolve().then(() => require("./pl-BWEPmXSc.cjs")).then((m) => m.default),
+		pt: () => Promise.resolve().then(() => require("./pt-C2PO_Mj1.cjs")).then((m) => m.default),
+		ro: () => Promise.resolve().then(() => require("./ro-BQNdxJER.cjs")).then((m) => m.default),
+		ru: () => Promise.resolve().then(() => require("./ru-BMlm0Iik.cjs")).then((m) => m.default),
+		th: () => Promise.resolve().then(() => require("./th-Dh70cqMt.cjs")).then((m) => m.default),
+		tl: () => Promise.resolve().then(() => require("./tl-Ba-YEt8X.cjs")).then((m) => m.default),
+		tr: () => Promise.resolve().then(() => require("./tr-Dh9kUXz3.cjs")).then((m) => m.default),
+		zh_CN: () => Promise.resolve().then(() => require("./zh_CN-W83ekXLJ.cjs")).then((m) => m.default),
+		zh_TW: () => Promise.resolve().then(() => require("./zh_TW-CJVVqPeS.cjs")).then((m) => m.default)
+	}
+});
+function createContactsTranslationAdapter(locale, dict) {
+	return require_static_dict_adapter.createStaticDictAdapter(locale, dict);
+}
+//#endregion
+//#region src/providers/ContactsTranslationBridge.tsx
+function ContactsTranslationBridge({ children }) {
+	const { locale } = require_static_dict_adapter.useActiveLocale();
+	const dict = require_static_dict_adapter.useDomainDict(contactsDomain, locale);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactsTranslationProvider, {
+		value: (0, react.useMemo)(() => createContactsTranslationAdapter(locale, dict), [locale, dict]),
+		children
+	});
+}
+//#endregion
+//#region src/screens/ContactsScreen.tsx
+const QUERY_KEY_PREFIX = "sdk-contacts";
+function ContactBrowseView({ selectedContactId, onSelect, onAdd }) {
+	const countriesAdapter = require_countries_api_context.useCountriesApi();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RepContactsLayout, {
+		selectedContactId,
+		onSelect,
+		onAdd,
+		queryKeyPrefix: QUERY_KEY_PREFIX,
+		getCountries: (0, react.useCallback)(async () => {
+			return (await countriesAdapter.listCountries()).countries.map((c) => ({
+				id: 0,
+				name: c.name,
+				iso: c.code
+			}));
+		}, [countriesAdapter])
+	});
+}
+const CREATE_DEFAULT_VALUES = {
+	first_name: "",
+	last_name: "",
+	email: "",
+	phone: "",
+	status: "new",
+	address: "",
+	city: "",
+	state: "",
+	postal_code: "",
+	country_code: null,
+	language_code: null,
+	metadata: {},
+	affiliate: {}
+};
+function ContactCreateView({ onNavigate, onCreateContact }) {
+	const formRef = (0, react.useRef)(null);
+	const countriesAdapter = require_countries_api_context.useCountriesApi();
+	const { data: countriesResponse } = (0, _tanstack_react_query.useQuery)({
+		queryKey: require_query_keys.storeKeys.countries(),
+		queryFn: () => countriesAdapter.listCountries()
+	});
+	const countryOptions = (0, react.useMemo)(() => (countriesResponse?.countries ?? []).map((c) => ({
+		name: c.name,
+		value: c.code
+	})).sort((a, b) => a.name.localeCompare(b.name)), [countriesResponse]);
+	const methods = require_src.useZodForm(createContactFormSchema, { defaultValues: CREATE_DEFAULT_VALUES });
+	const mutation = useCreateContactMutation(QUERY_KEY_PREFIX, { onSuccess: (data) => {
+		onCreateContact?.();
+		const newContactId = data?.contact?.id;
+		if (newContactId) onNavigate({
+			view: "browse",
+			selectedContactId: String(newContactId)
+		});
+		else onNavigate({
+			view: "browse",
+			selectedContactId: null
+		});
+	} });
+	const { mutate } = mutation;
+	const onSubmit = (0, react.useMemo)(() => methods.handleSubmit((data) => {
+		const { affiliate, ...contactFields } = data;
+		const payload = {};
+		for (const [key, value] of Object.entries(contactFields)) if (value !== "" && value !== null && value !== void 0) payload[key] = value;
+		if (affiliate && Object.keys(affiliate).length > 0) payload.affiliate = affiliate;
+		mutate(payload);
+	}, () => {}), [methods, mutate]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactCreateScreen, {
+		onNavigateToList: (0, react.useCallback)(() => {
+			onNavigate({
+				view: "browse",
+				selectedContactId: null
+			});
+		}, [onNavigate]),
+		onSubmit: () => formRef.current?.requestSubmit(),
+		isPending: mutation.isPending,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_hook_form.FormProvider, {
+			...methods,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "mx-auto max-w-7xl space-y-12 md:px-10 md:py-8",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("form", {
+					ref: formRef,
+					onSubmit,
+					className: "mx-auto space-y-6 lg:max-w-2xl",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactDetailsForm, { countries: countryOptions })
+				})
+			})
+		})
+	});
+}
+function ContactsScreen({ onContactSelect, onCreateContact, background, textColor, accentColor, padding, borderRadius, defaultViewMode, ...divProps }) {
+	const [nav, setNav] = (0, react.useState)({
+		view: "browse",
+		selectedContactId: null
+	});
+	const handleSelect = (0, react.useCallback)((id) => {
+		setNav({
+			view: "browse",
+			selectedContactId: id
+		});
+		if (id) onContactSelect?.(id);
+	}, [onContactSelect]);
+	const handleAdd = (0, react.useCallback)(() => {
+		setNav({ view: "new" });
+	}, []);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactsTranslationBridge, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PortalContactsApiProvider, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		...divProps,
+		className: `h-full ${divProps.className ?? ""}`,
+		children: [nav.view === "browse" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactBrowseView, {
+			selectedContactId: nav.selectedContactId,
+			onSelect: handleSelect,
+			onAdd: handleAdd
+		}), nav.view === "new" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContactCreateView, {
+			onNavigate: setNav,
+			onCreateContact
+		})]
+	}) }) });
+}
+const contactsScreenPropertySchema = {
+	widgetType: "ContactsScreen",
+	displayName: "Contacts Screen",
+	tabsConfig: [{
+		id: "styling",
+		label: "Styling"
+	}],
+	fields: []
+};
+//#endregion
+Object.defineProperty(exports, "ContactsScreen", {
+	enumerable: true,
+	get: function() {
+		return ContactsScreen;
+	}
+});
+Object.defineProperty(exports, "contactsScreenPropertySchema", {
+	enumerable: true,
+	get: function() {
+		return contactsScreenPropertySchema;
+	}
+});
+
+//# sourceMappingURL=ContactsScreen-D8M6J3nC.cjs.map