@flamingo-stack/openframe-frontend-core 0.0.321 → 0.0.322

package/dist/{chunk-TPJJJ6KC.js → chunk-MQHD6CTN.js}

@@ -6143,12 +6143,15 @@ function MingoChatHistoryRow({
     }
   );
 }
-function MingoChatHistorySkeleton({ className }) {
+function MingoChatHistorySkeleton({
+  className,
+  searchable = false
+}) {
   const groups = [
     { withBadge: 2, widths: ["w-3/5", "w-4/5", "w-2/5", "w-3/4"] },
     { withBadge: 0, widths: ["w-1/2", "w-3/5", "w-2/3"] }
   ];
-  return /* @__PURE__ */ jsx34(
+  return /* @__PURE__ */ jsxs30(
     "div",
     {
       "aria-hidden": true,
@@ -6156,20 +6159,51 @@ function MingoChatHistorySkeleton({ className }) {
         "flex flex-1 min-h-0 flex-col gap-[var(--spacing-system-m)] overflow-hidden",
         className
       ),
-      children: groups.map((group, g) => /* @__PURE__ */ jsxs30("div", { className: "flex shrink-0 flex-col gap-[var(--spacing-system-xxs)]", children: [
-        /* @__PURE__ */ jsx34("div", { className: "h-3 w-16 animate-pulse rounded bg-ods-border" }),
-        /* @__PURE__ */ jsx34("div", { className: "overflow-hidden rounded-md border border-ods-border", children: group.widths.map((w, i) => /* @__PURE__ */ jsxs30(
-          "div",
-          {
-            className: "flex h-12 items-center gap-[var(--spacing-system-xsf)] bg-ods-bg border-b border-ods-border px-[var(--spacing-system-s)] last:border-b-0",
-            children: [
-              i < group.withBadge && /* @__PURE__ */ jsx34("div", { className: "h-8 w-8 shrink-0 animate-pulse rounded-md bg-ods-border" }),
-              /* @__PURE__ */ jsx34("div", { className: cn("h-4 animate-pulse rounded bg-ods-border", w) })
-            ]
-          },
-          i
-        )) })
-      ] }, g))
+      children: [
+        searchable && /* @__PURE__ */ jsxs30("div", { className: "flex h-11 md:h-12 shrink-0 items-center gap-2 rounded-[6px] border border-ods-border bg-ods-card px-3", children: [
+          /* @__PURE__ */ jsx34("div", { className: "size-4 md:size-6 shrink-0 animate-pulse rounded bg-ods-border" }),
+          /* @__PURE__ */ jsx34("div", { className: "h-4 w-32 animate-pulse rounded bg-ods-border" })
+        ] }),
+        groups.map((group, g) => /* @__PURE__ */ jsxs30("div", { className: "flex shrink-0 flex-col gap-[var(--spacing-system-xxs)]", children: [
+          /* @__PURE__ */ jsx34("div", { className: "h-3 w-16 animate-pulse rounded bg-ods-border" }),
+          /* @__PURE__ */ jsx34("div", { className: "overflow-hidden rounded-md border border-ods-border", children: group.widths.map((w, i) => /* @__PURE__ */ jsxs30(
+            "div",
+            {
+              className: "flex h-12 items-center gap-[var(--spacing-system-xsf)] bg-ods-bg border-b border-ods-border px-[var(--spacing-system-s)] last:border-b-0",
+              children: [
+                i < group.withBadge && /* @__PURE__ */ jsx34("div", { className: "h-8 w-8 shrink-0 animate-pulse rounded-md bg-ods-border" }),
+                /* @__PURE__ */ jsx34("div", { className: cn("h-4 animate-pulse rounded bg-ods-border", w) })
+              ]
+            },
+            i
+          )) })
+        ] }, g))
+      ]
+    }
+  );
+}
+function DialogSearchBar({
+  initialValue,
+  onSearchChange
+}) {
+  const [value, setValue] = React13.useState(initialValue ?? "");
+  const debounced = useDebounce(value, 300);
+  const lastEmitted = React13.useRef(initialValue ?? "");
+  React13.useEffect(() => {
+    if (debounced === lastEmitted.current) return;
+    lastEmitted.current = debounced;
+    onSearchChange(debounced);
+  }, [debounced, onSearchChange]);
+  return /* @__PURE__ */ jsx34(
+    Input,
+    {
+      type: "text",
+      value,
+      onChange: (e) => setValue(e.target.value),
+      placeholder: "Search for Chats",
+      "aria-label": "Search chats",
+      startAdornment: /* @__PURE__ */ jsx34(SearchIcon, {}),
+      className: "shrink-0"
     }
   );
 }
@@ -6179,12 +6213,15 @@ function MingoChatHistory({
   onSelectDialog,
   onRequestRename,
   onRequestArchive,
+  searchQuery,
+  onSearchChange,
   hasMore = false,
   isLoadingMore = false,
   onLoadMore,
   className
 }) {
   const groups = React13.useMemo(() => groupDialogs(dialogs), [dialogs]);
+  const noSearchResults = groups.length === 0 && !!searchQuery?.trim();
   const scrollRef = React13.useRef(null);
   const [fade, setFade] = React13.useState({ top: false, bottom: false });
   const updateFade = React13.useCallback(() => {
@@ -6223,65 +6260,68 @@ function MingoChatHistory({
     io.observe(sentinel);
     return () => io.disconnect();
   }, [hasMore]);
-  return /* @__PURE__ */ jsxs30("div", { className: cn("relative flex flex-1 min-h-0 flex-col", className), children: [
-    /* @__PURE__ */ jsxs30(
-      "div",
-      {
-        ref: scrollRef,
-        onScroll: updateFade,
-        className: "flex flex-1 min-h-0 flex-col gap-[var(--spacing-system-m)] overflow-y-auto",
-        children: [
-          groups.map((group) => /* @__PURE__ */ jsxs30(
-            "div",
-            {
-              className: "flex flex-col gap-[var(--spacing-system-xxs)]",
-              children: [
-                /* @__PURE__ */ jsx34("p", { className: "text-h5 text-ods-text-secondary", children: group.label }),
-                /* @__PURE__ */ jsx34("div", { className: "overflow-hidden rounded-md border border-ods-border", children: group.items.map((dialog) => /* @__PURE__ */ jsx34(
-                  MingoChatHistoryRow,
-                  {
-                    dialog,
-                    isActive: dialog.id === activeDialogId,
-                    onSelect: onSelectDialog,
-                    onRequestRename,
-                    onRequestArchive
-                  },
-                  dialog.id
-                )) })
-              ]
-            },
-            group.key
-          )),
-          hasMore ? /* @__PURE__ */ jsx34("div", { ref: sentinelRef, className: "h-px shrink-0" }) : null
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx34(
-      "div",
-      {
-        "aria-hidden": true,
-        className: cn(
-          "pointer-events-none absolute inset-x-0 top-0 h-12 transition-opacity duration-150",
-          fade.top ? "opacity-100" : "opacity-0"
-        ),
-        style: {
-          background: "linear-gradient(0deg, transparent 0%, var(--color-bg-card) 100%)"
+  return /* @__PURE__ */ jsxs30("div", { className: cn("relative flex flex-1 min-h-0 flex-col gap-[var(--spacing-system-m)]", className), children: [
+    onSearchChange ? /* @__PURE__ */ jsx34(DialogSearchBar, { initialValue: searchQuery, onSearchChange }) : null,
+    /* @__PURE__ */ jsxs30("div", { className: "relative flex flex-1 min-h-0 flex-col", children: [
+      /* @__PURE__ */ jsxs30(
+        "div",
+        {
+          ref: scrollRef,
+          onScroll: updateFade,
+          className: "flex flex-1 min-h-0 flex-col gap-[var(--spacing-system-m)] overflow-y-auto",
+          children: [
+            noSearchResults ? /* @__PURE__ */ jsx34("p", { className: "py-[var(--spacing-system-m)] text-center text-h5 text-ods-text-secondary", children: "No chats found" }) : groups.map((group) => /* @__PURE__ */ jsxs30(
+              "div",
+              {
+                className: "flex flex-col gap-[var(--spacing-system-xxs)]",
+                children: [
+                  /* @__PURE__ */ jsx34("p", { className: "text-h5 text-ods-text-secondary", children: group.label }),
+                  /* @__PURE__ */ jsx34("div", { className: "overflow-hidden rounded-md border border-ods-border", children: group.items.map((dialog) => /* @__PURE__ */ jsx34(
+                    MingoChatHistoryRow,
+                    {
+                      dialog,
+                      isActive: dialog.id === activeDialogId,
+                      onSelect: onSelectDialog,
+                      onRequestRename,
+                      onRequestArchive
+                    },
+                    dialog.id
+                  )) })
+                ]
+              },
+              group.key
+            )),
+            hasMore ? /* @__PURE__ */ jsx34("div", { ref: sentinelRef, className: "h-px shrink-0" }) : null
+          ]
         }
-      }
-    ),
-    /* @__PURE__ */ jsx34(
-      "div",
-      {
-        "aria-hidden": true,
-        className: cn(
-          "pointer-events-none absolute inset-x-0 bottom-0 h-12 transition-opacity duration-150",
-          fade.bottom ? "opacity-100" : "opacity-0"
-        ),
-        style: {
-          background: "linear-gradient(180deg, transparent 0%, var(--color-bg-card) 100%)"
+      ),
+      /* @__PURE__ */ jsx34(
+        "div",
+        {
+          "aria-hidden": true,
+          className: cn(
+            "pointer-events-none absolute inset-x-0 top-0 h-12 transition-opacity duration-150",
+            fade.top ? "opacity-100" : "opacity-0"
+          ),
+          style: {
+            background: "linear-gradient(0deg, transparent 0%, var(--color-bg-card) 100%)"
+          }
         }
-      }
-    )
+      ),
+      /* @__PURE__ */ jsx34(
+        "div",
+        {
+          "aria-hidden": true,
+          className: cn(
+            "pointer-events-none absolute inset-x-0 bottom-0 h-12 transition-opacity duration-150",
+            fade.bottom ? "opacity-100" : "opacity-0"
+          ),
+          style: {
+            background: "linear-gradient(180deg, transparent 0%, var(--color-bg-card) 100%)"
+          }
+        }
+      )
+    ] })
   ] });
 }
 
@@ -6330,6 +6370,7 @@ function MingoWelcome({
   isLoadingHistory = false,
   loadError = false,
   onRetry,
+  historySearchable = false,
   onStartGuideChat,
   className
 }) {
@@ -6401,7 +6442,7 @@ function MingoWelcome({
               children: "Try again"
             }
           )
-        ] }) : isLoadingHistory ? /* @__PURE__ */ jsx35(MingoChatHistorySkeleton, {}) : /* @__PURE__ */ jsx35(Fragment7, { children: /* @__PURE__ */ jsxs31("div", { className: "relative flex flex-1 min-h-0 flex-col", children: [
+        ] }) : isLoadingHistory ? /* @__PURE__ */ jsx35(MingoChatHistorySkeleton, { searchable: historySearchable }) : /* @__PURE__ */ jsx35(Fragment7, { children: /* @__PURE__ */ jsxs31("div", { className: "relative flex flex-1 min-h-0 flex-col", children: [
           /* @__PURE__ */ jsxs31(
             "div",
             {
@@ -47960,14 +48001,18 @@ function EmbeddableChatInner({
         canRename: mingoDialogCapabilities?.canRename ?? false,
         canArchive: mingoDialogCapabilities?.canArchive ?? false,
         fetchArchivedDialogs: mingoDialogCapabilities?.fetchArchivedDialogs,
-        unarchiveDialog: mingoDialogCapabilities?.unarchiveDialog
+        unarchiveDialog: mingoDialogCapabilities?.unarchiveDialog,
+        searchQuery: mingoDialogCapabilities?.searchQuery,
+        onSearchChange: mingoDialogCapabilities?.onSearchChange
       };
     }
     return {
       canRename: !!effectiveModes.mingo?.renameDialog,
       canArchive: !!effectiveModes.mingo?.archiveDialog,
       fetchArchivedDialogs: effectiveModes.mingo?.fetchArchivedDialogs,
-      unarchiveDialog: effectiveModes.mingo?.unarchiveDialog
+      unarchiveDialog: effectiveModes.mingo?.unarchiveDialog,
+      searchQuery: void 0,
+      onSearchChange: void 0
     };
   }, [mingoState, mingoDialogCapabilities, effectiveModes]);
   const hasMingoMode = !!effectiveModes.mingo || !!mingoState;
@@ -48420,20 +48465,30 @@ function EmbeddableChatInner({
                               isLoadingHistory: dialogsInitialLoading,
                               loadError: dialogsLoadError,
                               onRetry: reloadDialogs,
-                              dialogHistory: dialogs.length > 0 ? /* @__PURE__ */ jsx326(
-                                MingoChatHistory,
-                                {
-                                  dialogs,
-                                  onSelectDialog: handleSelectDialog,
-                                  onRequestRename: mingoCaps.canRename ? setRenameTarget : void 0,
-                                  onRequestArchive: mingoCaps.canArchive ? setArchiveTarget : void 0,
-                                  hasMore: hasMoreDialogs,
-                                  isLoadingMore: isDialogsLoading && dialogs.length > 0,
-                                  onLoadMore: () => {
-                                    void loadMoreDialogs();
+                              historySearchable: !!mingoCaps.onSearchChange,
+                              dialogHistory: (
+                                // Keep the history (and its search bar) mounted during an
+                                // active search even at 0 results — otherwise a no-match
+                                // query would unmount the bar and flash the new-user
+                                // greeting. `MingoWelcome` renders `dialogHistory` with top
+                                // priority, so this wins over the greeting.
+                                dialogs.length > 0 || !!mingoCaps.searchQuery ? /* @__PURE__ */ jsx326(
+                                  MingoChatHistory,
+                                  {
+                                    dialogs,
+                                    onSelectDialog: handleSelectDialog,
+                                    onRequestRename: mingoCaps.canRename ? setRenameTarget : void 0,
+                                    onRequestArchive: mingoCaps.canArchive ? setArchiveTarget : void 0,
+                                    searchQuery: mingoCaps.searchQuery,
+                                    onSearchChange: mingoCaps.onSearchChange,
+                                    hasMore: hasMoreDialogs,
+                                    isLoadingMore: isDialogsLoading && dialogs.length > 0,
+                                    onLoadMore: () => {
+                                      void loadMoreDialogs();
+                                    }
                                   }
-                                }
-                              ) : void 0
+                                ) : void 0
+                              )
                             }
                           )
                         ) : (
@@ -49516,4 +49571,4 @@ export {
   LogsList,
   assets
 };
-//# sourceMappingURL=chunk-TPJJJ6KC.js.map
+//# sourceMappingURL=chunk-MQHD6CTN.js.map