@harbinger-ai/harbinger 0.1.0

package/lib/chat/components/ui/confirm-dialog.js

@@ -0,0 +1,53 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+import { cn } from "../../utils.js";
+function ConfirmDialog({ open, onConfirm, onCancel, title, description, confirmLabel = "Delete", cancelLabel = "Cancel", variant = "destructive" }) {
+  const cancelRef = useRef(null);
+  useEffect(() => {
+    if (open && cancelRef.current) {
+      cancelRef.current.focus();
+    }
+  }, [open]);
+  useEffect(() => {
+    if (!open) return;
+    const handleEsc = (e) => {
+      if (e.key === "Escape") onCancel();
+    };
+    document.addEventListener("keydown", handleEsc);
+    return () => document.removeEventListener("keydown", handleEsc);
+  }, [open, onCancel]);
+  if (!open) return null;
+  return /* @__PURE__ */ jsxs("div", { className: "fixed inset-0 z-50 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-black/50", onClick: onCancel }),
+    /* @__PURE__ */ jsxs("div", { className: "relative z-50 w-full max-w-sm rounded-lg border border-border bg-background p-6 shadow-lg", onClick: (e) => e.stopPropagation(), children: [
+      /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold", children: title }),
+      description && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: description }),
+      /* @__PURE__ */ jsxs("div", { className: "mt-4 flex justify-end gap-2", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            ref: cancelRef,
+            onClick: onCancel,
+            className: "rounded-md px-3 py-1.5 text-sm font-medium border border-input bg-background hover:bg-muted",
+            children: cancelLabel
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: onConfirm,
+            className: cn(
+              "rounded-md px-3 py-1.5 text-sm font-medium text-white",
+              variant === "destructive" ? "bg-destructive hover:bg-destructive/90" : "bg-foreground hover:bg-foreground/90"
+            ),
+            children: confirmLabel
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+export {
+  ConfirmDialog
+};

package/lib/chat/components/ui/confirm-dialog.jsx

@@ -0,0 +1,57 @@
+'use client';
+
+import { useEffect, useRef } from 'react';
+import { cn } from '../../utils.js';
+
+export function ConfirmDialog({ open, onConfirm, onCancel, title, description, confirmLabel = 'Delete', cancelLabel = 'Cancel', variant = 'destructive' }) {
+  const cancelRef = useRef(null);
+
+  useEffect(() => {
+    if (open && cancelRef.current) {
+      cancelRef.current.focus();
+    }
+  }, [open]);
+
+  useEffect(() => {
+    if (!open) return;
+    const handleEsc = (e) => {
+      if (e.key === 'Escape') onCancel();
+    };
+    document.addEventListener('keydown', handleEsc);
+    return () => document.removeEventListener('keydown', handleEsc);
+  }, [open, onCancel]);
+
+  if (!open) return null;
+
+  return (
+    <div className="fixed inset-0 z-50 flex items-center justify-center">
+      <div className="fixed inset-0 bg-black/50" onClick={onCancel} />
+      <div className="relative z-50 w-full max-w-sm rounded-lg border border-border bg-background p-6 shadow-lg" onClick={(e) => e.stopPropagation()}>
+        <h3 className="text-lg font-semibold">{title}</h3>
+        {description && (
+          <p className="mt-2 text-sm text-muted-foreground">{description}</p>
+        )}
+        <div className="mt-4 flex justify-end gap-2">
+          <button
+            ref={cancelRef}
+            onClick={onCancel}
+            className="rounded-md px-3 py-1.5 text-sm font-medium border border-input bg-background hover:bg-muted"
+          >
+            {cancelLabel}
+          </button>
+          <button
+            onClick={onConfirm}
+            className={cn(
+              'rounded-md px-3 py-1.5 text-sm font-medium text-white',
+              variant === 'destructive'
+                ? 'bg-destructive hover:bg-destructive/90'
+                : 'bg-foreground hover:bg-foreground/90'
+            )}
+          >
+            {confirmLabel}
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}

package/lib/chat/components/ui/dropdown-menu.js

@@ -0,0 +1,98 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext, useState, useEffect, useRef } from "react";
+import { cn } from "../../utils.js";
+const DropdownContext = createContext({ open: false, onOpenChange: () => {
+} });
+function DropdownMenu({ children, open: controlledOpen, onOpenChange: controlledOnOpenChange }) {
+  const [internalOpen, setInternalOpen] = useState(false);
+  const open = controlledOpen !== void 0 ? controlledOpen : internalOpen;
+  const onOpenChange = controlledOnOpenChange || setInternalOpen;
+  return /* @__PURE__ */ jsx(DropdownContext.Provider, { value: { open, onOpenChange }, children: /* @__PURE__ */ jsx("div", { className: "relative inline-block", children }) });
+}
+function DropdownMenuTrigger({ children, asChild, ...props }) {
+  const { open, onOpenChange } = useContext(DropdownContext);
+  const handleClick = (e) => {
+    e.stopPropagation();
+    onOpenChange(!open);
+  };
+  if (asChild && children) {
+    return /* @__PURE__ */ jsx("span", { onClick: handleClick, ...props, children });
+  }
+  return /* @__PURE__ */ jsx("button", { onClick: handleClick, ...props, children });
+}
+function DropdownMenuContent({ children, className, align = "start", side = "bottom", sideOffset = 4, ...props }) {
+  const { open, onOpenChange } = useContext(DropdownContext);
+  const ref = useRef(null);
+  useEffect(() => {
+    if (!open) return;
+    const handleClickOutside = (e) => {
+      if (ref.current && !ref.current.contains(e.target)) {
+        onOpenChange(false);
+      }
+    };
+    const handleEsc = (e) => {
+      if (e.key === "Escape") onOpenChange(false);
+    };
+    setTimeout(() => document.addEventListener("click", handleClickOutside), 0);
+    document.addEventListener("keydown", handleEsc);
+    return () => {
+      document.removeEventListener("click", handleClickOutside);
+      document.removeEventListener("keydown", handleEsc);
+    };
+  }, [open, onOpenChange]);
+  if (!open) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "absolute z-50 min-w-[8rem] overflow-hidden rounded-md border border-border bg-background/80 backdrop-blur-sm p-1 text-foreground shadow-lg",
+        side === "bottom" && `top-full mt-1`,
+        side === "top" && `bottom-full mb-1`,
+        align === "end" && "right-0",
+        align === "start" && "left-0",
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+function DropdownMenuItem({ children, className, onClick, ...props }) {
+  const { onOpenChange } = useContext(DropdownContext);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "menuitem",
+      className: cn(
+        "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors hover:bg-background focus:bg-background",
+        className
+      ),
+      onClick: (e) => {
+        onClick?.(e);
+        onOpenChange(false);
+      },
+      ...props,
+      children
+    }
+  );
+}
+function DropdownMenuSeparator({ className }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("-mx-1 my-1 h-px bg-border", className) });
+}
+function DropdownMenuLabel({ children, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("px-2 py-1.5 text-sm font-semibold", className), children });
+}
+function DropdownMenuGroup({ children }) {
+  return /* @__PURE__ */ jsx("div", { children });
+}
+export {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger
+};

