@open-mercato/core 0.6.6-develop.6094.1.28b081ea16 → 0.6.6-develop.6121.1.5797a901b3

package/dist/modules/customers/components/calendar/CalendarFooter.js

@@ -0,0 +1,48 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { Kbd } from "@open-mercato/ui/primitives/kbd";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+const CALENDAR_SHORTCUTS = [
+  { key: "T", labelKey: "customers.calendar.shortcuts.today", fallback: "Today" },
+  { key: "D", labelKey: "customers.calendar.shortcuts.dayView", fallback: "Day view" },
+  { key: "W", labelKey: "customers.calendar.shortcuts.week", fallback: "Week" },
+  { key: "M", labelKey: "customers.calendar.shortcuts.month", fallback: "Month" },
+  { key: "A", labelKey: "customers.calendar.shortcuts.agenda", fallback: "Agenda" },
+  { key: "N", labelKey: "customers.calendar.shortcuts.newEvent", fallback: "New event" },
+  { key: "/", labelKey: "customers.calendar.shortcuts.search", fallback: "Search" },
+  { key: "?", labelKey: "customers.calendar.shortcuts.help", fallback: "Shortcuts" }
+];
+function CalendarFooter({ timezoneLabel, onOpenShortcuts }) {
+  const t = useT();
+  return /* @__PURE__ */ jsxs("footer", { className: "flex flex-wrap items-center gap-x-4 gap-y-1.5 border-t bg-muted/40 px-4 py-2", children: [
+    CALENDAR_SHORTCUTS.map((shortcut) => {
+      const legend = /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Kbd, { children: shortcut.key }),
+        /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: t(shortcut.labelKey, shortcut.fallback) })
+      ] });
+      if (shortcut.key === "?" && onOpenShortcuts) {
+        return /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "sm",
+            className: "h-auto gap-1.5 p-0 font-normal hover:bg-transparent",
+            "aria-label": t("customers.calendar.shortcuts.title", "Keyboard shortcuts"),
+            onClick: onOpenShortcuts,
+            children: legend
+          },
+          shortcut.key
+        );
+      }
+      return /* @__PURE__ */ jsx("span", { className: "inline-flex items-center gap-1.5", children: legend }, shortcut.key);
+    }),
+    /* @__PURE__ */ jsx("span", { className: "ml-auto text-xs text-muted-foreground", children: timezoneLabel })
+  ] });
+}
+export {
+  CALENDAR_SHORTCUTS,
+  CalendarFooter
+};
+//# sourceMappingURL=CalendarFooter.js.map

