@assistant-ui/mcp-docs-server 0.1.10 → 0.1.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.docs/organized/code-examples/with-ai-sdk-v5.md +21 -21
- package/.docs/organized/code-examples/with-assistant-transport.md +24 -24
- package/.docs/organized/code-examples/with-cloud.md +18 -18
- package/.docs/organized/code-examples/with-external-store.md +15 -15
- package/.docs/organized/code-examples/with-ffmpeg.md +18 -18
- package/.docs/organized/code-examples/with-langgraph.md +18 -18
- package/.docs/organized/code-examples/with-parent-id-grouping.md +15 -15
- package/.docs/organized/code-examples/with-react-hook-form.md +23 -23
- package/.docs/raw/docs/cloud/persistence/langgraph.mdx +22 -2
- package/.docs/raw/docs/getting-started.mdx +541 -150
- package/.docs/raw/docs/guides/Attachments.mdx +21 -0
- package/.docs/raw/docs/runtimes/ai-sdk/use-chat.mdx +2 -2
- package/.docs/raw/docs/runtimes/custom/custom-thread-list.mdx +218 -0
- package/.docs/raw/docs/runtimes/custom/external-store.mdx +31 -24
- package/.docs/raw/docs/runtimes/mastra/separate-server-integration.mdx +8 -3
- package/.docs/raw/docs/runtimes/pick-a-runtime.mdx +1 -1
- package/.docs/raw/docs/ui/AssistantModal.mdx +21 -0
- package/.docs/raw/docs/ui/AssistantSidebar.mdx +21 -0
- package/.docs/raw/docs/ui/Attachment.mdx +21 -0
- package/.docs/raw/docs/ui/Markdown.mdx +22 -1
- package/.docs/raw/docs/ui/Mermaid.mdx +22 -1
- package/.docs/raw/docs/ui/SyntaxHighlighting.mdx +43 -2
- package/.docs/raw/docs/ui/Thread.mdx +9 -3
- package/.docs/raw/docs/ui/ThreadList.mdx +48 -2
- package/.docs/raw/docs/ui/ToolFallback.mdx +21 -0
- package/package.json +5 -5
|
@@ -326,7 +326,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
326
326
|
h2: ({ className, ...props }) => (
|
|
327
327
|
<h2
|
|
328
328
|
className={cn(
|
|
329
|
-
"mb-4
|
|
329
|
+
"mt-8 mb-4 scroll-m-20 text-3xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
330
330
|
className,
|
|
331
331
|
)}
|
|
332
332
|
{...props}
|
|
@@ -335,7 +335,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
335
335
|
h3: ({ className, ...props }) => (
|
|
336
336
|
<h3
|
|
337
337
|
className={cn(
|
|
338
|
-
"mb-4
|
|
338
|
+
"mt-6 mb-4 scroll-m-20 text-2xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
339
339
|
className,
|
|
340
340
|
)}
|
|
341
341
|
{...props}
|
|
@@ -344,7 +344,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
344
344
|
h4: ({ className, ...props }) => (
|
|
345
345
|
<h4
|
|
346
346
|
className={cn(
|
|
347
|
-
"mb-4
|
|
347
|
+
"mt-6 mb-4 scroll-m-20 text-xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
348
348
|
className,
|
|
349
349
|
)}
|
|
350
350
|
{...props}
|
|
@@ -367,7 +367,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
367
367
|
),
|
|
368
368
|
p: ({ className, ...props }) => (
|
|
369
369
|
<p
|
|
370
|
-
className={cn("
|
|
370
|
+
className={cn("mt-5 mb-5 leading-7 first:mt-0 last:mb-0", className)}
|
|
371
371
|
{...props}
|
|
372
372
|
/>
|
|
373
373
|
),
|
|
@@ -566,7 +566,7 @@ const ThreadWelcomeSuggestions: FC = () => {
|
|
|
566
566
|
method="replace"
|
|
567
567
|
autoSend
|
|
568
568
|
>
|
|
569
|
-
<span className="line-clamp-2 text-
|
|
569
|
+
<span className="line-clamp-2 text-sm font-semibold text-ellipsis">
|
|
570
570
|
What is the weather in Tokyo?
|
|
571
571
|
</span>
|
|
572
572
|
</ThreadPrimitive.Suggestion>
|
|
@@ -576,7 +576,7 @@ const ThreadWelcomeSuggestions: FC = () => {
|
|
|
576
576
|
method="replace"
|
|
577
577
|
autoSend
|
|
578
578
|
>
|
|
579
|
-
<span className="line-clamp-2 text-
|
|
579
|
+
<span className="line-clamp-2 text-sm font-semibold text-ellipsis">
|
|
580
580
|
What is assistant-ui?
|
|
581
581
|
</span>
|
|
582
582
|
</ThreadPrimitive.Suggestion>
|
|
@@ -632,7 +632,7 @@ const UserMessage: FC = () => {
|
|
|
632
632
|
<MessagePrimitive.Root className="grid w-full max-w-[var(--thread-max-width)] auto-rows-auto grid-cols-[minmax(72px,1fr)_auto] gap-y-2 py-4 [&:where(>*)]:col-start-2">
|
|
633
633
|
<UserActionBar />
|
|
634
634
|
|
|
635
|
-
<div className="bg-muted text-foreground col-start-2 row-start-2 max-w-[calc(var(--thread-max-width)*0.8)]
|
|
635
|
+
<div className="bg-muted text-foreground col-start-2 row-start-2 max-w-[calc(var(--thread-max-width)*0.8)] rounded-3xl px-5 py-2.5 break-words">
|
|
636
636
|
<MessagePrimitive.Parts />
|
|
637
637
|
</div>
|
|
638
638
|
|
|
@@ -646,7 +646,7 @@ const UserActionBar: FC = () => {
|
|
|
646
646
|
<ActionBarPrimitive.Root
|
|
647
647
|
hideWhenRunning
|
|
648
648
|
autohide="not-last"
|
|
649
|
-
className="col-start-1 row-start-2
|
|
649
|
+
className="col-start-1 row-start-2 mt-2.5 mr-3 flex flex-col items-end"
|
|
650
650
|
>
|
|
651
651
|
<ActionBarPrimitive.Edit asChild>
|
|
652
652
|
<TooltipIconButton tooltip="Edit">
|
|
@@ -677,7 +677,7 @@ const EditComposer: FC = () => {
|
|
|
677
677
|
const AssistantMessage: FC = () => {
|
|
678
678
|
return (
|
|
679
679
|
<MessagePrimitive.Root className="relative grid w-full max-w-[var(--thread-max-width)] grid-cols-[auto_auto_1fr] grid-rows-[auto_1fr] py-4">
|
|
680
|
-
<div className="text-foreground col-span-2 col-start-2 row-start-1 my-1.5 max-w-[calc(var(--thread-max-width)*0.8)] break-words
|
|
680
|
+
<div className="text-foreground col-span-2 col-start-2 row-start-1 my-1.5 max-w-[calc(var(--thread-max-width)*0.8)] leading-7 break-words">
|
|
681
681
|
<MessagePrimitive.Parts
|
|
682
682
|
components={{ Text: MarkdownText, tools: { Fallback: ToolFallback } }}
|
|
683
683
|
/>
|
|
@@ -686,7 +686,7 @@ const AssistantMessage: FC = () => {
|
|
|
686
686
|
|
|
687
687
|
<AssistantActionBar />
|
|
688
688
|
|
|
689
|
-
<BranchPicker className="col-start-2 row-start-2 -
|
|
689
|
+
<BranchPicker className="col-start-2 row-start-2 mr-2 -ml-2" />
|
|
690
690
|
</MessagePrimitive.Root>
|
|
691
691
|
);
|
|
692
692
|
};
|
|
@@ -986,7 +986,7 @@ function TooltipContent({
|
|
|
986
986
|
data-slot="tooltip-content"
|
|
987
987
|
sideOffset={sideOffset}
|
|
988
988
|
className={cn(
|
|
989
|
-
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-tooltip-content-transform-origin)
|
|
989
|
+
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
|
|
990
990
|
className,
|
|
991
991
|
)}
|
|
992
992
|
{...props}
|
|
@@ -1042,34 +1042,34 @@ export default nextConfig;
|
|
|
1042
1042
|
"version": "0.0.0",
|
|
1043
1043
|
"type": "module",
|
|
1044
1044
|
"dependencies": {
|
|
1045
|
-
"@ai-sdk/openai": "^2.0.
|
|
1046
|
-
"@ai-sdk/react": "^2.0.
|
|
1045
|
+
"@ai-sdk/openai": "^2.0.52",
|
|
1046
|
+
"@ai-sdk/react": "^2.0.76",
|
|
1047
1047
|
"@assistant-ui/react": "workspace:^",
|
|
1048
1048
|
"@assistant-ui/react-ai-sdk": "workspace:*",
|
|
1049
1049
|
"@assistant-ui/react-markdown": "workspace:^",
|
|
1050
1050
|
"@radix-ui/react-slot": "^1.2.3",
|
|
1051
1051
|
"@radix-ui/react-tooltip": "^1.2.8",
|
|
1052
1052
|
"@tailwindcss/postcss": "^4.1.14",
|
|
1053
|
-
"ai": "^5.0.
|
|
1053
|
+
"ai": "^5.0.76",
|
|
1054
1054
|
"class-variance-authority": "^0.7.1",
|
|
1055
1055
|
"clsx": "^2.1.1",
|
|
1056
|
-
"lucide-react": "^0.
|
|
1057
|
-
"next": "15.5.
|
|
1056
|
+
"lucide-react": "^0.546.0",
|
|
1057
|
+
"next": "15.5.6",
|
|
1058
1058
|
"postcss": "^8.5.6",
|
|
1059
1059
|
"react": "19.2.0",
|
|
1060
1060
|
"react-dom": "19.2.0",
|
|
1061
1061
|
"remark-gfm": "^4.0.1",
|
|
1062
1062
|
"tailwind-merge": "^3.3.1",
|
|
1063
1063
|
"tailwindcss": "^4.1.14",
|
|
1064
|
-
"zod": "^4.1.
|
|
1064
|
+
"zod": "^4.1.12"
|
|
1065
1065
|
},
|
|
1066
1066
|
"devDependencies": {
|
|
1067
1067
|
"@assistant-ui/x-buildutils": "workspace:*",
|
|
1068
|
-
"@types/node": "^24.
|
|
1069
|
-
"@types/react": "^19.2.
|
|
1070
|
-
"@types/react-dom": "^19.2.
|
|
1068
|
+
"@types/node": "^24.8.1",
|
|
1069
|
+
"@types/react": "^19.2.2",
|
|
1070
|
+
"@types/react-dom": "^19.2.2",
|
|
1071
1071
|
"eslint": "^9",
|
|
1072
|
-
"eslint-config-next": "15.5.
|
|
1072
|
+
"eslint-config-next": "15.5.6",
|
|
1073
1073
|
"tw-animate-css": "^1.4.0",
|
|
1074
1074
|
"typescript": "^5.9.3"
|
|
1075
1075
|
},
|
|
@@ -174,15 +174,15 @@ import {
|
|
|
174
174
|
AssistantRuntimeProvider,
|
|
175
175
|
AssistantTransportConnectionMetadata,
|
|
176
176
|
makeAssistantTool,
|
|
177
|
+
unstable_createMessageConverter as createMessageConverter,
|
|
178
|
+
useAssistantTransportRuntime,
|
|
177
179
|
} from "@assistant-ui/react";
|
|
178
180
|
import {
|
|
179
181
|
convertLangChainMessages,
|
|
180
182
|
LangChainMessage,
|
|
181
183
|
} from "@assistant-ui/react-langgraph";
|
|
182
|
-
import { useAssistantTransportRuntime } from "@assistant-ui/react";
|
|
183
184
|
import React, { ReactNode } from "react";
|
|
184
185
|
import { z } from "zod";
|
|
185
|
-
import { createMessageConverter } from "../../../packages/react/dist/legacy-runtime/runtime-cores/external-store/createMessageConverter";
|
|
186
186
|
|
|
187
187
|
// Frontend tool with execute function
|
|
188
188
|
const WeatherTool = makeAssistantTool({
|
|
@@ -441,7 +441,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
441
441
|
h2: ({ className, ...props }) => (
|
|
442
442
|
<h2
|
|
443
443
|
className={cn(
|
|
444
|
-
"mb-4
|
|
444
|
+
"mt-8 mb-4 scroll-m-20 text-3xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
445
445
|
className,
|
|
446
446
|
)}
|
|
447
447
|
{...props}
|
|
@@ -450,7 +450,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
450
450
|
h3: ({ className, ...props }) => (
|
|
451
451
|
<h3
|
|
452
452
|
className={cn(
|
|
453
|
-
"mb-4
|
|
453
|
+
"mt-6 mb-4 scroll-m-20 text-2xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
454
454
|
className,
|
|
455
455
|
)}
|
|
456
456
|
{...props}
|
|
@@ -459,7 +459,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
459
459
|
h4: ({ className, ...props }) => (
|
|
460
460
|
<h4
|
|
461
461
|
className={cn(
|
|
462
|
-
"mb-4
|
|
462
|
+
"mt-6 mb-4 scroll-m-20 text-xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
463
463
|
className,
|
|
464
464
|
)}
|
|
465
465
|
{...props}
|
|
@@ -482,7 +482,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
482
482
|
),
|
|
483
483
|
p: ({ className, ...props }) => (
|
|
484
484
|
<p
|
|
485
|
-
className={cn("
|
|
485
|
+
className={cn("mt-5 mb-5 leading-7 first:mt-0 last:mb-0", className)}
|
|
486
486
|
{...props}
|
|
487
487
|
/>
|
|
488
488
|
),
|
|
@@ -755,7 +755,7 @@ const Composer: FC = () => {
|
|
|
755
755
|
<ComposerPrimitive.Root className="relative flex w-full flex-col rounded-2xl focus-within:ring-2 focus-within:ring-black focus-within:ring-offset-2 dark:focus-within:ring-white">
|
|
756
756
|
<ComposerPrimitive.Input
|
|
757
757
|
placeholder="Send a message..."
|
|
758
|
-
className="bg-muted border-border dark:border-muted-foreground/15 focus:outline-primary placeholder:text-muted-foreground max-h-[calc(50dvh)] min-h-16 w-full resize-none rounded-t-2xl border-x border-t px-4 pb-3
|
|
758
|
+
className="bg-muted border-border dark:border-muted-foreground/15 focus:outline-primary placeholder:text-muted-foreground max-h-[calc(50dvh)] min-h-16 w-full resize-none rounded-t-2xl border-x border-t px-4 pt-2 pb-3 text-base outline-none"
|
|
759
759
|
rows={1}
|
|
760
760
|
autoFocus
|
|
761
761
|
aria-label="Message input"
|
|
@@ -832,7 +832,7 @@ const AssistantMessage: FC = () => {
|
|
|
832
832
|
<StarIcon size={14} />
|
|
833
833
|
</div>
|
|
834
834
|
|
|
835
|
-
<div className="text-foreground col-span-2 col-start-2 row-start-1 ml-4 break-words
|
|
835
|
+
<div className="text-foreground col-span-2 col-start-2 row-start-1 ml-4 leading-7 break-words">
|
|
836
836
|
<MessagePrimitive.Content
|
|
837
837
|
components={{
|
|
838
838
|
Text: MarkdownText,
|
|
@@ -844,7 +844,7 @@ const AssistantMessage: FC = () => {
|
|
|
844
844
|
|
|
845
845
|
<AssistantActionBar />
|
|
846
846
|
|
|
847
|
-
<BranchPicker className="col-start-2 row-start-2 -
|
|
847
|
+
<BranchPicker className="col-start-2 row-start-2 mr-2 -ml-2" />
|
|
848
848
|
</motion.div>
|
|
849
849
|
</MessagePrimitive.Root>
|
|
850
850
|
);
|
|
@@ -856,7 +856,7 @@ const AssistantActionBar: FC = () => {
|
|
|
856
856
|
hideWhenRunning
|
|
857
857
|
autohide="not-last"
|
|
858
858
|
autohideFloat="single-branch"
|
|
859
|
-
className="text-muted-foreground data-floating:bg-background data-floating:absolute data-floating:mt-2 data-floating:rounded-md data-floating:border data-floating:p-1 data-floating:shadow-sm
|
|
859
|
+
className="text-muted-foreground data-floating:bg-background col-start-3 row-start-2 mt-3 ml-3 flex gap-1 data-floating:absolute data-floating:mt-2 data-floating:rounded-md data-floating:border data-floating:p-1 data-floating:shadow-sm"
|
|
860
860
|
>
|
|
861
861
|
<ActionBarPrimitive.Copy asChild>
|
|
862
862
|
<TooltipIconButton tooltip="Copy">
|
|
@@ -888,7 +888,7 @@ const UserMessage: FC = () => {
|
|
|
888
888
|
>
|
|
889
889
|
<UserActionBar />
|
|
890
890
|
|
|
891
|
-
<div className="bg-muted text-foreground col-start-2
|
|
891
|
+
<div className="bg-muted text-foreground col-start-2 rounded-3xl px-5 py-2.5 break-words">
|
|
892
892
|
<MessagePrimitive.Content components={{ Text: MarkdownText }} />
|
|
893
893
|
</div>
|
|
894
894
|
|
|
@@ -903,7 +903,7 @@ const UserActionBar: FC = () => {
|
|
|
903
903
|
<ActionBarPrimitive.Root
|
|
904
904
|
hideWhenRunning
|
|
905
905
|
autohide="not-last"
|
|
906
|
-
className="col-start-1
|
|
906
|
+
className="col-start-1 mt-2.5 mr-3 flex flex-col items-end"
|
|
907
907
|
>
|
|
908
908
|
<ActionBarPrimitive.Edit asChild>
|
|
909
909
|
<TooltipIconButton tooltip="Edit">
|
|
@@ -917,7 +917,7 @@ const UserActionBar: FC = () => {
|
|
|
917
917
|
const EditComposer: FC = () => {
|
|
918
918
|
return (
|
|
919
919
|
<div className="mx-auto flex w-full max-w-[var(--thread-max-width)] flex-col gap-4 px-[var(--thread-padding-x)]">
|
|
920
|
-
<ComposerPrimitive.Root className="bg-muted
|
|
920
|
+
<ComposerPrimitive.Root className="bg-muted ml-auto flex w-full max-w-7/8 flex-col rounded-xl">
|
|
921
921
|
<ComposerPrimitive.Input
|
|
922
922
|
className="text-foreground flex min-h-[60px] w-full resize-none bg-transparent p-4 outline-none"
|
|
923
923
|
autoFocus
|
|
@@ -1199,7 +1199,7 @@ function TooltipContent({
|
|
|
1199
1199
|
data-slot="tooltip-content"
|
|
1200
1200
|
sideOffset={sideOffset}
|
|
1201
1201
|
className={cn(
|
|
1202
|
-
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-tooltip-content-transform-origin)
|
|
1202
|
+
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
|
|
1203
1203
|
className,
|
|
1204
1204
|
)}
|
|
1205
1205
|
{...props}
|
|
@@ -1271,12 +1271,12 @@ export default nextConfig;
|
|
|
1271
1271
|
"@radix-ui/react-slot": "^1.2.3",
|
|
1272
1272
|
"@radix-ui/react-tooltip": "^1.2.8",
|
|
1273
1273
|
"@tailwindcss/postcss": "^4.1.14",
|
|
1274
|
-
"assistant-stream": "^0.2.
|
|
1274
|
+
"assistant-stream": "^0.2.36",
|
|
1275
1275
|
"class-variance-authority": "^0.7.1",
|
|
1276
1276
|
"clsx": "^2.1.1",
|
|
1277
|
-
"framer-motion": "^12.23.
|
|
1278
|
-
"lucide-react": "^0.
|
|
1279
|
-
"next": "15.5.
|
|
1277
|
+
"framer-motion": "^12.23.24",
|
|
1278
|
+
"lucide-react": "^0.546.0",
|
|
1279
|
+
"next": "15.5.6",
|
|
1280
1280
|
"postcss": "^8.5.6",
|
|
1281
1281
|
"react": "19.2.0",
|
|
1282
1282
|
"react-dom": "19.2.0",
|
|
@@ -1284,15 +1284,15 @@ export default nextConfig;
|
|
|
1284
1284
|
"tailwind-merge": "^3.3.1",
|
|
1285
1285
|
"tailwindcss": "^4.1.14",
|
|
1286
1286
|
"tailwindcss-animate": "^1.0.7",
|
|
1287
|
-
"zod": "^4.1.
|
|
1287
|
+
"zod": "^4.1.12"
|
|
1288
1288
|
},
|
|
1289
1289
|
"devDependencies": {
|
|
1290
1290
|
"@assistant-ui/x-buildutils": "workspace:*",
|
|
1291
|
-
"@types/node": "^24.
|
|
1292
|
-
"@types/react": "^19.2.
|
|
1293
|
-
"@types/react-dom": "^19.2.
|
|
1291
|
+
"@types/node": "^24.8.1",
|
|
1292
|
+
"@types/react": "^19.2.2",
|
|
1293
|
+
"@types/react-dom": "^19.2.2",
|
|
1294
1294
|
"eslint": "^9",
|
|
1295
|
-
"eslint-config-next": "15.5.
|
|
1295
|
+
"eslint-config-next": "15.5.6",
|
|
1296
1296
|
"tw-animate-css": "^1.4.0",
|
|
1297
1297
|
"typescript": "^5.9.3"
|
|
1298
1298
|
},
|
|
@@ -1447,7 +1447,7 @@ examples/with-assistant-transport/
|
|
|
1447
1447
|
|
|
1448
1448
|
For a complete working backend example, check out:
|
|
1449
1449
|
|
|
1450
|
-
- `
|
|
1450
|
+
- `python/assistant-transport-backend` - Python FastAPI server with assistant-stream integration
|
|
1451
1451
|
|
|
1452
1452
|
## Customization
|
|
1453
1453
|
|
|
@@ -356,7 +356,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
356
356
|
h2: ({ className, ...props }) => (
|
|
357
357
|
<h2
|
|
358
358
|
className={cn(
|
|
359
|
-
"mb-4
|
|
359
|
+
"mt-8 mb-4 scroll-m-20 text-3xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
360
360
|
className,
|
|
361
361
|
)}
|
|
362
362
|
{...props}
|
|
@@ -365,7 +365,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
365
365
|
h3: ({ className, ...props }) => (
|
|
366
366
|
<h3
|
|
367
367
|
className={cn(
|
|
368
|
-
"mb-4
|
|
368
|
+
"mt-6 mb-4 scroll-m-20 text-2xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
369
369
|
className,
|
|
370
370
|
)}
|
|
371
371
|
{...props}
|
|
@@ -374,7 +374,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
374
374
|
h4: ({ className, ...props }) => (
|
|
375
375
|
<h4
|
|
376
376
|
className={cn(
|
|
377
|
-
"mb-4
|
|
377
|
+
"mt-6 mb-4 scroll-m-20 text-xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
378
378
|
className,
|
|
379
379
|
)}
|
|
380
380
|
{...props}
|
|
@@ -397,7 +397,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
397
397
|
),
|
|
398
398
|
p: ({ className, ...props }) => (
|
|
399
399
|
<p
|
|
400
|
-
className={cn("
|
|
400
|
+
className={cn("mt-5 mb-5 leading-7 first:mt-0 last:mb-0", className)}
|
|
401
401
|
{...props}
|
|
402
402
|
/>
|
|
403
403
|
),
|
|
@@ -541,7 +541,7 @@ const ThreadListItems: FC = () => {
|
|
|
541
541
|
|
|
542
542
|
const ThreadListItem: FC = () => {
|
|
543
543
|
return (
|
|
544
|
-
<ThreadListItemPrimitive.Root className="data-[active]:bg-muted hover:bg-muted focus-visible:bg-muted focus-visible:ring-ring flex items-center gap-2 rounded-lg transition-all focus-visible:
|
|
544
|
+
<ThreadListItemPrimitive.Root className="data-[active]:bg-muted hover:bg-muted focus-visible:bg-muted focus-visible:ring-ring flex items-center gap-2 rounded-lg transition-all focus-visible:ring-2 focus-visible:outline-none">
|
|
545
545
|
<ThreadListItemPrimitive.Trigger className="flex-grow px-3 py-2 text-start">
|
|
546
546
|
<ThreadListItemTitle />
|
|
547
547
|
</ThreadListItemPrimitive.Trigger>
|
|
@@ -562,7 +562,7 @@ const ThreadListItemArchive: FC = () => {
|
|
|
562
562
|
return (
|
|
563
563
|
<ThreadListItemPrimitive.Archive asChild>
|
|
564
564
|
<TooltipIconButton
|
|
565
|
-
className="hover:text-primary text-foreground ml-auto
|
|
565
|
+
className="hover:text-primary text-foreground mr-3 ml-auto size-4 p-0"
|
|
566
566
|
variant="ghost"
|
|
567
567
|
tooltip="Archive thread"
|
|
568
568
|
>
|
|
@@ -669,7 +669,7 @@ const ThreadWelcomeSuggestions: FC = () => {
|
|
|
669
669
|
method="replace"
|
|
670
670
|
autoSend
|
|
671
671
|
>
|
|
672
|
-
<span className="line-clamp-2 text-
|
|
672
|
+
<span className="line-clamp-2 text-sm font-semibold text-ellipsis">
|
|
673
673
|
What is the weather in Tokyo?
|
|
674
674
|
</span>
|
|
675
675
|
</ThreadPrimitive.Suggestion>
|
|
@@ -679,7 +679,7 @@ const ThreadWelcomeSuggestions: FC = () => {
|
|
|
679
679
|
method="replace"
|
|
680
680
|
autoSend
|
|
681
681
|
>
|
|
682
|
-
<span className="line-clamp-2 text-
|
|
682
|
+
<span className="line-clamp-2 text-sm font-semibold text-ellipsis">
|
|
683
683
|
What is assistant-ui?
|
|
684
684
|
</span>
|
|
685
685
|
</ThreadPrimitive.Suggestion>
|
|
@@ -735,7 +735,7 @@ const UserMessage: FC = () => {
|
|
|
735
735
|
<MessagePrimitive.Root className="grid w-full max-w-[var(--thread-max-width)] auto-rows-auto grid-cols-[minmax(72px,1fr)_auto] gap-y-2 py-4 [&:where(>*)]:col-start-2">
|
|
736
736
|
<UserActionBar />
|
|
737
737
|
|
|
738
|
-
<div className="bg-muted text-foreground col-start-2 row-start-2 max-w-[calc(var(--thread-max-width)*0.8)]
|
|
738
|
+
<div className="bg-muted text-foreground col-start-2 row-start-2 max-w-[calc(var(--thread-max-width)*0.8)] rounded-3xl px-5 py-2.5 break-words">
|
|
739
739
|
<MessagePrimitive.Parts />
|
|
740
740
|
</div>
|
|
741
741
|
|
|
@@ -749,7 +749,7 @@ const UserActionBar: FC = () => {
|
|
|
749
749
|
<ActionBarPrimitive.Root
|
|
750
750
|
hideWhenRunning
|
|
751
751
|
autohide="not-last"
|
|
752
|
-
className="col-start-1 row-start-2
|
|
752
|
+
className="col-start-1 row-start-2 mt-2.5 mr-3 flex flex-col items-end"
|
|
753
753
|
>
|
|
754
754
|
<ActionBarPrimitive.Edit asChild>
|
|
755
755
|
<TooltipIconButton tooltip="Edit">
|
|
@@ -780,13 +780,13 @@ const EditComposer: FC = () => {
|
|
|
780
780
|
const AssistantMessage: FC = () => {
|
|
781
781
|
return (
|
|
782
782
|
<MessagePrimitive.Root className="relative grid w-full max-w-[var(--thread-max-width)] grid-cols-[auto_auto_1fr] grid-rows-[auto_1fr] py-4">
|
|
783
|
-
<div className="text-foreground col-span-2 col-start-2 row-start-1 my-1.5 max-w-[calc(var(--thread-max-width)*0.8)] break-words
|
|
783
|
+
<div className="text-foreground col-span-2 col-start-2 row-start-1 my-1.5 max-w-[calc(var(--thread-max-width)*0.8)] leading-7 break-words">
|
|
784
784
|
<MessagePrimitive.Parts components={{ Text: MarkdownText }} />
|
|
785
785
|
</div>
|
|
786
786
|
|
|
787
787
|
<AssistantActionBar />
|
|
788
788
|
|
|
789
|
-
<BranchPicker className="col-start-2 row-start-2 -
|
|
789
|
+
<BranchPicker className="col-start-2 row-start-2 mr-2 -ml-2" />
|
|
790
790
|
</MessagePrimitive.Root>
|
|
791
791
|
);
|
|
792
792
|
};
|
|
@@ -1028,7 +1028,7 @@ function TooltipContent({
|
|
|
1028
1028
|
data-slot="tooltip-content"
|
|
1029
1029
|
sideOffset={sideOffset}
|
|
1030
1030
|
className={cn(
|
|
1031
|
-
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-[--radix-tooltip-content-transform-origin]
|
|
1031
|
+
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-[--radix-tooltip-content-transform-origin] rounded-md px-3 py-1.5 text-xs text-balance",
|
|
1032
1032
|
className,
|
|
1033
1033
|
)}
|
|
1034
1034
|
{...props}
|
|
@@ -1090,19 +1090,19 @@ export default nextConfig;
|
|
|
1090
1090
|
"lint": "eslint ."
|
|
1091
1091
|
},
|
|
1092
1092
|
"dependencies": {
|
|
1093
|
-
"@ai-sdk/openai": "^2.0.
|
|
1093
|
+
"@ai-sdk/openai": "^2.0.52",
|
|
1094
1094
|
"@assistant-ui/react": "workspace:*",
|
|
1095
1095
|
"@assistant-ui/react-ai-sdk": "workspace:*",
|
|
1096
1096
|
"@assistant-ui/react-markdown": "workspace:*",
|
|
1097
1097
|
"@radix-ui/react-slot": "^1.2.3",
|
|
1098
1098
|
"@radix-ui/react-tooltip": "^1.2.8",
|
|
1099
|
-
"ai": "^5.0.
|
|
1099
|
+
"ai": "^5.0.76",
|
|
1100
1100
|
"class-variance-authority": "^0.7.1",
|
|
1101
1101
|
"clsx": "^2.1.1",
|
|
1102
1102
|
"jsonwebtoken": "^9.0.2",
|
|
1103
|
-
"lucide-react": "^0.
|
|
1103
|
+
"lucide-react": "^0.546.0",
|
|
1104
1104
|
"nanoid": "5.1.6",
|
|
1105
|
-
"next": "15.5.
|
|
1105
|
+
"next": "15.5.6",
|
|
1106
1106
|
"react": "19.2.0",
|
|
1107
1107
|
"react-dom": "19.2.0",
|
|
1108
1108
|
"remark-gfm": "^4.0.1",
|
|
@@ -1116,7 +1116,7 @@ export default nextConfig;
|
|
|
1116
1116
|
"@types/react": "^19",
|
|
1117
1117
|
"@types/react-dom": "^19",
|
|
1118
1118
|
"eslint": "^9",
|
|
1119
|
-
"eslint-config-next": "15.5.
|
|
1119
|
+
"eslint-config-next": "15.5.6",
|
|
1120
1120
|
"postcss": "^8",
|
|
1121
1121
|
"tailwindcss": "^4.1.14",
|
|
1122
1122
|
"typescript": "^5"
|
|
@@ -343,7 +343,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
343
343
|
h2: ({ className, ...props }) => (
|
|
344
344
|
<h2
|
|
345
345
|
className={cn(
|
|
346
|
-
"mb-4
|
|
346
|
+
"mt-8 mb-4 scroll-m-20 text-3xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
347
347
|
className,
|
|
348
348
|
)}
|
|
349
349
|
{...props}
|
|
@@ -352,7 +352,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
352
352
|
h3: ({ className, ...props }) => (
|
|
353
353
|
<h3
|
|
354
354
|
className={cn(
|
|
355
|
-
"mb-4
|
|
355
|
+
"mt-6 mb-4 scroll-m-20 text-2xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
356
356
|
className,
|
|
357
357
|
)}
|
|
358
358
|
{...props}
|
|
@@ -361,7 +361,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
361
361
|
h4: ({ className, ...props }) => (
|
|
362
362
|
<h4
|
|
363
363
|
className={cn(
|
|
364
|
-
"mb-4
|
|
364
|
+
"mt-6 mb-4 scroll-m-20 text-xl font-semibold tracking-tight first:mt-0 last:mb-0",
|
|
365
365
|
className,
|
|
366
366
|
)}
|
|
367
367
|
{...props}
|
|
@@ -384,7 +384,7 @@ const defaultComponents = memoizeMarkdownComponents({
|
|
|
384
384
|
),
|
|
385
385
|
p: ({ className, ...props }) => (
|
|
386
386
|
<p
|
|
387
|
-
className={cn("
|
|
387
|
+
className={cn("mt-5 mb-5 leading-7 first:mt-0 last:mb-0", className)}
|
|
388
388
|
{...props}
|
|
389
389
|
/>
|
|
390
390
|
),
|
|
@@ -581,7 +581,7 @@ const ThreadWelcomeSuggestions: FC = () => {
|
|
|
581
581
|
method="replace"
|
|
582
582
|
autoSend
|
|
583
583
|
>
|
|
584
|
-
<span className="line-clamp-2 text-
|
|
584
|
+
<span className="line-clamp-2 text-sm font-semibold text-ellipsis">
|
|
585
585
|
What is the weather in Tokyo?
|
|
586
586
|
</span>
|
|
587
587
|
</ThreadPrimitive.Suggestion>
|
|
@@ -591,7 +591,7 @@ const ThreadWelcomeSuggestions: FC = () => {
|
|
|
591
591
|
method="replace"
|
|
592
592
|
autoSend
|
|
593
593
|
>
|
|
594
|
-
<span className="line-clamp-2 text-
|
|
594
|
+
<span className="line-clamp-2 text-sm font-semibold text-ellipsis">
|
|
595
595
|
What is assistant-ui?
|
|
596
596
|
</span>
|
|
597
597
|
</ThreadPrimitive.Suggestion>
|
|
@@ -647,7 +647,7 @@ const UserMessage: FC = () => {
|
|
|
647
647
|
<MessagePrimitive.Root className="grid w-full max-w-[var(--thread-max-width)] auto-rows-auto grid-cols-[minmax(72px,1fr)_auto] gap-y-2 py-4 [&:where(>*)]:col-start-2">
|
|
648
648
|
<UserActionBar />
|
|
649
649
|
|
|
650
|
-
<div className="bg-muted text-foreground col-start-2 row-start-2 max-w-[calc(var(--thread-max-width)*0.8)]
|
|
650
|
+
<div className="bg-muted text-foreground col-start-2 row-start-2 max-w-[calc(var(--thread-max-width)*0.8)] rounded-3xl px-5 py-2.5 break-words">
|
|
651
651
|
<MessagePrimitive.Parts />
|
|
652
652
|
</div>
|
|
653
653
|
|
|
@@ -661,7 +661,7 @@ const UserActionBar: FC = () => {
|
|
|
661
661
|
<ActionBarPrimitive.Root
|
|
662
662
|
hideWhenRunning
|
|
663
663
|
autohide="not-last"
|
|
664
|
-
className="col-start-1 row-start-2
|
|
664
|
+
className="col-start-1 row-start-2 mt-2.5 mr-3 flex flex-col items-end"
|
|
665
665
|
>
|
|
666
666
|
<ActionBarPrimitive.Edit asChild>
|
|
667
667
|
<TooltipIconButton tooltip="Edit">
|
|
@@ -692,13 +692,13 @@ const EditComposer: FC = () => {
|
|
|
692
692
|
const AssistantMessage: FC = () => {
|
|
693
693
|
return (
|
|
694
694
|
<MessagePrimitive.Root className="relative grid w-full max-w-[var(--thread-max-width)] grid-cols-[auto_auto_1fr] grid-rows-[auto_1fr] py-4">
|
|
695
|
-
<div className="text-foreground col-span-2 col-start-2 row-start-1 my-1.5 max-w-[calc(var(--thread-max-width)*0.8)] break-words
|
|
695
|
+
<div className="text-foreground col-span-2 col-start-2 row-start-1 my-1.5 max-w-[calc(var(--thread-max-width)*0.8)] leading-7 break-words">
|
|
696
696
|
<MessagePrimitive.Parts components={{ Text: MarkdownText }} />
|
|
697
697
|
</div>
|
|
698
698
|
|
|
699
699
|
<AssistantActionBar />
|
|
700
700
|
|
|
701
|
-
<BranchPicker className="col-start-2 row-start-2 -
|
|
701
|
+
<BranchPicker className="col-start-2 row-start-2 mr-2 -ml-2" />
|
|
702
702
|
</MessagePrimitive.Root>
|
|
703
703
|
);
|
|
704
704
|
};
|
|
@@ -940,7 +940,7 @@ function TooltipContent({
|
|
|
940
940
|
data-slot="tooltip-content"
|
|
941
941
|
sideOffset={sideOffset}
|
|
942
942
|
className={cn(
|
|
943
|
-
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-[--radix-tooltip-content-transform-origin]
|
|
943
|
+
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-[--radix-tooltip-content-transform-origin] rounded-md px-3 py-1.5 text-xs text-balance",
|
|
944
944
|
className,
|
|
945
945
|
)}
|
|
946
946
|
{...props}
|
|
@@ -1002,15 +1002,15 @@ export default nextConfig;
|
|
|
1002
1002
|
"lint": "eslint ."
|
|
1003
1003
|
},
|
|
1004
1004
|
"dependencies": {
|
|
1005
|
-
"@ai-sdk/openai": "^2.0.
|
|
1005
|
+
"@ai-sdk/openai": "^2.0.52",
|
|
1006
1006
|
"@assistant-ui/react": "workspace:*",
|
|
1007
1007
|
"@assistant-ui/react-markdown": "workspace:*",
|
|
1008
1008
|
"@radix-ui/react-slot": "^1.2.3",
|
|
1009
1009
|
"@radix-ui/react-tooltip": "^1.2.8",
|
|
1010
1010
|
"class-variance-authority": "^0.7.1",
|
|
1011
1011
|
"clsx": "^2.1.1",
|
|
1012
|
-
"lucide-react": "^0.
|
|
1013
|
-
"next": "15.5.
|
|
1012
|
+
"lucide-react": "^0.546.0",
|
|
1013
|
+
"next": "15.5.6",
|
|
1014
1014
|
"react": "19.2.0",
|
|
1015
1015
|
"react-dom": "19.2.0",
|
|
1016
1016
|
"remark-gfm": "^4.0.1",
|
|
@@ -1023,7 +1023,7 @@ export default nextConfig;
|
|
|
1023
1023
|
"@types/react": "^19",
|
|
1024
1024
|
"@types/react-dom": "^19",
|
|
1025
1025
|
"eslint": "^9",
|
|
1026
|
-
"eslint-config-next": "15.5.
|
|
1026
|
+
"eslint-config-next": "15.5.6",
|
|
1027
1027
|
"postcss": "^8",
|
|
1028
1028
|
"tailwindcss": "^4.1.14",
|
|
1029
1029
|
"typescript": "^5"
|