rift-ds 1.7.0 → 1.9.0

package/chat/ChatProvider.js

@@ -0,0 +1,196 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useState, useMemo, useRef, useEffect, useCallback } from "react";
+import { MOTION_EXIT_SYNC_MS } from "../tokens/motion.js";
+import { createFeedbackPoster, isInternalPath, ChatWidgetContext } from "./context.js";
+import { createFollowupsFetcher, followupTarget, DEFAULT_FALLBACK_FOLLOWUPS, pickFallbackFollowups } from "./followups.js";
+import { useThreads } from "./threads.js";
+import { createFetchTransport } from "./transport.js";
+import { DEFAULT_PLACEHOLDER_COPY, useChat } from "./useChat.js";
+const defaultRenderLink = ({ href, children, onNavigate }) => /* @__PURE__ */ jsx("a", { href, onClick: onNavigate, children });
+function ChatProvider({
+  transport,
+  endpoint = "/api/chat",
+  defaultPlacement = "right",
+  followups = "/api/chat/followups",
+  fallbackFollowups = DEFAULT_FALLBACK_FOLLOWUPS,
+  feedback = "/api/chat/feedback",
+  renderers,
+  artifactRenderers,
+  renderLink = defaultRenderLink,
+  isInternalHref = isInternalPath,
+  threads: threadsOptions,
+  placeholders,
+  children
+}) {
+  const [chosenModel, setChosenModel] = useState(null);
+  const fallbackTransport = useMemo(
+    () => createFetchTransport(endpoint, { getModel: () => chosenModel }),
+    [endpoint, chosenModel]
+  );
+  const placeholderCopy = useMemo(
+    () => ({ ...DEFAULT_PLACEHOLDER_COPY, ...placeholders }),
+    [placeholders]
+  );
+  const chat = useChat(transport ?? fallbackTransport, placeholderCopy);
+  const threads = useThreads(chat, threadsOptions);
+  const followupsSource = useMemo(() => {
+    if (followups === false) return null;
+    return typeof followups === "string" ? createFollowupsFetcher(followups) : followups;
+  }, [followups]);
+  const { setTurnFollowups } = chat;
+  const target = useMemo(() => followupTarget(chat.turns), [chat.turns]);
+  const askedRef = useRef(/* @__PURE__ */ new Set());
+  const [freshFollowupsId, setFreshFollowupsId] = useState(null);
+  useEffect(() => {
+    if (!target || askedRef.current.has(target.id)) return;
+    askedRef.current.add(target.id);
+    const offer = (suggestions) => {
+      const offered = suggestions.length > 0 ? suggestions : pickFallbackFollowups(fallbackFollowups, target.id, target.question);
+      setTurnFollowups(target.id, offered);
+      setFreshFollowupsId(target.id);
+    };
+    if (!followupsSource) {
+      offer([]);
+      return;
+    }
+    void followupsSource(target.question, target.answer, AbortSignal.timeout(1e4)).catch(() => []).then(offer);
+  }, [target, setTurnFollowups, followupsSource, fallbackFollowups]);
+  const feedbackSink = useMemo(() => {
+    if (feedback === false) return null;
+    return typeof feedback === "string" ? createFeedbackPoster(feedback) : feedback;
+  }, [feedback]);
+  const { setTurnFeedback } = chat;
+  const submitFeedback = useMemo(
+    () => feedbackSink ? (turnId, exchangeId, verdict) => {
+      setTurnFeedback(turnId, verdict);
+      void feedbackSink(exchangeId, verdict).catch(() => {
+      });
+    } : null,
+    [feedbackSink, setTurnFeedback]
+  );
+  const [starterRevealKey, setStarterRevealKey] = useState(null);
+  const [starterSeed, setStarterSeed] = useState(() => Math.random());
+  const [artifact, setArtifact] = useState(null);
+  const openArtifact = useCallback((next) => setArtifact(next), []);
+  const closeArtifact = useCallback(() => setArtifact(null), []);
+  if (artifact && chat.turns.length === 0 && !chat.live) setArtifact(null);
+  const { reset: resetChat } = chat;
+  const reset = useCallback(() => {
+    resetChat();
+    setArtifact(null);
+    setStarterSeed(Math.random());
+    setStarterRevealKey(null);
+  }, [resetChat]);
+  const [open, setOpenState] = useState(false);
+  const [panelPhase, setPanelPhase] = useState("closed");
+  const closeTimer = useRef(null);
+  useEffect(
+    () => () => {
+      if (closeTimer.current) clearTimeout(closeTimer.current);
+    },
+    []
+  );
+  const setOpen = useCallback((next) => {
+    if (next) {
+      if (closeTimer.current) {
+        clearTimeout(closeTimer.current);
+        closeTimer.current = null;
+      }
+      setPanelPhase("open");
+      setOpenState(true);
+      return;
+    }
+    setFreshFollowupsId(null);
+    setOpenState(false);
+    setPanelPhase((phase) => phase === "open" ? "closing" : phase);
+    closeTimer.current = setTimeout(() => {
+      closeTimer.current = null;
+      setPanelPhase("closed");
+    }, MOTION_EXIT_SYNC_MS);
+  }, []);
+  const [view, setView] = useState("panel");
+  const [side, setSide] = useState(
+    defaultPlacement === "floating" ? "right" : defaultPlacement
+  );
+  const [floating, setFloating] = useState(defaultPlacement === "floating");
+  const placement = floating ? "floating" : side;
+  const setPlacement = useCallback((next) => {
+    if (next === "floating") {
+      setFloating(true);
+      return;
+    }
+    setFloating(false);
+    setSide(next);
+  }, []);
+  const [draft, setDraft] = useState("");
+  const returnFocusRef = useRef(null);
+  const toggleOpen = useCallback(() => setOpen(!open), [open, setOpen]);
+  const renderersValue = useMemo(() => renderers ?? {}, [renderers]);
+  const artifactRenderersValue = useMemo(() => artifactRenderers ?? {}, [artifactRenderers]);
+  const value = useMemo(
+    () => ({
+      ...chat,
+      reset,
+      chosenModel,
+      setChosenModel,
+      open,
+      setOpen,
+      toggleOpen,
+      panelPhase,
+      starterRevealKey,
+      setStarterRevealKey,
+      starterSeed,
+      freshFollowupsId,
+      view,
+      setView,
+      placement,
+      setPlacement,
+      side,
+      floating,
+      draft,
+      setDraft,
+      returnFocusRef,
+      threads,
+      renderers: renderersValue,
+      artifact,
+      openArtifact,
+      closeArtifact,
+      artifactRenderers: artifactRenderersValue,
+      renderLink,
+      isInternalHref,
+      submitFeedback
+    }),
+    [
+      chat,
+      reset,
+      chosenModel,
+      open,
+      setOpen,
+      toggleOpen,
+      panelPhase,
+      starterRevealKey,
+      starterSeed,
+      freshFollowupsId,
+      view,
+      placement,
+      setPlacement,
+      side,
+      floating,
+      draft,
+      threads,
+      renderersValue,
+      artifact,
+      openArtifact,
+      closeArtifact,
+      artifactRenderersValue,
+      renderLink,
+      isInternalHref,
+      submitFeedback
+    ]
+  );
+  return /* @__PURE__ */ jsx(ChatWidgetContext.Provider, { value, children });
+}
+export {
+  ChatProvider
+};