package/dist/modules/customers/components/calendar/CalendarFooter.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/customers/components/calendar/CalendarFooter.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Kbd } from '@open-mercato/ui/primitives/kbd'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport type { CalendarFooterProps } from './types'\n\nexport const CALENDAR_SHORTCUTS: ReadonlyArray<{\n  key: string\n  labelKey: string\n  fallback: string\n}> = [\n  { key: 'T', labelKey: 'customers.calendar.shortcuts.today', fallback: 'Today' },\n  { key: 'D', labelKey: 'customers.calendar.shortcuts.dayView', fallback: 'Day view' },\n  { key: 'W', labelKey: 'customers.calendar.shortcuts.week', fallback: 'Week' },\n  { key: 'M', labelKey: 'customers.calendar.shortcuts.month', fallback: 'Month' },\n  { key: 'A', labelKey: 'customers.calendar.shortcuts.agenda', fallback: 'Agenda' },\n  { key: 'N', labelKey: 'customers.calendar.shortcuts.newEvent', fallback: 'New event' },\n  { key: '/', labelKey: 'customers.calendar.shortcuts.search', fallback: 'Search' },\n  { key: '?', labelKey: 'customers.calendar.shortcuts.help', fallback: 'Shortcuts' },\n]\n\nexport function CalendarFooter({ timezoneLabel, onOpenShortcuts }: CalendarFooterProps) {\n  const t = useT()\n  return (\n    <footer className=\"flex flex-wrap items-center gap-x-4 gap-y-1.5 border-t bg-muted/40 px-4 py-2\">\n      {CALENDAR_SHORTCUTS.map((shortcut) => {\n        const legend = (\n          <>\n            <Kbd>{shortcut.key}</Kbd>\n            <span className=\"text-xs text-muted-foreground\">\n              {t(shortcut.labelKey, shortcut.fallback)}\n            </span>\n          </>\n        )\n        if (shortcut.key === '?' && onOpenShortcuts) {\n          return (\n            <Button\n              key={shortcut.key}\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"sm\"\n              className=\"h-auto gap-1.5 p-0 font-normal hover:bg-transparent\"\n              aria-label={t('customers.calendar.shortcuts.title', 'Keyboard shortcuts')}\n              onClick={onOpenShortcuts}\n            >\n              {legend}\n            </Button>\n          )\n        }\n        return (\n          <span key={shortcut.key} className=\"inline-flex items-center gap-1.5\">\n            {legend}\n          </span>\n        )\n      })}\n      <span className=\"ml-auto text-xs text-muted-foreground\">{timezoneLabel}</span>\n    </footer>\n  )\n}\n"],
+  "mappings": ";AA6BU,mBACE,KADF;AA1BV,SAAS,cAAc;AACvB,SAAS,WAAW;AACpB,SAAS,YAAY;AAGd,MAAM,qBAIR;AAAA,EACH,EAAE,KAAK,KAAK,UAAU,sCAAsC,UAAU,QAAQ;AAAA,EAC9E,EAAE,KAAK,KAAK,UAAU,wCAAwC,UAAU,WAAW;AAAA,EACnF,EAAE,KAAK,KAAK,UAAU,qCAAqC,UAAU,OAAO;AAAA,EAC5E,EAAE,KAAK,KAAK,UAAU,sCAAsC,UAAU,QAAQ;AAAA,EAC9E,EAAE,KAAK,KAAK,UAAU,uCAAuC,UAAU,SAAS;AAAA,EAChF,EAAE,KAAK,KAAK,UAAU,yCAAyC,UAAU,YAAY;AAAA,EACrF,EAAE,KAAK,KAAK,UAAU,uCAAuC,UAAU,SAAS;AAAA,EAChF,EAAE,KAAK,KAAK,UAAU,qCAAqC,UAAU,YAAY;AACnF;AAEO,SAAS,eAAe,EAAE,eAAe,gBAAgB,GAAwB;AACtF,QAAM,IAAI,KAAK;AACf,SACE,qBAAC,YAAO,WAAU,gFACf;AAAA,uBAAmB,IAAI,CAAC,aAAa;AACpC,YAAM,SACJ,iCACE;AAAA,4BAAC,OAAK,mBAAS,KAAI;AAAA,QACnB,oBAAC,UAAK,WAAU,iCACb,YAAE,SAAS,UAAU,SAAS,QAAQ,GACzC;AAAA,SACF;AAEF,UAAI,SAAS,QAAQ,OAAO,iBAAiB;AAC3C,eACE;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,WAAU;AAAA,YACV,cAAY,EAAE,sCAAsC,oBAAoB;AAAA,YACxE,SAAS;AAAA,YAER;AAAA;AAAA,UARI,SAAS;AAAA,QAShB;AAAA,MAEJ;AACA,aACE,oBAAC,UAAwB,WAAU,oCAChC,oBADQ,SAAS,GAEpB;AAAA,IAEJ,CAAC;AAAA,IACD,oBAAC,UAAK,WAAU,yCAAyC,yBAAc;AAAA,KACzE;AAEJ;",
+  "names": []
+}

package/dist/modules/customers/components/calendar/CalendarHeader.js

