@slipstream-ui/ai 0.4.0 → 0.6.0

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.
Files changed (51) hide show
  1. package/dist/index.d.mts +51 -4
  2. package/dist/index.d.ts +51 -4
  3. package/dist/index.js +244 -113
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +246 -115
  6. package/dist/index.mjs.map +1 -1
  7. package/dist/manifests/attachment.manifest.json +37 -8
  8. package/dist/manifests/branch.manifest.json +3 -1
  9. package/dist/manifests/chain-thought.manifest.json +1 -1
  10. package/dist/manifests/code-block.manifest.json +3 -1
  11. package/dist/manifests/command-palette.manifest.json +59 -4
  12. package/dist/manifests/confirmation.manifest.json +3 -1
  13. package/dist/manifests/conversation.manifest.json +1 -1
  14. package/dist/manifests/inline-citation.manifest.json +3 -1
  15. package/dist/manifests/message-actions.manifest.json +61 -10
  16. package/dist/manifests/message.manifest.json +13 -1
  17. package/dist/manifests/prompt-input.manifest.json +2 -2
  18. package/dist/manifests/reasoning.manifest.json +19 -1
  19. package/dist/manifests/response.manifest.json +3 -1
  20. package/dist/manifests/source.manifest.json +2 -2
  21. package/dist/manifests/streaming-indicator.manifest.json +1 -1
  22. package/dist/manifests/suggestions.manifest.json +2 -2
  23. package/dist/manifests/tool-call.manifest.json +7 -1
  24. package/package.json +10 -10
  25. package/src/components/code-block/CodeBlock.tsx +91 -5
  26. package/src/components/command-palette/CommandPalette.test.tsx +42 -0
  27. package/src/components/command-palette/CommandPalette.tsx +82 -8
  28. package/src/components/confirmation/Confirmation.tsx +1 -1
  29. package/src/components/conversation/Conversation.tsx +6 -1
  30. package/src/components/message/Message.test.tsx +15 -0
  31. package/src/components/message/Message.tsx +9 -1
  32. package/src/components/reasoning/Reasoning.test.tsx +15 -0
  33. package/src/components/reasoning/Reasoning.tsx +20 -7
  34. package/src/components/tool-call/ToolCall.tsx +24 -8
  35. package/src/manifests/attachment.manifest.json +37 -8
  36. package/src/manifests/branch.manifest.json +3 -1
  37. package/src/manifests/chain-thought.manifest.json +1 -1
  38. package/src/manifests/code-block.manifest.json +3 -1
  39. package/src/manifests/command-palette.manifest.json +59 -4
  40. package/src/manifests/confirmation.manifest.json +3 -1
  41. package/src/manifests/conversation.manifest.json +1 -1
  42. package/src/manifests/inline-citation.manifest.json +3 -1
  43. package/src/manifests/message-actions.manifest.json +61 -10
  44. package/src/manifests/message.manifest.json +13 -1
  45. package/src/manifests/prompt-input.manifest.json +2 -2
  46. package/src/manifests/reasoning.manifest.json +19 -1
  47. package/src/manifests/response.manifest.json +3 -1
  48. package/src/manifests/source.manifest.json +2 -2
  49. package/src/manifests/streaming-indicator.manifest.json +1 -1
  50. package/src/manifests/suggestions.manifest.json +2 -2
  51. package/src/manifests/tool-call.manifest.json +7 -1