package/chat/ChatTabs.d.ts

@@ -0,0 +1,13 @@
+/**
+ * The built-in open-sessions strip: a ThreadTabs over the provider's
+ * thread lifecycle. Tabs hold thread ids; selecting one moves the rail's
+ * selection, the trailing plus is the same New chat as everywhere else, and
+ * closing the last tab lands back on the greeting. Renders nothing while no
+ * session is open: a bare plus over the greeting would be the header's pen
+ * restated.
+ */
+export interface ChatTabsProps {
+    /** Accessible name for the tab strip. */
+    ariaLabel?: string;
+}
+export declare function ChatTabs({ ariaLabel }: ChatTabsProps): import("react").JSX.Element | null;

package/chat/ChatTabs.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { ThreadTabs } from "../components/ThreadTabs/ThreadTabs.js";
+import { useChatWidget } from "./context.js";
+function ChatTabs({ ariaLabel = "Open chats" }) {
+  const { threads } = useChatWidget();
+  if (threads.tabs.length === 0) return null;
+  return /* @__PURE__ */ jsx(
+    ThreadTabs,
+    {
+      tabs: threads.tabs,
+      activeId: threads.activeThreadId || void 0,
+      onTabSelect: threads.select,
+      onTabClose: threads.closeTab,
+      onAdd: threads.startNew,
+      addLabel: threads.newThreadLabel,
+      closeLabel: "Close chat",
+      ariaLabel
+    }
+  );
+}
+export {
+  ChatTabs
+};