@@ -0,0 +1,36 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Plus } from "lucide-react";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { useLocale, useT } from "@open-mercato/shared/lib/i18n/context";
+function CalendarHeader({ view, anchor, onNewEvent }) {
+  const t = useT();
+  const locale = useLocale();
+  const title = React.useMemo(() => {
+    if (view === "agenda") return t("customers.calendar.header.titleAgenda", "Upcoming");
+    if (view === "month") {
+      return new Intl.DateTimeFormat(locale, { month: "long", year: "numeric" }).format(anchor);
+    }
+    return new Intl.DateTimeFormat(locale, { month: "short", day: "2-digit", year: "numeric" }).format(anchor);
+  }, [view, anchor, locale, t]);
+  return /* @__PURE__ */ jsxs("header", { className: "flex items-center gap-3 border-b py-4", children: [
+    /* @__PURE__ */ jsx("h1", { className: "min-w-0 truncate text-xl font-semibold text-foreground", children: title }),
+    onNewEvent ? /* @__PURE__ */ jsx("div", { className: "ml-auto flex shrink-0 items-center", children: /* @__PURE__ */ jsxs(
+      Button,
+      {
+        type: "button",
+        onClick: onNewEvent,
+        "aria-label": t("customers.calendar.actions.newEvent", "New event"),
+        children: [
+          /* @__PURE__ */ jsx(Plus, { "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: t("customers.calendar.actions.newEvent", "New event") })
+        ]
+      }
+    ) }) : null
+  ] });
+}
+export {
+  CalendarHeader
+};
+//# sourceMappingURL=CalendarHeader.js.map

package/dist/modules/customers/components/calendar/CalendarHeader.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/customers/components/calendar/CalendarHeader.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Plus } from 'lucide-react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { useLocale, useT } from '@open-mercato/shared/lib/i18n/context'\nimport type { CalendarHeaderProps } from './types'\n\nexport function CalendarHeader({ view, anchor, onNewEvent }: CalendarHeaderProps) {\n  const t = useT()\n  const locale = useLocale()\n\n  const title = React.useMemo(() => {\n    if (view === 'agenda') return t('customers.calendar.header.titleAgenda', 'Upcoming')\n    if (view === 'month') {\n      return new Intl.DateTimeFormat(locale, { month: 'long', year: 'numeric' }).format(anchor)\n    }\n    return new Intl.DateTimeFormat(locale, { month: 'short', day: '2-digit', year: 'numeric' }).format(anchor)\n  }, [view, anchor, locale, t])\n\n  return (\n    <header className=\"flex items-center gap-3 border-b py-4\">\n      <h1 className=\"min-w-0 truncate text-xl font-semibold text-foreground\">{title}</h1>\n      {onNewEvent ? (\n        <div className=\"ml-auto flex shrink-0 items-center\">\n          <Button\n            type=\"button\"\n            onClick={onNewEvent}\n            aria-label={t('customers.calendar.actions.newEvent', 'New event')}\n          >\n            <Plus aria-hidden=\"true\" />\n            <span className=\"hidden sm:inline\">\n              {t('customers.calendar.actions.newEvent', 'New event')}\n            </span>\n          </Button>\n        </div>\n      ) : null}\n    </header>\n  )\n}\n"],
+  "mappings": ";AAsBM,cAGI,YAHJ;AApBN,YAAY,WAAW;AACvB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,WAAW,YAAY;AAGzB,SAAS,eAAe,EAAE,MAAM,QAAQ,WAAW,GAAwB;AAChF,QAAM,IAAI,KAAK;AACf,QAAM,SAAS,UAAU;AAEzB,QAAM,QAAQ,MAAM,QAAQ,MAAM;AAChC,QAAI,SAAS,SAAU,QAAO,EAAE,yCAAyC,UAAU;AACnF,QAAI,SAAS,SAAS;AACpB,aAAO,IAAI,KAAK,eAAe,QAAQ,EAAE,OAAO,QAAQ,MAAM,UAAU,CAAC,EAAE,OAAO,MAAM;AAAA,IAC1F;AACA,WAAO,IAAI,KAAK,eAAe,QAAQ,EAAE,OAAO,SAAS,KAAK,WAAW,MAAM,UAAU,CAAC,EAAE,OAAO,MAAM;AAAA,EAC3G,GAAG,CAAC,MAAM,QAAQ,QAAQ,CAAC,CAAC;AAE5B,SACE,qBAAC,YAAO,WAAU,yCAChB;AAAA,wBAAC,QAAG,WAAU,0DAA0D,iBAAM;AAAA,IAC7E,aACC,oBAAC,SAAI,WAAU,sCACb;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT,cAAY,EAAE,uCAAuC,WAAW;AAAA,QAEhE;AAAA,8BAAC,QAAK,eAAY,QAAO;AAAA,UACzB,oBAAC,UAAK,WAAU,oBACb,YAAE,uCAAuC,WAAW,GACvD;AAAA;AAAA;AAAA,IACF,GACF,IACE;AAAA,KACN;AAEJ;",
+  "names": []
+}

package/dist/modules/customers/components/calendar/CalendarScreen.js

