inline-chat-kit 0.55.2 → 0.56.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.
- package/CHANGELOG.md +47 -0
- package/README.md +110 -2
- package/dist/Approval/Approval.d.ts +13 -2
- package/dist/Artifact/ArtifactPane.d.ts +1 -1
- package/dist/Attachments/Attachments.d.ts +2 -3
- package/dist/Branch/Branch.d.ts +2 -6
- package/dist/ChainOfThought/ChainOfThought.d.ts +2 -7
- package/dist/ChatExperience/ChatExperience.d.ts +47 -5
- package/dist/{ChatExperience-BwjmNCvw.js → ChatExperience-DCta8bv3.js} +2103 -1935
- package/dist/ChatExperience-DCta8bv3.js.map +1 -0
- package/dist/ChatInput/AddCardsOverlay.d.ts +20 -3
- package/dist/ChatInput/ChatInput.d.ts +10 -0
- package/dist/ChatTurnRow/ChatTurnRow.d.ts +36 -20
- package/dist/CodeBlock/CodeBlock.d.ts +3 -1
- package/dist/Context/Context.d.ts +2 -8
- package/dist/EmptyState/EmptyState.d.ts +1 -1
- package/dist/QuestionCard/QuestionCard.d.ts +2 -1
- package/dist/Reasoning/Reasoning.d.ts +2 -1
- package/dist/Sources/Sources.d.ts +2 -5
- package/dist/TaskList/TaskList.d.ts +2 -4
- package/dist/Tool/Tool.d.ts +2 -1
- package/dist/demo.js +1 -1
- package/dist/index.d.ts +6 -4
- package/dist/inline-chat-kit.css +1 -1
- package/dist/inline-chat-kit.js +8 -8
- package/dist/inline-chat-kit.js.map +1 -1
- package/dist/labels/labels.d.ts +254 -0
- package/dist/turnParts/turnParts.d.ts +29 -2
- package/dist/voice/useVoiceInput.d.ts +8 -1
- package/package.json +2 -2
- package/dist/ChatExperience-BwjmNCvw.js.map +0 -1
|
@@ -1,11 +1,28 @@
|
|
|
1
|
-
import { default as React } from 'react';
|
|
1
|
+
import { default as React, ReactNode } from 'react';
|
|
2
2
|
import { InlineAnimConfig } from './ChatInput';
|
|
3
|
+
/**
|
|
4
|
+
* One entry in the composer's "+" menu.
|
|
5
|
+
*
|
|
6
|
+
* `attach` is the one id the composer knows: without an `onSelect` of its own
|
|
7
|
+
* it opens the file picker, which is what the first built-in entry does.
|
|
8
|
+
*/
|
|
9
|
+
export interface ComposerMenuItem {
|
|
10
|
+
id: string;
|
|
11
|
+
label: string;
|
|
12
|
+
icon?: ReactNode;
|
|
13
|
+
onSelect?: () => void;
|
|
14
|
+
}
|
|
15
|
+
/** What the menu holds when the host says nothing, in the reader's language. */
|
|
16
|
+
export declare function useDefaultComposerMenu(): ComposerMenuItem[];
|
|
3
17
|
export interface AddCardsOverlayProps {
|
|
4
18
|
isAddOpen: boolean;
|
|
5
19
|
setIsAddOpen: React.Dispatch<React.SetStateAction<boolean>>;
|
|
6
|
-
|
|
20
|
+
/** Called with the entry's label and, second, its id — match on the id. */
|
|
21
|
+
onAdd?: (label?: string, id?: string) => void;
|
|
22
|
+
/** The entries. Defaults to Add, Design and Connectors. */
|
|
23
|
+
items?: ComposerMenuItem[];
|
|
7
24
|
showInlineGlyph: boolean;
|
|
8
25
|
showButtons: boolean;
|
|
9
26
|
ac: InlineAnimConfig | undefined;
|
|
10
27
|
}
|
|
11
|
-
export declare function AddCardsOverlay({ isAddOpen, setIsAddOpen, onAdd, showInlineGlyph, showButtons, ac, }: AddCardsOverlayProps): React.JSX.Element;
|
|
28
|
+
export declare function AddCardsOverlay({ isAddOpen, setIsAddOpen, onAdd, items, showInlineGlyph, showButtons, ac, }: AddCardsOverlayProps): React.JSX.Element;
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { Attachment } from '../Attachments/Attachments';
|
|
2
|
+
import { ComposerMenuItem } from './AddCardsOverlay';
|
|
2
3
|
import { TranscribeHandler } from '../voice/useVoiceInput';
|
|
4
|
+
import { ChatInputLabels } from '../labels/labels';
|
|
3
5
|
export type ChatInputState = "idle" | "typing" | "responding" | "resting";
|
|
4
6
|
export interface InlineAnimConfig {
|
|
5
7
|
bubble: {
|
|
@@ -112,6 +114,14 @@ export interface ChatInputProps {
|
|
|
112
114
|
onCancelEdit?: () => void;
|
|
113
115
|
isEditing?: boolean;
|
|
114
116
|
placeholder?: string;
|
|
117
|
+
/**
|
|
118
|
+
* What the "+" opens. Left out, the built-in three — Add, Design,
|
|
119
|
+
* Connectors. A list replaces them; an entry with id `"attach"` and no
|
|
120
|
+
* `onSelect` opens the file picker. `false` takes the "+" away altogether.
|
|
121
|
+
*/
|
|
122
|
+
menu?: ComposerMenuItem[] | false;
|
|
123
|
+
/** Every word the composer says. See `ChatLabels`. */
|
|
124
|
+
labels?: Partial<ChatInputLabels>;
|
|
115
125
|
animationConfig?: InlineAnimConfig;
|
|
116
126
|
style?: React.CSSProperties;
|
|
117
127
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Ref } from 'react';
|
|
1
|
+
import { ReactNode, Ref } from 'react';
|
|
2
2
|
import { Verdict } from '../AnswerActions/AnswerActions';
|
|
3
3
|
import { ChatInputHandle, InlineAnimConfig } from '../ChatInput/ChatInput';
|
|
4
4
|
import { Attachment } from '../Attachments/Attachments';
|
|
@@ -7,6 +7,9 @@ import { Decision } from '../Approval/Approval';
|
|
|
7
7
|
import { FoldMotion } from '../QuestionGroup/QuestionGroup';
|
|
8
8
|
import { Answer } from '../QuestionCard/types';
|
|
9
9
|
import { ChatTurn } from '../useChatTurns/useChatTurns';
|
|
10
|
+
import { CustomPart } from '../turnParts/turnParts';
|
|
11
|
+
import { ComposerMenuItem } from '../ChatInput/AddCardsOverlay';
|
|
12
|
+
import { ChatLabels } from '../labels/labels';
|
|
10
13
|
export interface ChatTurnRowProps {
|
|
11
14
|
turn: ChatTurn;
|
|
12
15
|
/** This row owns the live composer: the one the reader types the next question into. */
|
|
@@ -92,24 +95,37 @@ export interface ChatTurnRowProps {
|
|
|
92
95
|
* not keep the decision, it reports it. Write it back with `updatePart`.
|
|
93
96
|
*/
|
|
94
97
|
onDecideApproval?: (turnId: string, partId: string, decision: Decision) => void;
|
|
98
|
+
/**
|
|
99
|
+
* Draws a `{ kind: "custom" }` part — the host's own card, in the answer.
|
|
100
|
+
*
|
|
101
|
+
* Called with the part and the turn it is in, and whatever it returns is
|
|
102
|
+
* drawn where the part sits among the others. Left out, or returning `null`,
|
|
103
|
+
* the part draws nothing: no placeholder, no error. A part the host does not
|
|
104
|
+
* recognise is a part it chose not to draw.
|
|
105
|
+
*
|
|
106
|
+
* **Keep it stable** — define it outside the component, or wrap it in
|
|
107
|
+
* `useCallback`. The row is memoised, and a new function every render is a
|
|
108
|
+
* changed prop on every row, so every finished answer re-renders on every
|
|
109
|
+
* frame of the one arriving. What the card needs to change — "applied", say
|
|
110
|
+
* — belongs in the part's `data`, written with `updatePart`, not in a
|
|
111
|
+
* closure: then only the row that owns it re-renders.
|
|
112
|
+
*/
|
|
113
|
+
renderPart?: (part: CustomPart, context: {
|
|
114
|
+
turnId: string;
|
|
115
|
+
}) => ReactNode;
|
|
116
|
+
/**
|
|
117
|
+
* The live composer's "+" menu. `false` takes the "+" away; a list replaces
|
|
118
|
+
* the built-in three. See `ChatInput`'s `menu`. Keep it stable, for the
|
|
119
|
+
* reason `renderPart` has to be.
|
|
120
|
+
*/
|
|
121
|
+
composerMenu?: ComposerMenuItem[] | false;
|
|
122
|
+
/**
|
|
123
|
+
* Every word the row and everything in it says. Partial: what is left out
|
|
124
|
+
* stays English. Compared by content rather than identity, so an object
|
|
125
|
+
* written inline does not cost the memo anything — though for a whole
|
|
126
|
+
* conversation, one `LabelsProvider` around the list does the same job once.
|
|
127
|
+
*/
|
|
128
|
+
labels?: ChatLabels;
|
|
95
129
|
className?: string;
|
|
96
130
|
}
|
|
97
|
-
|
|
98
|
-
* One turn: the question as a composer that has become a bubble, and the
|
|
99
|
-
* answer beneath it.
|
|
100
|
-
*
|
|
101
|
-
* Not `Message`, because it is not one. The user half is a live input that
|
|
102
|
-
* morphs into its own bubble rather than a rendered record of what was typed
|
|
103
|
-
* — which is the whole idea, and the reason the row is a turn.
|
|
104
|
-
*
|
|
105
|
-
* **Memoised, and the memo is load-bearing.** `useChatTurns` already leaves
|
|
106
|
-
* untouched turns referentially identical when it rewrites one of them, but
|
|
107
|
-
* that only pays off if the rows can act on it. Left inline in a `.map()`,
|
|
108
|
-
* every row re-renders on every flush anyway, because the parent re-rendered.
|
|
109
|
-
* Measured before this existed: streaming a second answer produced 366 DOM
|
|
110
|
-
* mutations inside the first, already-finished turn.
|
|
111
|
-
*
|
|
112
|
-
* The two halves have to be in place together. Stable objects give React the
|
|
113
|
-
* grounds to skip; `memo` is what makes it skip.
|
|
114
|
-
*/
|
|
115
|
-
export declare const ChatTurnRow: import('react').MemoExoticComponent<({ turn, isActiveInput, inputRef, placeholder, animationConfig, foldMotion, openArtifactId, onOpenArtifact, entranceDelay, selectionMode, questionAlign, onDraft, onSubmit, onStop, onEdit, onCancelEdit, onCopy, onHighlight, onReplyInThread, onRegenerate, onShowVersion, onFeedback, feedback, answerActions, onAnswerQuestion, onEditQuestion, onDecideApproval, className, onTranscribe, }: ChatTurnRowProps) => import("react").JSX.Element>;
|
|
131
|
+
export declare const ChatTurnRow: import('react').MemoExoticComponent<({ turn, isActiveInput, inputRef, placeholder, animationConfig, foldMotion, openArtifactId, onOpenArtifact, entranceDelay, selectionMode, questionAlign, onDraft, onSubmit, onStop, onEdit, onCancelEdit, onCopy, onHighlight, onReplyInThread, onRegenerate, onShowVersion, onFeedback, feedback, answerActions, onAnswerQuestion, onEditQuestion, onDecideApproval, renderPart, composerMenu, labels, className, onTranscribe, }: ChatTurnRowProps) => import("react").JSX.Element>;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { HTMLAttributes } from 'react';
|
|
2
|
+
import { LabelsOf } from '../labels/labels';
|
|
2
3
|
export interface CodeBlockProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "onCopy"> {
|
|
3
4
|
code: string;
|
|
4
5
|
/** The fence's language. Unknown ones render unhighlighted. */
|
|
@@ -11,6 +12,7 @@ export interface CodeBlockProps extends Omit<HTMLAttributes<HTMLDivElement>, "ch
|
|
|
11
12
|
onCopy?: (code: string) => void;
|
|
12
13
|
/** How long the button stays confirmed, in ms. */
|
|
13
14
|
copiedFor?: number;
|
|
15
|
+
labels?: Partial<LabelsOf<"codeBlock">>;
|
|
14
16
|
}
|
|
15
17
|
/**
|
|
16
18
|
* A fenced block: language, a copy button, and code that scrolls sideways
|
|
@@ -21,4 +23,4 @@ export interface CodeBlockProps extends Omit<HTMLAttributes<HTMLDivElement>, "ch
|
|
|
21
23
|
* stops being preformatted, so this renders whole and the highlighter skips
|
|
22
24
|
* it. Copy is what people want from code anyway.
|
|
23
25
|
*/
|
|
24
|
-
export declare function CodeBlock({ code, lang, label, copyable, onCopy, copiedFor, className, ...rest }: CodeBlockProps): import("react").JSX.Element;
|
|
26
|
+
export declare function CodeBlock({ code, lang, label, copyable, onCopy, copiedFor, labels, className, ...rest }: CodeBlockProps): import("react").JSX.Element;
|
|
@@ -1,12 +1,6 @@
|
|
|
1
1
|
import { HTMLAttributes, ReactNode } from 'react';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
/** Between the two numbers: "128k of 1M". */
|
|
5
|
-
of: string;
|
|
6
|
-
tokens: string;
|
|
7
|
-
/** Said once it is past `warnAt`, and it should say what happens next. */
|
|
8
|
-
nearlyFull: string;
|
|
9
|
-
};
|
|
2
|
+
import { LabelsOf } from '../labels/labels';
|
|
3
|
+
type Labels = LabelsOf<"context">;
|
|
10
4
|
export interface ContextProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
|
|
11
5
|
used: number;
|
|
12
6
|
total: number;
|
|
@@ -21,4 +21,4 @@ export interface EmptyStateProps extends Omit<HTMLAttributes<HTMLDivElement>, "t
|
|
|
21
21
|
* is not ours to do. `title` renders as text; wrap it yourself if it should be
|
|
22
22
|
* a heading.
|
|
23
23
|
*/
|
|
24
|
-
export declare function EmptyState({ icon, title, description, suggestions, onSuggestion, suggestionsLabel, children, className, ...rest }: EmptyStateProps): import("react").JSX.Element;
|
|
24
|
+
export declare function EmptyState({ icon, title, description, suggestions, onSuggestion, suggestionsLabel: suggestionsProp, children, className, ...rest }: EmptyStateProps): import("react").JSX.Element;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Answer, Question, QuestionState } from './types';
|
|
2
|
+
import { LabelsOf } from '../labels/labels';
|
|
2
3
|
export interface QuestionCardProps {
|
|
3
4
|
question: Question;
|
|
4
5
|
/** Shown in the badge. 1-based. */
|
|
@@ -10,7 +11,7 @@ export interface QuestionCardProps {
|
|
|
10
11
|
onEdit?: () => void;
|
|
11
12
|
/** Answers can be read but not changed. */
|
|
12
13
|
readOnly?: boolean;
|
|
13
|
-
labels?: Partial<
|
|
14
|
+
labels?: Partial<LabelsOf<"question">>;
|
|
14
15
|
}
|
|
15
16
|
/**
|
|
16
17
|
* What an answer looks like once folded into a row.
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
import { LabelsOf } from '../labels/labels';
|
|
2
3
|
/** Still working it out, or finished. */
|
|
3
4
|
export type ReasoningState = "thinking" | "done";
|
|
4
|
-
type Labels =
|
|
5
|
+
type Labels = LabelsOf<"reasoning">;
|
|
5
6
|
export interface ReasoningProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
|
|
6
7
|
/** The thinking itself. Prose, not structure — see `Tool` for that. */
|
|
7
8
|
children: ReactNode;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
import { LabelsOf } from '../labels/labels';
|
|
2
3
|
/** Where a claim came from. */
|
|
3
4
|
export interface Source {
|
|
4
5
|
id: string;
|
|
@@ -10,11 +11,7 @@ export interface Source {
|
|
|
10
11
|
/** The passage in the source that carries the claim. */
|
|
11
12
|
quote?: string;
|
|
12
13
|
}
|
|
13
|
-
type Labels =
|
|
14
|
-
title: string;
|
|
15
|
-
one: string;
|
|
16
|
-
many: string;
|
|
17
|
-
};
|
|
14
|
+
type Labels = LabelsOf<"sources">;
|
|
18
15
|
export interface SourcesProps extends Omit<HTMLAttributes<HTMLElement>, "title" | "onSelect"> {
|
|
19
16
|
sources: Source[];
|
|
20
17
|
/** Heads the list. Defaults to `labels.title`. */
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { HTMLAttributes, ReactNode } from 'react';
|
|
2
2
|
import { WorkState } from '../stateGlyph/StateGlyph';
|
|
3
|
+
import { LabelsOf } from '../labels/labels';
|
|
3
4
|
/** The same four as a tool call. See `StateGlyph`. */
|
|
4
5
|
export type TaskState = WorkState;
|
|
5
6
|
export interface Task {
|
|
@@ -9,10 +10,7 @@ export interface Task {
|
|
|
9
10
|
/** A line under the label — what it found, or why it failed. */
|
|
10
11
|
detail?: ReactNode;
|
|
11
12
|
}
|
|
12
|
-
type Labels =
|
|
13
|
-
/** `{done}` and `{total}` are filled in. */
|
|
14
|
-
progress: string;
|
|
15
|
-
};
|
|
13
|
+
type Labels = LabelsOf<"tasks">;
|
|
16
14
|
export interface TaskListProps extends Omit<HTMLAttributes<HTMLElement>, "title"> {
|
|
17
15
|
tasks: Task[];
|
|
18
16
|
/** Names the list, and gives it a row to fold into. */
|
package/dist/Tool/Tool.d.ts
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { HTMLAttributes, ReactNode } from 'react';
|
|
2
2
|
import { WorkState } from '../stateGlyph/StateGlyph';
|
|
3
|
+
import { LabelsOf } from '../labels/labels';
|
|
3
4
|
/** Queued, working, finished, or failed — the kit's four, shared with `TaskList`. */
|
|
4
5
|
export type ToolState = WorkState;
|
|
5
|
-
type Labels =
|
|
6
|
+
type Labels = LabelsOf<"tool">;
|
|
6
7
|
export interface ToolProps extends Omit<HTMLAttributes<HTMLDivElement>, "title" | "onToggle"> {
|
|
7
8
|
/** What was called. Set in mono: it is an identifier, not prose. */
|
|
8
9
|
name: string;
|
package/dist/demo.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import {
|
|
2
|
+
import { et as e, n as t, t as n } from "./ChatExperience-DCta8bv3.js";
|
|
3
3
|
import { useCallback as r, useRef as i, useState as a } from "react";
|
|
4
4
|
import { jsx as o, jsxs as s } from "react/jsx-runtime";
|
|
5
5
|
import { AnimatePresence as c, motion as l } from "motion/react";
|
package/dist/index.d.ts
CHANGED
|
@@ -1,21 +1,23 @@
|
|
|
1
1
|
export { ChatInput, defaultInlineAnimConfig } from './ChatInput/ChatInput';
|
|
2
2
|
export type { ChatInputProps, ChatInputHandle, ChatInputState, InlineAnimConfig, } from './ChatInput/ChatInput';
|
|
3
3
|
export { AddCardsOverlay } from './ChatInput/AddCardsOverlay';
|
|
4
|
-
export type { AddCardsOverlayProps } from './ChatInput/AddCardsOverlay';
|
|
4
|
+
export type { AddCardsOverlayProps, ComposerMenuItem } from './ChatInput/AddCardsOverlay';
|
|
5
5
|
export { HoverActionsRow } from './ChatInput/HoverActionsRow';
|
|
6
6
|
export type { HoverActionsRowProps } from './ChatInput/HoverActionsRow';
|
|
7
7
|
export { MorphGlyph } from './ChatInput/MorphGlyph';
|
|
8
8
|
export type { MorphGlyphProps } from './ChatInput/MorphGlyph';
|
|
9
9
|
export { useChatTurns } from './useChatTurns/useChatTurns';
|
|
10
10
|
export { mergeParts } from './turnParts/turnParts';
|
|
11
|
-
export type { TurnPart, TurnPartUpdate } from './turnParts/turnParts';
|
|
11
|
+
export type { CustomPart, TurnPart, TurnPartUpdate } from './turnParts/turnParts';
|
|
12
|
+
export { LabelsProvider, defaultLabels } from './labels/labels';
|
|
13
|
+
export type { ChatLabels, AnswerActionsLabels, ApprovalLabels, BranchLabels, ChainLabels, ChatInputLabels, ContextLabels, ReasoningLabels, SourcesLabels, TaskListLabels, ToolLabels, VoiceLabels, } from './labels/labels';
|
|
12
14
|
export type { ChatAnnouncements, ChatTurn, SendContext, SendHandler, UseChatTurnsOptions, UseChatTurnsResult, } from './useChatTurns/useChatTurns';
|
|
13
15
|
export { useVoiceInput } from './voice/useVoiceInput';
|
|
14
16
|
export type { TranscribeContext, TranscribeHandler, UseVoiceInputOptions, VoiceInput, VoiceState, } from './voice/useVoiceInput';
|
|
15
17
|
export { announce } from './announce/announce';
|
|
16
18
|
export type { Politeness } from './announce/announce';
|
|
17
19
|
export { ChatExperience } from './ChatExperience/ChatExperience';
|
|
18
|
-
export type { ChatExperienceProps, ChatExperienceEmpty, ChatExperienceArtifact, PartWriter, } from './ChatExperience/ChatExperience';
|
|
20
|
+
export type { ChatExperienceProps, ChatExperienceEmpty, ChatExperienceArtifact, ChatExperienceHeaderAction, PartWriter, } from './ChatExperience/ChatExperience';
|
|
19
21
|
export { ChatHeader, headerIconSize } from './ChatHeader/ChatHeader';
|
|
20
22
|
export type { ChatHeaderAction, ChatHeaderProps, ChatHeaderSize, ChatHeaderVariant, } from './ChatHeader/ChatHeader';
|
|
21
23
|
export { ChatTurnRow } from './ChatTurnRow/ChatTurnRow';
|
|
@@ -35,7 +37,7 @@ export type { Source, SourcesProps } from './Sources/Sources';
|
|
|
35
37
|
export { InlineCitation } from './InlineCitation/InlineCitation';
|
|
36
38
|
export type { InlineCitationProps } from './InlineCitation/InlineCitation';
|
|
37
39
|
export { Approval } from './Approval/Approval';
|
|
38
|
-
export type { ApprovalProps, Decision } from './Approval/Approval';
|
|
40
|
+
export type { ApprovalChoice, ApprovalProps, Decision } from './Approval/Approval';
|
|
39
41
|
export { Context } from './Context/Context';
|
|
40
42
|
export type { ContextProps } from './Context/Context';
|
|
41
43
|
export { QuestionCard, answerChips } from './QuestionCard/QuestionCard';
|