package/chat/ChatThreads.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+import { ThreadPanelProfile } from '../components/ThreadPanel/ThreadPanel';
+export interface ChatThreadsProps {
+    /** The widget seated the rail as a sheet over the conversation rather than beside it. */
+    overlay: boolean;
+    /** Closes the sheet; a no-op on the inline rail. */
+    close: () => void;
+    /** The brand row's mark, in both seats. */
+    logo?: ReactNode;
+    /** The brand row's text. Shown on the sheet by default, where the chat header is hidden behind it. */
+    logoText?: string;
+    /** The signed-in person, shown on the inline rail. */
+    profile?: ThreadPanelProfile;
+    /** Whether the inline rail can collapse to its icon strip. */
+    collapsible?: boolean;
+    /** Whether the rail starts collapsed. */
+    defaultExpanded?: boolean;
+    /** Accessible heading over the history. */
+    historyLabel?: string;
+}
+/**
+ * The built-in session-history rail: a ThreadPanel over the provider's
+ * thread lifecycle (`useThreads`). The widget seats it inline on a wide
+ * host and as a slide-over sheet on a narrow one, and tells it which.
+ */
+export declare function ChatThreads({ overlay, close, logo, logoText, profile, collapsible, defaultExpanded, historyLabel, }: ChatThreadsProps): import("react").JSX.Element;

package/chat/ChatThreads.js

@@ -0,0 +1,55 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { ThreadPanel } from "../components/ThreadPanel/ThreadPanel.js";
+import { useChatWidget } from "./context.js";
+function ChatThreads({
+  overlay,
+  close,
+  logo,
+  logoText,
+  profile,
+  collapsible = true,
+  defaultExpanded = false,
+  historyLabel = "Chat history"
+}) {
+  const { threads } = useChatWidget();
+  const [expanded, setExpanded] = useState(defaultExpanded);
+  const hasProjects = threads.projects.length > 0;
+  return /* @__PURE__ */ jsx(
+    ThreadPanel,
+    {
+      groups: threads.groups,
+      activeThreadId: threads.activeThreadId,
+      onThreadSelect: (id) => {
+        threads.select(id);
+        close();
+      },
+      onThreadAction: threads.runAction,
+      renamingThreadId: threads.renamingId ?? void 0,
+      onThreadRename: threads.rename,
+      onRenameCancel: () => threads.setRenamingId(null),
+      newThreadLabel: threads.newThreadLabel,
+      onNewThread: () => {
+        threads.startNew();
+        close();
+      },
+      historyLabel,
+      projects: hasProjects ? threads.projects : void 0,
+      activeProjectId: threads.activeProjectId,
+      onProjectSelect: (id) => {
+        threads.selectProject(id);
+        close();
+      },
+      onProjectCreate: hasProjects ? threads.createProject : void 0,
+      logo,
+      logoText: overlay ? logoText : void 0,
+      expanded: overlay || !collapsible ? true : expanded,
+      onExpandedChange: overlay || !collapsible ? void 0 : setExpanded,
+      profile: overlay ? void 0 : profile
+    }
+  );
+}
+export {
+  ChatThreads
+};