@@ -0,0 +1,516 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import dynamic from "next/dynamic";
+import { addDays } from "date-fns/addDays";
+import { isSameDay } from "date-fns/isSameDay";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { apiCall, apiCallOrThrow, withScopedApiRequestHeaders } from "@open-mercato/ui/backend/utils/apiCall";
+import { matchFeature } from "@open-mercato/shared/lib/auth/featureMatch";
+import {
+  buildOptimisticLockHeader,
+  extractOptimisticLockConflict
+} from "@open-mercato/ui/backend/utils/optimisticLock";
+import { flash } from "@open-mercato/ui/backend/FlashMessages";
+import { useGuardedMutation } from "@open-mercato/ui/backend/injection/useGuardedMutation";
+import { ErrorMessage, LoadingMessage } from "@open-mercato/ui/backend/detail";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { countByCategory } from "../../lib/calendar/categories.js";
+import { findConflicts } from "../../lib/calendar/conflicts.js";
+import { getVisibleRange } from "../../lib/calendar/range.js";
+import { AgendaList } from "./AgendaList.js";
+import { CalendarFooter } from "./CalendarFooter.js";
+import { CalendarHeader } from "./CalendarHeader.js";
+import { CalendarTabs } from "./CalendarTabs.js";
+import { CalendarToolbar } from "./CalendarToolbar.js";
+import { MonthGrid } from "./MonthGrid.js";
+import { ShortcutsDialog } from "./ShortcutsDialog.js";
+import { TimeGrid } from "./TimeGrid.js";
+import { UpcomingCards } from "./UpcomingCards.js";
+import { CalendarSettingsModal } from "./CalendarSettingsModal.js";
+import { useCalendarPreferences } from "./useCalendarPreferences.js";
+import { MAX_WINDOW_ITEMS, useCalendarItems } from "./useCalendarItems.js";
+const CalendarEventEditor = dynamic(
+  () => import("./CalendarEventEditor.js").then((mod) => mod.CalendarEventEditor),
+  { ssr: false }
+);
+const SEARCH_DEBOUNCE_MS = 200;
+const PHONE_BREAKPOINT_PX = 640;
+const HIGHLIGHT_CLEAR_MS = 3e3;
+const DEFAULT_AGENDA_HORIZON_DAYS = 7;
+const UPCOMING_CARDS_COUNT = 4;
+const EMPTY_FILTERS = { types: [], status: null, ownerUserId: null };
+const MANAGE_FEATURE = "customers.interactions.manage";
+function useCanManageInteractions() {
+  const [canManage, setCanManage] = React.useState(false);
+  React.useEffect(() => {
+    const controller = new AbortController();
+    let cancelled = false;
+    apiCall("/api/auth/feature-check", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      signal: controller.signal,
+      body: JSON.stringify({ features: [MANAGE_FEATURE] })
+    }).then((call) => {
+      if (cancelled || !call.ok) return;
+      const granted = Array.isArray(call.result?.granted) ? call.result.granted.map((feature) => String(feature)) : [];
+      setCanManage(granted.some((grantedFeature) => matchFeature(MANAGE_FEATURE, grantedFeature)));
+    }).catch(() => {
+      if (!cancelled && !controller.signal.aborted) setCanManage(false);
+    });
+    return () => {
+      cancelled = true;
+      controller.abort();
+    };
+  }, []);
+  return canManage;
+}
+function buildTimezoneLabel() {
+  const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+  const offsetMinutes = -(/* @__PURE__ */ new Date()).getTimezoneOffset();
+  const sign = offsetMinutes >= 0 ? "+" : "-";
+  const absolute = Math.abs(offsetMinutes);
+  const hours = Math.floor(absolute / 60);
+  const minutes = absolute % 60;
+  const offset = minutes > 0 ? `${sign}${hours}:${String(minutes).padStart(2, "0")}` : `${sign}${hours}`;
+  return `${timeZone} (GMT${offset})`;
+}
+function resolveJoinUrl(location) {
+  const trimmed = location?.trim() ?? "";
+  if (!trimmed) return null;
+  if (/^https?:\/\//i.test(trimmed)) return trimmed;
+  if (/^www\./i.test(trimmed)) return `https://${trimmed}`;
+  return null;
+}
+function asEditableItem(item) {
+  return item.isRecurringOccurrence ? { ...item, id: item.raw.id } : item;
+}
+function CalendarScreen() {
+  const t = useT();
+  const [view, setView] = React.useState("week");
+  const [anchor, setAnchor] = React.useState(() => /* @__PURE__ */ new Date());
+  const [agendaHorizonDays, setAgendaHorizonDays] = React.useState(DEFAULT_AGENDA_HORIZON_DAYS);
+  const [preset, setPreset] = React.useState("thisWeek");
+  React.useEffect(() => {
+    if (window.innerWidth >= PHONE_BREAKPOINT_PX) return;
+    setView("day");
+    setPreset(null);
+  }, []);
+  const [tab, setTab] = React.useState("all");
+  const [searchText, setSearchText] = React.useState("");
+  const [debouncedSearch, setDebouncedSearch] = React.useState("");
+  const [filters, setFilters] = React.useState(EMPTY_FILTERS);
+  const [editor, setEditor] = React.useState({ open: false, mode: "create", item: null });
+  const [editorMounted, setEditorMounted] = React.useState(false);
+  const [createRange, setCreateRange] = React.useState(null);
+  const [shortcutsOpen, setShortcutsOpen] = React.useState(false);
+  const [settingsOpen, setSettingsOpen] = React.useState(false);
+  const [highlightItemId, setHighlightItemId] = React.useState(null);
+  const [hasLoadedOnce, setHasLoadedOnce] = React.useState(false);
+  const { preferences, setPreferences, hydrated: preferencesHydrated, userId: currentUserId } = useCalendarPreferences();
+  const range = React.useMemo(
+    () => getVisibleRange(view, anchor, agendaHorizonDays),
+    [view, anchor, agendaHorizonDays]
+  );
+  const { items, isLoading, error, truncated, typeLabels, typeColors, refetch } = useCalendarItems(range);
+  React.useEffect(() => {
+    if (!isLoading) setHasLoadedOnce(true);
+  }, [isLoading]);
+  React.useEffect(() => {
+    const timer = window.setTimeout(() => setDebouncedSearch(searchText), SEARCH_DEBOUNCE_MS);
+    return () => window.clearTimeout(timer);
+  }, [searchText]);
+  React.useEffect(() => {
+    if (!highlightItemId) return;
+    const timer = window.setTimeout(() => setHighlightItemId(null), HIGHLIGHT_CLEAR_MS);
+    return () => window.clearTimeout(timer);
+  }, [highlightItemId]);
+  const visibleItems = React.useMemo(
+    () => items.filter((item) => item.end > range.from && item.start < range.to),
+    [items, range]
+  );
+  const searchedItems = React.useMemo(() => {
+    const query = debouncedSearch.trim().toLowerCase();
+    if (!query) return visibleItems;
+    return visibleItems.filter((item) => {
+      if (item.title.toLowerCase().includes(query)) return true;
+      if (item.location && item.location.toLowerCase().includes(query)) return true;
+      const rawBody = item.raw.body;
+      if (typeof rawBody === "string" && rawBody.toLowerCase().includes(query)) return true;
+      return item.participants.some(
+        (participant) => (participant.name ?? "").toLowerCase().includes(query)
+      );
+    });
+  }, [visibleItems, debouncedSearch]);
+  const baseItems = React.useMemo(
+    () => searchedItems.filter((item) => {
+      if (filters.types.length > 0 && !filters.types.includes(item.interactionType)) return false;
+      if (filters.status && item.status !== filters.status) return false;
+      if (filters.ownerUserId && item.ownerUserId !== filters.ownerUserId) return false;
+      if (!preferences.showCrmActivities && item.category !== "meeting" && item.category !== "event") return false;
+      return true;
+    }),
+    [searchedItems, filters, preferences.showCrmActivities]
+  );
+  const tabCounts = React.useMemo(() => countByCategory(baseItems), [baseItems]);
+  const viewItems = React.useMemo(() => {
+    if (tab === "meetings") return baseItems.filter((item) => item.category === "meeting");
+    if (tab === "events") return baseItems.filter((item) => item.category === "event");
+    return baseItems;
+  }, [baseItems, tab]);
+  const conflictMap = React.useMemo(
+    () => findConflicts(baseItems, { scope: preferences.conflictScope, currentUserId }),
+    [baseItems, preferences.conflictScope, currentUserId]
+  );
+  const conflictIds = React.useMemo(() => new Set(conflictMap.keys()), [conflictMap]);
+  const upcomingCards = React.useMemo(() => {
+    const now = /* @__PURE__ */ new Date();
+    const nowMs = now.getTime();
+    return baseItems.filter((item) => item.start.getTime() >= nowMs).sort((first, second) => first.start.getTime() - second.start.getTime()).slice(0, UPCOMING_CARDS_COUNT).map((item) => {
+      const conflictCount = preferences.conflictWarnings ? conflictMap.get(item.id)?.length ?? 0 : 0;
+      const kind = item.status === "canceled" ? "cancelled" : conflictCount > 0 ? "conflicted" : isSameDay(item.start, now) ? "today" : "future";
+      return { item, kind, conflictCount };
+    });
+  }, [baseItems, conflictMap, preferences.conflictWarnings]);
+  const typeOptions = React.useMemo(() => {
+    const values = new Set(Object.keys(typeLabels));
+    for (const item of items) values.add(item.interactionType);
+    return [...values].sort().map((value) => ({ value, label: typeLabels[value] ?? value }));
+  }, [items, typeLabels]);
+  const ownerOptions = React.useMemo(() => {
+    const participantNames = /* @__PURE__ */ new Map();
+    for (const item of items) {
+      for (const participant of item.participants) {
+        if (participant.name && !participantNames.has(participant.userId)) {
+          participantNames.set(participant.userId, participant.name);
+        }
+      }
+    }
+    const owners = /* @__PURE__ */ new Map();
+    for (const item of items) {
+      if (!item.ownerUserId || owners.has(item.ownerUserId)) continue;
+      owners.set(item.ownerUserId, participantNames.get(item.ownerUserId) ?? item.ownerUserId);
+    }
+    return [...owners.entries()].map(([value, label]) => ({ value, label })).sort((first, second) => first.label.localeCompare(second.label));
+  }, [items]);
+  const timezoneLabel = React.useMemo(() => buildTimezoneLabel(), []);
+  const canManage = useCanManageInteractions();
+  const openCreateEditor = React.useCallback(() => {
+    if (!canManage) return;
+    setCreateRange(null);
+    setEditorMounted(true);
+    setEditor({ open: true, mode: "create", item: null });
+  }, [canManage]);
+  const openEditEditor = React.useCallback(
+    (item) => {
+      if (!canManage) return;
+      setCreateRange(null);
+      setEditorMounted(true);
+      setEditor({ open: true, mode: "edit", item: asEditableItem(item) });
+    },
+    [canManage]
+  );
+  const handleCreateRange = React.useCallback(
+    (start, end) => {
+      if (!canManage) return;
+      setCreateRange({ start, end });
+      setEditorMounted(true);
+      setEditor({ open: true, mode: "create", item: null });
+    },
+    [canManage]
+  );
+  const seedActivityTypes = React.useMemo(() => {
+    const seen = /* @__PURE__ */ new Set();
+    const labels = [];
+    for (const value of Object.keys(typeLabels)) {
+      const label = typeLabels[value] ?? value;
+      if (seen.has(label)) continue;
+      seen.add(label);
+      labels.push(label);
+    }
+    return labels;
+  }, [typeLabels]);
+  const handleToday = React.useCallback(() => {
+    setAnchor(/* @__PURE__ */ new Date());
+    setPreset(null);
+  }, []);
+  const handlePresetChange = React.useCallback((next) => {
+    setPreset(next);
+    setAnchor(/* @__PURE__ */ new Date());
+    if (next === "thisWeek") {
+      setView("week");
+    } else if (next === "thisMonth") {
+      setView("month");
+    } else {
+      setView("agenda");
+      setAgendaHorizonDays(next === "next30" ? 30 : DEFAULT_AGENDA_HORIZON_DAYS);
+    }
+  }, []);
+  const handleAnchorChange = React.useCallback((date) => {
+    setAnchor(date);
+    setPreset(null);
+  }, []);
+  const handleViewChange = React.useCallback((next) => {
+    setView(next);
+    setPreset(null);
+  }, []);
+  const handleTimeGridNavigate = React.useCallback((deltaDays) => {
+    setAnchor((current) => addDays(current, deltaDays));
+    setPreset(null);
+  }, []);
+  const handleDayOpen = React.useCallback((date) => {
+    setView("day");
+    setAnchor(date);
+    setPreset(null);
+  }, []);
+  const handleSeeConflict = React.useCallback((item) => {
+    setView("week");
+    setAnchor(item.start);
+    setPreset(null);
+    setHighlightItemId(item.id);
+  }, []);
+  const handleJoin = React.useCallback((item) => {
+    const url = resolveJoinUrl(item.location);
+    if (url) window.open(url, "_blank", "noopener");
+  }, []);
+  const { runMutation, retryLastMutation } = useGuardedMutation({
+    contextId: "customers-calendar-cancel",
+    blockedMessage: t("ui.forms.flash.saveBlocked", "Save blocked by validation")
+  });
+  const handleCancelItem = React.useCallback(
+    async (item) => {
+      const interactionId = item.raw.id;
+      try {
+        await runMutation({
+          operation: () => withScopedApiRequestHeaders(
+            buildOptimisticLockHeader(item.updatedAt),
+            () => apiCallOrThrow("/api/customers/interactions", {
+              method: "PUT",
+              headers: { "content-type": "application/json" },
+              body: JSON.stringify({ id: interactionId, status: "canceled" })
+            })
+          ),
+          mutationPayload: {
+            operation: "cancelCalendarEvent",
+            interactionId,
+            interactionType: item.interactionType
+          },
+          context: {
+            formId: "customers-calendar-cancel",
+            resourceKind: "customers.interaction",
+            resourceId: interactionId,
+            retryLastMutation
+          }
+        });
+        flash(t("customers.calendar.cards.cancelSuccess", "Event cancelled"), "success");
+        refetch();
+      } catch (err) {
+        if (extractOptimisticLockConflict(err)) return;
+        flash(t("customers.calendar.cards.cancelError", "Failed to cancel event"), "error");
+      }
+    },
+    [refetch, retryLastMutation, runMutation, t]
+  );
+  const focusSearch = React.useCallback(() => {
+    const node = document.querySelector("[data-calendar-search]");
+    if (node instanceof HTMLInputElement) node.focus();
+    else if (node instanceof HTMLElement) node.querySelector("input")?.focus();
+  }, []);
+  const editorOpen = editor.open;
+  React.useEffect(() => {
+    const handleKeyDown = (event) => {
+      if (event.defaultPrevented) return;
+      if (event.metaKey || event.ctrlKey || event.altKey) return;
+      const target = event.target;
+      if (target instanceof HTMLElement) {
+        const tag = target.tagName;
+        if (tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT" || target.isContentEditable) return;
+      }
+      if (editorOpen) return;
+      switch (event.key) {
+        case "t":
+        case "T":
+          event.preventDefault();
+          setAnchor(/* @__PURE__ */ new Date());
+          setPreset(null);
+          break;
+        case "d":
+        case "D":
+          event.preventDefault();
+          setView("day");
+          setPreset(null);
+          break;
+        case "w":
+        case "W":
+          event.preventDefault();
+          setView("week");
+          setPreset(null);
+          break;
+        case "m":
+        case "M":
+          event.preventDefault();
+          setView("month");
+          setPreset(null);
+          break;
+        case "a":
+        case "A":
+          event.preventDefault();
+          setView("agenda");
+          setPreset(null);
+          break;
+        case "n":
+        case "N":
+          event.preventDefault();
+          openCreateEditor();
+          break;
+        case "/":
+          event.preventDefault();
+          focusSearch();
+          break;
+        case "?":
+          event.preventDefault();
+          setShortcutsOpen((open) => !open);
+          break;
+        case "Escape":
+          setHighlightItemId(null);
+          break;
+        default:
+          break;
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [editorOpen, focusSearch, openCreateEditor]);
+  const showInitialLoading = isLoading && !hasLoadedOnce || !preferencesHydrated;
+  let viewArea;
+  if (error) {
+    viewArea = /* @__PURE__ */ jsx(
+      ErrorMessage,
+      {
+        label: t("customers.calendar.errors.loadFailed", "Failed to load calendar events."),
+        action: /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: refetch, children: t("customers.calendar.errors.retry", "Retry") })
+      }
+    );
+  } else if (showInitialLoading) {
+    viewArea = /* @__PURE__ */ jsx(LoadingMessage, { label: t("customers.calendar.loading", "Loading calendar\u2026") });
+  } else if (view === "month") {
+    viewArea = /* @__PURE__ */ jsx(MonthGrid, { anchor, items: viewItems, onItemClick: openEditEditor, onDayOpen: handleDayOpen });
+  } else if (view === "agenda") {
+    viewArea = /* @__PURE__ */ jsx(
+      AgendaList,
+      {
+        anchor,
+        horizonDays: agendaHorizonDays,
+        items: viewItems,
+        typeLabels,
+        onItemClick: openEditEditor
+      }
+    );
+  } else {
+    viewArea = /* @__PURE__ */ jsx(
+      TimeGrid,
+      {
+        days: view === "day" ? 1 : 7,
+        anchor,
+        items: viewItems,
+        conflictIds,
+        showWeekends: preferences.showWeekends,
+        showConflicts: preferences.conflictWarnings,
+        aiSummaries: preferences.aiSummaries,
+        highlightItemId,
+        onItemClick: openEditEditor,
+        onJoin: handleJoin,
+        onNavigate: handleTimeGridNavigate,
+        onCreate: canManage ? openCreateEditor : void 0,
+        onCreateRange: canManage ? handleCreateRange : void 0
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col gap-4", children: [
+    /* @__PURE__ */ jsx(CalendarHeader, { view, anchor, onNewEvent: canManage ? openCreateEditor : void 0 }),
+    /* @__PURE__ */ jsx(
+      CalendarToolbar,
+      {
+        view,
+        anchor,
+        range,
+        preset,
+        search: searchText,
+        filters,
+        typeOptions,
+        ownerOptions,
+        onToday: handleToday,
+        onPresetChange: handlePresetChange,
+        onAnchorChange: handleAnchorChange,
+        onSearchChange: setSearchText,
+        onFiltersChange: setFilters,
+        onOpenSettings: () => setSettingsOpen(true)
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      UpcomingCards,
+      {
+        cards: upcomingCards,
+        canManage,
+        onJoin: handleJoin,
+        onSeeConflict: handleSeeConflict,
+        onOpen: openEditEditor,
+        onEdit: openEditEditor,
+        onCancel: handleCancelItem
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col gap-3", children: [
+      /* @__PURE__ */ jsx(
+        CalendarTabs,
+        {
+          tab,
+          counts: tabCounts,
+          view,
+          onTabChange: setTab,
+          onViewChange: handleViewChange
+        }
+      ),
+      truncated ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", role: "status", children: t("customers.calendar.notice.truncated", "Showing first {count} items for this range.", {
+        count: MAX_WINDOW_ITEMS
+      }) }) : null,
+      /* @__PURE__ */ jsx("div", { className: "flex min-h-[560px] flex-1 flex-col [&>*]:flex-1", children: viewArea })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "hidden md:block", children: /* @__PURE__ */ jsx(CalendarFooter, { timezoneLabel, onOpenShortcuts: () => setShortcutsOpen(true) }) }),
+    /* @__PURE__ */ jsx(ShortcutsDialog, { open: shortcutsOpen, onOpenChange: setShortcutsOpen }),
+    /* @__PURE__ */ jsx(
+      CalendarSettingsModal,
+      {
+        open: settingsOpen,
+        preferences,
+        seedActivityTypes,
+        onOpenChange: setSettingsOpen,
+        onSave: (next) => {
+          setPreferences(next);
+          flash(t("customers.calendar.settings.saved", "Calendar settings saved"), "success");
+        }
+      }
+    ),
+    editorMounted ? /* @__PURE__ */ jsx(
+      CalendarEventEditor,
+      {
+        open: editor.open,
+        mode: editor.mode,
+        item: editor.item,
+        defaultDate: anchor,
+        defaultRange: createRange,
+        typeLabels,
+        typeColors,
+        surfacedTypes: preferences.activityTypes,
+        eventCategories: preferences.eventCategories,
+        conflictScope: preferences.conflictScope,
+        currentUserId,
+        onOpenChange: (open) => setEditor((current) => ({ ...current, open })),
+        onSaved: refetch
+      }
+    ) : null
+  ] });
+}
+export {
+  CalendarScreen
+};
+//# sourceMappingURL=CalendarScreen.js.map