@assistant-ui/react 0.5.53 → 0.5.55

Sign up to get free protection for your applications and to get access to all the features.
package/dist/index.mjs CHANGED
@@ -10,7 +10,7 @@ import {
10
10
  toLanguageModelMessages,
11
11
  toLanguageModelTools,
12
12
  toolResultStream
13
- } from "./chunk-ZQNZLTZL.mjs";
13
+ } from "./chunk-33TPUWEZ.mjs";
14
14
  import {
15
15
  __export
16
16
  } from "./chunk-BJPOCE4O.mjs";
@@ -22,52 +22,72 @@ import { memo } from "react";
22
22
  import { useEffect as useEffect4, useInsertionEffect as useInsertionEffect3, useRef as useRef2, useState as useState8 } from "react";
23
23
 
24
24
  // src/context/react/AssistantContext.ts
25
- import { createContext, useContext } from "react";
26
- var AssistantContext = createContext(
27
- null
28
- );
29
- function useAssistantContext(options) {
30
- const context = useContext(AssistantContext);
31
- if (!options?.optional && !context)
32
- throw new Error(
33
- "This component must be used within an AssistantRuntimeProvider."
34
- );
35
- return context;
25
+ import { createContext } from "react";
26
+
27
+ // src/context/react/utils/createContextHook.ts
28
+ import { useContext } from "react";
29
+ function createContextHook(context, providerName) {
30
+ function useContextHook(options) {
31
+ const contextValue = useContext(context);
32
+ if (!options?.optional && !contextValue) {
33
+ throw new Error(`This component must be used within ${providerName}.`);
34
+ }
35
+ return contextValue;
36
+ }
37
+ return useContextHook;
36
38
  }
37
39
 
38
- // src/context/stores/AssistantModelConfig.ts
39
- import { create } from "zustand";
40
-
41
- // src/utils/ProxyConfigProvider.ts
42
- var ProxyConfigProvider = class {
43
- _providers = /* @__PURE__ */ new Set();
44
- getModelConfig() {
45
- return mergeModelConfigs(this._providers);
40
+ // src/context/react/utils/createContextStoreHook.ts
41
+ function createContextStoreHook(contextHook, contextKey) {
42
+ function useStoreStoreHook(options) {
43
+ const context = contextHook(options);
44
+ if (!context) {
45
+ if (!options?.optional) {
46
+ throw new Error(`This component must be used within a ${contextKey}.`);
47
+ }
48
+ return null;
49
+ }
50
+ return context[contextKey];
46
51
  }
47
- registerModelConfigProvider(provider) {
48
- this._providers.add(provider);
49
- return () => {
50
- this._providers.delete(provider);
51
- };
52
+ function useStoreHook(param) {
53
+ let optional = false;
54
+ let selector;
55
+ if (typeof param === "function") {
56
+ selector = param;
57
+ } else if (param && typeof param === "object") {
58
+ optional = !!param.optional;
59
+ selector = param.selector;
60
+ }
61
+ const store = useStoreStoreHook({
62
+ optional
63
+ });
64
+ if (!store) return null;
65
+ return selector ? store(selector) : store();
52
66
  }
53
- };
67
+ return {
68
+ [contextKey]: useStoreHook,
69
+ [`${contextKey}Store`]: useStoreStoreHook
70
+ };
71
+ }
54
72
 
55
- // src/context/stores/AssistantModelConfig.ts
56
- var makeAssistantModelConfigStore = () => create(() => {
57
- const proxy = new ProxyConfigProvider();
58
- return Object.freeze({
59
- getModelConfig: () => {
60
- return proxy.getModelConfig();
61
- },
62
- registerModelConfigProvider: (provider) => {
63
- return proxy.registerModelConfigProvider(provider);
64
- }
65
- });
66
- });
73
+ // src/context/react/AssistantContext.ts
74
+ var AssistantContext = createContext(
75
+ null
76
+ );
77
+ var useAssistantContext = createContextHook(
78
+ AssistantContext,
79
+ "AssistantRuntimeProvider"
80
+ );
81
+ var { useAssistantRuntime, useAssistantRuntimeStore } = createContextStoreHook(useAssistantContext, "useAssistantRuntime");
82
+ var { useToolUIs, useToolUIsStore } = createContextStoreHook(
83
+ useAssistantContext,
84
+ "useToolUIs"
85
+ );
86
+ var { useAssistantActions, useAssistantActionsStore } = createContextStoreHook(useAssistantContext, "useAssistantActions");
67
87
 
68
88
  // src/context/stores/AssistantToolUIs.ts
69
- import { create as create2 } from "zustand";
70
- var makeAssistantToolUIsStore = () => create2((set) => {
89
+ import { create } from "zustand";
90
+ var makeAssistantToolUIsStore = () => create((set) => {
71
91
  const renderers = /* @__PURE__ */ new Map();
72
92
  return Object.freeze({
73
93
  getToolUI: (name) => {
@@ -101,24 +121,36 @@ var makeAssistantToolUIsStore = () => create2((set) => {
101
121
  import { useEffect as useEffect3, useInsertionEffect as useInsertionEffect2, useState as useState7 } from "react";
102
122
 
103
123
  // src/context/react/ThreadContext.ts
104
- import { createContext as createContext2, useContext as useContext2 } from "react";
124
+ import { createContext as createContext2 } from "react";
105
125
  var ThreadContext = createContext2(null);
106
- function useThreadContext(options) {
107
- const context = useContext2(ThreadContext);
108
- if (!options?.optional && !context)
109
- throw new Error(
110
- "This component must be used within an AssistantRuntimeProvider."
111
- );
112
- return context;
113
- }
114
-
115
- // src/context/stores/Composer.ts
116
- import { create as create3 } from "zustand";
117
- var makeComposerStore = (useThreadRuntime) => {
126
+ var useThreadContext = createContextHook(
127
+ ThreadContext,
128
+ "AssistantRuntimeProvider"
129
+ );
130
+ var { useThreadRuntime, useThreadRuntimeStore } = createContextStoreHook(useThreadContext, "useThreadRuntime");
131
+ var { useThread, useThreadStore } = createContextStoreHook(
132
+ useThreadContext,
133
+ "useThread"
134
+ );
135
+ var { useThreadMessages, useThreadMessagesStore } = createContextStoreHook(useThreadContext, "useThreadMessages");
136
+ var { useThreadActions, useThreadActionsStore } = createContextStoreHook(useThreadContext, "useThreadActions");
137
+ var {
138
+ useComposer: useThreadComposer,
139
+ useComposerStore: useThreadComposerStore
140
+ } = createContextStoreHook(useThreadContext, "useComposer");
141
+ var {
142
+ useViewport: useThreadViewport,
143
+ useViewportStore: useThreadViewportStore
144
+ } = createContextStoreHook(useThreadContext, "useViewport");
145
+
146
+ // src/context/stores/ThreadComposer.ts
147
+ import { create as create2 } from "zustand";
148
+ var makeThreadComposerStore = (useThreadRuntime2) => {
118
149
  const focusListeners = /* @__PURE__ */ new Set();
119
- return create3()((_, get) => {
120
- const runtime = useThreadRuntime.getState();
150
+ return create2()((_, get) => {
151
+ const runtime = useThreadRuntime2.getState();
121
152
  return {
153
+ type: "thread",
122
154
  get value() {
123
155
  return get().text;
124
156
  },
@@ -127,27 +159,27 @@ var makeComposerStore = (useThreadRuntime) => {
127
159
  },
128
160
  attachments: runtime.composer.attachments,
129
161
  addAttachment: (file) => {
130
- useThreadRuntime.getState().composer.addAttachment(file);
162
+ useThreadRuntime2.getState().composer.addAttachment(file);
131
163
  },
132
164
  removeAttachment: (attachmentId) => {
133
- useThreadRuntime.getState().composer.removeAttachment(attachmentId);
165
+ useThreadRuntime2.getState().composer.removeAttachment(attachmentId);
134
166
  },
135
167
  reset: () => {
136
- useThreadRuntime.getState().composer.reset();
168
+ useThreadRuntime2.getState().composer.reset();
137
169
  },
138
170
  text: runtime.composer.text,
139
171
  setText: (text) => {
140
- useThreadRuntime.getState().composer.setText(text);
172
+ useThreadRuntime2.getState().composer.setText(text);
141
173
  },
142
174
  canCancel: runtime.capabilities.cancel,
143
175
  isEditing: true,
144
176
  isEmpty: runtime.composer.isEmpty,
145
177
  send: () => {
146
- const runtime2 = useThreadRuntime.getState();
178
+ const runtime2 = useThreadRuntime2.getState();
147
179
  runtime2.composer.send();
148
180
  },
149
181
  cancel: () => {
150
- useThreadRuntime.getState().cancelRun();
182
+ useThreadRuntime2.getState().cancelRun();
151
183
  },
152
184
  focus: () => {
153
185
  for (const listener of focusListeners) {
@@ -165,7 +197,7 @@ var makeComposerStore = (useThreadRuntime) => {
165
197
  };
166
198
 
167
199
  // src/context/stores/Thread.ts
168
- import { create as create4 } from "zustand";
200
+ import { create as create3 } from "zustand";
169
201
  var getThreadStateFromRuntime = (runtime) => {
170
202
  const lastMessage = runtime.messages.at(-1);
171
203
  return Object.freeze({
@@ -177,14 +209,14 @@ var getThreadStateFromRuntime = (runtime) => {
177
209
  };
178
210
  var makeThreadStore = (runtimeRef) => {
179
211
  const runtime = runtimeRef.getState();
180
- return create4(() => getThreadStateFromRuntime(runtime));
212
+ return create3(() => getThreadStateFromRuntime(runtime));
181
213
  };
182
214
 
183
215
  // src/context/stores/ThreadViewport.tsx
184
- import { create as create5 } from "zustand";
216
+ import { create as create4 } from "zustand";
185
217
  var makeThreadViewportStore = () => {
186
218
  const scrollToBottomListeners = /* @__PURE__ */ new Set();
187
- return create5(() => ({
219
+ return create4(() => ({
188
220
  isAtBottom: true,
189
221
  scrollToBottom: () => {
190
222
  for (const listener of scrollToBottomListeners) {
@@ -201,9 +233,9 @@ var makeThreadViewportStore = () => {
201
233
  };
202
234
 
203
235
  // src/context/stores/ThreadActions.ts
204
- import { create as create6 } from "zustand";
236
+ import { create as create5 } from "zustand";
205
237
  var makeThreadActionStore = (runtimeStore) => {
206
- return create6(
238
+ return create5(
207
239
  () => Object.freeze({
208
240
  getBranches: (messageId) => runtimeStore.getState().getBranches(messageId),
209
241
  switchToBranch: (branchId) => runtimeStore.getState().switchToBranch(branchId),
@@ -217,15 +249,15 @@ var makeThreadActionStore = (runtimeStore) => {
217
249
  };
218
250
 
219
251
  // src/context/stores/ThreadMessages.ts
220
- import { create as create7 } from "zustand";
252
+ import { create as create6 } from "zustand";
221
253
  var makeThreadMessagesStore = (runtimeRef) => {
222
- return create7(() => runtimeRef.getState().messages);
254
+ return create6(() => runtimeRef.getState().messages);
223
255
  };
224
256
 
225
257
  // src/context/stores/ThreadRuntime.tsx
226
- import { create as create8 } from "zustand";
258
+ import { create as create7 } from "zustand";
227
259
  var makeThreadRuntimeStore = (runtime) => {
228
- return create8(() => runtime);
260
+ return create7(() => runtime);
229
261
  };
230
262
 
231
263
  // src/runtimes/core/subscribeToMainThread.ts
@@ -358,6 +390,20 @@ var ThreadRuntimeComposer = class {
358
390
  }
359
391
  };
360
392
 
393
+ // src/utils/ProxyConfigProvider.ts
394
+ var ProxyConfigProvider = class {
395
+ _providers = /* @__PURE__ */ new Set();
396
+ getModelConfig() {
397
+ return mergeModelConfigs(this._providers);
398
+ }
399
+ registerModelConfigProvider(provider) {
400
+ this._providers.add(provider);
401
+ return () => {
402
+ this._providers.delete(provider);
403
+ };
404
+ }
405
+ };
406
+
361
407
  // src/utils/idUtils.tsx
362
408
  import { customAlphabet } from "nanoid/non-secure";
363
409
  var generateId = customAlphabet(
@@ -609,26 +655,43 @@ var MessageRepository = class {
609
655
 
610
656
  // src/utils/smooth/useSmooth.tsx
611
657
  import { useEffect, useMemo, useRef, useState as useState2 } from "react";
658
+ import { useCallbackRef } from "@radix-ui/react-use-callback-ref";
612
659
 
613
660
  // src/utils/smooth/SmoothContext.tsx
614
661
  import {
615
- createContext as createContext3,
662
+ createContext as createContext4,
616
663
  forwardRef,
617
- useContext as useContext3,
664
+ useContext as useContext2,
618
665
  useState
619
666
  } from "react";
620
- import { create as create9 } from "zustand";
667
+ import { create as create8 } from "zustand";
668
+
669
+ // src/context/react/ContentPartContext.ts
670
+ import { createContext as createContext3 } from "react";
671
+ var ContentPartContext = createContext3(
672
+ null
673
+ );
674
+ var useContentPartContext = createContextHook(
675
+ ContentPartContext,
676
+ "a component passed to <MessagePrimitive.Content components={...}>"
677
+ );
678
+ var { useContentPart, useContentPartStore } = createContextStoreHook(
679
+ useContentPartContext,
680
+ "useContentPart"
681
+ );
682
+
683
+ // src/utils/smooth/SmoothContext.tsx
621
684
  import { jsx } from "react/jsx-runtime";
622
- var SmoothContext = createContext3(null);
685
+ var SmoothContext = createContext4(null);
623
686
  var makeSmoothContext = (initialState) => {
624
- const useSmoothStatus2 = create9(() => initialState);
687
+ const useSmoothStatus2 = create8(() => initialState);
625
688
  return { useSmoothStatus: useSmoothStatus2 };
626
689
  };
627
690
  var SmoothContextProvider = ({ children }) => {
628
691
  const outer = useSmoothContext({ optional: true });
629
- const { useContentPart } = useContentPartContext();
692
+ const contentPartStore = useContentPartStore();
630
693
  const [context] = useState(
631
- () => makeSmoothContext(useContentPart.getState().status)
694
+ () => makeSmoothContext(contentPartStore.getState().status)
632
695
  );
633
696
  if (outer) return children;
634
697
  return /* @__PURE__ */ jsx(SmoothContext.Provider, { value: context, children });
@@ -641,20 +704,24 @@ var withSmoothContextProvider = (Component) => {
641
704
  return Wrapped;
642
705
  };
643
706
  function useSmoothContext(options) {
644
- const context = useContext3(SmoothContext);
707
+ const context = useContext2(SmoothContext);
645
708
  if (!options?.optional && !context)
646
709
  throw new Error(
647
710
  "This component must be used within a SmoothContextProvider."
648
711
  );
649
712
  return context;
650
713
  }
651
- var useSmoothStatus = () => {
652
- const { useSmoothStatus: useSmoothStatus2 } = useSmoothContext();
653
- return useSmoothStatus2();
714
+ var { useSmoothStatus, useSmoothStatusStore } = createContextStoreHook(
715
+ useSmoothContext,
716
+ "useSmoothStatus"
717
+ );
718
+
719
+ // src/context/ReadonlyStore.ts
720
+ var writableStore = (store) => {
721
+ return store;
654
722
  };
655
723
 
656
724
  // src/utils/smooth/useSmooth.tsx
657
- import { useCallbackRef } from "@radix-ui/react-use-callback-ref";
658
725
  var TextStreamAnimator = class {
659
726
  constructor(currentText, setText) {
660
727
  this.currentText = currentText;
@@ -703,21 +770,28 @@ var SMOOTH_STATUS = Object.freeze({
703
770
  type: "running"
704
771
  });
705
772
  var useSmooth = (state, smooth = false) => {
706
- const { useSmoothStatus: useSmoothStatus2 } = useSmoothContext({ optional: true }) ?? {};
707
773
  const {
708
774
  part: { text }
709
775
  } = state;
710
- const { useMessage } = useMessageContext();
711
776
  const id = useMessage((m) => m.message.id);
712
777
  const idRef = useRef(id);
713
778
  const [displayedText, setDisplayedText] = useState2(text);
779
+ const smoothStatusStore = useSmoothStatusStore({ optional: true });
714
780
  const setText = useCallbackRef((text2) => {
715
781
  setDisplayedText(text2);
716
- useSmoothStatus2?.setState(text2 !== state.part.text ? SMOOTH_STATUS : state.status);
782
+ if (smoothStatusStore) {
783
+ writableStore(smoothStatusStore).setState(
784
+ text2 !== state.part.text ? SMOOTH_STATUS : state.status
785
+ );
786
+ }
717
787
  });
718
788
  useEffect(() => {
719
- useSmoothStatus2?.setState(text !== displayedText ? SMOOTH_STATUS : state.status);
720
- }, [useSmoothStatus2, text, displayedText, state.status]);
789
+ if (smoothStatusStore) {
790
+ writableStore(smoothStatusStore).setState(
791
+ text !== state.part.text ? SMOOTH_STATUS : state.status
792
+ );
793
+ }
794
+ }, [smoothStatusStore, text, displayedText, state.status, state.part.text]);
721
795
  const [animatorRef] = useState2(
722
796
  new TextStreamAnimator(text, setText)
723
797
  );
@@ -1350,7 +1424,9 @@ var LocalThreadRuntime = class {
1350
1424
  toolCallId,
1351
1425
  result
1352
1426
  }) {
1353
- let { parentId, message } = this.repository.getMessage(messageId);
1427
+ const messageData = this.repository.getMessage(messageId);
1428
+ const { parentId } = messageData;
1429
+ let { message } = messageData;
1354
1430
  if (message.role !== "assistant")
1355
1431
  throw new Error("Tried to add tool result to non-assistant message");
1356
1432
  let added = false;
@@ -1421,10 +1497,7 @@ var LocalRuntime = class extends BaseAssistantRuntime {
1421
1497
  registerModelConfigProvider(provider) {
1422
1498
  return this._proxyConfigProvider.registerModelConfigProvider(provider);
1423
1499
  }
1424
- switchToThread(threadId) {
1425
- if (threadId) {
1426
- throw new Error("LocalRuntime does not yet support switching threads");
1427
- }
1500
+ switchToNewThread() {
1428
1501
  const { initialMessages, ...options } = this.thread.options;
1429
1502
  return this.thread = new LocalThreadRuntime(
1430
1503
  this._proxyConfigProvider,
@@ -1432,6 +1505,12 @@ var LocalRuntime = class extends BaseAssistantRuntime {
1432
1505
  options
1433
1506
  );
1434
1507
  }
1508
+ switchToThread(threadId) {
1509
+ if (threadId !== null) {
1510
+ throw new Error("LocalRuntime does not yet support switching threads");
1511
+ }
1512
+ this.switchToNewThread();
1513
+ }
1435
1514
  reset({
1436
1515
  initialMessages
1437
1516
  } = {}) {
@@ -1755,8 +1834,17 @@ var ExternalStoreRuntime = class extends BaseAssistantRuntime {
1755
1834
  registerModelConfigProvider(provider) {
1756
1835
  return this._proxyConfigProvider.registerModelConfigProvider(provider);
1757
1836
  }
1837
+ async switchToNewThread() {
1838
+ if (!this.store.onNewThread)
1839
+ throw new Error("Runtime does not support switching to new threads.");
1840
+ this.thread = new ExternalStoreThreadRuntime({
1841
+ messages: [],
1842
+ onNew: this.store.onNew
1843
+ });
1844
+ await this.store.onNewThread();
1845
+ }
1758
1846
  async switchToThread(threadId) {
1759
- if (threadId) {
1847
+ if (threadId !== null) {
1760
1848
  if (!this.store.onSwitchThread)
1761
1849
  throw new Error("Runtime does not support switching threads.");
1762
1850
  this.thread = new ExternalStoreThreadRuntime({
@@ -1765,13 +1853,7 @@ var ExternalStoreRuntime = class extends BaseAssistantRuntime {
1765
1853
  });
1766
1854
  this.store.onSwitchThread(threadId);
1767
1855
  } else {
1768
- if (!this.store.onNewThread)
1769
- throw new Error("Runtime does not support switching to new threads.");
1770
- this.thread = new ExternalStoreThreadRuntime({
1771
- messages: [],
1772
- onNew: this.store.onNew
1773
- });
1774
- await this.store.onNewThread();
1856
+ this.switchToNewThread();
1775
1857
  }
1776
1858
  }
1777
1859
  };
@@ -2146,11 +2228,6 @@ var CompositeAttachmentAdapter = class {
2146
2228
  }
2147
2229
  };
2148
2230
 
2149
- // src/context/ReadonlyStore.ts
2150
- var writableStore = (store) => {
2151
- return store;
2152
- };
2153
-
2154
2231
  // src/context/providers/ThreadProvider.tsx
2155
2232
  import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
2156
2233
  var ThreadProvider = ({
@@ -2158,18 +2235,18 @@ var ThreadProvider = ({
2158
2235
  provider
2159
2236
  }) => {
2160
2237
  const [context] = useState7(() => {
2161
- const useThreadRuntime = makeThreadRuntimeStore(provider.thread);
2162
- const useThread = makeThreadStore(useThreadRuntime);
2163
- const useThreadMessages = makeThreadMessagesStore(useThreadRuntime);
2164
- const useThreadActions = makeThreadActionStore(useThreadRuntime);
2238
+ const useThreadRuntime2 = makeThreadRuntimeStore(provider.thread);
2239
+ const useThread2 = makeThreadStore(useThreadRuntime2);
2240
+ const useThreadMessages2 = makeThreadMessagesStore(useThreadRuntime2);
2241
+ const useThreadActions2 = makeThreadActionStore(useThreadRuntime2);
2165
2242
  const useViewport = makeThreadViewportStore();
2166
- const useComposer = makeComposerStore(useThreadRuntime);
2243
+ const useComposer2 = makeThreadComposerStore(useThreadRuntime2);
2167
2244
  return {
2168
- useThread,
2169
- useThreadRuntime,
2170
- useThreadMessages,
2171
- useThreadActions,
2172
- useComposer,
2245
+ useThread: useThread2,
2246
+ useThreadRuntime: useThreadRuntime2,
2247
+ useThreadMessages: useThreadMessages2,
2248
+ useThreadActions: useThreadActions2,
2249
+ useComposer: useComposer2,
2173
2250
  useViewport
2174
2251
  };
2175
2252
  });
@@ -2217,18 +2294,19 @@ var ThreadProvider = ({
2217
2294
  };
2218
2295
 
2219
2296
  // src/context/stores/AssistantActions.tsx
2220
- import { create as create10 } from "zustand";
2221
- var makeAssistantActionsStore = (runtimeRef) => create10(
2297
+ import { create as create9 } from "zustand";
2298
+ var makeAssistantActionsStore = (runtimeRef) => create9(
2222
2299
  () => Object.freeze({
2223
2300
  switchToThread: () => runtimeRef.current.switchToThread(null),
2301
+ registerModelConfigProvider: (provider) => runtimeRef.current.registerModelConfigProvider(provider),
2224
2302
  getRuntime: () => runtimeRef.current
2225
2303
  })
2226
2304
  );
2227
2305
 
2228
2306
  // src/context/stores/AssistantRuntime.tsx
2229
- import { create as create11 } from "zustand";
2307
+ import { create as create10 } from "zustand";
2230
2308
  var makeAssistantRuntimeStore = (runtime) => {
2231
- return create11(() => runtime);
2309
+ return create10(() => runtime);
2232
2310
  };
2233
2311
 
2234
2312
  // src/context/providers/AssistantProvider.tsx
@@ -2239,21 +2317,15 @@ var AssistantProvider = ({ children, runtime }) => {
2239
2317
  runtimeRef.current = runtime;
2240
2318
  });
2241
2319
  const [context] = useState8(() => {
2242
- const useAssistantRuntime = makeAssistantRuntimeStore(runtime);
2243
- const useModelConfig = makeAssistantModelConfigStore();
2244
- const useToolUIs = makeAssistantToolUIsStore();
2245
- const useAssistantActions = makeAssistantActionsStore(runtimeRef);
2320
+ const useAssistantRuntime2 = makeAssistantRuntimeStore(runtime);
2321
+ const useToolUIs2 = makeAssistantToolUIsStore();
2322
+ const useAssistantActions2 = makeAssistantActionsStore(runtimeRef);
2246
2323
  return {
2247
- useModelConfig,
2248
- useToolUIs,
2249
- useAssistantRuntime,
2250
- useAssistantActions
2324
+ useToolUIs: useToolUIs2,
2325
+ useAssistantRuntime: useAssistantRuntime2,
2326
+ useAssistantActions: useAssistantActions2
2251
2327
  };
2252
2328
  });
2253
- const getModelConfig = context.useModelConfig();
2254
- useEffect4(() => {
2255
- return runtime.registerModelConfigProvider(getModelConfig);
2256
- }, [runtime, getModelConfig]);
2257
2329
  useEffect4(
2258
2330
  () => writableStore(context.useAssistantRuntime).setState(runtime, true),
2259
2331
  [runtime, context]
@@ -2270,93 +2342,95 @@ var AssistantRuntimeProvider = memo(AssistantRuntimeProviderImpl);
2270
2342
 
2271
2343
  // src/context/providers/TextContentPartProvider.tsx
2272
2344
  import { useState as useState9 } from "react";
2273
- import { create as create12 } from "zustand";
2274
-
2275
- // src/context/react/ContentPartContext.ts
2276
- import { createContext as createContext4, useContext as useContext4 } from "react";
2277
- var ContentPartContext = createContext4(
2278
- null
2279
- );
2280
- function useContentPartContext(options) {
2281
- const context = useContext4(ContentPartContext);
2282
- if (!options?.optional && !context)
2283
- throw new Error(
2284
- "This component can only be used inside a component passed to <MessagePrimitive.Content components={...} >."
2285
- );
2286
- return context;
2287
- }
2288
-
2289
- // src/context/providers/TextContentPartProvider.tsx
2345
+ import { create as create11 } from "zustand";
2290
2346
  import { jsx as jsx9 } from "react/jsx-runtime";
2291
2347
  var TextContentPartProvider = ({ children, text }) => {
2292
2348
  const [context] = useState9(() => {
2293
- const useContentPart = create12(() => ({
2349
+ const useContentPart2 = create11(() => ({
2294
2350
  status: { type: "complete" },
2295
2351
  part: { type: "text", text }
2296
2352
  }));
2297
2353
  return {
2298
- useContentPart
2354
+ useContentPart: useContentPart2
2299
2355
  };
2300
2356
  });
2301
2357
  return /* @__PURE__ */ jsx9(ContentPartContext.Provider, { value: context, children });
2302
2358
  };
2303
2359
 
2304
- // src/context/react/ComposerContext.ts
2305
- import { useMemo as useMemo3 } from "react";
2306
-
2307
2360
  // src/context/react/MessageContext.ts
2308
- import { createContext as createContext5, useContext as useContext5 } from "react";
2361
+ import { createContext as createContext5 } from "react";
2309
2362
  var MessageContext = createContext5(null);
2310
- function useMessageContext(options) {
2311
- const context = useContext5(MessageContext);
2312
- if (!options?.optional && !context)
2313
- throw new Error(
2314
- "This component can only be used inside a component passed to <ThreadPrimitive.Messages components={...} />."
2315
- );
2316
- return context;
2317
- }
2363
+ var useMessageContext = createContextHook(
2364
+ MessageContext,
2365
+ "a component passed to <ThreadPrimitive.Messages components={...} />"
2366
+ );
2367
+ var { useMessage, useMessageStore } = createContextStoreHook(
2368
+ useMessageContext,
2369
+ "useMessage"
2370
+ );
2371
+ var { useMessageUtils, useMessageUtilsStore } = createContextStoreHook(
2372
+ useMessageContext,
2373
+ "useMessageUtils"
2374
+ );
2375
+ var { useEditComposer, useEditComposerStore } = createContextStoreHook(
2376
+ useMessageContext,
2377
+ "useEditComposer"
2378
+ );
2318
2379
 
2319
2380
  // src/context/react/ComposerContext.ts
2381
+ import { useMemo as useMemo3 } from "react";
2320
2382
  var useComposerContext = () => {
2321
- const { useComposer } = useThreadContext();
2322
- const { useEditComposer } = useMessageContext({ optional: true }) ?? {};
2383
+ const { useComposer: useComposer2 } = useThreadContext();
2384
+ const { useEditComposer: useEditComposer2 } = useMessageContext({ optional: true }) ?? {};
2323
2385
  return useMemo3(
2324
2386
  () => ({
2325
- useComposer: useEditComposer ?? useComposer,
2326
- type: useEditComposer ? "edit" : "new"
2387
+ useComposer: useEditComposer2 ?? useComposer2,
2388
+ type: useEditComposer2 ? "edit" : "new"
2327
2389
  }),
2328
- [useEditComposer, useComposer]
2390
+ [useEditComposer2, useComposer2]
2329
2391
  );
2330
2392
  };
2393
+ var { useComposer, useComposerStore } = createContextStoreHook(
2394
+ useComposerContext,
2395
+ "useComposer"
2396
+ );
2331
2397
 
2332
2398
  // src/hooks/useAppendMessage.tsx
2333
2399
  import { useCallback } from "react";
2334
- var toAppendMessage = (useThreadMessages, message) => {
2400
+ var toAppendMessage = (useThreadMessages2, message) => {
2335
2401
  if (typeof message === "string") {
2336
2402
  return {
2337
- parentId: useThreadMessages.getState().at(-1)?.id ?? null,
2403
+ parentId: useThreadMessages2.getState().at(-1)?.id ?? null,
2338
2404
  role: "user",
2339
2405
  content: [{ type: "text", text: message }],
2340
2406
  attachments: []
2341
2407
  };
2342
2408
  }
2343
2409
  return {
2344
- parentId: message.parentId ?? useThreadMessages.getState().at(-1)?.id ?? null,
2410
+ parentId: message.parentId ?? useThreadMessages2.getState().at(-1)?.id ?? null,
2345
2411
  role: message.role ?? "user",
2346
2412
  content: message.content,
2347
2413
  attachments: message.attachments ?? []
2348
2414
  };
2349
2415
  };
2350
2416
  var useAppendMessage = () => {
2351
- const { useThreadMessages, useThreadActions, useViewport, useComposer } = useThreadContext();
2417
+ const threadMessagesStore = useThreadMessagesStore();
2418
+ const threadActionsStore = useThreadActionsStore();
2419
+ const threadViewportStore = useThreadViewportStore();
2420
+ const threadComposerStore = useThreadComposerStore();
2352
2421
  const append = useCallback(
2353
2422
  (message) => {
2354
- const appendMessage = toAppendMessage(useThreadMessages, message);
2355
- useThreadActions.getState().append(appendMessage);
2356
- useViewport.getState().scrollToBottom();
2357
- useComposer.getState().focus();
2423
+ const appendMessage = toAppendMessage(threadMessagesStore, message);
2424
+ threadActionsStore.getState().append(appendMessage);
2425
+ threadViewportStore.getState().scrollToBottom();
2426
+ threadComposerStore.getState().focus();
2358
2427
  },
2359
- [useThreadMessages, useThreadActions, useViewport, useComposer]
2428
+ [
2429
+ threadMessagesStore,
2430
+ threadActionsStore,
2431
+ threadViewportStore,
2432
+ threadComposerStore
2433
+ ]
2360
2434
  );
2361
2435
  return append;
2362
2436
  };
@@ -2364,23 +2438,20 @@ var useAppendMessage = () => {
2364
2438
  // src/hooks/useSwitchToNewThread.tsx
2365
2439
  import { useCallback as useCallback2 } from "react";
2366
2440
  var useSwitchToNewThread = () => {
2367
- const { useAssistantActions } = useAssistantContext();
2368
- const { useComposer } = useThreadContext();
2441
+ const assistantActionsStore = useAssistantActionsStore();
2442
+ const threadComposerStore = useThreadComposerStore();
2369
2443
  const switchToNewThread = useCallback2(() => {
2370
- useAssistantActions.getState().switchToThread(null);
2371
- useComposer.getState().focus();
2372
- }, [useAssistantActions, useComposer]);
2444
+ assistantActionsStore.getState().switchToThread(null);
2445
+ threadComposerStore.getState().focus();
2446
+ }, [assistantActionsStore, threadComposerStore]);
2373
2447
  return switchToNewThread;
2374
2448
  };
2375
2449
 
2376
2450
  // src/model-config/useAssistantTool.tsx
2377
2451
  import { useEffect as useEffect5 } from "react";
2378
2452
  var useAssistantTool = (tool) => {
2379
- const { useModelConfig, useToolUIs } = useAssistantContext();
2380
- const registerModelConfigProvider = useModelConfig(
2381
- (s) => s.registerModelConfigProvider
2382
- );
2383
- const setToolUI = useToolUIs((s) => s.setToolUI);
2453
+ const assistantActionsStore = useAssistantActionsStore();
2454
+ const toolUIsStore = useToolUIsStore();
2384
2455
  useEffect5(() => {
2385
2456
  const { toolName, render, ...rest } = tool;
2386
2457
  const config = {
@@ -2388,15 +2459,15 @@ var useAssistantTool = (tool) => {
2388
2459
  [tool.toolName]: rest
2389
2460
  }
2390
2461
  };
2391
- const unsub1 = registerModelConfigProvider({
2462
+ const unsub1 = assistantActionsStore.getState().registerModelConfigProvider({
2392
2463
  getModelConfig: () => config
2393
2464
  });
2394
- const unsub2 = render ? setToolUI(toolName, render) : void 0;
2465
+ const unsub2 = render ? toolUIsStore.getState().setToolUI(toolName, render) : void 0;
2395
2466
  return () => {
2396
2467
  unsub1();
2397
2468
  unsub2?.();
2398
2469
  };
2399
- }, [registerModelConfigProvider, setToolUI, tool]);
2470
+ }, [assistantActionsStore, toolUIsStore, tool]);
2400
2471
  };
2401
2472
 
2402
2473
  // src/model-config/makeAssistantTool.tsx
@@ -2412,13 +2483,12 @@ var makeAssistantTool = (tool) => {
2412
2483
  // src/model-config/useAssistantToolUI.tsx
2413
2484
  import { useEffect as useEffect6 } from "react";
2414
2485
  var useAssistantToolUI = (tool) => {
2415
- const { useToolUIs } = useAssistantContext();
2416
- const setToolUI = useToolUIs((s) => s.setToolUI);
2486
+ const toolUIsStore = useToolUIsStore();
2417
2487
  useEffect6(() => {
2418
2488
  if (!tool) return;
2419
2489
  const { toolName, render } = tool;
2420
- return setToolUI(toolName, render);
2421
- }, [setToolUI, tool]);
2490
+ return toolUIsStore.getState().setToolUI(toolName, render);
2491
+ }, [toolUIsStore, tool]);
2422
2492
  };
2423
2493
 
2424
2494
  // src/model-config/makeAssistantToolUI.tsx
@@ -2434,16 +2504,13 @@ var makeAssistantToolUI = (tool) => {
2434
2504
  // src/model-config/useAssistantInstructions.tsx
2435
2505
  import { useEffect as useEffect7 } from "react";
2436
2506
  var useAssistantInstructions = (instruction) => {
2437
- const { useModelConfig } = useAssistantContext();
2438
- const registerModelConfigProvider = useModelConfig(
2439
- (s) => s.registerModelConfigProvider
2440
- );
2507
+ const runtimeStore = useAssistantRuntimeStore();
2441
2508
  useEffect7(() => {
2442
2509
  const config = {
2443
2510
  system: instruction
2444
2511
  };
2445
- return registerModelConfigProvider({ getModelConfig: () => config });
2446
- }, [registerModelConfigProvider, instruction]);
2512
+ return runtimeStore.getState().registerModelConfigProvider({ getModelConfig: () => config });
2513
+ }, [runtimeStore, instruction]);
2447
2514
  };
2448
2515
 
2449
2516
  // src/primitive-hooks/actionBar/useActionBarCopy.tsx
@@ -2479,23 +2546,25 @@ var useCombinedStore = (stores, selector) => {
2479
2546
  var useActionBarCopy = ({
2480
2547
  copiedDuration = 3e3
2481
2548
  } = {}) => {
2482
- const { useMessage, useMessageUtils, useEditComposer } = useMessageContext();
2549
+ const messageStore = useMessageStore();
2550
+ const messageUtilsStore = useMessageUtilsStore();
2551
+ const editComposerStore = useEditComposerStore();
2483
2552
  const hasCopyableContent = useCombinedStore(
2484
- [useMessage, useEditComposer],
2553
+ [messageStore, editComposerStore],
2485
2554
  ({ message }, c) => {
2486
2555
  return !c.isEditing && (message.role !== "assistant" || message.status.type !== "running") && message.content.some((c2) => c2.type === "text" && c2.text.length > 0);
2487
2556
  }
2488
2557
  );
2489
2558
  const callback = useCallback3(() => {
2490
- const { message } = useMessage.getState();
2491
- const { setIsCopied } = useMessageUtils.getState();
2492
- const { isEditing, text: composerValue } = useEditComposer.getState();
2559
+ const { message } = messageStore.getState();
2560
+ const { setIsCopied } = messageUtilsStore.getState();
2561
+ const { isEditing, text: composerValue } = editComposerStore.getState();
2493
2562
  const valueToCopy = isEditing ? composerValue : getThreadMessageText(message);
2494
2563
  navigator.clipboard.writeText(valueToCopy).then(() => {
2495
2564
  setIsCopied(true);
2496
2565
  setTimeout(() => setIsCopied(false), copiedDuration);
2497
2566
  });
2498
- }, [useMessage, useMessageUtils, useEditComposer, copiedDuration]);
2567
+ }, [messageStore, messageUtilsStore, editComposerStore, copiedDuration]);
2499
2568
  if (!hasCopyableContent) return null;
2500
2569
  return callback;
2501
2570
  };
@@ -2503,12 +2572,12 @@ var useActionBarCopy = ({
2503
2572
  // src/primitive-hooks/actionBar/useActionBarEdit.tsx
2504
2573
  import { useCallback as useCallback4 } from "react";
2505
2574
  var useActionBarEdit = () => {
2506
- const { useEditComposer } = useMessageContext();
2575
+ const editComposerStore = useEditComposerStore();
2507
2576
  const disabled = useEditComposer((c) => c.isEditing);
2508
2577
  const callback = useCallback4(() => {
2509
- const { edit } = useEditComposer.getState();
2578
+ const { edit } = editComposerStore.getState();
2510
2579
  edit();
2511
- }, [useEditComposer]);
2580
+ }, [editComposerStore]);
2512
2581
  if (disabled) return null;
2513
2582
  return callback;
2514
2583
  };
@@ -2516,18 +2585,26 @@ var useActionBarEdit = () => {
2516
2585
  // src/primitive-hooks/actionBar/useActionBarReload.tsx
2517
2586
  import { useCallback as useCallback5 } from "react";
2518
2587
  var useActionBarReload = () => {
2519
- const { useThread, useThreadActions, useComposer, useViewport } = useThreadContext();
2520
- const { useMessage } = useMessageContext();
2588
+ const messageStore = useMessageStore();
2589
+ const threadStore = useThreadStore();
2590
+ const threadActionsStore = useThreadActionsStore();
2591
+ const threadComposerStore = useThreadComposerStore();
2592
+ const threadViewportStore = useThreadViewportStore();
2521
2593
  const disabled = useCombinedStore(
2522
- [useThread, useMessage],
2594
+ [threadStore, messageStore],
2523
2595
  (t, m) => t.isRunning || t.isDisabled || m.message.role !== "assistant"
2524
2596
  );
2525
2597
  const callback = useCallback5(() => {
2526
- const { parentId } = useMessage.getState();
2527
- useThreadActions.getState().startRun(parentId);
2528
- useViewport.getState().scrollToBottom();
2529
- useComposer.getState().focus();
2530
- }, [useThreadActions, useComposer, useViewport, useMessage]);
2598
+ const { parentId } = messageStore.getState();
2599
+ threadActionsStore.getState().startRun(parentId);
2600
+ threadViewportStore.getState().scrollToBottom();
2601
+ threadComposerStore.getState().focus();
2602
+ }, [
2603
+ threadActionsStore,
2604
+ threadComposerStore,
2605
+ threadViewportStore,
2606
+ messageStore
2607
+ ]);
2531
2608
  if (disabled) return null;
2532
2609
  return callback;
2533
2610
  };
@@ -2535,19 +2612,21 @@ var useActionBarReload = () => {
2535
2612
  // src/primitive-hooks/actionBar/useActionBarSpeak.tsx
2536
2613
  import { useCallback as useCallback6 } from "react";
2537
2614
  var useActionBarSpeak = () => {
2538
- const { useThreadActions } = useThreadContext();
2539
- const { useMessage, useEditComposer, useMessageUtils } = useMessageContext();
2615
+ const messageStore = useMessageStore();
2616
+ const editComposerStore = useEditComposerStore();
2617
+ const threadActionsStore = useThreadActionsStore();
2618
+ const messageUtilsStore = useMessageUtilsStore();
2540
2619
  const hasSpeakableContent = useCombinedStore(
2541
- [useMessage, useEditComposer],
2620
+ [messageStore, editComposerStore],
2542
2621
  ({ message }, c) => {
2543
2622
  return !c.isEditing && (message.role !== "assistant" || message.status.type !== "running") && message.content.some((c2) => c2.type === "text" && c2.text.length > 0);
2544
2623
  }
2545
2624
  );
2546
2625
  const callback = useCallback6(async () => {
2547
- const { message } = useMessage.getState();
2548
- const utt = useThreadActions.getState().speak(message.id);
2549
- useMessageUtils.getState().addUtterance(utt);
2550
- }, [useThreadActions, useMessage, useMessageUtils]);
2626
+ const { message } = messageStore.getState();
2627
+ const utt = threadActionsStore.getState().speak(message.id);
2628
+ messageUtilsStore.getState().addUtterance(utt);
2629
+ }, [threadActionsStore, messageStore, messageUtilsStore]);
2551
2630
  if (!hasSpeakableContent) return null;
2552
2631
  return callback;
2553
2632
  };
@@ -2555,18 +2634,17 @@ var useActionBarSpeak = () => {
2555
2634
  // src/primitive-hooks/actionBar/useActionBarStopSpeaking.tsx
2556
2635
  import { useCallback as useCallback7 } from "react";
2557
2636
  var useActionBarStopSpeaking = () => {
2558
- const { useMessageUtils } = useMessageContext();
2637
+ const messageUtilsStore = useMessageUtilsStore();
2559
2638
  const isSpeaking = useMessageUtils((u) => u.isSpeaking);
2560
2639
  const callback = useCallback7(async () => {
2561
- useMessageUtils.getState().stopSpeaking();
2562
- }, [useMessageUtils]);
2640
+ messageUtilsStore.getState().stopSpeaking();
2641
+ }, [messageUtilsStore]);
2563
2642
  if (!isSpeaking) return null;
2564
2643
  return callback;
2565
2644
  };
2566
2645
 
2567
2646
  // src/primitive-hooks/branchPicker/useBranchPickerCount.tsx
2568
2647
  var useBranchPickerCount = () => {
2569
- const { useMessage } = useMessageContext();
2570
2648
  const branchCount = useMessage((s) => s.branches.length);
2571
2649
  return branchCount;
2572
2650
  };
@@ -2574,23 +2652,23 @@ var useBranchPickerCount = () => {
2574
2652
  // src/primitive-hooks/branchPicker/useBranchPickerNext.tsx
2575
2653
  import { useCallback as useCallback8 } from "react";
2576
2654
  var useBranchPickerNext = () => {
2577
- const { useThreadActions } = useThreadContext();
2578
- const { useMessage, useEditComposer } = useMessageContext();
2655
+ const messageStore = useMessageStore();
2656
+ const editComposerStore = useEditComposerStore();
2657
+ const threadActionsStore = useThreadActionsStore();
2579
2658
  const disabled = useCombinedStore(
2580
- [useMessage, useEditComposer],
2659
+ [messageStore, editComposerStore],
2581
2660
  (m, c) => c.isEditing || m.branches.indexOf(m.message.id) + 1 >= m.branches.length
2582
2661
  );
2583
2662
  const callback = useCallback8(() => {
2584
- const { message, branches } = useMessage.getState();
2585
- useThreadActions.getState().switchToBranch(branches[branches.indexOf(message.id) + 1]);
2586
- }, [useThreadActions, useMessage]);
2663
+ const { message, branches } = messageStore.getState();
2664
+ threadActionsStore.getState().switchToBranch(branches[branches.indexOf(message.id) + 1]);
2665
+ }, [threadActionsStore, messageStore]);
2587
2666
  if (disabled) return null;
2588
2667
  return callback;
2589
2668
  };
2590
2669
 
2591
2670
  // src/primitive-hooks/branchPicker/useBranchPickerNumber.tsx
2592
2671
  var useBranchPickerNumber = () => {
2593
- const { useMessage } = useMessageContext();
2594
2672
  const branchIdx = useMessage((s) => s.branches.indexOf(s.message.id));
2595
2673
  return branchIdx + 1;
2596
2674
  };
@@ -2598,16 +2676,17 @@ var useBranchPickerNumber = () => {
2598
2676
  // src/primitive-hooks/branchPicker/useBranchPickerPrevious.tsx
2599
2677
  import { useCallback as useCallback9 } from "react";
2600
2678
  var useBranchPickerPrevious = () => {
2601
- const { useThreadActions } = useThreadContext();
2602
- const { useMessage, useEditComposer } = useMessageContext();
2679
+ const messageStore = useMessageStore();
2680
+ const editComposerStore = useEditComposerStore();
2681
+ const threadActionsStore = useThreadActionsStore();
2603
2682
  const disabled = useCombinedStore(
2604
- [useMessage, useEditComposer],
2683
+ [messageStore, editComposerStore],
2605
2684
  (m, c) => c.isEditing || m.branches.indexOf(m.message.id) <= 0
2606
2685
  );
2607
2686
  const callback = useCallback9(() => {
2608
- const { message, branches } = useMessage.getState();
2609
- useThreadActions.getState().switchToBranch(branches[branches.indexOf(message.id) - 1]);
2610
- }, [useThreadActions, useMessage]);
2687
+ const { message, branches } = messageStore.getState();
2688
+ threadActionsStore.getState().switchToBranch(branches[branches.indexOf(message.id) - 1]);
2689
+ }, [threadActionsStore, messageStore]);
2611
2690
  if (disabled) return null;
2612
2691
  return callback;
2613
2692
  };
@@ -2615,19 +2694,18 @@ var useBranchPickerPrevious = () => {
2615
2694
  // src/primitive-hooks/composer/useComposerCancel.tsx
2616
2695
  import { useCallback as useCallback10 } from "react";
2617
2696
  var useComposerCancel = () => {
2618
- const { useComposer } = useComposerContext();
2697
+ const composerStore = useComposerStore();
2619
2698
  const disabled = useComposer((c) => !c.canCancel);
2620
2699
  const callback = useCallback10(() => {
2621
- const { cancel } = useComposer.getState();
2700
+ const { cancel } = composerStore.getState();
2622
2701
  cancel();
2623
- }, [useComposer]);
2702
+ }, [composerStore]);
2624
2703
  if (disabled) return null;
2625
2704
  return callback;
2626
2705
  };
2627
2706
 
2628
2707
  // src/primitive-hooks/composer/useComposerIf.tsx
2629
2708
  var useComposerIf = (props) => {
2630
- const { useComposer } = useComposerContext();
2631
2709
  return useComposer((composer) => {
2632
2710
  if (props.editing === true && !composer.isEditing) return false;
2633
2711
  if (props.editing === false && composer.isEditing) return false;
@@ -2638,23 +2716,21 @@ var useComposerIf = (props) => {
2638
2716
  // src/primitive-hooks/composer/useComposerSend.tsx
2639
2717
  import { useCallback as useCallback11 } from "react";
2640
2718
  var useComposerSend = () => {
2641
- const {
2642
- useThread,
2643
- useViewport,
2644
- useComposer: useNewComposer
2645
- } = useThreadContext();
2646
- const { useComposer } = useComposerContext();
2719
+ const threadStore = useThreadStore();
2720
+ const threadViewportStore = useThreadViewportStore();
2721
+ const composerStore = useComposerStore();
2722
+ const threadComposerStore = useThreadComposerStore();
2647
2723
  const disabled = useCombinedStore(
2648
- [useThread, useComposer],
2724
+ [threadStore, composerStore],
2649
2725
  (t, c) => t.isRunning || !c.isEditing || c.isEmpty
2650
2726
  );
2651
2727
  const callback = useCallback11(() => {
2652
- const composerState = useComposer.getState();
2728
+ const composerState = composerStore.getState();
2653
2729
  if (!composerState.isEditing) return;
2654
2730
  composerState.send();
2655
- useViewport.getState().scrollToBottom();
2656
- useNewComposer.getState().focus();
2657
- }, [useNewComposer, useComposer, useViewport]);
2731
+ threadViewportStore.getState().scrollToBottom();
2732
+ threadComposerStore.getState().focus();
2733
+ }, [threadComposerStore, composerStore, threadViewportStore]);
2658
2734
  if (disabled) return null;
2659
2735
  return callback;
2660
2736
  };
@@ -2662,11 +2738,12 @@ var useComposerSend = () => {
2662
2738
  // src/primitive-hooks/composer/useComposerAddAttachment.tsx
2663
2739
  import { useCallback as useCallback12 } from "react";
2664
2740
  var useComposerAddAttachment = () => {
2665
- const { useComposer, useThreadRuntime } = useThreadContext();
2666
2741
  const disabled = useComposer((c) => !c.isEditing);
2742
+ const threadComposerStore = useThreadComposerStore();
2743
+ const threadRuntimeStore = useThreadRuntimeStore();
2667
2744
  const callback = useCallback12(() => {
2668
- const { addAttachment } = useComposer.getState();
2669
- const { attachmentAccept } = useThreadRuntime.getState().composer;
2745
+ const { addAttachment } = threadComposerStore.getState();
2746
+ const { attachmentAccept } = threadRuntimeStore.getState().composer;
2670
2747
  const input = document.createElement("input");
2671
2748
  input.type = "file";
2672
2749
  if (attachmentAccept !== "*") {
@@ -2678,14 +2755,13 @@ var useComposerAddAttachment = () => {
2678
2755
  addAttachment(file);
2679
2756
  };
2680
2757
  input.click();
2681
- }, [useComposer, useThreadRuntime]);
2758
+ }, [threadComposerStore, threadRuntimeStore]);
2682
2759
  if (disabled) return null;
2683
2760
  return callback;
2684
2761
  };
2685
2762
 
2686
2763
  // src/primitive-hooks/contentPart/useContentPartDisplay.tsx
2687
2764
  var useContentPartDisplay = () => {
2688
- const { useContentPart } = useContentPartContext();
2689
2765
  const display = useContentPart((c) => {
2690
2766
  if (c.part.type !== "ui")
2691
2767
  throw new Error(
@@ -2698,7 +2774,6 @@ var useContentPartDisplay = () => {
2698
2774
 
2699
2775
  // src/primitive-hooks/contentPart/useContentPartImage.tsx
2700
2776
  var useContentPartImage = () => {
2701
- const { useContentPart } = useContentPartContext();
2702
2777
  const image = useContentPart((c) => {
2703
2778
  if (c.part.type !== "image")
2704
2779
  throw new Error(
@@ -2711,7 +2786,6 @@ var useContentPartImage = () => {
2711
2786
 
2712
2787
  // src/primitive-hooks/contentPart/useContentPartText.tsx
2713
2788
  var useContentPartText = () => {
2714
- const { useContentPart } = useContentPartContext();
2715
2789
  const text = useContentPart((c) => {
2716
2790
  if (c.part.type !== "text")
2717
2791
  throw new Error(
@@ -2724,9 +2798,10 @@ var useContentPartText = () => {
2724
2798
 
2725
2799
  // src/primitive-hooks/message/useMessageIf.tsx
2726
2800
  var useMessageIf = (props) => {
2727
- const { useMessage, useMessageUtils } = useMessageContext();
2801
+ const messageStore = useMessageStore();
2802
+ const messageUtilsStore = useMessageUtilsStore();
2728
2803
  return useCombinedStore(
2729
- [useMessage, useMessageUtils],
2804
+ [messageStore, messageUtilsStore],
2730
2805
  ({ message, branches, isLast }, { isCopied, isHovering, isSpeaking }) => {
2731
2806
  if (props.hasBranches === true && branches.length < 2) return false;
2732
2807
  if (props.user && message.role !== "user") return false;
@@ -2748,9 +2823,10 @@ var useMessageIf = (props) => {
2748
2823
 
2749
2824
  // src/primitive-hooks/thread/useThreadIf.tsx
2750
2825
  var useThreadIf = (props) => {
2751
- const { useThread, useThreadMessages } = useThreadContext();
2826
+ const threadStore = useThreadStore();
2827
+ const threadMessagesStore = useThreadMessagesStore();
2752
2828
  return useCombinedStore(
2753
- [useThread, useThreadMessages],
2829
+ [threadStore, threadMessagesStore],
2754
2830
  (thread, messages) => {
2755
2831
  if (props.empty === true && messages.length !== 0) return false;
2756
2832
  if (props.empty === false && messages.length === 0) return false;
@@ -2771,12 +2847,13 @@ var useThreadEmpty = () => {
2771
2847
  // src/primitive-hooks/thread/useThreadScrollToBottom.tsx
2772
2848
  import { useCallback as useCallback13 } from "react";
2773
2849
  var useThreadScrollToBottom = () => {
2774
- const { useComposer, useViewport } = useThreadContext();
2775
- const isAtBottom = useViewport((s) => s.isAtBottom);
2850
+ const isAtBottom = useThreadViewport((s) => s.isAtBottom);
2851
+ const threadViewportStore = useThreadViewportStore();
2852
+ const threadComposerStore = useThreadComposerStore();
2776
2853
  const handleScrollToBottom = useCallback13(() => {
2777
- useViewport.getState().scrollToBottom();
2778
- useComposer.getState().focus();
2779
- }, [useViewport, useComposer]);
2854
+ threadViewportStore.getState().scrollToBottom();
2855
+ threadComposerStore.getState().focus();
2856
+ }, [threadViewportStore, threadComposerStore]);
2780
2857
  if (isAtBottom) return null;
2781
2858
  return handleScrollToBottom;
2782
2859
  };
@@ -2787,19 +2864,20 @@ var useThreadSuggestion = ({
2787
2864
  prompt,
2788
2865
  autoSend
2789
2866
  }) => {
2790
- const { useThread, useComposer } = useThreadContext();
2867
+ const threadStore = useThreadStore();
2868
+ const composerStore = useThreadComposerStore();
2791
2869
  const append = useAppendMessage();
2792
2870
  const disabled = useThread((t) => t.isDisabled);
2793
2871
  const callback = useCallback14(() => {
2794
- const thread = useThread.getState();
2795
- const composer = useComposer.getState();
2872
+ const thread = threadStore.getState();
2873
+ const composer = composerStore.getState();
2796
2874
  if (autoSend && !thread.isRunning) {
2797
2875
  append(prompt);
2798
2876
  composer.setText("");
2799
2877
  } else {
2800
2878
  composer.setText(prompt);
2801
2879
  }
2802
- }, [useThread, useComposer, autoSend, append, prompt]);
2880
+ }, [threadStore, composerStore, autoSend, append, prompt]);
2803
2881
  if (disabled) return null;
2804
2882
  return callback;
2805
2883
  };
@@ -2825,10 +2903,11 @@ var useActionBarFloatStatus = ({
2825
2903
  autohide,
2826
2904
  autohideFloat
2827
2905
  }) => {
2828
- const { useThread } = useThreadContext();
2829
- const { useMessage, useMessageUtils } = useMessageContext();
2906
+ const threadStore = useThreadStore();
2907
+ const messageStore = useMessageStore();
2908
+ const messageUtilsStore = useMessageUtilsStore();
2830
2909
  return useCombinedStore(
2831
- [useThread, useMessage, useMessageUtils],
2910
+ [threadStore, messageStore, messageUtilsStore],
2832
2911
  (t, m, mu) => {
2833
2912
  if (hideWhenRunning && t.isRunning) return "hidden" /* Hidden */;
2834
2913
  const autohideEnabled = autohide === "always" || autohide === "not-last" && !m.isLast;
@@ -2947,6 +3026,7 @@ var ActionBarPrimitiveStopSpeaking = forwardRef7((props, ref) => {
2947
3026
  }
2948
3027
  );
2949
3028
  });
3029
+ ActionBarPrimitiveStopSpeaking.displayName = "ActionBarPrimitive.StopSpeaking";
2950
3030
 
2951
3031
  // src/primitives/assistantModal/index.ts
2952
3032
  var assistantModal_exports = {};
@@ -2967,12 +3047,12 @@ import { useCallbackRef as useCallbackRef2 } from "@radix-ui/react-use-callback-
2967
3047
  import { useEffect as useEffect8 } from "react";
2968
3048
  var useOnComposerFocus = (callback) => {
2969
3049
  const callbackRef = useCallbackRef2(callback);
2970
- const { useComposer } = useThreadContext();
3050
+ const threadComposerStore = useThreadComposerStore();
2971
3051
  useEffect8(() => {
2972
- return useComposer.getState().onFocus(() => {
3052
+ return threadComposerStore.getState().onFocus(() => {
2973
3053
  callbackRef();
2974
3054
  });
2975
- }, [useComposer, callbackRef]);
3055
+ }, [threadComposerStore, callbackRef]);
2976
3056
  };
2977
3057
 
2978
3058
  // src/primitives/assistantModal/scope.tsx
@@ -3154,10 +3234,10 @@ var useManagedRef = (callback) => {
3154
3234
  import { useComposedRefs } from "@radix-ui/react-compose-refs";
3155
3235
  import { jsx as jsx19 } from "react/jsx-runtime";
3156
3236
  var useIsHoveringRef = () => {
3157
- const { useMessageUtils } = useMessageContext();
3237
+ const messageUtilsStore = useMessageUtilsStore();
3158
3238
  const callbackRef = useCallback16(
3159
3239
  (el) => {
3160
- const setIsHovering = useMessageUtils.getState().setIsHovering;
3240
+ const setIsHovering = messageUtilsStore.getState().setIsHovering;
3161
3241
  const handleMouseEnter = () => {
3162
3242
  setIsHovering(true);
3163
3243
  };
@@ -3172,14 +3252,14 @@ var useIsHoveringRef = () => {
3172
3252
  setIsHovering(false);
3173
3253
  };
3174
3254
  },
3175
- [useMessageUtils]
3255
+ [messageUtilsStore]
3176
3256
  );
3177
3257
  return useManagedRef(callbackRef);
3178
3258
  };
3179
- var MessagePrimitiveRoot = forwardRef11(({ onMouseEnter, onMouseLeave, ...rest }, forwardRef30) => {
3259
+ var MessagePrimitiveRoot = forwardRef11((props, forwardRef30) => {
3180
3260
  const isHoveringRef = useIsHoveringRef();
3181
3261
  const ref = useComposedRefs(forwardRef30, isHoveringRef);
3182
- return /* @__PURE__ */ jsx19(Primitive5.div, { ...rest, ref });
3262
+ return /* @__PURE__ */ jsx19(Primitive5.div, { ...props, ref });
3183
3263
  });
3184
3264
  MessagePrimitiveRoot.displayName = "MessagePrimitive.Root";
3185
3265
 
@@ -3198,7 +3278,7 @@ import { memo as memo2 } from "react";
3198
3278
 
3199
3279
  // src/context/providers/ContentPartProvider.tsx
3200
3280
  import { useEffect as useEffect9, useState as useState11 } from "react";
3201
- import { create as create13 } from "zustand";
3281
+ import { create as create12 } from "zustand";
3202
3282
  import { jsx as jsx20 } from "react/jsx-runtime";
3203
3283
  var COMPLETE_STATUS = {
3204
3284
  type: "complete"
@@ -3219,7 +3299,7 @@ var toContentPartStatus = (message, partIndex, part) => {
3219
3299
  return message.status;
3220
3300
  };
3221
3301
  var EMPTY_CONTENT = Object.freeze({ type: "text", text: "" });
3222
- var getContentPartState = ({ message }, useContentPart, partIndex) => {
3302
+ var getContentPartState = ({ message }, useContentPart2, partIndex) => {
3223
3303
  let part = message.content[partIndex];
3224
3304
  if (!part) {
3225
3305
  if (message.content.length === 0 && partIndex === 0) {
@@ -3231,18 +3311,18 @@ var getContentPartState = ({ message }, useContentPart, partIndex) => {
3231
3311
  part = EMPTY_CONTENT;
3232
3312
  }
3233
3313
  const status = toContentPartStatus(message, partIndex, part);
3234
- const currentState = useContentPart?.getState();
3314
+ const currentState = useContentPart2?.getState();
3235
3315
  if (currentState && currentState.part === part && currentState.status === status)
3236
3316
  return null;
3237
3317
  return Object.freeze({ part, status });
3238
3318
  };
3239
3319
  var useContentPartContext2 = (partIndex) => {
3240
- const { useMessage } = useMessageContext();
3320
+ const messageStore = useMessageStore();
3241
3321
  const [context] = useState11(() => {
3242
- const useContentPart = create13(
3243
- () => getContentPartState(useMessage.getState(), void 0, partIndex)
3322
+ const useContentPart2 = create12(
3323
+ () => getContentPartState(messageStore.getState(), void 0, partIndex)
3244
3324
  );
3245
- return { useContentPart };
3325
+ return { useContentPart: useContentPart2 };
3246
3326
  });
3247
3327
  useEffect9(() => {
3248
3328
  const syncContentPart = (message) => {
@@ -3254,9 +3334,9 @@ var useContentPartContext2 = (partIndex) => {
3254
3334
  if (!newState) return;
3255
3335
  writableStore(context.useContentPart).setState(newState, true);
3256
3336
  };
3257
- syncContentPart(useMessage.getState());
3258
- return useMessage.subscribe(syncContentPart);
3259
- }, [context, useMessage, partIndex]);
3337
+ syncContentPart(messageStore.getState());
3338
+ return messageStore.subscribe(syncContentPart);
3339
+ }, [context, messageStore, partIndex]);
3260
3340
  return context;
3261
3341
  };
3262
3342
  var ContentPartProvider = ({
@@ -3304,7 +3384,6 @@ ContentPartPrimitiveDisplay.displayName = "ContentPartPrimitive.Display";
3304
3384
 
3305
3385
  // src/primitives/contentPart/ContentPartInProgress.tsx
3306
3386
  var ContentPartPrimitiveInProgress = ({ children }) => {
3307
- const { useContentPart } = useContentPartContext();
3308
3387
  const isInProgress = useContentPart((c) => c.status.type === "running");
3309
3388
  return isInProgress ? children : null;
3310
3389
  };
@@ -3316,7 +3395,6 @@ var ToolUIDisplay = ({
3316
3395
  UI,
3317
3396
  ...props
3318
3397
  }) => {
3319
- const { useToolUIs } = useAssistantContext();
3320
3398
  const Render = useToolUIs((s) => s.getToolUI(props.part.toolName)) ?? UI;
3321
3399
  if (!Render) return null;
3322
3400
  return /* @__PURE__ */ jsx23(Render, { ...props });
@@ -3338,10 +3416,8 @@ var MessageContentPartComponent = ({
3338
3416
  tools: { by_name = {}, Fallback: Fallback2 = void 0 } = {}
3339
3417
  } = {}
3340
3418
  }) => {
3341
- const { useThreadActions } = useThreadContext();
3342
- const { useMessage } = useMessageContext();
3343
- const addToolResult = useThreadActions((t) => t.addToolResult);
3344
- const { useContentPart } = useContentPartContext();
3419
+ const messageStore = useMessageStore();
3420
+ const threadActionsStore = useThreadActionsStore();
3345
3421
  const { part, status } = useContentPart();
3346
3422
  const type = part.type;
3347
3423
  switch (type) {
@@ -3362,8 +3438,8 @@ var MessageContentPartComponent = ({
3362
3438
  return /* @__PURE__ */ jsx23(UI, { part, status });
3363
3439
  case "tool-call": {
3364
3440
  const Tool = by_name[part.toolName] || Fallback2;
3365
- const addResult = (result) => addToolResult({
3366
- messageId: useMessage.getState().message.id,
3441
+ const addResult = (result) => threadActionsStore.getState().addToolResult({
3442
+ messageId: messageStore.getState().message.id,
3367
3443
  toolName: part.toolName,
3368
3444
  toolCallId: part.toolCallId,
3369
3445
  result
@@ -3396,7 +3472,6 @@ var MessageContentPart = memo2(
3396
3472
  var MessagePrimitiveContent = ({
3397
3473
  components
3398
3474
  }) => {
3399
- const { useMessage } = useMessageContext();
3400
3475
  const contentLength = useMessage((s) => s.message.content.length) || 1;
3401
3476
  return Array.from({ length: contentLength }, (_, index) => /* @__PURE__ */ jsx23(MessageContentPart, { partIndex: index, components }, index));
3402
3477
  };
@@ -3412,48 +3487,70 @@ MessagePrimitiveInProgress.displayName = "MessagePrimitive.InProgress";
3412
3487
  import { memo as memo3 } from "react";
3413
3488
 
3414
3489
  // src/context/react/AttachmentContext.ts
3415
- import { createContext as createContext6, useContext as useContext6 } from "react";
3490
+ import { createContext as createContext6, useContext as useContext3 } from "react";
3416
3491
  var AttachmentContext = createContext6(
3417
3492
  null
3418
3493
  );
3419
3494
  function useAttachmentContext(options) {
3420
- const context = useContext6(AttachmentContext);
3421
- if (options?.type === "composer" && context?.type !== "composer")
3495
+ const context = useContext3(AttachmentContext);
3496
+ if (!options?.optional && !context)
3422
3497
  throw new Error(
3423
- "This component must be used within a ComposerPrimitive.Attachments component."
3498
+ "This component must be used within a ComposerPrimitive.Attachments or MessagePrimitive.Attachments component."
3424
3499
  );
3425
- if (options?.type === "message" && context?.type !== "message")
3500
+ return context;
3501
+ }
3502
+ function useComposerAttachmentContext(options) {
3503
+ const context = useAttachmentContext(options);
3504
+ if (!context) return null;
3505
+ if (context.type !== "composer")
3426
3506
  throw new Error(
3427
- "This component must be used within a MessagePrimitive.Attachments component."
3507
+ "This component must be used within a ComposerPrimitive.Attachments component."
3428
3508
  );
3429
- if (!options?.optional && !context)
3509
+ return context;
3510
+ }
3511
+ function useMessageAttachmentContext(options) {
3512
+ const context = useAttachmentContext(options);
3513
+ if (!context) return null;
3514
+ if (context.type !== "message")
3430
3515
  throw new Error(
3431
- "This component must be used within a ComposerPrimitive.Attachments or MessagePrimitive.Attachments component."
3516
+ "This component must be used within a MessagePrimitive.Attachments component."
3432
3517
  );
3433
3518
  return context;
3434
3519
  }
3520
+ var { useAttachment, useAttachmentStore } = createContextStoreHook(
3521
+ useAttachmentContext,
3522
+ "useAttachment"
3523
+ );
3524
+ var {
3525
+ useAttachment: useComposerAttachment,
3526
+ useAttachmentStore: useComposerAttachmentStore
3527
+ } = createContextStoreHook(useComposerAttachmentContext, "useAttachment");
3528
+ var {
3529
+ useAttachment: useMessageAttachment,
3530
+ useAttachmentStore: useMessageAttachmentStore
3531
+ } = createContextStoreHook(useMessageAttachmentContext, "useAttachment");
3435
3532
 
3436
3533
  // src/context/providers/MessageAttachmentProvider.tsx
3437
3534
  import { useEffect as useEffect10, useState as useState12 } from "react";
3438
- import { create as create14 } from "zustand";
3535
+ import { create as create13 } from "zustand";
3439
3536
  import { jsx as jsx24 } from "react/jsx-runtime";
3440
- var getAttachment = ({ message }, useAttachment, partIndex) => {
3537
+ var getAttachment = ({ message }, useAttachment2, partIndex) => {
3441
3538
  if (message.role !== "user") return null;
3442
3539
  const attachments = message.attachments;
3443
- let attachment = attachments[partIndex];
3540
+ const attachment = attachments[partIndex];
3444
3541
  if (!attachment) return null;
3445
- const currentState = useAttachment?.getState();
3542
+ const currentState = useAttachment2?.getState();
3446
3543
  if (currentState && currentState.attachment === attachment) return null;
3447
3544
  return Object.freeze({ attachment });
3448
3545
  };
3449
- var useMessageAttachmentContext = (partIndex) => {
3450
- const { useMessage } = useMessageContext();
3546
+ var useMessageAttachmentContext2 = (partIndex) => {
3547
+ const messageStore = useMessageStore();
3451
3548
  const [context] = useState12(
3452
3549
  () => {
3453
- const useAttachment = create14(
3454
- () => getAttachment(useMessage.getState(), void 0, partIndex)
3550
+ const useAttachment2 = create13(
3551
+ () => getAttachment(messageStore.getState(), void 0, partIndex)
3455
3552
  );
3456
- return { type: "message", useAttachment };
3553
+ return { type: "message", useAttachment: useAttachment2 };
3457
3554
  }
3458
3555
  );
3459
3556
  useEffect10(() => {
@@ -3466,16 +3563,16 @@ var useMessageAttachmentContext = (partIndex) => {
3466
3563
  if (!newState) return;
3467
3564
  writableStore(context.useAttachment).setState(newState, true);
3468
3565
  };
3469
- syncAttachment(useMessage.getState());
3470
- return useMessage.subscribe(syncAttachment);
3471
- }, [context, useMessage, partIndex]);
3566
+ syncAttachment(messageStore.getState());
3567
+ return messageStore.subscribe(syncAttachment);
3568
+ }, [context, messageStore, partIndex]);
3472
3569
  return context;
3473
3570
  };
3474
3571
  var MessageAttachmentProvider = ({
3475
3572
  attachmentIndex: partIndex,
3476
3573
  children
3477
3574
  }) => {
3478
- const context = useMessageAttachmentContext(partIndex);
3575
+ const context = useMessageAttachmentContext2(partIndex);
3479
3576
  return /* @__PURE__ */ jsx24(AttachmentContext.Provider, { value: context, children });
3480
3577
  };
3481
3578
 
@@ -3496,8 +3593,7 @@ var getComponent = (components, attachment) => {
3496
3593
  }
3497
3594
  };
3498
3595
  var AttachmentComponent = ({ components }) => {
3499
- const { useAttachment } = useAttachmentContext({ type: "message" });
3500
- const Component = useAttachment(
3596
+ const Component = useMessageAttachment(
3501
3597
  (a) => getComponent(components, a.attachment)
3502
3598
  );
3503
3599
  if (!Component) return null;
@@ -3511,7 +3607,6 @@ var MessageAttachment = memo3(
3511
3607
  (prev, next) => prev.attachmentIndex === next.attachmentIndex && prev.components?.Image === next.components?.Image && prev.components?.Document === next.components?.Document && prev.components?.File === next.components?.File && prev.components?.Attachment === next.components?.Attachment
3512
3608
  );
3513
3609
  var MessagePrimitiveAttachments = ({ components }) => {
3514
- const { useMessage } = useMessageContext();
3515
3610
  const attachmentsCount = useMessage(({ message }) => {
3516
3611
  if (message.role !== "user") return 0;
3517
3612
  return message.attachments.length;
@@ -3593,8 +3688,8 @@ var ComposerPrimitiveInput = forwardRef16(
3593
3688
  onKeyDown,
3594
3689
  ...rest
3595
3690
  }, forwardedRef) => {
3596
- const { useThread } = useThreadContext();
3597
- const { useComposer, type } = useComposerContext();
3691
+ const threadStore = useThreadStore();
3692
+ const composerStore = useComposerStore();
3598
3693
  const value = useComposer((c) => {
3599
3694
  if (!c.isEditing) return "";
3600
3695
  return c.text;
@@ -3604,7 +3699,7 @@ var ComposerPrimitiveInput = forwardRef16(
3604
3699
  const textareaRef = useRef4(null);
3605
3700
  const ref = useComposedRefs2(forwardedRef, textareaRef);
3606
3701
  useEscapeKeydown2((e) => {
3607
- const composer = useComposer.getState();
3702
+ const composer = composerStore.getState();
3608
3703
  if (composer.canCancel) {
3609
3704
  composer.cancel();
3610
3705
  e.preventDefault();
@@ -3614,7 +3709,7 @@ var ComposerPrimitiveInput = forwardRef16(
3614
3709
  if (isDisabled) return;
3615
3710
  if (e.nativeEvent.isComposing) return;
3616
3711
  if (e.key === "Enter" && e.shiftKey === false) {
3617
- const { isRunning } = useThread.getState();
3712
+ const { isRunning } = threadStore.getState();
3618
3713
  if (!isRunning) {
3619
3714
  e.preventDefault();
3620
3715
  textareaRef.current?.closest("form")?.requestSubmit();
@@ -3633,7 +3728,7 @@ var ComposerPrimitiveInput = forwardRef16(
3633
3728
  }, [autoFocusEnabled]);
3634
3729
  useEffect11(() => focus(), [focus]);
3635
3730
  useOnComposerFocus(() => {
3636
- if (type === "new") {
3731
+ if (composerStore.getState().type === "thread") {
3637
3732
  focus();
3638
3733
  }
3639
3734
  });
@@ -3646,7 +3741,7 @@ var ComposerPrimitiveInput = forwardRef16(
3646
3741
  ref,
3647
3742
  disabled: isDisabled,
3648
3743
  onChange: composeEventHandlers6(onChange, (e) => {
3649
- const composerState = useComposer.getState();
3744
+ const composerState = composerStore.getState();
3650
3745
  if (!composerState.isEditing) return;
3651
3746
  return composerState.setText(e.target.value);
3652
3747
  }),
@@ -3680,23 +3775,23 @@ import { memo as memo4 } from "react";
3680
3775
 
3681
3776
  // src/context/providers/ComposerAttachmentProvider.tsx
3682
3777
  import { useEffect as useEffect12, useState as useState13 } from "react";
3683
- import { create as create15 } from "zustand";
3778
+ import { create as create14 } from "zustand";
3684
3779
  import { jsx as jsx29 } from "react/jsx-runtime";
3685
- var getAttachment2 = ({ attachments }, useAttachment, partIndex) => {
3686
- let attachment = attachments[partIndex];
3780
+ var getAttachment2 = ({ attachments }, useAttachment2, partIndex) => {
3781
+ const attachment = attachments[partIndex];
3687
3782
  if (!attachment) return null;
3688
- const currentState = useAttachment?.getState();
3783
+ const currentState = useAttachment2?.getState();
3689
3784
  if (currentState && currentState.attachment === attachment) return null;
3690
3785
  return Object.freeze({ attachment });
3691
3786
  };
3692
- var useComposerAttachmentContext = (partIndex) => {
3693
- const { useComposer } = useThreadContext();
3787
+ var useComposerAttachmentContext2 = (partIndex) => {
3788
+ const threadComposerStore = useThreadComposerStore();
3694
3789
  const [context] = useState13(
3695
3790
  () => {
3696
- const useAttachment = create15(
3697
- () => getAttachment2(useComposer.getState(), void 0, partIndex)
3791
+ const useAttachment2 = create14(
3792
+ () => getAttachment2(threadComposerStore.getState(), void 0, partIndex)
3698
3793
  );
3699
- return { type: "composer", useAttachment };
3794
+ return { type: "composer", useAttachment: useAttachment2 };
3700
3795
  }
3701
3796
  );
3702
3797
  useEffect12(() => {
@@ -3709,13 +3804,13 @@ var useComposerAttachmentContext = (partIndex) => {
3709
3804
  if (!newState) return;
3710
3805
  writableStore(context.useAttachment).setState(newState, true);
3711
3806
  };
3712
- syncAttachment(useComposer.getState());
3713
- return useComposer.subscribe(syncAttachment);
3714
- }, [context, useComposer, partIndex]);
3807
+ syncAttachment(threadComposerStore.getState());
3808
+ return threadComposerStore.subscribe(syncAttachment);
3809
+ }, [context, threadComposerStore, partIndex]);
3715
3810
  return context;
3716
3811
  };
3717
3812
  var ComposerAttachmentProvider = ({ attachmentIndex: partIndex, children }) => {
3718
- const context = useComposerAttachmentContext(partIndex);
3813
+ const context = useComposerAttachmentContext2(partIndex);
3719
3814
  return /* @__PURE__ */ jsx29(AttachmentContext.Provider, { value: context, children });
3720
3815
  };
3721
3816
 
@@ -3736,8 +3831,7 @@ var getComponent2 = (components, attachment) => {
3736
3831
  }
3737
3832
  };
3738
3833
  var AttachmentComponent2 = ({ components }) => {
3739
- const { useAttachment } = useAttachmentContext({ type: "composer" });
3740
- const Component = useAttachment(
3834
+ const Component = useComposerAttachment(
3741
3835
  (a) => getComponent2(components, a.attachment)
3742
3836
  );
3743
3837
  if (!Component) return null;
@@ -3751,8 +3845,7 @@ var ComposerAttachment = memo4(
3751
3845
  (prev, next) => prev.attachmentIndex === next.attachmentIndex && prev.components?.Image === next.components?.Image && prev.components?.Document === next.components?.Document && prev.components?.File === next.components?.File && prev.components?.Attachment === next.components?.Attachment
3752
3846
  );
3753
3847
  var ComposerPrimitiveAttachments = ({ components }) => {
3754
- const { useComposer } = useThreadContext();
3755
- const attachmentsCount = useComposer((s) => s.attachments.length);
3848
+ const attachmentsCount = useThreadComposer((s) => s.attachments.length);
3756
3849
  return Array.from({ length: attachmentsCount }, (_, index) => /* @__PURE__ */ jsx30(
3757
3850
  ComposerAttachment,
3758
3851
  {
@@ -3877,12 +3970,12 @@ import { useCallbackRef as useCallbackRef4 } from "@radix-ui/react-use-callback-
3877
3970
  import { useEffect as useEffect13 } from "react";
3878
3971
  var useOnScrollToBottom = (callback) => {
3879
3972
  const callbackRef = useCallbackRef4(callback);
3880
- const { useViewport } = useThreadContext();
3973
+ const threadViewportStore = useThreadViewportStore();
3881
3974
  useEffect13(() => {
3882
- return useViewport.getState().onScrollToBottom(() => {
3975
+ return threadViewportStore.getState().onScrollToBottom(() => {
3883
3976
  callbackRef();
3884
3977
  });
3885
- }, [useViewport, callbackRef]);
3978
+ }, [threadViewportStore, callbackRef]);
3886
3979
  };
3887
3980
 
3888
3981
  // src/primitive-hooks/thread/useThreadViewportAutoScroll.tsx
@@ -3890,7 +3983,7 @@ var useThreadViewportAutoScroll = ({
3890
3983
  autoScroll = true
3891
3984
  }) => {
3892
3985
  const divRef = useRef5(null);
3893
- const { useViewport } = useThreadContext();
3986
+ const threadViewportStore = useThreadViewportStore();
3894
3987
  const lastScrollTop = useRef5(0);
3895
3988
  const isScrollingToBottomRef = useRef5(false);
3896
3989
  const scrollToBottom = (behavior) => {
@@ -3902,7 +3995,7 @@ var useThreadViewportAutoScroll = ({
3902
3995
  const handleScroll = () => {
3903
3996
  const div = divRef.current;
3904
3997
  if (!div) return;
3905
- const isAtBottom = useViewport.getState().isAtBottom;
3998
+ const isAtBottom = threadViewportStore.getState().isAtBottom;
3906
3999
  const newIsAtBottom = div.scrollHeight - div.scrollTop <= div.clientHeight + 1;
3907
4000
  if (!newIsAtBottom && lastScrollTop.current < div.scrollTop) {
3908
4001
  } else {
@@ -3910,13 +4003,15 @@ var useThreadViewportAutoScroll = ({
3910
4003
  isScrollingToBottomRef.current = false;
3911
4004
  }
3912
4005
  if (newIsAtBottom !== isAtBottom) {
3913
- writableStore(useViewport).setState({ isAtBottom: newIsAtBottom });
4006
+ writableStore(threadViewportStore).setState({
4007
+ isAtBottom: newIsAtBottom
4008
+ });
3914
4009
  }
3915
4010
  }
3916
4011
  lastScrollTop.current = div.scrollTop;
3917
4012
  };
3918
4013
  const resizeRef = useOnResizeContent(() => {
3919
- if (isScrollingToBottomRef.current || useViewport.getState().isAtBottom) {
4014
+ if (isScrollingToBottomRef.current || threadViewportStore.getState().isAtBottom) {
3920
4015
  scrollToBottom("instant");
3921
4016
  }
3922
4017
  handleScroll();
@@ -3936,7 +4031,7 @@ var useThreadViewportAutoScroll = ({
3936
4031
 
3937
4032
  // src/primitives/thread/ThreadViewport.tsx
3938
4033
  import { jsx as jsx32 } from "react/jsx-runtime";
3939
- var ThreadPrimitiveViewport = forwardRef18(({ autoScroll, onScroll, children, ...rest }, forwardedRef) => {
4034
+ var ThreadPrimitiveViewport = forwardRef18(({ autoScroll, children, ...rest }, forwardedRef) => {
3940
4035
  const autoScrollRef = useThreadViewportAutoScroll({
3941
4036
  autoScroll
3942
4037
  });
@@ -3950,14 +4045,15 @@ import { memo as memo5 } from "react";
3950
4045
 
3951
4046
  // src/context/providers/MessageProvider.tsx
3952
4047
  import { useEffect as useEffect14, useState as useState14 } from "react";
3953
- import { create as create18 } from "zustand";
4048
+ import { create as create17 } from "zustand";
3954
4049
 
3955
4050
  // src/context/stores/EditComposer.ts
3956
- import { create as create16 } from "zustand";
4051
+ import { create as create15 } from "zustand";
3957
4052
  var makeEditComposerStore = ({
3958
4053
  onEdit,
3959
4054
  onSend
3960
- }) => create16()((set, get) => ({
4055
+ }) => create15()((set, get) => ({
4056
+ type: "edit",
3961
4057
  get value() {
3962
4058
  return get().text;
3963
4059
  },
@@ -3991,8 +4087,8 @@ var makeEditComposerStore = ({
3991
4087
  }));
3992
4088
 
3993
4089
  // src/context/stores/MessageUtils.ts
3994
- import { create as create17 } from "zustand";
3995
- var makeMessageUtilsStore = () => create17((set) => {
4090
+ import { create as create16 } from "zustand";
4091
+ var makeMessageUtilsStore = () => create16((set) => {
3996
4092
  let utterance = null;
3997
4093
  return {
3998
4094
  isCopied: false,
@@ -4022,13 +4118,13 @@ import { jsx as jsx33 } from "react/jsx-runtime";
4022
4118
  var getIsLast = (messages, message) => {
4023
4119
  return messages[messages.length - 1]?.id === message.id;
4024
4120
  };
4025
- var getMessageState = (messages, getBranches, useMessage, messageIndex) => {
4121
+ var getMessageState = (messages, getBranches, useMessage2, messageIndex) => {
4026
4122
  const parentId = messages[messageIndex - 1]?.id ?? null;
4027
4123
  const message = messages[messageIndex];
4028
4124
  if (!message) return null;
4029
4125
  const isLast = getIsLast(messages, message);
4030
4126
  const branches = getBranches(message.id);
4031
- const currentState = useMessage?.getState();
4127
+ const currentState = useMessage2?.getState();
4032
4128
  if (currentState && currentState.message === message && currentState.parentId === parentId && currentState.branches === branches && currentState.isLast === isLast)
4033
4129
  return null;
4034
4130
  return Object.freeze({
@@ -4039,31 +4135,32 @@ var getMessageState = (messages, getBranches, useMessage, messageIndex) => {
4039
4135
  });
4040
4136
  };
4041
4137
  var useMessageContext2 = (messageIndex) => {
4042
- const { useThreadMessages, useThreadActions } = useThreadContext();
4138
+ const threadMessagesStore = useThreadMessagesStore();
4139
+ const threadActionsStore = useThreadActionsStore();
4043
4140
  const [context] = useState14(() => {
4044
- const useMessage = create18(
4141
+ const useMessage2 = create17(
4045
4142
  () => getMessageState(
4046
- useThreadMessages.getState(),
4047
- useThreadActions.getState().getBranches,
4143
+ threadMessagesStore.getState(),
4144
+ threadActionsStore.getState().getBranches,
4048
4145
  void 0,
4049
4146
  messageIndex
4050
4147
  )
4051
4148
  );
4052
- const useMessageUtils = makeMessageUtilsStore();
4053
- const useEditComposer = makeEditComposerStore({
4149
+ const useMessageUtils2 = makeMessageUtilsStore();
4150
+ const useEditComposer2 = makeEditComposerStore({
4054
4151
  onEdit: () => {
4055
- const message = useMessage.getState().message;
4152
+ const message = useMessage2.getState().message;
4056
4153
  const text = getThreadMessageText(message);
4057
4154
  return text;
4058
4155
  },
4059
4156
  onSend: (text) => {
4060
- const { message, parentId } = useMessage.getState();
4157
+ const { message, parentId } = useMessage2.getState();
4061
4158
  const previousText = getThreadMessageText(message);
4062
4159
  if (previousText === text) return;
4063
4160
  const nonTextParts = message.content.filter(
4064
4161
  (part) => part.type !== "text" && part.type !== "ui"
4065
4162
  );
4066
- useThreadActions.getState().append({
4163
+ threadActionsStore.getState().append({
4067
4164
  parentId,
4068
4165
  role: message.role,
4069
4166
  content: [{ type: "text", text }, ...nonTextParts],
@@ -4071,22 +4168,22 @@ var useMessageContext2 = (messageIndex) => {
4071
4168
  });
4072
4169
  }
4073
4170
  });
4074
- return { useMessage, useMessageUtils, useEditComposer };
4171
+ return { useMessage: useMessage2, useMessageUtils: useMessageUtils2, useEditComposer: useEditComposer2 };
4075
4172
  });
4076
4173
  useEffect14(() => {
4077
4174
  const syncMessage = (thread) => {
4078
4175
  const newState = getMessageState(
4079
4176
  thread,
4080
- useThreadActions.getState().getBranches,
4177
+ threadActionsStore.getState().getBranches,
4081
4178
  context.useMessage,
4082
4179
  messageIndex
4083
4180
  );
4084
4181
  if (!newState) return;
4085
4182
  writableStore(context.useMessage).setState(newState, true);
4086
4183
  };
4087
- syncMessage(useThreadMessages.getState());
4088
- return useThreadMessages.subscribe(syncMessage);
4089
- }, [useThreadMessages, useThreadActions, context, messageIndex]);
4184
+ syncMessage(threadMessagesStore.getState());
4185
+ return threadMessagesStore.subscribe(syncMessage);
4186
+ }, [threadMessagesStore, threadActionsStore, context, messageIndex]);
4090
4187
  return context;
4091
4188
  };
4092
4189
  var MessageProvider = ({
@@ -4131,7 +4228,6 @@ var getComponent3 = (components, role, isEditing) => {
4131
4228
  var ThreadMessageComponent = ({
4132
4229
  components
4133
4230
  }) => {
4134
- const { useMessage, useEditComposer } = useMessageContext();
4135
4231
  const role = useMessage((m) => m.message.role);
4136
4232
  const isEditing = useEditComposer((c) => c.isEditing);
4137
4233
  const Component = getComponent3(components, role, isEditing);
@@ -4150,7 +4246,6 @@ var ThreadMessage = memo5(
4150
4246
  var ThreadPrimitiveMessagesImpl = ({
4151
4247
  components
4152
4248
  }) => {
4153
- const { useThreadMessages } = useThreadContext();
4154
4249
  const messagesLength = useThreadMessages((t) => t.length);
4155
4250
  if (messagesLength === 0) return null;
4156
4251
  return Array.from({ length: messagesLength }, (_, index) => /* @__PURE__ */ jsx34(ThreadMessage, { messageIndex: index, components }, index));
@@ -4177,21 +4272,21 @@ var ThreadPrimitiveSuggestion = createActionButton(
4177
4272
  // src/ui/thread-config.tsx
4178
4273
  import {
4179
4274
  createContext as createContext7,
4180
- useContext as useContext7
4275
+ useContext as useContext4
4181
4276
  } from "react";
4182
4277
  import { Fragment as Fragment3, jsx as jsx35 } from "react/jsx-runtime";
4183
4278
  var ThreadConfigContext = createContext7({});
4184
4279
  var useThreadConfig = () => {
4185
- return useContext7(ThreadConfigContext);
4280
+ return useContext4(ThreadConfigContext);
4186
4281
  };
4187
4282
  var ThreadConfigProvider = ({
4188
4283
  children,
4189
4284
  config
4190
4285
  }) => {
4191
- const assistant = useAssistantContext({ optional: true });
4286
+ const hasAssistant = !!useAssistantRuntimeStore({ optional: true });
4192
4287
  const configProvider = config && Object.keys(config ?? {}).length > 0 ? /* @__PURE__ */ jsx35(ThreadConfigContext.Provider, { value: config, children }) : /* @__PURE__ */ jsx35(Fragment3, { children });
4193
4288
  if (!config?.runtime) return configProvider;
4194
- if (assistant) {
4289
+ if (hasAssistant) {
4195
4290
  throw new Error(
4196
4291
  "You provided a runtime to <Thread> while simulataneously using <AssistantRuntimeProvider>. This is not allowed."
4197
4292
  );
@@ -4212,19 +4307,16 @@ import {
4212
4307
  import { Fragment as Fragment4, jsx as jsx36, jsxs as jsxs4 } from "react/jsx-runtime";
4213
4308
  var useAllowCopy = (ensureCapability = false) => {
4214
4309
  const { assistantMessage: { allowCopy = true } = {} } = useThreadConfig();
4215
- const { useThread } = useThreadContext();
4216
4310
  const copySupported = useThread((t) => t.capabilities.unstable_copy);
4217
4311
  return allowCopy && (!ensureCapability || copySupported);
4218
4312
  };
4219
4313
  var useAllowSpeak = (ensureCapability = false) => {
4220
4314
  const { assistantMessage: { allowSpeak = true } = {} } = useThreadConfig();
4221
- const { useThread } = useThreadContext();
4222
4315
  const speakSupported = useThread((t) => t.capabilities.speak);
4223
4316
  return allowSpeak && (!ensureCapability || speakSupported);
4224
4317
  };
4225
4318
  var useAllowReload = (ensureCapability = false) => {
4226
4319
  const { assistantMessage: { allowReload = true } = {} } = useThreadConfig();
4227
- const { useThread } = useThreadContext();
4228
4320
  const reloadSupported = useThread((t) => t.capabilities.reload);
4229
4321
  return allowReload && (!ensureCapability || reloadSupported);
4230
4322
  };
@@ -4324,7 +4416,6 @@ import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
4324
4416
  import { jsx as jsx37, jsxs as jsxs5 } from "react/jsx-runtime";
4325
4417
  var useAllowBranchPicker = (ensureCapability = false) => {
4326
4418
  const { branchPicker: { allowBranchPicker = true } = {} } = useThreadConfig();
4327
- const { useThread } = useThreadContext();
4328
4419
  const branchPickerSupported = useThread((t) => t.capabilities.edit);
4329
4420
  return allowBranchPicker && (!ensureCapability || branchPickerSupported);
4330
4421
  };
@@ -4518,8 +4609,7 @@ var ComposerAttachmentRoot = withDefaults("div", {
4518
4609
  });
4519
4610
  ComposerAttachmentRoot.displayName = "ComposerAttachmentRoot";
4520
4611
  var ComposerAttachment2 = () => {
4521
- const { useAttachment } = useAttachmentContext({ type: "composer" });
4522
- const attachment = useAttachment((a) => a.attachment);
4612
+ const attachment = useComposerAttachment((a) => a.attachment);
4523
4613
  return /* @__PURE__ */ jsxs8(ComposerAttachmentRoot, { children: [
4524
4614
  ".",
4525
4615
  attachment.name.split(".").pop(),
@@ -4533,10 +4623,10 @@ var ComposerAttachmentRemove = forwardRef22((props, ref) => {
4533
4623
  composer: { removeAttachment: { tooltip = "Remove file" } = {} } = {}
4534
4624
  } = {}
4535
4625
  } = useThreadConfig();
4536
- const { useComposer } = useThreadContext();
4537
- const { useAttachment } = useAttachmentContext();
4626
+ const composerStore = useThreadComposerStore();
4627
+ const attachmentStore = useAttachmentStore();
4538
4628
  const handleRemoveAttachment = () => {
4539
- useComposer.getState().removeAttachment(useAttachment.getState().attachment.id);
4629
+ composerStore.getState().removeAttachment(attachmentStore.getState().attachment.id);
4540
4630
  };
4541
4631
  return /* @__PURE__ */ jsx42(
4542
4632
  TooltipIconButton,
@@ -4565,7 +4655,6 @@ var composer_attachment_default = Object.assign(
4565
4655
  import { Fragment as Fragment5, jsx as jsx43, jsxs as jsxs9 } from "react/jsx-runtime";
4566
4656
  var useAllowAttachments = (ensureCapability = false) => {
4567
4657
  const { composer: { allowAttachments = true } = {} } = useThreadConfig();
4568
- const { useThread } = useThreadContext();
4569
4658
  const attachmentsSupported = useThread((t) => t.capabilities.attachments);
4570
4659
  return allowAttachments && (!ensureCapability || attachmentsSupported);
4571
4660
  };
@@ -4637,7 +4726,6 @@ var ComposerAddAttachment = forwardRef23((props, ref) => {
4637
4726
  });
4638
4727
  ComposerAddAttachment.displayName = "ComposerAddAttachment";
4639
4728
  var useAllowCancel = () => {
4640
- const { useThread } = useThreadContext();
4641
4729
  const cancelSupported = useThread((t) => t.capabilities.cancel);
4642
4730
  return cancelSupported;
4643
4731
  };
@@ -4766,7 +4854,6 @@ import { PencilIcon } from "lucide-react";
4766
4854
  import { jsx as jsx45 } from "react/jsx-runtime";
4767
4855
  var useAllowEdit = (ensureCapability = false) => {
4768
4856
  const { userMessage: { allowEdit = true } = {} } = useThreadConfig();
4769
- const { useThread } = useThreadContext();
4770
4857
  const editSupported = useThread((t) => t.capabilities.edit);
4771
4858
  return allowEdit && (!ensureCapability || editSupported);
4772
4859
  };
@@ -4801,7 +4888,6 @@ var UserMessageAttachmentRoot = withDefaults("div", {
4801
4888
  });
4802
4889
  UserMessageAttachmentRoot.displayName = "UserMessageAttachmentRoot";
4803
4890
  var UserMessageAttachment = () => {
4804
- const { useAttachment } = useAttachmentContext();
4805
4891
  const attachment = useAttachment((a) => a.attachment);
4806
4892
  return /* @__PURE__ */ jsxs11(UserMessageAttachmentRoot, { children: [
4807
4893
  ".",
@@ -5123,36 +5209,64 @@ export {
5123
5209
  useActionBarSpeak,
5124
5210
  useActionBarStopSpeaking,
5125
5211
  useAppendMessage,
5212
+ useAssistantActions,
5213
+ useAssistantActionsStore,
5126
5214
  useAssistantContext,
5127
5215
  useAssistantInstructions,
5216
+ useAssistantRuntime,
5217
+ useAssistantRuntimeStore,
5128
5218
  useAssistantTool,
5129
5219
  useAssistantToolUI,
5130
5220
  useBranchPickerCount,
5131
5221
  useBranchPickerNext,
5132
5222
  useBranchPickerNumber,
5133
5223
  useBranchPickerPrevious,
5224
+ useComposer,
5134
5225
  useComposerAddAttachment,
5135
5226
  useComposerCancel,
5136
5227
  useComposerContext,
5137
5228
  useComposerIf,
5138
5229
  useComposerSend,
5230
+ useComposerStore,
5231
+ useContentPart,
5139
5232
  useContentPartContext,
5140
5233
  useContentPartDisplay,
5141
5234
  useContentPartImage,
5235
+ useContentPartStore,
5142
5236
  useContentPartText,
5143
5237
  useDangerousInBrowserRuntime,
5144
5238
  useEdgeRuntime,
5239
+ useEditComposer,
5240
+ useEditComposerStore,
5145
5241
  useExternalMessageConverter,
5146
5242
  useExternalStoreRuntime,
5147
5243
  useLocalRuntime,
5244
+ useMessage,
5148
5245
  useMessageContext,
5149
5246
  useMessageIf,
5247
+ useMessageStore,
5248
+ useMessageUtils,
5249
+ useMessageUtilsStore,
5150
5250
  useSwitchToNewThread,
5251
+ useThread,
5252
+ useThreadActions,
5253
+ useThreadActionsStore,
5254
+ useThreadComposer,
5255
+ useThreadComposerStore,
5151
5256
  useThreadConfig,
5152
5257
  useThreadContext,
5153
5258
  useThreadEmpty,
5154
5259
  useThreadIf,
5260
+ useThreadMessages,
5261
+ useThreadMessagesStore,
5262
+ useThreadRuntime,
5263
+ useThreadRuntimeStore,
5155
5264
  useThreadScrollToBottom,
5156
- useThreadSuggestion
5265
+ useThreadStore,
5266
+ useThreadSuggestion,
5267
+ useThreadViewport,
5268
+ useThreadViewportStore,
5269
+ useToolUIs,
5270
+ useToolUIsStore
5157
5271
  };
5158
5272
  //# sourceMappingURL=index.mjs.map