@assistant-ui/react 0.0.1

package/dist/index.js

@@ -0,0 +1,874 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  ActionBar: () => actionBar_exports,
+  BranchPicker: () => branchPicker_exports,
+  Composer: () => composer_exports,
+  EditBar: () => editBar_exports,
+  Message: () => message_exports,
+  Thread: () => thread_exports,
+  unstable_useMessageContext: () => useMessageContext
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/primitives/thread/index.ts
+var thread_exports = {};
+__export(thread_exports, {
+  Empty: () => ThreadEmpty,
+  If: () => ThreadIf,
+  Messages: () => ThreadMessages,
+  Provider: () => ThreadProvider,
+  Root: () => ThreadRoot,
+  Viewport: () => ThreadViewport
+});
+
+// src/utils/hooks/useBranches.tsx
+var import_react = require("react");
+var ROOT_ID = "__ROOT_ID__";
+var UPCOMING_MESSAGE_ID = "__UPCOMING_MESSAGE_ID__";
+var updateBranchData = (data, messages) => {
+  for (let i = 0; i < messages.length; i++) {
+    const child = messages[i];
+    const childId = child.id;
+    const parentId = messages[i - 1]?.id ?? ROOT_ID;
+    data.parentMap.set(childId, parentId);
+    let parentArray = data.branchMap.get(parentId);
+    if (!parentArray) {
+      data.branchMap.set(parentId, [childId]);
+    } else if (!parentArray.includes(childId)) {
+      parentArray.push(childId);
+    }
+    data.snapshots.set(childId, messages);
+  }
+};
+var getParentId = (data, messages, message) => {
+  if (message.id === UPCOMING_MESSAGE_ID) {
+    const parent = messages.at(-1);
+    if (!parent)
+      return ROOT_ID;
+    return parent.id;
+  }
+  const parentId = data.parentMap.get(message.id);
+  if (!parentId)
+    throw new Error("Unexpected: Message parent not found");
+  return parentId;
+};
+var getBranchStateImpl = (data, messages, message) => {
+  const parentId = getParentId(data, messages, message);
+  const branches = data.branchMap.get(parentId) ?? [];
+  const branchId = message.id === UPCOMING_MESSAGE_ID ? branches.length : branches.indexOf(message.id);
+  if (branchId === -1)
+    throw new Error("Unexpected: Message not found in parent children");
+  const upcomingOffset = message.id === UPCOMING_MESSAGE_ID ? 1 : 0;
+  return {
+    branchId,
+    branchCount: branches.length + upcomingOffset
+  };
+};
+var switchToBranchImpl = (data, messages, message, branchId) => {
+  const parentId = getParentId(data, messages, message);
+  const branches = data.branchMap.get(parentId);
+  if (!branches)
+    throw new Error("Unexpected: Parent children not found");
+  const newMessageId = branches[branchId];
+  if (!newMessageId)
+    throw new Error("Unexpected: Requested branch not found");
+  if (branchId < 0 || branchId >= branches.length)
+    throw new Error("Switch to branch called with a branch index out of range");
+  if (newMessageId === message.id)
+    return messages;
+  const snapshot = data.snapshots.get(newMessageId);
+  if (!snapshot)
+    throw new Error("Unexpected: Branch snapshot not found");
+  return snapshot;
+};
+var sliceMessagesUntil = (messages, message) => {
+  if (message.id === UPCOMING_MESSAGE_ID)
+    return messages;
+  const messageIdx = messages.findIndex((m) => m.id === message.id);
+  if (messageIdx === -1)
+    throw new Error("Unexpected: Message not found");
+  return messages.slice(0, messageIdx);
+};
+var useChatWithBranches = (chat) => {
+  const data = (0, import_react.useRef)({
+    parentMap: /* @__PURE__ */ new Map(),
+    branchMap: /* @__PURE__ */ new Map(),
+    snapshots: /* @__PURE__ */ new Map()
+  }).current;
+  updateBranchData(data, chat.messages);
+  const getBranchState = (0, import_react.useCallback)(
+    (message) => {
+      return getBranchStateImpl(data, chat.messages, message);
+    },
+    [chat.messages]
+  );
+  const switchToBranch = (0, import_react.useCallback)(
+    (message, branchId) => {
+      const newMessages = switchToBranchImpl(
+        data,
+        chat.messages,
+        message,
+        branchId
+      );
+      chat.setMessages(newMessages);
+    },
+    [chat.messages, chat.setMessages]
+  );
+  const reloadAt = (0, import_react.useCallback)(
+    async (message) => {
+      const newMessages = sliceMessagesUntil(chat.messages, message);
+      chat.setMessages(newMessages);
+      await chat.reload();
+    },
+    [chat.messages, chat.setMessages, chat.reload]
+  );
+  const editAt = (0, import_react.useCallback)(
+    async (message, newMessage) => {
+      const newMessages = sliceMessagesUntil(chat.messages, message);
+      chat.setMessages(newMessages);
+      await chat.append(newMessage);
+    },
+    [chat.messages, chat.setMessages, chat.append]
+  );
+  return (0, import_react.useMemo)(
+    () => ({
+      ...chat,
+      getBranchState,
+      switchToBranch,
+      editAt,
+      reloadAt
+    }),
+    [chat, getBranchState, switchToBranch, editAt, reloadAt]
+  );
+};
+
+// src/utils/context/createStoreContext.tsx
+var import_react2 = require("react");
+var import_with_selector = require("use-sync-external-store/with-selector");
+
+// src/utils/context/shallow.ts
+function shallow(objA, objB) {
+  if (Object.is(objA, objB)) {
+    return true;
+  }
+  if (typeof objA !== "object" || objA === null || typeof objB !== "object" || objB === null) {
+    return false;
+  }
+  const keysA = Object.keys(objA);
+  if (keysA.length !== Object.keys(objB).length) {
+    return false;
+  }
+  for (const keyA of keysA) {
+    if (!Object.prototype.hasOwnProperty.call(objB, keyA) || !Object.is(objA[keyA], objB[keyA])) {
+      return false;
+    }
+  }
+  return true;
+}
+
+// src/utils/context/createStoreContext.tsx
+var createStoreContext = (providerName) => {
+  const context = (0, import_react2.createContext)(null);
+  const StoreProvider = ({ children, ...rest }) => {
+    const unstableContext = rest;
+    const [store] = (0, import_react2.useState)(() => {
+      let state = unstableContext;
+      const listeners = /* @__PURE__ */ new Set();
+      return {
+        subscribe: (cb) => {
+          listeners.add(cb);
+          return () => listeners.delete(cb);
+        },
+        emit: () => {
+          listeners.forEach((l) => l());
+        },
+        snapshot: () => {
+          return state;
+        },
+        setState: (value) => {
+          state = value;
+          store.emit();
+        }
+      };
+    });
+    (0, import_react2.useMemo)(
+      () => store.setState(unstableContext),
+      Object.values(unstableContext)
+    );
+    return /* @__PURE__ */ React.createElement(context.Provider, { value: store }, children);
+  };
+  const useStoreContext = (consumerName, selector) => {
+    const store = (0, import_react2.useContext)(context);
+    if (!store)
+      throw new Error(
+        `${consumerName} can only be used inside ${providerName}.`
+      );
+    return (0, import_with_selector.useSyncExternalStoreWithSelector)(
+      store.subscribe,
+      store.snapshot,
+      store.snapshot,
+      selector,
+      shallow
+    );
+  };
+  return [StoreProvider, useStoreContext];
+};
+
+// src/utils/context/ThreadContext.ts
+var [ThreadContextProvider, useThreadContext] = createStoreContext("Thread.Provider");
+
+// src/primitives/thread/ThreadProvider.tsx
+var ThreadProvider = ({ chat, children }) => {
+  const branches = useChatWithBranches(chat);
+  return /* @__PURE__ */ React.createElement(ThreadContextProvider, { chat: branches }, children);
+};
+
+// src/primitives/thread/ThreadRoot.tsx
+var import_react3 = require("react");
+var import_react_primitive = require("@radix-ui/react-primitive");
+var ThreadRoot = (0, import_react3.forwardRef)(
+  (props, ref) => {
+    return /* @__PURE__ */ React.createElement(import_react_primitive.Primitive.div, { ...props, ref });
+  }
+);
+
+// src/primitives/thread/ThreadIf.tsx
+var useThreadIf = (props) => {
+  return useThreadContext("Thread.If", (s) => {
+    const thread = s.chat;
+    if (props.empty === true && thread.messages.length !== 0)
+      return false;
+    if (props.empty === false && thread.messages.length === 0)
+      return false;
+    if (props.busy === true && !thread.isLoading)
+      return false;
+    if (props.busy === false && thread.isLoading)
+      return false;
+    return true;
+  });
+};
+var ThreadIf = ({ children, ...query }) => {
+  const result = useThreadIf(query);
+  return result ? children : null;
+};
+
+// src/primitives/thread/ThreadEmpty.tsx
+var ThreadEmpty = ({ children }) => {
+  return /* @__PURE__ */ React.createElement(ThreadIf, { empty: true }, children);
+};
+
+// src/primitives/thread/ThreadViewport.tsx
+var import_react5 = require("react");
+var import_react_primitive2 = require("@radix-ui/react-primitive");
+var import_react_compose_refs = require("@radix-ui/react-compose-refs");
+var import_primitive = require("@radix-ui/primitive");
+
+// src/utils/hooks/useOnResizeContent.tsx
+var import_react4 = require("react");
+var useOnResizeContent = (ref, callback) => {
+  const callbackRef = (0, import_react4.useRef)(callback);
+  callbackRef.current = callback;
+  (0, import_react4.useLayoutEffect)(() => {
+    const el = ref.current;
+    if (!el)
+      return;
+    const resizeObserver = new ResizeObserver(() => {
+      callbackRef.current();
+    });
+    const mutationObserver = new MutationObserver((mutations) => {
+      mutations.forEach((mutation) => {
+        mutation.addedNodes.forEach((node) => {
+          if (node instanceof HTMLElement) {
+            resizeObserver.observe(node);
+          }
+        });
+        mutation.removedNodes.forEach((node) => {
+          if (node instanceof HTMLElement) {
+            resizeObserver.unobserve(node);
+          }
+        });
+      });
+      callbackRef.current();
+    });
+    mutationObserver.observe(el, { childList: true });
+    return () => {
+      resizeObserver.disconnect();
+      mutationObserver.disconnect();
+    };
+  }, []);
+};
+
+// src/primitives/thread/ThreadViewport.tsx
+var ThreadViewport = (0, import_react5.forwardRef)(({ onScroll, children, ...rest }, forwardedRef) => {
+  const divRef = (0, import_react5.useRef)(null);
+  const ref = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, divRef);
+  const [isAtBottom, setIsAtBottom] = (0, import_react5.useState)(true);
+  useOnResizeContent(divRef, () => {
+    const div = divRef.current;
+    if (!div || !isAtBottom)
+      return;
+    div.scrollTop = div.scrollHeight;
+  });
+  const handleScroll = () => {
+    const div = divRef.current;
+    if (!div)
+      return;
+    setIsAtBottom(div.scrollHeight - div.scrollTop <= div.clientHeight);
+  };
+  return /* @__PURE__ */ React.createElement(
+    import_react_primitive2.Primitive.div,
+    {
+      ...rest,
+      onScroll: (0, import_primitive.composeEventHandlers)(onScroll, handleScroll),
+      ref
+    },
+    children
+  );
+});
+
+// src/primitives/message/index.ts
+var message_exports = {};
+__export(message_exports, {
+  Content: () => MessageContent,
+  EditableContent: () => MessageEditableContent,
+  If: () => MessageIf,
+  Provider: () => MessageProvider,
+  Root: () => MessageRoot
+});
+
+// src/primitives/message/MessageProvider.tsx
+var import_react6 = require("react");
+
+// src/utils/context/MessageContext.ts
+var [MessageContextProvider, useMessageContext] = createStoreContext("Thread.Provider");
+
+// src/primitives/message/MessageProvider.tsx
+var MessageProvider = ({
+  message,
+  children
+}) => {
+  const getBranchState = useThreadContext(
+    "Message.Provider",
+    (s) => s.chat.getBranchState
+  );
+  const [editState, setEditState] = (0, import_react6.useState)({
+    isEditing: false
+  });
+  const [isCopied, setIsCopied] = (0, import_react6.useState)(false);
+  const [isHovering, setIsHovering] = (0, import_react6.useState)(false);
+  const branchState = (0, import_react6.useMemo)(
+    () => getBranchState(message),
+    [getBranchState, message]
+  );
+  return /* @__PURE__ */ React.createElement(
+    MessageContextProvider,
+    {
+      message,
+      editState,
+      setEditState,
+      branchState,
+      isCopied,
+      setIsCopied,
+      isHovering,
+      setIsHovering
+    },
+    children
+  );
+};
+
+// src/primitives/message/MessageRoot.tsx
+var import_react7 = require("react");
+var import_react_primitive3 = require("@radix-ui/react-primitive");
+var import_primitive2 = require("@radix-ui/primitive");
+var MessageRoot = (0, import_react7.forwardRef)(
+  ({ onMouseEnter, onMouseLeave, ...rest }, ref) => {
+    const setIsHovering = useMessageContext(
+      "Message.Root",
+      (s) => s.setIsHovering
+    );
+    const handleMouseEnter = () => {
+      setIsHovering(true);
+    };
+    const handleMouseLeave = () => {
+      setIsHovering(false);
+    };
+    return /* @__PURE__ */ React.createElement(
+      import_react_primitive3.Primitive.div,
+      {
+        ...rest,
+        ref,
+        onMouseEnter: (0, import_primitive2.composeEventHandlers)(onMouseEnter, handleMouseEnter),
+        onMouseLeave: (0, import_primitive2.composeEventHandlers)(onMouseLeave, handleMouseLeave)
+      }
+    );
+  }
+);
+
+// src/primitives/message/MessageIf.tsx
+var useMessageIf = (props) => {
+  const thread = useThreadContext("Message.If", (s) => s.chat);
+  return useMessageContext(
+    "Message.If",
+    ({ message, editState: { isEditing }, isCopied, isHovering }) => {
+      const { branchCount } = thread.getBranchState(message);
+      if (props.hasBranches === true && branchCount < 2)
+        return false;
+      if (props.user && message.role !== "user")
+        return false;
+      if (props.assistant && message.role !== "assistant")
+        return false;
+      if (props.editing === true && !isEditing)
+        return false;
+      if (props.editing === false && isEditing)
+        return false;
+      if (props.unstable_hoveringOrLast === true && !isHovering && thread.messages[thread.messages.length - 1]?.id !== message.id)
+        return false;
+      if (props.copied === true && !isCopied)
+        return false;
+      if (props.copied === false && isCopied)
+        return false;
+      return true;
+    }
+  );
+};
+var MessageIf = ({ children, ...query }) => {
+  const result = useMessageIf(query);
+  return result ? children : null;
+};
+
+// src/primitives/message/MessageContent.tsx
+var MessageContent = () => {
+  const content = useMessageContext(
+    "Message.Content",
+    (s) => s.message.content
+  );
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, content);
+};
+
+// src/primitives/message/MessageEditableContent.tsx
+var import_react_compose_refs2 = require("@radix-ui/react-compose-refs");
+var import_react9 = require("react");
+
+// src/utils/hooks/useAutosize.tsx
+var import_react8 = require("react");
+var useAutosize = (ref) => {
+  const el = ref.current;
+  (0, import_react8.useLayoutEffect)(() => {
+    const el2 = ref.current;
+    if (!el2)
+      return;
+    const callback = () => {
+      el2.style.height = "0px";
+      el2.style.height = el2.scrollHeight + "px";
+    };
+    el2.addEventListener("input", callback);
+    callback();
+    return () => {
+      el2.removeEventListener("input", callback);
+    };
+  }, [ref, el]);
+};
+
+// src/primitives/message/MessageEditableContent.tsx
+var import_primitive3 = require("@radix-ui/primitive");
+var MessageEditableContent = (0, import_react9.forwardRef)(({ onChange, value, ...rest }, forwardedRef) => {
+  const textareaRef = (0, import_react9.useRef)(null);
+  const ref = (0, import_react_compose_refs2.useComposedRefs)(forwardedRef, textareaRef);
+  useAutosize(textareaRef);
+  const [editState, setEditState] = useMessageContext(
+    "Message.EditableContent",
+    (s) => [s.editState, s.setEditState]
+  );
+  const handleChange = (e) => {
+    setEditState({ isEditing: true, value: e.target.value });
+  };
+  if (!editState.isEditing)
+    throw new Error(
+      "Message.EditableContent may only be rendered when edit mode is enabled. Consider wrapping the component in <Message.If editing>."
+    );
+  return /* @__PURE__ */ React.createElement(
+    "textarea",
+    {
+      ...rest,
+      ref,
+      onChange: (0, import_primitive3.composeEventHandlers)(onChange, handleChange),
+      value: editState.value || value
+    }
+  );
+});
+
+// src/primitives/thread/ThreadMessages.tsx
+var ThreadMessages = ({
+  components: { Message }
+}) => {
+  const chat = useThreadContext("Thread.Messages", (s) => s.chat);
+  const messages = chat.messages;
+  if (messages.length === 0)
+    return null;
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, messages.map((message, index) => {
+    return /* @__PURE__ */ React.createElement(MessageProvider, { key: index, message }, /* @__PURE__ */ React.createElement(Message, null));
+  }), chat.isLoading && chat.messages[chat.messages.length - 1]?.role !== "assistant" && /* @__PURE__ */ React.createElement(
+    MessageProvider,
+    {
+      message: {
+        id: UPCOMING_MESSAGE_ID,
+        role: "assistant",
+        content: "..."
+      }
+    },
+    /* @__PURE__ */ React.createElement(Message, null)
+  ));
+};
+
+// src/primitives/composer/index.ts
+var composer_exports = {};
+__export(composer_exports, {
+  Input: () => ComposerInput,
+  Root: () => ComposerRoot,
+  Send: () => ComposerSend,
+  Stop: () => ComposerStop
+});
+
+// src/primitives/composer/ComposerRoot.tsx
+var import_react10 = require("react");
+var import_react_primitive4 = require("@radix-ui/react-primitive");
+var import_primitive4 = require("@radix-ui/primitive");
+var import_react_compose_refs3 = require("@radix-ui/react-compose-refs");
+var ComposerContext = (0, import_react10.createContext)(null);
+var useComposerContext = () => {
+  const context = (0, import_react10.useContext)(ComposerContext);
+  if (!context) {
+    throw new Error(
+      "Composer compound components cannot be rendered outside the Composer component"
+    );
+  }
+  return context;
+};
+var ComposerRoot = (0, import_react10.forwardRef)(
+  ({ onSubmit, ...rest }, forwardedRef) => {
+    const handleSubmit = useThreadContext(
+      "Composer.Root",
+      (s) => s.chat.handleSubmit
+    );
+    const formRef = (0, import_react10.useRef)(null);
+    const ref = (0, import_react_compose_refs3.useComposedRefs)(forwardedRef, formRef);
+    const composerContextValue = (0, import_react10.useMemo)(
+      () => ({
+        submit: () => formRef.current?.dispatchEvent(
+          new Event("submit", { cancelable: true, bubbles: true })
+        )
+      }),
+      []
+    );
+    return /* @__PURE__ */ React.createElement(ComposerContext.Provider, { value: composerContextValue }, /* @__PURE__ */ React.createElement(
+      import_react_primitive4.Primitive.form,
+      {
+        ...rest,
+        ref,
+        onSubmit: (0, import_primitive4.composeEventHandlers)(onSubmit, handleSubmit)
+      }
+    ));
+  }
+);
+
+// src/primitives/composer/ComposerInput.tsx
+var import_react11 = require("react");
+var import_react_slot = require("@radix-ui/react-slot");
+var import_primitive5 = require("@radix-ui/primitive");
+var import_react_compose_refs4 = require("@radix-ui/react-compose-refs");
+var ComposerInput = (0, import_react11.forwardRef)(({ asChild, onChange, onKeyDown, ...rest }, forwardedRef) => {
+  const chat = useThreadContext(
+    "Composer.Input",
+    ({ chat: { input, handleInputChange, isLoading } }) => ({
+      input,
+      handleInputChange,
+      isLoading
+    })
+  );
+  const Component = asChild ? import_react_slot.Slot : "textarea";
+  const textareaRef = (0, import_react11.useRef)(null);
+  const ref = (0, import_react_compose_refs4.useComposedRefs)(forwardedRef, textareaRef);
+  useAutosize(textareaRef);
+  const composer = useComposerContext();
+  const handleKeyPress = (e) => {
+    if (chat.isLoading || rest.disabled)
+      return;
+    if (e.key === "Enter" && e.shiftKey == false) {
+      e.preventDefault();
+      composer.submit();
+    }
+  };
+  return /* @__PURE__ */ React.createElement(
+    Component,
+    {
+      value: chat.input,
+      ...rest,
+      ref,
+      onChange: (0, import_primitive5.composeEventHandlers)(onChange, chat.handleInputChange),
+      onKeyDown: (0, import_primitive5.composeEventHandlers)(onKeyDown, handleKeyPress)
+    }
+  );
+});
+
+// src/primitives/composer/ComposerSend.tsx
+var import_react12 = require("react");
+var import_react_primitive5 = require("@radix-ui/react-primitive");
+var ComposerSend = (0, import_react12.forwardRef)(
+  ({ disabled, ...rest }, ref) => {
+    const input = useThreadContext("Composer.Send", (s) => s.chat.input);
+    return /* @__PURE__ */ React.createElement(
+      import_react_primitive5.Primitive.button,
+      {
+        type: "submit",
+        ...rest,
+        ref,
+        disabled: disabled || input.length === 0
+      }
+    );
+  }
+);
+
+// src/utils/createActionButton.tsx
+var import_react13 = require("react");
+var import_react_primitive6 = require("@radix-ui/react-primitive");
+var import_primitive6 = require("@radix-ui/primitive");
+var createActionButton = (useActionButton) => {
+  return (0, import_react13.forwardRef)(
+    (props, forwardedRef) => {
+      const onClick = useActionButton(props);
+      return /* @__PURE__ */ React.createElement(
+        import_react_primitive6.Primitive.button,
+        {
+          type: "button",
+          disabled: !onClick,
+          ...props,
+          ref: forwardedRef,
+          onClick: (0, import_primitive6.composeEventHandlers)(props.onClick, onClick ?? void 0)
+        }
+      );
+    }
+  );
+};
+
+// src/primitives/composer/ComposerStop.tsx
+var useComposerStop = () => {
+  const [isLoading, stop] = useThreadContext("Composer.Stop", (s) => [
+    s.chat.isLoading,
+    s.chat.stop
+  ]);
+  if (!isLoading)
+    return null;
+  return stop;
+};
+var ComposerStop = createActionButton(useComposerStop);
+
+// src/primitives/branchPicker/index.ts
+var branchPicker_exports = {};
+__export(branchPicker_exports, {
+  Count: () => BranchPickerCount,
+  Next: () => BranchPickerNext,
+  Number: () => BranchPickerNumber,
+  Previous: () => BranchPickerPrevious,
+  Root: () => BranchPickerRoot
+});
+
+// src/primitives/branchPicker/BranchPickerNext.tsx
+var useBranchPickerNext = () => {
+  const switchToBranch = useThreadContext(
+    "BranchPicker.Next",
+    (s) => s.chat.switchToBranch
+  );
+  const [message, { branchId, branchCount }] = useMessageContext(
+    "BranchPicker.Next",
+    (s) => [s.message, s.branchState]
+  );
+  if (branchCount <= 1 || branchId + 1 >= branchCount)
+    return null;
+  return () => {
+    switchToBranch(message, branchId + 1);
+  };
+};
+var BranchPickerNext = createActionButton(useBranchPickerNext);
+
+// src/primitives/branchPicker/BranchPickerPrevious.tsx
+var useBranchPickerPrevious = () => {
+  const switchToBranch = useThreadContext(
+    "BranchPicker.Previous",
+    (s) => s.chat.switchToBranch
+  );
+  const [message, { branchId, branchCount }] = useMessageContext(
+    "BranchPicker.Previous",
+    (s) => [s.message, s.branchState]
+  );
+  if (branchCount <= 1 || branchId <= 0)
+    return null;
+  return () => {
+    switchToBranch(message, branchId - 1);
+  };
+};
+var BranchPickerPrevious = createActionButton(useBranchPickerPrevious);
+
+// src/primitives/branchPicker/BranchPickerCount.tsx
+var BranchPickerCount = () => {
+  const branchCount = useMessageContext(
+    "BranchPicker.Count",
+    (s) => s.branchState.branchCount
+  );
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, branchCount);
+};
+
+// src/primitives/branchPicker/BranchPickerNumber.tsx
+var BranchPickerNumber = () => {
+  const branchId = useMessageContext(
+    "BranchPicker.Number",
+    (s) => s.branchState.branchId
+  );
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, branchId + 1);
+};
+
+// src/primitives/branchPicker/BranchPickerRoot.tsx
+var import_react14 = require("react");
+var import_react_primitive7 = require("@radix-ui/react-primitive");
+var BranchPickerRoot = (0, import_react14.forwardRef)(({ ...rest }, ref) => {
+  return /* @__PURE__ */ React.createElement(import_react_primitive7.Primitive.div, { ...rest, ref });
+});
+
+// src/primitives/actionBar/index.ts
+var actionBar_exports = {};
+__export(actionBar_exports, {
+  Copy: () => ActionBarCopy,
+  Edit: () => ActionBarEdit,
+  Reload: () => ActionBarReload,
+  Root: () => ActionBarRoot
+});
+
+// src/primitives/actionBar/ActionBarRoot.tsx
+var import_react15 = require("react");
+var import_react_primitive8 = require("@radix-ui/react-primitive");
+var ActionBarRoot = (0, import_react15.forwardRef)(
+  ({ ...rest }, ref) => {
+    return /* @__PURE__ */ React.createElement(import_react_primitive8.Primitive.div, { ...rest, ref });
+  }
+);
+
+// src/primitives/actionBar/ActionBarCopy.tsx
+var useActionBarCopy = ({ copiedDuration = 3e3 }) => {
+  const [messageContent, setIsCopied] = useMessageContext(
+    "ActionBar.Copy",
+    (s) => [s.message.content, s.setIsCopied]
+  );
+  return () => {
+    navigator.clipboard.writeText(messageContent);
+    setIsCopied(true);
+    setTimeout(() => setIsCopied(false), copiedDuration);
+  };
+};
+var ActionBarCopy = createActionButton(useActionBarCopy);
+
+// src/primitives/actionBar/ActionBarReload.tsx
+var useActionBarReload = () => {
+  const chat = useThreadContext("ActionBar.Reload", (s) => s.chat);
+  const message = useMessageContext("ActionBar.Reload", (s) => s.message);
+  if (message.role !== "assistant" || chat.isLoading)
+    return null;
+  return () => chat.reloadAt(message);
+};
+var ActionBarReload = createActionButton(useActionBarReload);
+
+// src/primitives/actionBar/ActionBarEdit.tsx
+var useActionBarEdit = () => {
+  const [editState, messageContent, setEditState] = useMessageContext(
+    "ActionBar.Edit",
+    (s) => [s.editState, s.message.content, s.setEditState]
+  );
+  if (editState.isEditing)
+    return null;
+  return () => {
+    setEditState({ isEditing: true, value: messageContent });
+  };
+};
+var ActionBarEdit = createActionButton(useActionBarEdit);
+
+// src/primitives/editBar/index.ts
+var editBar_exports = {};
+__export(editBar_exports, {
+  Cancel: () => EditBarCancel,
+  Root: () => EditBarRoot,
+  Save: () => EditBarSave
+});
+
+// src/primitives/editBar/EditBarRoot.tsx
+var import_react16 = require("react");
+var import_react_primitive9 = require("@radix-ui/react-primitive");
+var EditBarRoot = (0, import_react16.forwardRef)(
+  ({ ...rest }, ref) => {
+    return /* @__PURE__ */ React.createElement(import_react_primitive9.Primitive.div, { ...rest, ref });
+  }
+);
+
+// src/primitives/editBar/EditBarSave.tsx
+var useEditBarSave = () => {
+  const chat = useThreadContext("EditBar.Save", (s) => s.chat);
+  const [editState, message, setEditState] = useMessageContext(
+    "EditBar.Save",
+    (s) => [s.editState, s.message, s.setEditState]
+  );
+  if (!editState.isEditing)
+    return null;
+  return () => {
+    if (!editState.isEditing)
+      return;
+    chat.editAt(message, {
+      ...message,
+      id: void 0,
+      // remove id to create a new message
+      content: editState.value
+    });
+    setEditState({ isEditing: false });
+  };
+};
+var EditBarSave = createActionButton(useEditBarSave);
+
+// src/primitives/editBar/EditBarCancel.tsx
+var useEditBarCancel = () => {
+  const [isEditing, setEditState] = useMessageContext("EditBar.Cancel", (s) => [
+    s.editState.isEditing,
+    s.setEditState
+  ]);
+  if (!isEditing)
+    return null;
+  return () => {
+    setEditState({ isEditing: false });
+  };
+};
+var EditBarCancel = createActionButton(useEditBarCancel);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ActionBar,
+  BranchPicker,
+  Composer,
+  EditBar,
+  Message,
+  Thread,
+  unstable_useMessageContext
+});