package/dist/index.d.mts CHANGED
@@ -45,6 +45,10 @@ type MessageProps = {
45
45
  userLabel?: string;
46
46
  /** Display name for the assistant role; override for localization. */
47
47
  assistantLabel?: string;
48
+ /** Formats the message timestamp; defaults to the runtime's toLocaleTimeString(). */
49
+ formatTime?: (date: Date) => string;
50
+ /** BCP-47 locale used by the default timestamp formatter. */
51
+ locale?: string;
48
52
  /**
49
53
  * Custom content renderer, e.g. for markdown/code blocks.
50
54
  * When provided, it fully replaces the default plain-text rendering.
@@ -77,7 +81,7 @@ type MessageProps = {
77
81
  * (and timestamp re-formatting) for every other message in the transcript.
78
82
  * Callback props must be referentially stable for memo to help.
79
83
  */
80
- declare const MemoizedMessage: React.MemoExoticComponent<React.ForwardRefExoticComponent<MessageProps & React.RefAttributes<HTMLDivElement>>>;
84
+ declare const MemoizedMessage: React.NamedExoticComponent<MessageProps & React.RefAttributes<HTMLDivElement>>;
81
85
 
82
86
  /** User sentiment for an AI response. */
83
87
  type FeedbackRating = 'up' | 'down';
@@ -357,7 +361,7 @@ type PromptInputProps = {
357
361
  };
358
362
  declare const PromptInputRoot: React.ForwardRefExoticComponent<PromptInputProps & React.RefAttributes<HTMLTextAreaElement>>;
359
363
  /** Auto-resizing textarea bound to the prompt state. Accepts standard textarea props. */
360
- declare const PromptInputTextarea: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange" | "value"> & React.RefAttributes<HTMLTextAreaElement>>;
364
+ declare const PromptInputTextarea: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "value" | "onChange"> & React.RefAttributes<HTMLTextAreaElement>>;
361
365
  /** Status-aware submit control: send / stop / error icons chosen automatically. */
362
366
  declare const PromptInputSubmit: React.ForwardRefExoticComponent<{
363
367
  className?: string;
@@ -409,6 +413,17 @@ type ReasoningProps = {
409
413
  duration?: number | string;
410
414
  /** Marks reasoning as still arriving: animated header state. */
411
415
  isStreaming?: boolean;
416
+ /** Formats step timestamps; defaults to the runtime's toLocaleTimeString(). */
417
+ formatTime?: (date: Date) => string;
418
+ /** BCP-47 locale used by the default timestamp formatter. */
419
+ locale?: string;
420
+ /** Localized header, count and step labels. */
421
+ labels?: {
422
+ title?: string;
423
+ count?: (count: number) => string;
424
+ thinking?: string;
425
+ step?: (index: number) => string;
426
+ };
412
427
  };
413
428
  declare const Reasoning: React.ForwardRefExoticComponent<ReasoningProps & React.RefAttributes<HTMLDivElement>>;
414
429
 
@@ -416,6 +431,16 @@ type ToolCallProps = {
416
431
  toolCall: ToolCall$1;
417
432
  className?: string;
418
433
  showResult?: boolean;
434
+ /** Localized status and section labels. */
435
+ labels?: {
436
+ pending?: string;
437
+ running?: string;
438
+ completed?: string;
439
+ failed?: string;
440
+ arguments?: string;
441
+ result?: string;
442
+ error?: string;
443
+ };
419
444
  };
420
445
  /**
421
446
  * Displays a single tool invocation: name, status chip, serialized
@@ -488,20 +513,41 @@ type Command = {
488
513
  /** Extra lexical search terms. */
489
514
  keywords?: string[];
490
515
  shortcut?: string;
516
+ /** Optional leading icon (rendered by the default row or renderCommand). */
517
+ icon?: React.ReactNode;
518
+ /** Optional secondary line in the default row. */
519
+ description?: string;
491
520
  };
492
521
  type CommandPaletteProps = {
493
522
  open: boolean;
494
523
  onOpenChange: (open: boolean) => void;
524
+ /** Static command set (ignored for filtering when loadCommands is set). */
495
525
  commands: Command[];
496
526
  onSelect: (command: Command) => void;
527
+ /** Async source; called with the current query (debounced). */
528
+ loadCommands?: (query: string) => Promise<Command[]>;
529
+ /** Debounce for loadCommands, in ms. Default 200. */
530
+ debounceMs?: number;
531
+ /** Custom row renderer (icons, type badges, metadata). */
532
+ renderCommand?: (command: Command, state: {
533
+ active: boolean;
534
+ }) => React.ReactNode;
535
+ /** Shown while async commands load. */
536
+ loadingText?: string;
497
537
  placeholder?: string;
538
+ /** Accessible label for the combobox. Default 'Command palette'. */
539
+ dialogLabel?: string;
540
+ /** Accessible label for the listbox. Default 'Commands'. */
541
+ listLabel?: string;
542
+ /** Shown when no command matches. Default 'No matching commands.'. */
543
+ emptyText?: string;
498
544
  };
499
545
  /**
500
546
  * Cmd+K command palette: combobox + listbox with aria-activedescendant
501
547
  * keyboard navigation, lexical filtering over label/keywords, and
502
548
  * Escape-to-close. No focus leaves the input while navigating.
503
549
  */
504
- declare function CommandPalette({ open, onOpenChange, commands, onSelect, placeholder, }: CommandPaletteProps): React.JSX.Element | null;
550
+ declare function CommandPalette({ open, onOpenChange, commands, onSelect, loadCommands, debounceMs, renderCommand, loadingText, placeholder, dialogLabel, listLabel, emptyText, }: CommandPaletteProps): React.JSX.Element | null;
505
551
 
506
552
  /**
507
553
  * Structural types mirroring the parts of the Vercel AI SDK's chat state the
@@ -576,4 +622,5 @@ type UseSlipstreamStreamResult = {
576
622
  */
577
623
  declare function useSlipstreamStream({ status, error, onRetry, messages, }: UseSlipstreamStreamOptions): UseSlipstreamStreamResult;
578
624
 
579
- export { type AiSdkMessage, type AiSdkStatus, type AiSdkToolInvocation, Attachment, type AttachmentItem, AttachmentList, type AttachmentListProps, type AttachmentProps, Branch, type BranchProps, ChainThought, type ChainThoughtProps, type ChainThoughtStep, CodeBlock, type CodeBlockProps, type Command, CommandPalette, type CommandPaletteProps, Confirmation, type ConfirmationProps, type ConfirmationStatus, Conversation, type ConversationProps, type FeedbackRating, InlineCitation, type InlineCitationProps, MemoizedMessage as Message, MessageActions, type MessageActionsProps, type Message as MessageData, type MessageProps, type MessageRole, PromptInputRoot as PromptInput, PromptInputActionAddAttachments, PromptInputActionDictate, PromptInputBody, PromptInputButton, type PromptInputButtonProps, PromptInputFooter, PromptInputHeader, type PromptInputProps, PromptInputSubmit, PromptInputTextarea, PromptInputTools, Reasoning, type ReasoningProps, type ReasoningStep, Response, type ResponseProps, Source, type SourceItem, type SourceProps, Sources, type SourcesProps, StreamingIndicator, type StreamingIndicatorProps, type Suggestion, Suggestions, type SuggestionsProps, ToolCall, type ToolCall$1 as ToolCallData, type ToolCallProps, type UseAttachmentsOptions, type UseAttachmentsResult, type UseSlipstreamMessagesOptions, type UseSlipstreamMessagesResult, type UseSlipstreamStreamOptions, type UseSlipstreamStreamResult, closeIncompleteMarkdown, toSlipstreamMessage, toSlipstreamMessages, toSlipstreamToolCall, toSlipstreamToolCalls, usePromptInputAttachments, useSlipstreamMessages, useSlipstreamStream, useSpeechRecognition };
625
+ export { Attachment, AttachmentList, Branch, ChainThought, CodeBlock, CommandPalette, Confirmation, Conversation, InlineCitation, MemoizedMessage as Message, MessageActions, PromptInputRoot as PromptInput, PromptInputActionAddAttachments, PromptInputActionDictate, PromptInputBody, PromptInputButton, PromptInputFooter, PromptInputHeader, PromptInputSubmit, PromptInputTextarea, PromptInputTools, Reasoning, Response, Source, Sources, StreamingIndicator, Suggestions, ToolCall, closeIncompleteMarkdown, toSlipstreamMessage, toSlipstreamMessages, toSlipstreamToolCall, toSlipstreamToolCalls, usePromptInputAttachments, useSlipstreamMessages, useSlipstreamStream, useSpeechRecognition };
626
+ export type { AiSdkMessage, AiSdkStatus, AiSdkToolInvocation, AttachmentItem, AttachmentListProps, AttachmentProps, BranchProps, ChainThoughtProps, ChainThoughtStep, CodeBlockProps, Command, CommandPaletteProps, ConfirmationProps, ConfirmationStatus, ConversationProps, FeedbackRating, InlineCitationProps, MessageActionsProps, Message as MessageData, MessageProps, MessageRole, PromptInputButtonProps, PromptInputProps, ReasoningProps, ReasoningStep, ResponseProps, SourceItem, SourceProps, SourcesProps, StreamingIndicatorProps, Suggestion, SuggestionsProps, ToolCall$1 as ToolCallData, ToolCallProps, UseAttachmentsOptions, UseAttachmentsResult, UseSlipstreamMessagesOptions, UseSlipstreamMessagesResult, UseSlipstreamStreamOptions, UseSlipstreamStreamResult };
package/dist/index.d.ts CHANGED
@@ -45,6 +45,10 @@ type MessageProps = {
45
45
  userLabel?: string;
46
46
  /** Display name for the assistant role; override for localization. */
47
47
  assistantLabel?: string;
48
+ /** Formats the message timestamp; defaults to the runtime's toLocaleTimeString(). */
49
+ formatTime?: (date: Date) => string;
50
+ /** BCP-47 locale used by the default timestamp formatter. */
51
+ locale?: string;
48
52
  /**
49
53
  * Custom content renderer, e.g. for markdown/code blocks.
50
54
  * When provided, it fully replaces the default plain-text rendering.
@@ -77,7 +81,7 @@ type MessageProps = {
77
81
  * (and timestamp re-formatting) for every other message in the transcript.
78
82
  * Callback props must be referentially stable for memo to help.
79
83
  */
80
- declare const MemoizedMessage: React.MemoExoticComponent<React.ForwardRefExoticComponent<MessageProps & React.RefAttributes<HTMLDivElement>>>;
84
+ declare const MemoizedMessage: React.NamedExoticComponent<MessageProps & React.RefAttributes<HTMLDivElement>>;
81
85
 
82
86
  /** User sentiment for an AI response. */
83
87
  type FeedbackRating = 'up' | 'down';
@@ -357,7 +361,7 @@ type PromptInputProps = {
357
361
  };
358
362
  declare const PromptInputRoot: React.ForwardRefExoticComponent<PromptInputProps & React.RefAttributes<HTMLTextAreaElement>>;
359
363
  /** Auto-resizing textarea bound to the prompt state. Accepts standard textarea props. */
360
- declare const PromptInputTextarea: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange" | "value"> & React.RefAttributes<HTMLTextAreaElement>>;
364
+ declare const PromptInputTextarea: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "value" | "onChange"> & React.RefAttributes<HTMLTextAreaElement>>;
361
365
  /** Status-aware submit control: send / stop / error icons chosen automatically. */
362
366
  declare const PromptInputSubmit: React.ForwardRefExoticComponent<{
363
367
  className?: string;
@@ -409,6 +413,17 @@ type ReasoningProps = {
409
413
  duration?: number | string;
410
414
  /** Marks reasoning as still arriving: animated header state. */
411
415
  isStreaming?: boolean;
416
+ /** Formats step timestamps; defaults to the runtime's toLocaleTimeString(). */
417
+ formatTime?: (date: Date) => string;
418
+ /** BCP-47 locale used by the default timestamp formatter. */
419
+ locale?: string;
420
+ /** Localized header, count and step labels. */
421
+ labels?: {
422
+ title?: string;
423
+ count?: (count: number) => string;
424
+ thinking?: string;
425
+ step?: (index: number) => string;
426
+ };
412
427
  };
413
428
  declare const Reasoning: React.ForwardRefExoticComponent<ReasoningProps & React.RefAttributes<HTMLDivElement>>;
414
429
 
@@ -416,6 +431,16 @@ type ToolCallProps = {
416
431
  toolCall: ToolCall$1;
417
432
  className?: string;
418
433
  showResult?: boolean;
434
+ /** Localized status and section labels. */
435
+ labels?: {
436
+ pending?: string;
437
+ running?: string;
438
+ completed?: string;
439
+ failed?: string;
440
+ arguments?: string;
441
+ result?: string;
442
+ error?: string;
443
+ };
419
444
  };
420
445
  /**
421
446
  * Displays a single tool invocation: name, status chip, serialized
@@ -488,20 +513,41 @@ type Command = {
488
513
  /** Extra lexical search terms. */
489
514
  keywords?: string[];
490
515
  shortcut?: string;
516
+ /** Optional leading icon (rendered by the default row or renderCommand). */
517
+ icon?: React.ReactNode;
518
+ /** Optional secondary line in the default row. */
519
+ description?: string;
491
520
  };
492
521
  type CommandPaletteProps = {
493
522
  open: boolean;
494
523
  onOpenChange: (open: boolean) => void;
524
+ /** Static command set (ignored for filtering when loadCommands is set). */
495
525
  commands: Command[];
496
526
  onSelect: (command: Command) => void;
527
+ /** Async source; called with the current query (debounced). */
528
+ loadCommands?: (query: string) => Promise<Command[]>;
529
+ /** Debounce for loadCommands, in ms. Default 200. */
530
+ debounceMs?: number;
531
+ /** Custom row renderer (icons, type badges, metadata). */
532
+ renderCommand?: (command: Command, state: {
533
+ active: boolean;
534
+ }) => React.ReactNode;
535
+ /** Shown while async commands load. */
536
+ loadingText?: string;
497
537
  placeholder?: string;
538
+ /** Accessible label for the combobox. Default 'Command palette'. */
539
+ dialogLabel?: string;
540
+ /** Accessible label for the listbox. Default 'Commands'. */
541
+ listLabel?: string;
542
+ /** Shown when no command matches. Default 'No matching commands.'. */
543
+ emptyText?: string;
498
544
  };
499
545
  /**
500
546
  * Cmd+K command palette: combobox + listbox with aria-activedescendant
501
547
  * keyboard navigation, lexical filtering over label/keywords, and
502
548
  * Escape-to-close. No focus leaves the input while navigating.
503
549
  */
504
- declare function CommandPalette({ open, onOpenChange, commands, onSelect, placeholder, }: CommandPaletteProps): React.JSX.Element | null;
550
+ declare function CommandPalette({ open, onOpenChange, commands, onSelect, loadCommands, debounceMs, renderCommand, loadingText, placeholder, dialogLabel, listLabel, emptyText, }: CommandPaletteProps): React.JSX.Element | null;
505
551
 
506
552
  /**
507
553
  * Structural types mirroring the parts of the Vercel AI SDK's chat state the
@@ -576,4 +622,5 @@ type UseSlipstreamStreamResult = {
576
622
  */
577
623
  declare function useSlipstreamStream({ status, error, onRetry, messages, }: UseSlipstreamStreamOptions): UseSlipstreamStreamResult;
578
624
 
579
- export { type AiSdkMessage, type AiSdkStatus, type AiSdkToolInvocation, Attachment, type AttachmentItem, AttachmentList, type AttachmentListProps, type AttachmentProps, Branch, type BranchProps, ChainThought, type ChainThoughtProps, type ChainThoughtStep, CodeBlock, type CodeBlockProps, type Command, CommandPalette, type CommandPaletteProps, Confirmation, type ConfirmationProps, type ConfirmationStatus, Conversation, type ConversationProps, type FeedbackRating, InlineCitation, type InlineCitationProps, MemoizedMessage as Message, MessageActions, type MessageActionsProps, type Message as MessageData, type MessageProps, type MessageRole, PromptInputRoot as PromptInput, PromptInputActionAddAttachments, PromptInputActionDictate, PromptInputBody, PromptInputButton, type PromptInputButtonProps, PromptInputFooter, PromptInputHeader, type PromptInputProps, PromptInputSubmit, PromptInputTextarea, PromptInputTools, Reasoning, type ReasoningProps, type ReasoningStep, Response, type ResponseProps, Source, type SourceItem, type SourceProps, Sources, type SourcesProps, StreamingIndicator, type StreamingIndicatorProps, type Suggestion, Suggestions, type SuggestionsProps, ToolCall, type ToolCall$1 as ToolCallData, type ToolCallProps, type UseAttachmentsOptions, type UseAttachmentsResult, type UseSlipstreamMessagesOptions, type UseSlipstreamMessagesResult, type UseSlipstreamStreamOptions, type UseSlipstreamStreamResult, closeIncompleteMarkdown, toSlipstreamMessage, toSlipstreamMessages, toSlipstreamToolCall, toSlipstreamToolCalls, usePromptInputAttachments, useSlipstreamMessages, useSlipstreamStream, useSpeechRecognition };
625
+ export { Attachment, AttachmentList, Branch, ChainThought, CodeBlock, CommandPalette, Confirmation, Conversation, InlineCitation, MemoizedMessage as Message, MessageActions, PromptInputRoot as PromptInput, PromptInputActionAddAttachments, PromptInputActionDictate, PromptInputBody, PromptInputButton, PromptInputFooter, PromptInputHeader, PromptInputSubmit, PromptInputTextarea, PromptInputTools, Reasoning, Response, Source, Sources, StreamingIndicator, Suggestions, ToolCall, closeIncompleteMarkdown, toSlipstreamMessage, toSlipstreamMessages, toSlipstreamToolCall, toSlipstreamToolCalls, usePromptInputAttachments, useSlipstreamMessages, useSlipstreamStream, useSpeechRecognition };
626
+ export type { AiSdkMessage, AiSdkStatus, AiSdkToolInvocation, AttachmentItem, AttachmentListProps, AttachmentProps, BranchProps, ChainThoughtProps, ChainThoughtStep, CodeBlockProps, Command, CommandPaletteProps, ConfirmationProps, ConfirmationStatus, ConversationProps, FeedbackRating, InlineCitationProps, MessageActionsProps, Message as MessageData, MessageProps, MessageRole, PromptInputButtonProps, PromptInputProps, ReasoningProps, ReasoningStep, ResponseProps, SourceItem, SourceProps, SourcesProps, StreamingIndicatorProps, Suggestion, SuggestionsProps, ToolCall$1 as ToolCallData, ToolCallProps, UseAttachmentsOptions, UseAttachmentsResult, UseSlipstreamMessagesOptions, UseSlipstreamMessagesResult, UseSlipstreamStreamOptions, UseSlipstreamStreamResult };