@paramms/chat-widget 1.0.6 → 1.0.7

package/dist/react.d.ts

@@ -34,13 +34,7 @@ export interface ChatWidgetProps extends BaseProps {
     contextTitle?: string;
     contextSubtitle?: string;
     contextStatus?: string;
-    /** Show the WhatsApp-style thread list as the home screen.
-     *  Use when users can have more than one thread on this profile
-     *  (e.g. one thread per support ticket, one per booking). */
-    showChatList?: boolean;
-    /** Stable item ID — pins this conversation to a specific item/thread.
-     *  When showChatList is also true, the widget opens this thread immediately
-     *  but the user can navigate back to the full list. */
+    /** Stable item ID — pins this conversation to a specific item/thread. */
     subjectId?: string;
 }
 /**
@@ -70,7 +64,7 @@ export interface ChatWidgetProps extends BaseProps {
  * />
  * ```
  */
-export declare function ChatWidget({ url, profileId, userId, userName, userEmail, userAvatar, contextTitle, contextSubtitle, contextStatus, showChatList, subjectId, accent, launcher, position, quickReplies, height, i18n, translateLang, }: ChatWidgetProps): JSX.Element;
+export declare function ChatWidget({ url, profileId, userId, userName, userEmail, userAvatar, contextTitle, contextSubtitle, contextStatus, subjectId, accent, launcher, position, quickReplies, height, i18n, translateLang, }: ChatWidgetProps): JSX.Element;
 export interface MarketplaceChatProps extends BaseProps {
     /** Unique ID for this listing — each listing gets its own thread.
      *  Omit for a general (non-item-specific) conversation. */
@@ -121,4 +115,51 @@ export interface MarketplaceChatProps extends BaseProps {
  * Only `url` and `profileId` are required. All other props are optional.
  */
 export declare function MarketplaceChat({ url, profileId, listingId, listingTitle, listingMeta, listingPrice, listingStatus, userId, userName, userEmail, userAvatar, accent, launcher, position, quickReplies, height, i18n, translateLang, }: MarketplaceChatProps): JSX.Element;
+export interface ChatListProps {
+    /** Relay WebSocket URL — required */
+    url: string;
+    /** Your Relay profile ID — required */
+    profileId: string;
+    /** Your logged-in user's stable ID. Omit for anonymous (uses localStorage UID) */
+    userId?: string;
+    /** Called when the user taps a conversation row.
+     *  Use this to navigate to the listing page or open a ChatWidget. */
+    onSelect: (entry: import('./chatlist.js').ChatListEntry) => void;
+    /** Brand colour hex — default '#f5713c' */
+    accent?: string;
+    /** Container height when rendered inline. Default: '100%' */
+    height?: string;
+    /** i18n overrides */
+    i18n?: import('./chatlist.js').ChatListOptions['i18n'];
+}
+/**
+ * Standalone conversation list — separate from the chat widget.
+ * Use this on a dedicated /messages or /inbox page.
+ * Tap a row → onSelect fires → you navigate to the listing or open a ChatWidget.
+ *
+ * @example
+ * ```tsx
+ * 'use client'
+ * import { ChatList } from '@paramms/chat-widget/react'
+ * import { useRouter } from 'next/navigation'
+ *
+ * export default function MessagesPage({ session }) {
+ *   const router = useRouter()
+ *   return (
+ *     <div style={{ height: '600px' }}>
+ *       <ChatList
+ *         url={process.env.NEXT_PUBLIC_RELAY_WS_URL}
+ *         profileId={process.env.NEXT_PUBLIC_RELAY_PROFILE_ID}
+ *         userId={session?.user.id}
+ *         onSelect={(entry) => {
+ *           // Navigate to the listing page where the ChatWidget lives
+ *           router.push(`/listings/${entry.subjectId}`)
+ *         }}
+ *       />
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+export declare function ChatList({ url, profileId, userId, onSelect, accent, height, i18n, }: ChatListProps): JSX.Element;
 export {};

package/dist/react.js

@@ -1,143 +1,172 @@
-import { jsx as y } from "react/jsx-runtime";
-import { useRef as d, useEffect as _ } from "react";
-import { mount as $ } from "./index.js";
-function x({
-  url: u,
-  profileId: w,
+import { jsx as k } from "react/jsx-runtime";
+import { useRef as b, useEffect as H } from "react";
+import { mount as _ } from "./index.js";
+function W({
+  url: c,
+  profileId: l,
   userId: t,
-  userName: h,
-  userEmail: f,
-  userAvatar: c,
-  contextTitle: m,
+  userName: u,
+  userEmail: r,
+  userAvatar: i,
+  contextTitle: f,
   contextSubtitle: o,
-  contextStatus: l,
-  showChatList: p,
-  subjectId: e,
-  accent: b,
-  launcher: n,
-  position: k,
-  quickReplies: L,
-  height: v = "100%",
+  contextStatus: e,
+  subjectId: n,
+  accent: m,
+  launcher: p,
+  position: R,
+  quickReplies: s,
+  height: y = "100%",
   i18n: C,
-  translateLang: s
+  translateLang: d
 }) {
-  const r = d(null), i = d(null);
-  return _(() => {
-    if (r.current)
-      return i.current = $({
-        el: r.current,
-        url: u,
-        profileId: w,
-        ...e ? { subjectId: e } : {},
+  const v = b(null), h = b(null);
+  return H(() => {
+    if (v.current)
+      return h.current = _({
+        el: v.current,
+        url: c,
+        profileId: l,
+        ...n ? { subjectId: n } : {},
         ...t ? { token: t } : {},
-        ...t || h || f || c ? {
+        ...t || u || r || i ? {
           user: {
-            ...h ? { name: h } : {},
-            ...f ? { email: f } : {},
-            ...c ? { avatar: c } : {}
+            ...u ? { name: u } : {},
+            ...r ? { email: r } : {},
+            ...i ? { avatar: i } : {}
           }
         } : {},
-        ...m ? {
+        ...f ? {
           subject: {
-            title: m,
+            title: f,
             ...o ? { subtitle: o } : {},
-            ...l ? { status: l } : {}
+            ...e ? { status: e } : {}
           }
         } : {},
-        ...p ? { showChatList: !0 } : {},
-        ...L ? { quickReplies: L } : {},
-        ...b ? { accent: b } : {},
-        ...s ? { translateLang: s } : {},
+        ...s ? { quickReplies: s } : {},
+        ...m ? { accent: m } : {},
+        ...d ? { translateLang: d } : {},
         ...C ? { i18n: C } : {},
-        ...n ? { launcher: n, position: k ?? "bottom-right" } : {}
+        ...p ? { launcher: p, position: R ?? "bottom-right" } : {}
       }), () => {
-        var R;
-        (R = i.current) == null || R.close(), i.current = null;
+        var w;
+        (w = h.current) == null || w.close(), h.current = null;
       };
-  }, [u, w, e, t]), /* @__PURE__ */ y(
+  }, [c, l, n, t]), /* @__PURE__ */ k(
     "div",
     {
-      ref: r,
-      style: n ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: v, minHeight: v === "100%" ? "480px" : void 0 }
+      ref: v,
+      style: p ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: y, minHeight: y === "100%" ? "480px" : void 0 }
     }
   );
 }