package/lib/chat/components/ui/dropdown-menu.jsx

@@ -0,0 +1,116 @@
+'use client';
+
+import { createContext, useContext, useState, useEffect, useRef } from 'react';
+import { cn } from '../../utils.js';
+
+const DropdownContext = createContext({ open: false, onOpenChange: () => {} });
+
+export function DropdownMenu({ children, open: controlledOpen, onOpenChange: controlledOnOpenChange }) {
+  const [internalOpen, setInternalOpen] = useState(false);
+  const open = controlledOpen !== undefined ? controlledOpen : internalOpen;
+  const onOpenChange = controlledOnOpenChange || setInternalOpen;
+
+  return (
+    <DropdownContext.Provider value={{ open, onOpenChange }}>
+      <div className="relative inline-block">{children}</div>
+    </DropdownContext.Provider>
+  );
+}
+
+export function DropdownMenuTrigger({ children, asChild, ...props }) {
+  const { open, onOpenChange } = useContext(DropdownContext);
+  const handleClick = (e) => {
+    e.stopPropagation();
+    onOpenChange(!open);
+  };
+  if (asChild && children) {
+    return (
+      <span onClick={handleClick} {...props}>
+        {children}
+      </span>
+    );
+  }
+  return (
+    <button onClick={handleClick} {...props}>
+      {children}
+    </button>
+  );
+}
+
+export function DropdownMenuContent({ children, className, align = 'start', side = 'bottom', sideOffset = 4, ...props }) {
+  const { open, onOpenChange } = useContext(DropdownContext);
+  const ref = useRef(null);
+
+  useEffect(() => {
+    if (!open) return;
+    const handleClickOutside = (e) => {
+      if (ref.current && !ref.current.contains(e.target)) {
+        onOpenChange(false);
+      }
+    };
+    const handleEsc = (e) => {
+      if (e.key === 'Escape') onOpenChange(false);
+    };
+    setTimeout(() => document.addEventListener('click', handleClickOutside), 0);
+    document.addEventListener('keydown', handleEsc);
+    return () => {
+      document.removeEventListener('click', handleClickOutside);
+      document.removeEventListener('keydown', handleEsc);
+    };
+  }, [open, onOpenChange]);
+
+  if (!open) return null;
+
+  return (
+    <div
+      ref={ref}
+      className={cn(
+        'absolute z-50 min-w-[8rem] overflow-hidden rounded-md border border-border bg-background/80 backdrop-blur-sm p-1 text-foreground shadow-lg',
+        side === 'bottom' && `top-full mt-1`,
+        side === 'top' && `bottom-full mb-1`,
+        align === 'end' && 'right-0',
+        align === 'start' && 'left-0',
+        className
+      )}
+      {...props}
+    >
+      {children}
+    </div>
+  );
+}
+
+export function DropdownMenuItem({ children, className, onClick, ...props }) {
+  const { onOpenChange } = useContext(DropdownContext);
+  return (
+    <div
+      role="menuitem"
+      className={cn(
+        'relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors hover:bg-background focus:bg-background',
+        className
+      )}
+      onClick={(e) => {
+        onClick?.(e);
+        onOpenChange(false);
+      }}
+      {...props}
+    >
+      {children}
+    </div>
+  );
+}
+
+export function DropdownMenuSeparator({ className }) {
+  return <div className={cn('-mx-1 my-1 h-px bg-border', className)} />;
+}
+
+export function DropdownMenuLabel({ children, className }) {
+  return (
+    <div className={cn('px-2 py-1.5 text-sm font-semibold', className)}>
+      {children}
+    </div>
+  );
+}
+
+export function DropdownMenuGroup({ children }) {
+  return <div>{children}</div>;
+}