-const j = [
+const $ = [
   "Is this still available?",
   "Can I schedule a viewing?",
   "What is your best price?"
 ];
 function D({
-  url: u,
-  profileId: w,
+  url: c,
+  profileId: l,
   listingId: t,
-  listingTitle: h,
-  listingMeta: f,
-  listingPrice: c,
-  listingStatus: m,
+  listingTitle: u,
+  listingMeta: r,
+  listingPrice: i,
+  listingStatus: f,
   userId: o,
-  userName: l,
-  userEmail: p,
-  userAvatar: e,
-  accent: b,
-  launcher: n,
-  position: k,
-  quickReplies: L,
-  height: v = "100%",
-  i18n: C,
-  translateLang: s
+  userName: e,
+  userEmail: n,
+  userAvatar: m,
+  accent: p,
+  launcher: R,
+  position: s,
+  quickReplies: y,
+  height: C = "100%",
+  i18n: d,
+  translateLang: v
 }) {
-  const r = d(null), i = d(null);
-  return _(() => {
-    if (r.current)
-      return i.current = $({
-        el: r.current,
-        url: u,
-        profileId: w,
+  const h = b(null), w = b(null);
+  return H(() => {
+    if (h.current)
+      return w.current = _({
+        el: h.current,
+        url: c,
+        profileId: l,
         // ── Listing context ────────────────────────────────────────────────────
         // When listingId is present: open that listing's chat directly (no list).
         // When listingId is absent: show the thread list (dedicated inbox page).
         ...t ? { subjectId: `listing_${t}` } : {},
         ...o ? { token: o } : {},
-        ...o || l || p || e ? {
+        ...o || e || n || m ? {
           user: {
-            ...l ? { name: l } : {},
-            ...p ? { email: p } : {},
-            ...e ? { avatar: e } : {},
+            ...e ? { name: e } : {},
+            ...n ? { email: n } : {},
+            ...m ? { avatar: m } : {},
             ...t ? { meta: { listingId: t } } : {}
           }
         } : {},
-        ...h ? {
+        ...u ? {
           subject: {
-            title: h,
-            ...f ? { subtitle: f } : {},
-            ...c ? { tags: [`$${c.toLocaleString()}`] } : {},
-            ...m ? { status: m } : {}
+            title: u,
+            ...r ? { subtitle: r } : {},
+            ...i ? { tags: [`$${i.toLocaleString()}`] } : {},
+            ...f ? { status: f } : {}
           }
         } : {},
-        // showChatList is true in both cases but behaves differently:
-        // • With subjectId → chat screen shown immediately on open (in index.ts)
-        // • Without subjectId → list screen is home (the dedicated inbox case)
-        showChatList: !0,
-        quickReplies: L ?? j,
-        ...b ? { accent: b } : {},
-        ...s ? { translateLang: s } : {},
-        ...C ? { i18n: C } : {},
-        ...n ? { launcher: n, position: k ?? "bottom-right" } : {}
+        quickReplies: y ?? $,
+        ...p ? { accent: p } : {},
+        ...v ? { translateLang: v } : {},
+        ...d ? { i18n: d } : {},
+        ...R ? { launcher: R, position: s ?? "bottom-right" } : {}
+      }), () => {
+        var L;
+        (L = w.current) == null || L.close(), w.current = null;
+      };
+  }, [c, l, t, o]), /* @__PURE__ */ k(
+    "div",
+    {
+      ref: h,
+      style: R ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: C, minHeight: C === "100%" ? "480px" : void 0 }
+    }
+  );
+}
+function F({
+  url: c,
+  profileId: l,
+  userId: t,
+  onSelect: u,
+  accent: r,
+  height: i = "100%",
+  i18n: f
+}) {
+  const o = b(null), e = b(null);
+  return H(() => {
+    if (o.current)
+      return import("./chatlist.js").then(({ mountChatList: n }) => {
+        e.current = n({
+          el: o.current,
+          url: c,
+          profileId: l,
+          onSelect: u,
+          ...t ? { userId: t } : {},
+          ...r ? { accent: r } : {},
+          ...f ? { i18n: f } : {}
+        });
       }), () => {
-        var R;
-        (R = i.current) == null || R.close(), i.current = null;
+        var n;
+        (n = e.current) == null || n.close(), e.current = null;
       };
-  }, [u, w, t, o]), /* @__PURE__ */ y(
+  }, [c, l, t]), /* @__PURE__ */ k(
     "div",
     {
-      ref: r,
-      style: n ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: v, minHeight: v === "100%" ? "480px" : void 0 }
+      ref: o,
+      style: { width: "100%", height: i, minHeight: i === "100%" ? "400px" : void 0 }
     }
   );
 }
 export {
-  x as ChatWidget,
+  F as ChatList,
+  W as ChatWidget,
   D as MarketplaceChat
 };
 //# sourceMappingURL=react.js.map

package/dist/react.js.map

@@ -1 +1 @@
-{"version":3,"file":"react.js","sources":["../src/react.tsx"],"sourcesContent":["// react.tsx — React wrapper around mount().\n//\n// Next.js App Router: add 'use client' to whichever file imports these.\n// The widget needs WebSocket + DOM — it cannot render on the server.\n//\n// Import path: '@paramms/chat-widget/react'\n//\n// Two components:\n//   ChatWidget        — general support chat (hotel, SaaS, helpdesk, etc.)\n//   MarketplaceChat   — one thread per listing (used cars, rentals, etc.)\n//\n// Both: only url + profileId are required. userId is always optional —\n// anonymous guests are handled automatically via localStorage.\n\nimport { useEffect, useRef } from 'react'\nimport { mount, type MountOptions, type WidgetHandle } from './index.js'\n\n// ── Shared base props ─────────────────────────────────────────────────────────\n\ninterface BaseProps {\n  /** Relay WebSocket URL — set as NEXT_PUBLIC_RELAY_WS_URL in .env — required */\n  url:       string\n  /** Your Relay profile ID — set as NEXT_PUBLIC_RELAY_PROFILE_ID in .env — required */\n  profileId: string\n\n  /** Your logged-in user's stable ID. When omitted the widget automatically\n   *  assigns a persistent anonymous ID from localStorage — no login required. */\n  userId?:     string\n  /** Shown to agents instead of the raw user ID */\n  userName?:   string\n  /** Shown to agents so they can follow up by email */\n  userEmail?:  string\n  /** Avatar URL shown in the widget header and dashboard */\n  userAvatar?: string\n\n  /** Brand colour hex, e.g. \"#1a56db\". Defaults to the profile theme colour. */\n  accent?:   string\n  /** Render as a floating launcher button instead of inline */\n  launcher?: boolean\n  /** Launcher position — default 'bottom-right' */\n  position?: 'bottom-right' | 'bottom-left'\n  /** Pre-set reply chips shown above the input */\n  quickReplies?: string[]\n  /** Container height when rendered inline. Default: '100%' */\n  height?: string\n  /** i18n string overrides for non-English sites */\n  i18n?: MountOptions['i18n']\n  /** ISO language code for auto-translating incoming messages */\n  translateLang?: string\n}\n\n// ── ChatWidget ────────────────────────────────────────────────────────────────\n\nexport interface ChatWidgetProps extends BaseProps {\n  /** Optional context card shown at the top of the chat\n   *  (e.g. the support ticket, booking, or order being discussed) */\n  contextTitle?:    string\n  contextSubtitle?: string\n  contextStatus?:   string\n\n  /** Show the WhatsApp-style thread list as the home screen.\n   *  Use when users can have more than one thread on this profile\n   *  (e.g. one thread per support ticket, one per booking). */\n  showChatList?: boolean\n\n  /** Stable item ID — pins this conversation to a specific item/thread.\n   *  When showChatList is also true, the widget opens this thread immediately\n   *  but the user can navigate back to the full list. */\n  subjectId?: string\n}\n\n/**\n * General-purpose support chat widget. Only `url` and `profileId` are required.\n * All other props are optional — anonymous guests work without any configuration.\n *\n * @example Basic support chat\n * ```tsx\n * <ChatWidget\n *   url={process.env.NEXT_PUBLIC_RELAY_WS_URL}\n *   profileId={process.env.NEXT_PUBLIC_RELAY_PROFILE_ID}\n *   userId={session?.user.id}\n *   userName={session?.user.name}\n *   userEmail={session?.user.email}\n * />\n * ```\n *\n * @example Multi-thread (tickets, bookings, orders)\n * ```tsx\n * <ChatWidget\n *   url={...} profileId={...}\n *   showChatList\n *   subjectId={`ticket_${ticket.id}`}\n *   contextTitle={ticket.title}\n *   contextStatus={ticket.status}\n *   userId={session?.user.id}\n * />\n * ```\n */\nexport function ChatWidget({\n  url, profileId,\n  userId, userName, userEmail, userAvatar,\n  contextTitle, contextSubtitle, contextStatus,\n  showChatList, subjectId,\n  accent, launcher, position, quickReplies, height = '100%',\n  i18n, translateLang,\n}: ChatWidgetProps): JSX.Element {\n  const ref       = useRef<HTMLDivElement>(null)\n  const handleRef = useRef<WidgetHandle | null>(null)\n\n  useEffect(() => {\n    if (!ref.current) return\n    handleRef.current = mount({\n      el: ref.current,\n      url,\n      profileId,\n      ...(subjectId ? { subjectId }    : {}),\n      ...(userId    ? { token: userId } : {}),\n      ...(userId || userName || userEmail || userAvatar ? {\n        user: {\n          ...(userName   ? { name:   userName }   : {}),\n          ...(userEmail  ? { email:  userEmail }  : {}),\n          ...(userAvatar ? { avatar: userAvatar } : {}),\n        },\n      } : {}),\n      ...(contextTitle ? {\n        subject: {\n          title: contextTitle,\n          ...(contextSubtitle ? { subtitle: contextSubtitle } : {}),\n          ...(contextStatus   ? { status:   contextStatus }   : {}),\n        },\n      } : {}),\n      ...(showChatList   ? { showChatList: true }                          : {}),\n      ...(quickReplies   ? { quickReplies }                                : {}),\n      ...(accent         ? { accent }                                      : {}),\n      ...(translateLang  ? { translateLang }                               : {}),\n      ...(i18n           ? { i18n }                                        : {}),\n      ...(launcher       ? { launcher, position: position ?? 'bottom-right' } : {}),\n    })\n    return () => { handleRef.current?.close(); handleRef.current = null }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [url, profileId, subjectId, userId])\n\n  // When launcher=true, still render the div — mount() moves it inside the\n  // fixed panel above the bubble. Zero size so it doesn't affect page layout.\n  return (\n    <div\n      ref={ref}\n      style={launcher ? { width: 0, height: 0, overflow: 'hidden' } : { width: '100%', height, minHeight: height === '100%' ? '480px' : undefined }}\n    />\n  )\n}\n\n// ── MarketplaceChat ───────────────────────────────────────────────────────────\n\nexport interface MarketplaceChatProps extends BaseProps {\n  /** Unique ID for this listing — each listing gets its own thread.\n   *  Omit for a general (non-item-specific) conversation. */\n  listingId?:     string\n  /** Shown at the top of the chat — e.g. \"2019 Toyota Camry SE\" */\n  listingTitle?:  string\n  /** One-line detail — e.g. \"45,000 km · Automatic\" */\n  listingMeta?:   string\n  /** Price shown as a tag — e.g. 12500 → \"$12,500\" */\n  listingPrice?:  number\n  /** Status badge — e.g. \"Available\", \"Sold\", \"Pending\" */\n  listingStatus?: string\n}\n\nconst DEFAULT_MARKETPLACE_REPLIES = [\n  'Is this still available?',\n  'Can I schedule a viewing?',\n  'What is your best price?',\n]\n\n/**\n * Marketplace chat widget. Two modes depending on whether `listingId` is provided:\n *\n * **With `listingId` (listing page)** — opens that listing's chat immediately.\n * No list screen. The buyer is already looking at the item so context is clear.\n * ```tsx\n * // On your listing detail page:\n * <MarketplaceChat\n *   url={process.env.NEXT_PUBLIC_RELAY_WS_URL}\n *   profileId={process.env.NEXT_PUBLIC_RELAY_PROFILE_ID}\n *   listingId={car.id}\n *   listingTitle={car.title}\n *   listingPrice={car.price}\n *   listingMeta={`${car.mileage.toLocaleString()} km · ${car.gearbox}`}\n *   listingStatus=\"Available\"\n *   userId={session?.user.id}\n *   userName={session?.user.name}\n *   userEmail={session?.user.email}\n * />\n * ```\n *\n * **Without `listingId` (My Messages / inbox page)** — shows the WhatsApp-style\n * thread list as the home screen. No conversation is opened until the user taps one.\n * Use this on a dedicated `/messages` or `/inbox` page.\n * ```tsx\n * // On your /messages page:\n * <MarketplaceChat\n *   url={process.env.NEXT_PUBLIC_RELAY_WS_URL}\n *   profileId={process.env.NEXT_PUBLIC_RELAY_PROFILE_ID}\n *   userId={session?.user.id}\n *   userName={session?.user.name}\n * />\n * ```\n *\n * Only `url` and `profileId` are required. All other props are optional.\n */\nexport function MarketplaceChat({\n  url, profileId,\n  listingId, listingTitle, listingMeta, listingPrice, listingStatus,\n  userId, userName, userEmail, userAvatar,\n  accent, launcher, position, quickReplies, height = '100%',\n  i18n, translateLang,\n}: MarketplaceChatProps): JSX.Element {\n  const ref       = useRef<HTMLDivElement>(null)\n  const handleRef = useRef<WidgetHandle | null>(null)\n\n  useEffect(() => {\n    if (!ref.current) return\n    handleRef.current = mount({\n      el: ref.current,\n      url,\n      profileId,\n\n      // ── Listing context ────────────────────────────────────────────────────\n      // When listingId is present: open that listing's chat directly (no list).\n      // When listingId is absent: show the thread list (dedicated inbox page).\n      ...(listingId ? { subjectId: `listing_${listingId}` } : {}),\n\n      ...(userId    ? { token: userId } : {}),\n      ...(userId || userName || userEmail || userAvatar ? {\n        user: {\n          ...(userName   ? { name:   userName }   : {}),\n          ...(userEmail  ? { email:  userEmail }  : {}),\n          ...(userAvatar ? { avatar: userAvatar } : {}),\n          ...(listingId  ? { meta: { listingId } } : {}),\n        },\n      } : {}),\n\n      ...(listingTitle ? {\n        subject: {\n          title: listingTitle,\n          ...(listingMeta   ? { subtitle: listingMeta }                       : {}),\n          ...(listingPrice  ? { tags: [`$${listingPrice.toLocaleString()}`] } : {}),\n          ...(listingStatus ? { status:   listingStatus }                     : {}),\n        },\n      } : {}),\n\n      // showChatList is true in both cases but behaves differently:\n      // • With subjectId → chat screen shown immediately on open (in index.ts)\n      // • Without subjectId → list screen is home (the dedicated inbox case)\n      showChatList:  true,\n      quickReplies:  quickReplies ?? DEFAULT_MARKETPLACE_REPLIES,\n      ...(accent        ? { accent }                                         : {}),\n      ...(translateLang ? { translateLang }                                  : {}),\n      ...(i18n          ? { i18n }                                           : {}),\n      ...(launcher      ? { launcher, position: position ?? 'bottom-right' } : {}),\n    })\n    return () => { handleRef.current?.close(); handleRef.current = null }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [url, profileId, listingId, userId])\n\n  // When launcher=true, still render the div — mount() moves it inside the\n  // fixed panel above the bubble. Zero size so it doesn't affect page layout.\n  return (\n    <div\n      ref={ref}\n      style={launcher ? { width: 0, height: 0, overflow: 'hidden' } : { width: '100%', height, minHeight: height === '100%' ? '480px' : undefined }}\n    />\n  )\n}\n"],"names":["ChatWidget","url","profileId","userId","userName","userEmail","userAvatar","contextTitle","contextSubtitle","contextStatus","showChatList","subjectId","accent","launcher","position","quickReplies","height","i18n","translateLang","ref","useRef","handleRef","useEffect","mount","_a","jsx","DEFAULT_MARKETPLACE_REPLIES","MarketplaceChat","listingId","listingTitle","listingMeta","listingPrice","listingStatus"],"mappings":"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"}
+{"version":3,"file":"react.js","sources":["../src/react.tsx"],"sourcesContent":["// react.tsx — React wrapper around mount().\n//\n// Next.js App Router: add 'use client' to whichever file imports these.\n// The widget needs WebSocket + DOM — it cannot render on the server.\n//\n// Import path: '@paramms/chat-widget/react'\n//\n// Two components:\n//   ChatWidget        — general support chat (hotel, SaaS, helpdesk, etc.)\n//   MarketplaceChat   — one thread per listing (used cars, rentals, etc.)\n//\n// Both: only url + profileId are required. userId is always optional —\n// anonymous guests are handled automatically via localStorage.\n\nimport { useEffect, useRef } from 'react'\nimport { mount, type MountOptions, type WidgetHandle } from './index.js'\n\n// ── Shared base props ─────────────────────────────────────────────────────────\n\ninterface BaseProps {\n  /** Relay WebSocket URL — set as NEXT_PUBLIC_RELAY_WS_URL in .env — required */\n  url:       string\n  /** Your Relay profile ID — set as NEXT_PUBLIC_RELAY_PROFILE_ID in .env — required */\n  profileId: string\n\n  /** Your logged-in user's stable ID. When omitted the widget automatically\n   *  assigns a persistent anonymous ID from localStorage — no login required. */\n  userId?:     string\n  /** Shown to agents instead of the raw user ID */\n  userName?:   string\n  /** Shown to agents so they can follow up by email */\n  userEmail?:  string\n  /** Avatar URL shown in the widget header and dashboard */\n  userAvatar?: string\n\n  /** Brand colour hex, e.g. \"#1a56db\". Defaults to the profile theme colour. */\n  accent?:   string\n  /** Render as a floating launcher button instead of inline */\n  launcher?: boolean\n  /** Launcher position — default 'bottom-right' */\n  position?: 'bottom-right' | 'bottom-left'\n  /** Pre-set reply chips shown above the input */\n  quickReplies?: string[]\n  /** Container height when rendered inline. Default: '100%' */\n  height?: string\n  /** i18n string overrides for non-English sites */\n  i18n?: MountOptions['i18n']\n  /** ISO language code for auto-translating incoming messages */\n  translateLang?: string\n}\n\n// ── ChatWidget ────────────────────────────────────────────────────────────────\n\nexport interface ChatWidgetProps extends BaseProps {\n  /** Optional context card shown at the top of the chat\n   *  (e.g. the support ticket, booking, or order being discussed) */\n  contextTitle?:    string\n  contextSubtitle?: string\n  contextStatus?:   string\n\n  /** Stable item ID — pins this conversation to a specific item/thread. */\n  subjectId?: string\n}\n\n/**\n * General-purpose support chat widget. Only `url` and `profileId` are required.\n * All other props are optional — anonymous guests work without any configuration.\n *\n * @example Basic support chat\n * ```tsx\n * <ChatWidget\n *   url={process.env.NEXT_PUBLIC_RELAY_WS_URL}\n *   profileId={process.env.NEXT_PUBLIC_RELAY_PROFILE_ID}\n *   userId={session?.user.id}\n *   userName={session?.user.name}\n *   userEmail={session?.user.email}\n * />\n * ```\n *\n * @example Multi-thread (tickets, bookings, orders)\n * ```tsx\n * <ChatWidget\n *   url={...} profileId={...}\n *   showChatList\n *   subjectId={`ticket_${ticket.id}`}\n *   contextTitle={ticket.title}\n *   contextStatus={ticket.status}\n *   userId={session?.user.id}\n * />\n * ```\n */\nexport function ChatWidget({\n  url, profileId,\n  userId, userName, userEmail, userAvatar,\n  contextTitle, contextSubtitle, contextStatus,\n  subjectId,\n  accent, launcher, position, quickReplies, height = '100%',\n  i18n, translateLang,\n}: ChatWidgetProps): JSX.Element {\n  const ref       = useRef<HTMLDivElement>(null)\n  const handleRef = useRef<WidgetHandle | null>(null)\n\n  useEffect(() => {\n    if (!ref.current) return\n    handleRef.current = mount({\n      el: ref.current,\n      url,\n      profileId,\n      ...(subjectId ? { subjectId }    : {}),\n      ...(userId    ? { token: userId } : {}),\n      ...(userId || userName || userEmail || userAvatar ? {\n        user: {\n          ...(userName   ? { name:   userName }   : {}),\n          ...(userEmail  ? { email:  userEmail }  : {}),\n          ...(userAvatar ? { avatar: userAvatar } : {}),\n        },\n      } : {}),\n      ...(contextTitle ? {\n        subject: {\n          title: contextTitle,\n          ...(contextSubtitle ? { subtitle: contextSubtitle } : {}),\n          ...(contextStatus   ? { status:   contextStatus }   : {}),\n        },\n      } : {}),\n      ...(quickReplies   ? { quickReplies }                                : {}),\n      ...(accent         ? { accent }                                      : {}),\n      ...(translateLang  ? { translateLang }                               : {}),\n      ...(i18n           ? { i18n }                                        : {}),\n      ...(launcher       ? { launcher, position: position ?? 'bottom-right' } : {}),\n    })\n    return () => { handleRef.current?.close(); handleRef.current = null }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [url, profileId, subjectId, userId])\n\n  // When launcher=true, still render the div — mount() moves it inside the\n  // fixed panel above the bubble. Zero size so it doesn't affect page layout.\n  return (\n    <div\n      ref={ref}\n      style={launcher ? { width: 0, height: 0, overflow: 'hidden' } : { width: '100%', height, minHeight: height === '100%' ? '480px' : undefined }}\n    />\n  )\n}\n\n// ── MarketplaceChat ───────────────────────────────────────────────────────────\n\nexport interface MarketplaceChatProps extends BaseProps {\n  /** Unique ID for this listing — each listing gets its own thread.\n   *  Omit for a general (non-item-specific) conversation. */\n  listingId?:     string\n  /** Shown at the top of the chat — e.g. \"2019 Toyota Camry SE\" */\n  listingTitle?:  string\n  /** One-line detail — e.g. \"45,000 km · Automatic\" */\n  listingMeta?:   string\n  /** Price shown as a tag — e.g. 12500 → \"$12,500\" */\n  listingPrice?:  number\n  /** Status badge — e.g. \"Available\", \"Sold\", \"Pending\" */\n  listingStatus?: string\n}\n\nconst DEFAULT_MARKETPLACE_REPLIES = [\n  'Is this still available?',\n  'Can I schedule a viewing?',\n  'What is your best price?',\n]\n\n/**\n * Marketplace chat widget. Two modes depending on whether `listingId` is provided:\n *\n * **With `listingId` (listing page)** — opens that listing's chat immediately.\n * No list screen. The buyer is already looking at the item so context is clear.\n * ```tsx\n * // On your listing detail page:\n * <MarketplaceChat\n *   url={process.env.NEXT_PUBLIC_RELAY_WS_URL}\n *   profileId={process.env.NEXT_PUBLIC_RELAY_PROFILE_ID}\n *   listingId={car.id}\n *   listingTitle={car.title}\n *   listingPrice={car.price}\n *   listingMeta={`${car.mileage.toLocaleString()} km · ${car.gearbox}`}\n *   listingStatus=\"Available\"\n *   userId={session?.user.id}\n *   userName={session?.user.name}\n *   userEmail={session?.user.email}\n * />\n * ```\n *\n * **Without `listingId` (My Messages / inbox page)** — shows the WhatsApp-style\n * thread list as the home screen. No conversation is opened until the user taps one.\n * Use this on a dedicated `/messages` or `/inbox` page.\n * ```tsx\n * // On your /messages page:\n * <MarketplaceChat\n *   url={process.env.NEXT_PUBLIC_RELAY_WS_URL}\n *   profileId={process.env.NEXT_PUBLIC_RELAY_PROFILE_ID}\n *   userId={session?.user.id}\n *   userName={session?.user.name}\n * />\n * ```\n *\n * Only `url` and `profileId` are required. All other props are optional.\n */\nexport function MarketplaceChat({\n  url, profileId,\n  listingId, listingTitle, listingMeta, listingPrice, listingStatus,\n  userId, userName, userEmail, userAvatar,\n  accent, launcher, position, quickReplies, height = '100%',\n  i18n, translateLang,\n}: MarketplaceChatProps): JSX.Element {\n  const ref       = useRef<HTMLDivElement>(null)\n  const handleRef = useRef<WidgetHandle | null>(null)\n\n  useEffect(() => {\n    if (!ref.current) return\n    handleRef.current = mount({\n      el: ref.current,\n      url,\n      profileId,\n\n      // ── Listing context ────────────────────────────────────────────────────\n      // When listingId is present: open that listing's chat directly (no list).\n      // When listingId is absent: show the thread list (dedicated inbox page).\n      ...(listingId ? { subjectId: `listing_${listingId}` } : {}),\n\n      ...(userId    ? { token: userId } : {}),\n      ...(userId || userName || userEmail || userAvatar ? {\n        user: {\n          ...(userName   ? { name:   userName }   : {}),\n          ...(userEmail  ? { email:  userEmail }  : {}),\n          ...(userAvatar ? { avatar: userAvatar } : {}),\n          ...(listingId  ? { meta: { listingId } } : {}),\n        },\n      } : {}),\n\n      ...(listingTitle ? {\n        subject: {\n          title: listingTitle,\n          ...(listingMeta   ? { subtitle: listingMeta }                       : {}),\n          ...(listingPrice  ? { tags: [`$${listingPrice.toLocaleString()}`] } : {}),\n          ...(listingStatus ? { status:   listingStatus }                     : {}),\n        },\n      } : {}),\n\n\n      quickReplies:  quickReplies ?? DEFAULT_MARKETPLACE_REPLIES,\n      ...(accent        ? { accent }                                         : {}),\n      ...(translateLang ? { translateLang }                                  : {}),\n      ...(i18n          ? { i18n }                                           : {}),\n      ...(launcher      ? { launcher, position: position ?? 'bottom-right' } : {}),\n    })\n    return () => { handleRef.current?.close(); handleRef.current = null }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [url, profileId, listingId, userId])\n\n  // When launcher=true, still render the div — mount() moves it inside the\n  // fixed panel above the bubble. Zero size so it doesn't affect page layout.\n  return (\n    <div\n      ref={ref}\n      style={launcher ? { width: 0, height: 0, overflow: 'hidden' } : { width: '100%', height, minHeight: height === '100%' ? '480px' : undefined }}\n    />\n  )\n}\n\n// ── ChatList ──────────────────────────────────────────────────────────────────\n\nexport interface ChatListProps {\n  /** Relay WebSocket URL — required */\n  url:        string\n  /** Your Relay profile ID — required */\n  profileId:  string\n  /** Your logged-in user's stable ID. Omit for anonymous (uses localStorage UID) */\n  userId?:    string\n  /** Called when the user taps a conversation row.\n   *  Use this to navigate to the listing page or open a ChatWidget. */\n  onSelect:   (entry: import('./chatlist.js').ChatListEntry) => void\n  /** Brand colour hex — default '#f5713c' */\n  accent?:    string\n  /** Container height when rendered inline. Default: '100%' */\n  height?:    string\n  /** i18n overrides */\n  i18n?: import('./chatlist.js').ChatListOptions['i18n']\n}\n\n/**\n * Standalone conversation list — separate from the chat widget.\n * Use this on a dedicated /messages or /inbox page.\n * Tap a row → onSelect fires → you navigate to the listing or open a ChatWidget.\n *\n * @example\n * ```tsx\n * 'use client'\n * import { ChatList } from '@paramms/chat-widget/react'\n * import { useRouter } from 'next/navigation'\n *\n * export default function MessagesPage({ session }) {\n *   const router = useRouter()\n *   return (\n *     <div style={{ height: '600px' }}>\n *       <ChatList\n *         url={process.env.NEXT_PUBLIC_RELAY_WS_URL}\n *         profileId={process.env.NEXT_PUBLIC_RELAY_PROFILE_ID}\n *         userId={session?.user.id}\n *         onSelect={(entry) => {\n *           // Navigate to the listing page where the ChatWidget lives\n *           router.push(`/listings/${entry.subjectId}`)\n *         }}\n *       />\n *     </div>\n *   )\n * }\n * ```\n */\nexport function ChatList({\n  url, profileId, userId, onSelect, accent, height = '100%', i18n,\n}: ChatListProps): JSX.Element {\n  const ref       = useRef<HTMLDivElement>(null)\n  const handleRef = useRef<import('./chatlist.js').ChatListHandle | null>(null)\n\n  useEffect(() => {\n    if (!ref.current) return\n    import('./chatlist.js').then(({ mountChatList }) => {\n      handleRef.current = mountChatList({\n        el:        ref.current!,\n        url,\n        profileId,\n        onSelect,\n        ...(userId ? { userId } : {}),\n        ...(accent ? { accent } : {}),\n        ...(i18n   ? { i18n }   : {}),\n      })\n    })\n    return () => { handleRef.current?.close(); handleRef.current = null }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [url, profileId, userId])\n\n  return (\n    <div\n      ref={ref}\n      style={{ width: '100%', height, minHeight: height === '100%' ? '400px' : undefined }}\n    />\n  )\n}\n"],"names":["ChatWidget","url","profileId","userId","userName","userEmail","userAvatar","contextTitle","contextSubtitle","contextStatus","subjectId","accent","launcher","position","quickReplies","height","i18n","translateLang","ref","useRef","handleRef","useEffect","mount","_a","jsx","DEFAULT_MARKETPLACE_REPLIES","MarketplaceChat","listingId","listingTitle","listingMeta","listingPrice","listingStatus","ChatList","onSelect","mountChatList"],"mappings":"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"}

package/dist/renderer.d.ts

@@ -22,10 +22,6 @@ export interface WidgetConfig {
         offline?: string;
         poweredBy?: string;
     };
-    /** When showChatList=true, start on the chat screen instead of the list screen.
-     *  Set when a specific conversation/listing is already known (e.g. MarketplaceChat
-     *  with listingId). The list is still accessible via the back button. */
-    startOnChat?: boolean;
 }
 export interface RendererHandlers {
     onSend(text: string): void;
@@ -45,24 +41,6 @@ export interface RendererHandlers {
     /** Translate a message's text for display. Return null if unavailable —
      *  the renderer shows a brief "unavailable" hint and leaves the original. */
     onTranslate?(text: string): Promise<string | null>;
-    /** Multi-subject chat list (e.g. a marketplace with one thread per item):
-     *  fetch the guest's other conversations. Omit to hide the list button
-     *  entirely — single-conversation embeds don't need this. */
-    onListChats?(): Promise<ChatListEntry[]>;
-    /** Switch the active conversation to a different one from the list —
-     *  effectively a re-open with a different subjectId. */
-    onSwitchChat?(entry: ChatListEntry): void;
-}
-export interface ChatListEntry {
-    id: string;
-    subjectId?: string;
-    subjectTitle?: string;
-    state: string;
-    updatedAt: number;
-    /** Server-assigned highest message seq — used to compute unread count. */
-    lastSeq?: number;
-    /** Snippet of the last message text — shown as preview in the list row. */
-    lastMessage?: string;
 }
 /** Renders a ChatStore into a host element in the Image-1 layout: header →
  *  subject card → action chips → chat → quick replies → input. Self-injects its
@@ -104,38 +82,15 @@ export declare class Renderer {
     setScrollCleanup(fn: () => void): void;
     private readonly translationCache;
     private readonly showingTranslation;
-    private listScreen;
-    private chatScreen;
-    private listBody;
-    private listSearch;
-    private backBtn;
-    private activeChatId;
-    private inChatScreen;
-    private allEntries;
     /** Last seq the guest has seen per conversationId — used to compute unread badges. */
-    private readonly seenSeq;
-    private seenSeqKey;
-    /** Load seenSeq from localStorage (keyed by userId+profileId). */
-    initSeenSeq(key: string): void;
-    setSeenSeq(conversationId: string, seq: number): void;
     constructor(root: HTMLElement, me: string, h: RendererHandlers, cfg?: WidgetConfig);
-    /** Fetch the list and re-render it. Called on mount and after switching chats. */
-    private destroyed;
-    /** Call when the widget is unmounted. Disconnects scroll listeners and
-     *  prevents in-flight fetches from writing to dead DOM. */
+    /** Call when the widget is unmounted. Disconnects scroll listeners. */
     destroy(): void;
-    refreshList(): void;
     /** Render list rows, optionally filtered by search query. */
-    private renderListRows;
-    private isUnread;
     /** Build a single WhatsApp-style conversation row. */
-    private buildRow;
     /** Returns true when the chat screen is visible (not the list). */
-    isInChatScreen(): boolean;
     /** Navigate to the chat screen (slide list left, slide chat in from right). */
-    showChatScreen(): void;
     /** Navigate back to the list screen. */
-    showListScreen(): void;
     private flushSend;
     private signalTyping;
     render(store: ChatStore): void;

package/dist/uid.d.ts

@@ -0,0 +1,3 @@
+/** Persistent anonymous identity, reused across reloads (per the old widget's
+ *  oc_uid pattern). */
+export declare function persistentUid(): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paramms/chat-widget",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "Embeddable real-time chat widget for the Relay platform",
   "license": "MIT",
   "repository": {
@@ -21,6 +21,9 @@
     "dist/react.js",
     "dist/react.js.map",
     "dist/react.d.ts",
+    "dist/chatlist.js",
+    "dist/chatlist.js.map",
+    "dist/chatlist.d.ts",
     "dist/store.d.ts",
     "dist/connection.d.ts",
     "dist/history.d.ts",
@@ -28,6 +31,7 @@
     "dist/renderer.d.ts",
     "dist/crypto.d.ts",
     "dist/e2e.d.ts",
+    "dist/uid.d.ts",
     "dist/protocol"
   ],
   "type": "module",
@@ -60,6 +64,10 @@
     "./react": {
       "types": "./dist/react.d.ts",
       "default": "./dist/react.js"
+    },
+    "./chatlist": {
+      "types": "./dist/chatlist.d.ts",
+      "default": "./dist/chatlist.js"
     }
   },
   "peerDependencies": {