package/lib/chat/components/ui/rename-dialog.js

@@ -0,0 +1,74 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useRef } from "react";
+function RenameDialog({ open, onSave, onCancel, title = "Rename chat", currentValue = "" }) {
+  const [value, setValue] = useState(currentValue);
+  const inputRef = useRef(null);
+  useEffect(() => {
+    if (open) {
+      setValue(currentValue);
+      setTimeout(() => {
+        if (inputRef.current) {
+          inputRef.current.focus();
+          inputRef.current.select();
+        }
+      }, 0);
+    }
+  }, [open, currentValue]);
+  useEffect(() => {
+    if (!open) return;
+    const handleEsc = (e) => {
+      if (e.key === "Escape") onCancel();
+    };
+    document.addEventListener("keydown", handleEsc);
+    return () => document.removeEventListener("keydown", handleEsc);
+  }, [open, onCancel]);
+  const handleSave = () => {
+    const trimmed = value.trim();
+    if (trimmed && trimmed !== currentValue) {
+      onSave(trimmed);
+    }
+    onCancel();
+  };
+  if (!open) return null;
+  return /* @__PURE__ */ jsxs("div", { className: "fixed inset-0 z-50 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-black/50", onClick: onCancel }),
+    /* @__PURE__ */ jsxs("div", { className: "relative z-50 w-full max-w-sm rounded-lg border border-border bg-background p-6 shadow-lg", onClick: (e) => e.stopPropagation(), children: [
+      /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold", children: title }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: inputRef,
+          type: "text",
+          value,
+          onChange: (e) => setValue(e.target.value),
+          onKeyDown: (e) => {
+            if (e.key === "Enter") handleSave();
+          },
+          className: "mt-3 w-full rounded-md border border-input bg-background px-3 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "mt-4 flex justify-end gap-2", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: onCancel,
+            className: "rounded-md px-3 py-1.5 text-sm font-medium border border-input bg-background hover:bg-muted",
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: handleSave,
+            className: "rounded-md px-3 py-1.5 text-sm font-medium text-white bg-foreground hover:bg-foreground/90",
+            children: "Save"
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+export {
+  RenameDialog
+};

package/lib/chat/components/ui/rename-dialog.jsx

@@ -0,0 +1,72 @@
+'use client';
+
+import { useState, useEffect, useRef } from 'react';
+
+export function RenameDialog({ open, onSave, onCancel, title = 'Rename chat', currentValue = '' }) {
+  const [value, setValue] = useState(currentValue);
+  const inputRef = useRef(null);
+
+  useEffect(() => {
+    if (open) {
+      setValue(currentValue);
+      setTimeout(() => {
+        if (inputRef.current) {
+          inputRef.current.focus();
+          inputRef.current.select();
+        }
+      }, 0);
+    }
+  }, [open, currentValue]);
+
+  useEffect(() => {
+    if (!open) return;
+    const handleEsc = (e) => {
+      if (e.key === 'Escape') onCancel();
+    };
+    document.addEventListener('keydown', handleEsc);
+    return () => document.removeEventListener('keydown', handleEsc);
+  }, [open, onCancel]);
+
+  const handleSave = () => {
+    const trimmed = value.trim();
+    if (trimmed && trimmed !== currentValue) {
+      onSave(trimmed);
+    }
+    onCancel();
+  };
+
+  if (!open) return null;
+
+  return (
+    <div className="fixed inset-0 z-50 flex items-center justify-center">
+      <div className="fixed inset-0 bg-black/50" onClick={onCancel} />
+      <div className="relative z-50 w-full max-w-sm rounded-lg border border-border bg-background p-6 shadow-lg" onClick={(e) => e.stopPropagation()}>
+        <h3 className="text-lg font-semibold">{title}</h3>
+        <input
+          ref={inputRef}
+          type="text"
+          value={value}
+          onChange={(e) => setValue(e.target.value)}
+          onKeyDown={(e) => {
+            if (e.key === 'Enter') handleSave();
+          }}
+          className="mt-3 w-full rounded-md border border-input bg-background px-3 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+        />
+        <div className="mt-4 flex justify-end gap-2">
+          <button
+            onClick={onCancel}
+            className="rounded-md px-3 py-1.5 text-sm font-medium border border-input bg-background hover:bg-muted"
+          >
+            Cancel
+          </button>
+          <button
+            onClick={handleSave}
+            className="rounded-md px-3 py-1.5 text-sm font-medium text-white bg-foreground hover:bg-foreground/90"
+          >
+            Save
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}

package/lib/chat/components/ui/scroll-area.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../utils.js";
+function ScrollArea({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("relative overflow-hidden", className), ...props, children: /* @__PURE__ */ jsx("div", { className: "h-full w-full overflow-y-auto scrollbar-thin", children }) });
+}
+function ScrollBar() {
+  return null;
+}
+export {
+  ScrollArea,
+  ScrollBar
+};

package/lib/chat/components/ui/scroll-area.jsx

@@ -0,0 +1,17 @@
+'use client';
+
+import { cn } from '../../utils.js';
+
+export function ScrollArea({ children, className, ...props }) {
+  return (
+    <div className={cn('relative overflow-hidden', className)} {...props}>
+      <div className="h-full w-full overflow-y-auto scrollbar-thin">
+        {children}
+      </div>
+    </div>
+  );
+}
+
+export function ScrollBar() {
+  return null;
+}

package/lib/chat/components/ui/separator.js

@@ -0,0 +1,21 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../utils.js";
+function Separator({ className, orientation = "horizontal", ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "separator",
+      "aria-orientation": orientation,
+      className: cn(
+        "shrink-0 bg-border",
+        orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+export {
+  Separator
+};

package/lib/chat/components/ui/separator.jsx

@@ -0,0 +1,18 @@
+'use client';
+
+import { cn } from '../../utils.js';
+
+export function Separator({ className, orientation = 'horizontal', ...props }) {
+  return (
+    <div
+      role="separator"
+      aria-orientation={orientation}
+      className={cn(
+        'shrink-0 bg-border',
+        orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',
+        className
+      )}
+      {...props}
+    />
+  );
+}

package/lib/chat/components/ui/sheet.js

@@ -0,0 +1,75 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createContext, useContext, useEffect } from "react";
+import { cn } from "../../utils.js";
+const SheetContext = createContext({ open: false, onOpenChange: () => {
+} });
+function Sheet({ children, open, onOpenChange }) {
+  return /* @__PURE__ */ jsx(SheetContext.Provider, { value: { open, onOpenChange }, children });
+}
+function SheetTrigger({ children, asChild, ...props }) {
+  const { onOpenChange } = useContext(SheetContext);
+  if (asChild && children) {
+    return /* @__PURE__ */ jsx("span", { onClick: () => onOpenChange(true), ...props, children });
+  }
+  return /* @__PURE__ */ jsx("button", { onClick: () => onOpenChange(true), ...props, children });
+}
+function SheetContent({ children, className, side = "left", ...props }) {
+  const { open, onOpenChange } = useContext(SheetContext);
+  useEffect(() => {
+    if (!open) return;
+    const handleEsc = (e) => {
+      if (e.key === "Escape") onOpenChange(false);
+    };
+    document.addEventListener("keydown", handleEsc);
+    return () => document.removeEventListener("keydown", handleEsc);
+  }, [open, onOpenChange]);
+  if (!open) return null;
+  return /* @__PURE__ */ jsxs("div", { className: "fixed inset-0 z-50", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "fixed inset-0 bg-black/50",
+        onClick: () => onOpenChange(false)
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "fixed z-50 bg-background shadow-lg transition-transform",
+          side === "left" && "inset-y-0 left-0 w-3/4 max-w-sm border-r border-border",
+          side === "right" && "inset-y-0 right-0 w-3/4 max-w-sm border-l border-border",
+          className
+        ),
+        ...props,
+        children
+      }
+    )
+  ] });
+}
+function SheetHeader({ children, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("flex flex-col space-y-2 p-4", className), children });
+}
+function SheetTitle({ children, className }) {
+  return /* @__PURE__ */ jsx("h2", { className: cn("text-lg font-semibold text-foreground", className), children });
+}
+function SheetDescription({ children, className }) {
+  return /* @__PURE__ */ jsx("p", { className: cn("text-sm text-muted-foreground", className), children });
+}
+function SheetClose({ children, asChild, ...props }) {
+  const { onOpenChange } = useContext(SheetContext);
+  if (asChild && children) {
+    return /* @__PURE__ */ jsx("span", { onClick: () => onOpenChange(false), ...props, children });
+  }
+  return /* @__PURE__ */ jsx("button", { onClick: () => onOpenChange(false), ...props, children });
+}
+export {
+  Sheet,
+  SheetClose,
+  SheetContent,
+  SheetDescription,
+  SheetHeader,
+  SheetTitle,
+  SheetTrigger
+};