@aleph-alpha/chat-kit 2.3.0 → 3.1.0

package/dist/components/composed/CkInput/types.d.ts

@@ -1,12 +1,12 @@
 /**
- * Drop-in chat input: combines `CkPromptInput`, a `CkPromptActionButton` send
+ * Drop-in chat input: combines `CkPromptInput`, a `CkPromptSendButton` send
  * button, and a `CkPromptInputDisclaimer`. Supports `v-model`, loading and
  * disabled states, and slots to customize the toolbar and footer.
  *
  * @category Form Inputs
  * @useCases chat compose input, prompt box with send button, llm input with disclaimer, quick-start chat input, turnkey chat input
  * @keywords input, prompt, chat, send, compose, disclaimer, loading, v-model, textarea
- * @related CkPromptInput, CkPromptActionButton, CkPromptInputDisclaimer, CkConversation
+ * @related CkPromptInput, CkPromptSendButton, CkPromptInputDisclaimer, CkConversation
  */
 export interface CkInputProps {
     /**
@@ -30,11 +30,6 @@ export interface CkInputProps {
      * @default false
      */
     loading?: boolean;
-    /**
-     * Max height (in px) of the underlying textarea before it becomes scrollable.
-     * @default 200
-     */
-    maxHeight?: number;
     /**
      * Accessible label for the input.
      * @default 'Chat message input'

package/dist/components/composed/CkInput/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/composed/CkInput/types.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,MAAM,WAAW,YAAY;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,YAAY;IAC3B,kCAAkC;IAClC,CAAC,CAAC,EAAE,mBAAmB,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9C,kEAAkE;IAClE,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACpC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/composed/CkInput/types.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,MAAM,WAAW,YAAY;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,YAAY;IAC3B,kCAAkC;IAClC,CAAC,CAAC,EAAE,mBAAmB,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9C,kEAAkE;IAClE,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACpC"}

package/dist/components/index.d.ts

@@ -1,5 +1,5 @@
-export { CkAgentMessage, CkConversationLayout, CkCopyMessageActionButton, CkDropZoneOverlay, CkFeedbackButton, CkFeedbackDialog, CkFileItemsList, CkHistoryItem, CkHistoryWrapper, CkMarkdownRenderer, CkMessageActionButton, CkModelSelector, CkPromptActionButton, CkPromptStopButton, CkPromptInput, CkPromptInputDisclaimer, CkSendIcon, CkStopIcon, CkUserMessage, } from './base';
-export type { CkConversationLayoutProps, CkDropZoneOverlayProps, CkDropZoneOverlayEmits, CkDropZoneRejection, CkDropZoneRejectionReason, CkFeedbackButtonProps, CkFeedbackDialogEmits, CkFeedbackDialogProps, CkFeedbackDialogSubmitPayload, CkFeedbackReason, CkFeedbackSentiment, CkFeedbackValue, CkFileEntry, CkFileItemsListEmits, CkFileItemsListProps, CkHistoryItemEmits, CkHistoryItemProps, CkHistoryWrapperProps, CkMarkdownElementClasses, CkMarkdownRendererProps, CkModelOption, CkModelSelectorProps, CkModelSelectorEmits, CkUserMessageProps, } from './base';
+export { CkAgentMessage, CkConversationLayout, CkCopyMessageActionButton, CkDropZoneOverlay, CkFeedbackButton, CkFeedbackDialog, CkFileItemsList, CkHistoryItem, CkHistoryWrapper, CkMarkdownRenderer, CkMessageActionButton, CkModelSelector, CkPromptSendButton, CkPromptMenuButton, CkPromptStopButton, CkPromptInput, CkPromptInputDisclaimer, CkSendIcon, CkStopIcon, CkUserMessage, } from './base';
+export type { CkConversationLayoutProps, CkDropZoneOverlayProps, CkDropZoneOverlayEmits, CkDropZoneRejection, CkDropZoneRejectionReason, CkFeedbackButtonProps, CkFeedbackDialogEmits, CkFeedbackDialogProps, CkFeedbackDialogSubmitPayload, CkFeedbackReason, CkFeedbackSentiment, CkFeedbackValue, CkFileEntry, CkFileItemsListEmits, CkFileItemsListProps, CkHistoryItemEmits, CkHistoryItemProps, CkHistoryWrapperProps, CkMarkdownElementClasses, CkMarkdownRendererProps, CkModelOption, CkModelSelectorProps, CkModelSelectorEmits, CkPromptMenuButtonProps, CkUserMessageProps, } from './base';
 export { CkConversation, CkHistory, CkInput } from './composed';
 export type { CkConversationProps, CkHistoryEmits, CkHistoryProps, } from './composed';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,cAAc,EACd,oBAAoB,EACpB,yBAAyB,EACzB,iBAAiB,EACjB,gBAAgB,EAChB,gBAAgB,EAChB,eAAe,EACf,aAAa,EACb,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACrB,eAAe,EACf,oBAAoB,EACpB,kBAAkB,EAClB,aAAa,EACb,uBAAuB,EACvB,UAAU,EACV,UAAU,EACV,aAAa,GACd,MAAM,QAAQ,CAAC;AAChB,YAAY,EACV,yBAAyB,EACzB,sBAAsB,EACtB,sBAAsB,EACtB,mBAAmB,EACnB,yBAAyB,EACzB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,6BAA6B,EAC7B,gBAAgB,EAChB,mBAAmB,EACnB,eAAe,EACf,WAAW,EACX,oBAAoB,EACpB,oBAAoB,EACpB,kBAAkB,EAClB,kBAAkB,EAClB,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EACvB,aAAa,EACb,oBAAoB,EACpB,oBAAoB,EACpB,kBAAkB,GACnB,MAAM,QAAQ,CAAC;AAGhB,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAChE,YAAY,EACV,mBAAmB,EACnB,cAAc,EACd,cAAc,GACf,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,cAAc,EACd,oBAAoB,EACpB,yBAAyB,EACzB,iBAAiB,EACjB,gBAAgB,EAChB,gBAAgB,EAChB,eAAe,EACf,aAAa,EACb,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACrB,eAAe,EACf,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,aAAa,EACb,uBAAuB,EACvB,UAAU,EACV,UAAU,EACV,aAAa,GACd,MAAM,QAAQ,CAAC;AAChB,YAAY,EACV,yBAAyB,EACzB,sBAAsB,EACtB,sBAAsB,EACtB,mBAAmB,EACnB,yBAAyB,EACzB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,6BAA6B,EAC7B,gBAAgB,EAChB,mBAAmB,EACnB,eAAe,EACf,WAAW,EACX,oBAAoB,EACpB,oBAAoB,EACpB,kBAAkB,EAClB,kBAAkB,EAClB,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EACvB,aAAa,EACb,oBAAoB,EACpB,oBAAoB,EACpB,uBAAuB,EACvB,kBAAkB,GACnB,MAAM,QAAQ,CAAC;AAGhB,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAChE,YAAY,EACV,mBAAmB,EACnB,cAAc,EACd,cAAc,GACf,MAAM,YAAY,CAAC"}

package/dist/components/index.js

@@ -1,4 +1,4 @@
-import { _, a, b, C, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q, r, s, t } from "../CkInput.vue_vue_type_script_setup_true_lang-DYTizPsB.js";
+import { _, a, b, C, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q, r, s, t, u } from "../CkInput.vue_vue_type_script_setup_true_lang-DKzc21Yp.js";
 export {
   _ as CkAgentMessage,
   a as CkConversation,
@@ -15,11 +15,12 @@ export {
   k as CkMarkdownRenderer,
   l as CkMessageActionButton,
   m as CkModelSelector,
-  n as CkPromptActionButton,
-  o as CkPromptInput,
-  p as CkPromptInputDisclaimer,
-  q as CkPromptStopButton,
-  r as CkSendIcon,
-  s as CkStopIcon,
-  t as CkUserMessage
+  n as CkPromptInput,
+  o as CkPromptInputDisclaimer,
+  p as CkPromptMenuButton,
+  q as CkPromptSendButton,
+  r as CkPromptStopButton,
+  s as CkSendIcon,
+  t as CkStopIcon,
+  u as CkUserMessage
 };

package/dist/handlers/index.js

@@ -1,5 +1,5 @@
 import { u } from "../useMessageHandler-CMdy-lm0.js";
-import { C, d, p, u as u2, a } from "../useChatKitLabels-ZutacPad.js";
+import { C, d, p, u as u2, a } from "../useChatKitLabels-CLsWWwgG.js";
 export {
   C as CHAT_KIT_LABELS,
   d as defaultChatKitLabels,

package/dist/handlers/useChatKitLabels.d.ts

@@ -73,6 +73,12 @@ export type ChatKitLabels = {
     modelSelectorListAriaLabel?: string;
     /** Trigger text shown by `CkModelSelector` when no model is selected. */
     modelSelectorPlaceholder?: string;
+    /**
+     * Accessible label for the horizontally scrollable wrapper around markdown
+     * tables in `CkMarkdownRenderer` (the wrapper is focusable so keyboard users
+     * can scroll wide tables). Falls back to `defaultChatKitLabels` when omitted.
+     */
+    markdownTableLabel?: string;
     /** Fallback title used by `CkHistory` when a conversation has no `title`. */
     historyItemUntitled: string;
     /** Accessible name for the trailing kebab trigger on each `CkHistory` row. */

package/dist/handlers/useChatKitLabels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useChatKitLabels.d.ts","sourceRoot":"","sources":["../../src/handlers/useChatKitLabels.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAG1D;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,0CAA0C;IAC1C,cAAc,EAAE,MAAM,CAAC;IACvB,4CAA4C;IAC5C,qBAAqB,EAAE,MAAM,CAAC;IAC9B,gDAAgD;IAChD,gBAAgB,EAAE,MAAM,CAAC;IACzB,sFAAsF;IACtF,iBAAiB,EAAE,MAAM,CAAC;IAC1B,4FAA4F;IAC5F,uBAAuB,EAAE,MAAM,CAAC;IAChC;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,+DAA+D;IAC/D,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,+DAA+D;IAC/D,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,gEAAgE;IAChE,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,kFAAkF;IAClF,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,qEAAqE;IACrE,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,qEAAqE;IACrE,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,iEAAiE;IACjE,iCAAiC,CAAC,EAAE,MAAM,CAAC;IAC3C,iDAAiD;IACjD,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,iDAAiD;IACjD,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,0EAA0E;IAC1E,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,yEAAyE;IACzE,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,iEAAiE;IACjE,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,+DAA+D;IAC/D,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,yEAAyE;IACzE,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,6EAA6E;IAC7E,mBAAmB,EAAE,MAAM,CAAC;IAC5B,8EAA8E;IAC9E,0BAA0B,EAAE,MAAM,CAAC;IACnC,uEAAuE;IACvE,qBAAqB,EAAE,MAAM,CAAC;IAC9B,yEAAyE;IACzE,uBAAuB,EAAE,MAAM,CAAC;IAChC;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,yEAAyE;AACzE,eAAO,MAAM,oBAAoB,EAAE,aA8BlC,CAAC;AAEF,4CAA4C;AAC5C,eAAO,MAAM,eAAe,EAAE,YAAY,CAAC,WAAW,CAAC,aAAa,CAAC,CAC1C,CAAC;AAE5B,KAAK,aAAa,GAAG,OAAO,CAAC,aAAa,CAAC,CAAC;AAE5C,yFAAyF;AACzF,KAAK,cAAc,GACf,GAAG,CAAC,aAAa,CAAC,GAClB,WAAW,CAAC,aAAa,CAAC,GAC1B,CAAC,MAAM,aAAa,CAAC,CAAC;AAE1B;;;;;;;;;GASG;AACH,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,cAAc,GAAG,IAAI,CAKjE;AAED;;;;;;GAMG;AACH,wBAAgB,gBAAgB,IAAI,WAAW,CAAC,aAAa,CAAC,CAK7D"}
+{"version":3,"file":"useChatKitLabels.d.ts","sourceRoot":"","sources":["../../src/handlers/useChatKitLabels.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAG1D;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,0CAA0C;IAC1C,cAAc,EAAE,MAAM,CAAC;IACvB,4CAA4C;IAC5C,qBAAqB,EAAE,MAAM,CAAC;IAC9B,gDAAgD;IAChD,gBAAgB,EAAE,MAAM,CAAC;IACzB,sFAAsF;IACtF,iBAAiB,EAAE,MAAM,CAAC;IAC1B,4FAA4F;IAC5F,uBAAuB,EAAE,MAAM,CAAC;IAChC;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,+DAA+D;IAC/D,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,+DAA+D;IAC/D,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,gEAAgE;IAChE,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,kFAAkF;IAClF,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,qEAAqE;IACrE,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,qEAAqE;IACrE,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,iEAAiE;IACjE,iCAAiC,CAAC,EAAE,MAAM,CAAC;IAC3C,iDAAiD;IACjD,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,iDAAiD;IACjD,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,0EAA0E;IAC1E,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,yEAAyE;IACzE,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,iEAAiE;IACjE,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,+DAA+D;IAC/D,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,yEAAyE;IACzE,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,6EAA6E;IAC7E,mBAAmB,EAAE,MAAM,CAAC;IAC5B,8EAA8E;IAC9E,0BAA0B,EAAE,MAAM,CAAC;IACnC,uEAAuE;IACvE,qBAAqB,EAAE,MAAM,CAAC;IAC9B,yEAAyE;IACzE,uBAAuB,EAAE,MAAM,CAAC;IAChC;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,yEAAyE;AACzE,eAAO,MAAM,oBAAoB,EAAE,aA+BlC,CAAC;AAEF,4CAA4C;AAC5C,eAAO,MAAM,eAAe,EAAE,YAAY,CAAC,WAAW,CAAC,aAAa,CAAC,CAC1C,CAAC;AAE5B,KAAK,aAAa,GAAG,OAAO,CAAC,aAAa,CAAC,CAAC;AAE5C,yFAAyF;AACzF,KAAK,cAAc,GACf,GAAG,CAAC,aAAa,CAAC,GAClB,WAAW,CAAC,aAAa,CAAC,GAC1B,CAAC,MAAM,aAAa,CAAC,CAAC;AAE1B;;;;;;;;;GASG;AACH,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,cAAc,GAAG,IAAI,CAKjE;AAED;;;;;;GAMG;AACH,wBAAgB,gBAAgB,IAAI,WAAW,CAAC,aAAa,CAAC,CAK7D"}

package/dist/index.d.ts

@@ -5,8 +5,8 @@ export { useChat, useConversationSessions, useConversations, } from './composabl
 export type { ChatActions, ChatState, ConversationSession, CreateConversationInput, MessageHandler, MutationOptions, UseChatReturn, UseConversationSessionsReturn, UseConversationsOptions, UseConversationsReturn, } from './composables';
 export { SdkError, createDocumentUploadProvider, defaultDocumentUploadConfig, defaultEndpoints, useDocumentUploadWithDefaultConfig, } from './composables/fileUpload';
 export type { DocumentUploadConfig, DocumentUploadProvider, FileEntry, FileStatus, } from './composables/fileUpload';
-export { CkAgentMessage, CkConversation, CkConversationLayout, CkCopyMessageActionButton, CkDropZoneOverlay, CkFeedbackButton, CkFeedbackDialog, CkFileItemsList, CkHistory, CkHistoryItem, CkHistoryWrapper, CkInput, CkMarkdownRenderer, CkMessageActionButton, CkModelSelector, CkPromptActionButton, CkPromptStopButton, CkPromptInput, CkPromptInputDisclaimer, CkSendIcon, CkStopIcon, CkUserMessage, } from './components';
-export type { CkConversationLayoutProps, CkConversationProps, CkDropZoneOverlayProps, CkDropZoneOverlayEmits, CkDropZoneRejection, CkDropZoneRejectionReason, CkFeedbackButtonProps, CkFeedbackDialogEmits, CkFeedbackDialogProps, CkFeedbackDialogSubmitPayload, CkFeedbackReason, CkFeedbackSentiment, CkFeedbackValue, CkFileEntry, CkFileItemsListEmits, CkFileItemsListProps, CkHistoryEmits, CkHistoryItemEmits, CkHistoryItemProps, CkHistoryProps, CkHistoryWrapperProps, CkMarkdownElementClasses, CkMarkdownRendererProps, CkModelOption, CkModelSelectorProps, CkModelSelectorEmits, CkUserMessageProps, } from './components';
+export { CkAgentMessage, CkConversation, CkConversationLayout, CkCopyMessageActionButton, CkDropZoneOverlay, CkFeedbackButton, CkFeedbackDialog, CkFileItemsList, CkHistory, CkHistoryItem, CkHistoryWrapper, CkInput, CkMarkdownRenderer, CkMessageActionButton, CkModelSelector, CkPromptSendButton, CkPromptMenuButton, CkPromptStopButton, CkPromptInput, CkPromptInputDisclaimer, CkSendIcon, CkStopIcon, CkUserMessage, } from './components';
+export type { CkConversationLayoutProps, CkConversationProps, CkDropZoneOverlayProps, CkDropZoneOverlayEmits, CkDropZoneRejection, CkDropZoneRejectionReason, CkFeedbackButtonProps, CkFeedbackDialogEmits, CkFeedbackDialogProps, CkFeedbackDialogSubmitPayload, CkFeedbackReason, CkFeedbackSentiment, CkFeedbackValue, CkFileEntry, CkFileItemsListEmits, CkFileItemsListProps, CkHistoryEmits, CkHistoryItemEmits, CkHistoryItemProps, CkHistoryProps, CkHistoryWrapperProps, CkMarkdownElementClasses, CkMarkdownRendererProps, CkModelOption, CkModelSelectorProps, CkModelSelectorEmits, CkPromptMenuButtonProps, CkUserMessageProps, } from './components';
 export { formatRelativeTime } from './helpers';
 export type { BaseMessage, Conversation, ConversationTree, MessageContent, MessageContentStatus, MessageMetadata, MessageReasoningContent, MessageRole, MessageStatus, MessageTextContent, MessageToolContent, TreeMessage, } from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,UAAU,EACf,KAAK,WAAW,EAChB,KAAK,YAAY,EACjB,KAAK,mBAAmB,EACxB,KAAK,UAAU,EACf,KAAK,eAAe,EACpB,KAAK,mBAAmB,EACxB,KAAK,WAAW,GACjB,MAAM,YAAY,CAAC;AASpB,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,oBAAoB,EACpB,gBAAgB,EAChB,oBAAoB,EACpB,eAAe,GAChB,MAAM,YAAY,CAAC;AACpB,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,OAAO,EACL,OAAO,EACP,uBAAuB,EACvB,gBAAgB,GACjB,MAAM,eAAe,CAAC;AACvB,YAAY,EACV,WAAW,EACX,SAAS,EACT,mBAAmB,EACnB,uBAAuB,EACvB,cAAc,EACd,eAAe,EACf,aAAa,EACb,6BAA6B,EAC7B,uBAAuB,EACvB,sBAAsB,GACvB,MAAM,eAAe,CAAC;AAEvB,OAAO,EACL,QAAQ,EACR,4BAA4B,EAC5B,2BAA2B,EAC3B,gBAAgB,EAChB,kCAAkC,GACnC,MAAM,0BAA0B,CAAC;AAClC,YAAY,EACV,oBAAoB,EACpB,sBAAsB,EACtB,SAAS,EACT,UAAU,GACX,MAAM,0BAA0B,CAAC;AAGlC,OAAO,EACL,cAAc,EACd,cAAc,EACd,oBAAoB,EACpB,yBAAyB,EACzB,iBAAiB,EACjB,gBAAgB,EAChB,gBAAgB,EAChB,eAAe,EACf,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,OAAO,EACP,kBAAkB,EAClB,qBAAqB,EACrB,eAAe,EACf,oBAAoB,EACpB,kBAAkB,EAClB,aAAa,EACb,uBAAuB,EACvB,UAAU,EACV,UAAU,EACV,aAAa,GACd,MAAM,cAAc,CAAC;AACtB,YAAY,EACV,yBAAyB,EACzB,mBAAmB,EACnB,sBAAsB,EACtB,sBAAsB,EACtB,mBAAmB,EACnB,yBAAyB,EACzB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,6BAA6B,EAC7B,gBAAgB,EAChB,mBAAmB,EACnB,eAAe,EACf,WAAW,EACX,oBAAoB,EACpB,oBAAoB,EACpB,cAAc,EACd,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EACvB,aAAa,EACb,oBAAoB,EACpB,oBAAoB,EACpB,kBAAkB,GACnB,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAG/C,YAAY,EACV,WAAW,EACX,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,oBAAoB,EACpB,eAAe,EACf,uBAAuB,EACvB,WAAW,EACX,aAAa,EACb,kBAAkB,EAClB,kBAAkB,EAClB,WAAW,GACZ,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,UAAU,EACf,KAAK,WAAW,EAChB,KAAK,YAAY,EACjB,KAAK,mBAAmB,EACxB,KAAK,UAAU,EACf,KAAK,eAAe,EACpB,KAAK,mBAAmB,EACxB,KAAK,WAAW,GACjB,MAAM,YAAY,CAAC;AASpB,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,oBAAoB,EACpB,gBAAgB,EAChB,oBAAoB,EACpB,eAAe,GAChB,MAAM,YAAY,CAAC;AACpB,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,OAAO,EACL,OAAO,EACP,uBAAuB,EACvB,gBAAgB,GACjB,MAAM,eAAe,CAAC;AACvB,YAAY,EACV,WAAW,EACX,SAAS,EACT,mBAAmB,EACnB,uBAAuB,EACvB,cAAc,EACd,eAAe,EACf,aAAa,EACb,6BAA6B,EAC7B,uBAAuB,EACvB,sBAAsB,GACvB,MAAM,eAAe,CAAC;AAEvB,OAAO,EACL,QAAQ,EACR,4BAA4B,EAC5B,2BAA2B,EAC3B,gBAAgB,EAChB,kCAAkC,GACnC,MAAM,0BAA0B,CAAC;AAClC,YAAY,EACV,oBAAoB,EACpB,sBAAsB,EACtB,SAAS,EACT,UAAU,GACX,MAAM,0BAA0B,CAAC;AAGlC,OAAO,EACL,cAAc,EACd,cAAc,EACd,oBAAoB,EACpB,yBAAyB,EACzB,iBAAiB,EACjB,gBAAgB,EAChB,gBAAgB,EAChB,eAAe,EACf,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,OAAO,EACP,kBAAkB,EAClB,qBAAqB,EACrB,eAAe,EACf,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,aAAa,EACb,uBAAuB,EACvB,UAAU,EACV,UAAU,EACV,aAAa,GACd,MAAM,cAAc,CAAC;AACtB,YAAY,EACV,yBAAyB,EACzB,mBAAmB,EACnB,sBAAsB,EACtB,sBAAsB,EACtB,mBAAmB,EACnB,yBAAyB,EACzB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,6BAA6B,EAC7B,gBAAgB,EAChB,mBAAmB,EACnB,eAAe,EACf,WAAW,EACX,oBAAoB,EACpB,oBAAoB,EACpB,cAAc,EACd,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EACvB,aAAa,EACb,oBAAoB,EACpB,oBAAoB,EACpB,uBAAuB,EACvB,kBAAkB,GACnB,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAG/C,YAAY,EACV,WAAW,EACX,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,oBAAoB,EACpB,eAAe,EACf,uBAAuB,EACvB,WAAW,EACX,aAAa,EACb,kBAAkB,EAClB,kBAAkB,EAClB,WAAW,GACZ,MAAM,SAAS,CAAC"}

package/dist/index.js

@@ -1,7 +1,7 @@
 import { u } from "./useMessageHandler-CMdy-lm0.js";
-import { C, d, p, u as u2, a } from "./useChatKitLabels-ZutacPad.js";
+import { C, d, p, u as u2, a } from "./useChatKitLabels-CLsWWwgG.js";
 import { S, c, d as d2, a as a2, u as u3, b, e, f } from "./index-THzZwfMU.js";
-import { _, a as a3, b as b2, C as C2, c as c2, d as d3, e as e2, f as f2, g, h, i, j, k, l, m, n, o, p as p2, q, r, s, t, u as u4 } from "./CkInput.vue_vue_type_script_setup_true_lang-DYTizPsB.js";
+import { _, a as a3, b as b2, C as C2, c as c2, d as d3, e as e2, f as f2, g, h, i, j, k, l, m, n, o, p as p2, q, r, s, t, u as u4, v } from "./CkInput.vue_vue_type_script_setup_true_lang-DKzc21Yp.js";
 export {
   C as CHAT_KIT_LABELS,
   _ as CkAgentMessage,
@@ -19,19 +19,20 @@ export {
   k as CkMarkdownRenderer,
   l as CkMessageActionButton,
   m as CkModelSelector,
-  n as CkPromptActionButton,
-  o as CkPromptInput,
-  p2 as CkPromptInputDisclaimer,
-  q as CkPromptStopButton,
-  r as CkSendIcon,
-  s as CkStopIcon,
-  t as CkUserMessage,
+  n as CkPromptInput,
+  o as CkPromptInputDisclaimer,
+  p2 as CkPromptMenuButton,
+  q as CkPromptSendButton,
+  r as CkPromptStopButton,
+  s as CkSendIcon,
+  t as CkStopIcon,
+  u4 as CkUserMessage,
   S as SdkError,
   c as createDocumentUploadProvider,
   d as defaultChatKitLabels,
   d2 as defaultDocumentUploadConfig,
   a2 as defaultEndpoints,
-  u4 as formatRelativeTime,
+  v as formatRelativeTime,
   p as provideChatKitLabels,
   u3 as useChat,
   u2 as useChatKitLabels,

package/dist/{useChatKitLabels-ZutacPad.js → useChatKitLabels-CLsWWwgG.js}

@@ -12722,6 +12722,7 @@ const defaultChatKitLabels = {
   modelSelectorAriaLabel: "Select model",
   modelSelectorListAriaLabel: "Models",
   modelSelectorPlaceholder: "Select model",
+  markdownTableLabel: "Table",
   historyItemUntitled: "Untitled conversation",
   historyItemActionAriaLabel: "Conversation options",
   historyItemEditAction: "Edit",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aleph-alpha/chat-kit",
-  "version": "2.3.0",
+  "version": "3.1.0",
   "description": "Chat kit package for building chat interfaces with Vue",
   "type": "module",
   "main": "./dist/index.js",

package/src/components/base/CkAgentMessage/CkAgentMessage.vue

@@ -3,7 +3,7 @@ defineOptions({ name: 'CkAgentMessage' });
 </script>
 
 <template>
-  <div class="flex w-full flex-col gap-6 pb-6">
+  <div class="flex w-full min-w-0 flex-col gap-6 pb-6">
     <div v-if="$slots.icon || $slots.header" class="flex items-start gap-3">
       <div
         v-if="$slots.icon"
@@ -21,7 +21,7 @@ defineOptions({ name: 'CkAgentMessage' });
       </span>
     </div>
 
-    <div class="text-content-on-surface-primary text-base leading-7">
+    <div class="text-content-on-surface-primary min-w-0 text-base leading-7">
       <slot />
     </div>
 

package/src/components/base/CkConversationLayout/CkConversationLayout.vue

@@ -188,11 +188,12 @@ watch(
       v-for="message in messages"
       :key="message.id"
       :data-message-row="message.role"
+      class="min-w-0"
     >
-      <div v-if="message.role === 'user'" class="flex justify-end">
+      <div v-if="message.role === 'user'" class="flex min-w-0 justify-end">
         <slot name="user-message" :message="message" />
       </div>
-      <div v-else class="flex justify-start">
+      <div v-else class="flex min-w-0 justify-start">
         <slot name="agent-message" :message="message" />
       </div>
     </div>

package/src/components/base/CkDropZoneOverlay/CkDropZoneOverlay.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { computed, onBeforeUnmount, onMounted, ref } from 'vue';
+import { formatFileSize } from '@aleph-alpha/ui-library';
 
 import CkDropZoneIllustration from './CkDropZoneIllustration.vue';
 import type {
@@ -76,12 +77,6 @@ function fileMatchesAccept(file: File): boolean {
   return false;
 }
 
-function formatBytes(bytes: number): string {
-  const mb = bytes / (1024 * 1024);
-  if (mb >= 1) return `${mb.toFixed(0)} MB`;
-  return `${Math.max(1, Math.round(bytes / 1024))} KB`;
-}
-
 const isSingle = computed(() => props.maxFiles === 1);
 
 const resolvedHeading = computed(
@@ -156,7 +151,7 @@ function onOverlayDrop(e: DragEvent) {
       rejected.push({
         file,
         reason: 'too-large',
-        message: `"${file.name}" — exceeds ${formatBytes(props.maxFileSizeBytes)} limit`,
+        message: `"${file.name}" — exceeds ${formatFileSize(props.maxFileSizeBytes)} limit`,
       });
       continue;
     }

package/src/components/base/CkMarkdownRenderer/CkMarkdownRenderer.vue

@@ -10,13 +10,22 @@ import {
 } from 'vue';
 import type { PluggableList } from 'unified';
 import { useMarkdownParser } from '../../../handlers/useMarkdownParser';
+import {
+  defaultChatKitLabels,
+  useChatKitLabels,
+} from '../../../handlers/useChatKitLabels';
 import type { CkMarkdownElementClasses } from './types';
 import { defaultMarkdownClasses } from './defaultMarkdownClasses';
 
+// Tables are wrapped in a horizontally scrollable container so wide content
+// never forces the whole message column wider on narrow viewports.
+const TABLE_WRAPPER_CLASS = 'max-w-full overflow-x-auto';
+
 function domToVNode(
   node: Node,
   slots: Slots,
   classes: CkMarkdownElementClasses,
+  tableLabel: string,
 ): VNode | string | null {
   if (node.nodeType === Node.TEXT_NODE) return node.textContent;
   if (node.nodeType !== Node.ELEMENT_NODE) return null;
@@ -34,7 +43,7 @@ function domToVNode(
   }
 
   const children = Array.from(node.childNodes)
-    .map((child) => domToVNode(child, slots, classes))
+    .map((child) => domToVNode(child, slots, classes, tableLabel))
     .filter((c): c is VNode | string => c != null);
 
   const attrs: Record<string, string> = {};
@@ -48,7 +57,22 @@ function domToVNode(
     attrs.class = attrs.class ? `${attrs.class} ${customClass}` : customClass;
   }
 
-  return h(tag, attrs, children);
+  const vnode = h(tag, attrs, children);
+
+  if (tag === 'table') {
+    return h(
+      'div',
+      {
+        class: TABLE_WRAPPER_CLASS,
+        tabindex: '0',
+        role: 'region',
+        'aria-label': tableLabel,
+      },
+      [vnode],
+    );
+  }
+
+  return vnode;
 }
 
 export default defineComponent({
@@ -64,6 +88,7 @@ export default defineComponent({
   setup(props, { slots }) {
     const { content, plugins } = toRefs(props);
     const { html } = useMarkdownParser(content, plugins);
+    const labels = useChatKitLabels();
 
     const parsedNodes = computed(() => {
       const raw = html.value;
@@ -79,10 +104,17 @@ export default defineComponent({
 
     return () => {
       const elementClasses = mergedClasses.value;
+      const tableLabel =
+        labels.value.markdownTableLabel ??
+        defaultChatKitLabels.markdownTableLabel!;
       const children = parsedNodes.value
-        .map((node) => domToVNode(node, slots, elementClasses))
+        .map((node) => domToVNode(node, slots, elementClasses, tableLabel))
         .filter((c): c is VNode | string => c != null);
-      return h('div', { class: 'markdown-renderer' }, children);
+      return h(
+        'div',
+        { class: 'markdown-renderer min-w-0 break-words' },
+        children,
+      );
     };
   },
 });

package/src/components/base/CkMarkdownRenderer/defaultMarkdownClasses.ts

@@ -3,13 +3,14 @@ import type { CkMarkdownElementClasses } from './types';
 export const defaultMarkdownClasses: CkMarkdownElementClasses = {
   p: 'my-1 leading-7',
   a: 'underline underline-offset-4',
+  img: 'max-w-full h-auto',
   h1: 'mt-4 mb-2 text-2xl font-bold',
   h2: 'mt-3 mb-2 text-xl font-semibold',
   h3: 'mt-3 mb-1 text-lg font-semibold',
   ul: 'my-1 ml-6 list-disc',
   ol: 'my-1 ml-6 list-decimal',
   li: 'my-0.5',
-  pre: 'my-2 overflow-x-auto rounded-lg p-4',
+  pre: 'my-2 max-w-full overflow-x-auto rounded-lg p-4',
   code: 'rounded px-1.5 py-0.5',
   blockquote: 'my-2 border-l-2 pl-4 italic',
   table: 'my-2 w-full border-collapse',

package/src/components/base/CkModelSelector/CkModelSelector.vue

@@ -63,14 +63,19 @@ function select(id: string) {
     <UiPopoverTrigger as-child>
       <button
         type="button"
-        class="ck-model-selector__trigger inline-flex h-9 shrink-0 items-center gap-1 rounded-3xl px-3 label-14-medium text-content-on-surface-primary outline-none transition-colors hover:bg-background-surface-muted focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50"
+        class="ck-model-selector__trigger inline-flex h-9 min-w-0 items-center gap-1 rounded-3xl px-3 label-14-medium text-content-on-surface-primary outline-none transition-colors hover:bg-background-surface-muted focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50"
         :disabled="disabled"
         aria-haspopup="listbox"
         :aria-expanded="open"
         :aria-label="triggerAriaLabel"
       >
-        <span class="max-w-[10rem] truncate">{{ selectedLabel }}</span>
-        <UiIcon name="chevron-down" :size="16" aria-hidden="true" />
+        <span class="min-w-0 max-w-[10rem] truncate">{{ selectedLabel }}</span>
+        <UiIcon
+          name="chevron-down"
+          :size="16"
+          class="shrink-0"
+          aria-hidden="true"
+        />
       </button>
     </UiPopoverTrigger>
     <UiPopoverContent

package/src/components/base/CkModelSelector/types.ts

@@ -9,7 +9,7 @@
  * @category Actions
  * @useCases select model, choose LLM, model picker in prompt field, switch model mid-conversation
  * @keywords model, selector, picker, dropdown, llm, prompt, choose, switch
- * @related CkPromptInput, CkPromptActionButton
+ * @related CkPromptInput, CkPromptSendButton
  */
 export interface CkModelOption {
   /**

package/src/components/base/CkPromptInput/CkPromptInput.spec.ts

@@ -1,5 +1,29 @@
 import CkPromptInput from './CkPromptInput.vue';
 import { render, screen, fireEvent } from '@testing-library/vue';
+import { defineComponent, nextTick, ref } from 'vue';
+
+// Mock the textarea's scrollHeight (jsdom always returns 0). The auto-grow +
+// multi-line latch logic in CkPromptInput depends on scrollHeight; tests that
+// exercise that path call this helper to stage a measured value.
+function mockScrollHeight(value: number): void {
+  Object.defineProperty(HTMLTextAreaElement.prototype, 'scrollHeight', {
+    configurable: true,
+    get() {
+      return value;
+    },
+  });
+}
+
+function restoreScrollHeight(): void {
+  // Re-installing a property descriptor with a getter returning 0 mirrors
+  // jsdom's default (`HTMLElement.scrollHeight` returns 0 by spec there).
+  Object.defineProperty(HTMLTextAreaElement.prototype, 'scrollHeight', {
+    configurable: true,
+    get() {
+      return 0;
+    },
+  });
+}
 
 describe('CkPromptInput', () => {
   describe('rendering', () => {
@@ -122,13 +146,10 @@ describe('CkPromptInput', () => {
       expect(screen.getByText('Express')).toBeInTheDocument();
     });
 
-    it('does not render toolbar-left container when slot is not provided', () => {
+    it('renders no toolbar buttons when slots are not provided', () => {
       const { container } = render(CkPromptInput);
 
-      const toolbarDivs = container.querySelectorAll(
-        'form > div:last-child > div',
-      );
-      expect(toolbarDivs[0]?.children.length).toBe(0);
+      expect(container.querySelectorAll('button')).toHaveLength(0);
     });
 
     it('renders toolbar-right slot content', () => {
@@ -139,13 +160,12 @@ describe('CkPromptInput', () => {
       expect(screen.getByText('Custom Send')).toBeInTheDocument();
     });
 
-    it('renders nothing in toolbar-right by default', () => {
-      const { container } = render(CkPromptInput);
+    it('renders toolbar-top slot content', () => {
+      render(CkPromptInput, {
+        slots: { 'toolbar-top': '<span>Toolbar-top content</span>' },
+      });
 
-      const toolbarRight = container.querySelector(
-        'form > div:last-child > div.ml-auto',
-      );
-      expect(toolbarRight?.children.length).toBe(0);
+      expect(screen.getByText('Toolbar-top content')).toBeInTheDocument();
     });
 
     it('renders footer slot content', () => {
@@ -178,4 +198,179 @@ describe('CkPromptInput', () => {
       expect(screen.getByRole('textbox')).toBeDisabled();
     });
   });
+
+  // The form switches between compact (single-row, rounded-3xl) and stacked
+  // (multi-row, rounded-2xl) layouts based on (a) the presence of the
+  // `toolbar-top` slot and (b) whether the textarea content exceeds one line.
+  // These tests regression-guard the slot reactivity fix and the multi-line
+  // latch threshold.
+  describe('layout transitions', () => {
+    afterEach(() => {
+      restoreScrollHeight();
+    });
+
+    it('reacts to toolbar-top slot becoming available after mount', async () => {
+      const Parent = defineComponent({
+        components: { CkPromptInput },
+        setup() {
+          return { show: ref(false) };
+        },
+        template: `
+          <div>
+            <button data-testid="toggle" @click="show = !show">toggle</button>
+            <CkPromptInput model-value="">
+              <template v-if="show" #toolbar-top>
+                <span data-testid="top">attached files</span>
+              </template>
+            </CkPromptInput>
+          </div>
+        `,
+      });
+      const { container } = render(Parent);
+
+      expect(container.querySelector('[data-testid="top"]')).toBeNull();
+      expect(container.querySelector('form')?.className).toContain(
+        'rounded-3xl',
+      );
+
+      await fireEvent.click(screen.getByTestId('toggle'));
+
+      // Parent re-render → `useSlots()` flips → computed re-evaluates → top
+      // row renders AND the form swaps to the smaller multi-row radius.
+      expect(
+        container.querySelector('[data-testid="top"]'),
+      ).toBeInTheDocument();
+      expect(container.querySelector('form')?.className).toContain(
+        'rounded-2xl',
+      );
+    });
+
+    it('also reacts to toolbar-top slot becoming unavailable', async () => {
+      const Parent = defineComponent({
+        components: { CkPromptInput },
+        setup() {
+          return { show: ref(true) };
+        },
+        template: `
+          <div>
+            <button data-testid="toggle" @click="show = !show">toggle</button>
+            <CkPromptInput model-value="">
+              <template v-if="show" #toolbar-top>
+                <span data-testid="top">attached files</span>
+              </template>
+            </CkPromptInput>
+          </div>
+        `,
+      });
+      const { container } = render(Parent);
+
+      expect(container.querySelector('form')?.className).toContain(
+        'rounded-2xl',
+      );
+
+      await fireEvent.click(screen.getByTestId('toggle'));
+
+      expect(container.querySelector('[data-testid="top"]')).toBeNull();
+      expect(container.querySelector('form')?.className).toContain(
+        'rounded-3xl',
+      );
+    });
+
+    it('latches to multi-line layout when scrollHeight exceeds 2× line-height', async () => {
+      mockScrollHeight(48); // exactly 2 × LINE_HEIGHT
+      const Parent = defineComponent({
+        components: { CkPromptInput },
+        setup() {
+          return { text: ref('one') };
+        },
+        template: `
+          <CkPromptInput :model-value="text" @update:model-value="text = $event" />
+        `,
+      });
+      const { container, rerender } = render(Parent);
+      // Initial render mounted with scrollHeight=48 but modelValue='one' (no
+      // newline) — single line latches to multi when scrollHeight ≥ 48.
+      await nextTick();
+      // The grid template should now include the input-on-top + toolbar-row
+      // shape used for multi-line mode.
+      const form = container.querySelector('form');
+      expect(form?.style.gridTemplateAreas).toContain('"left . right"');
+
+      // Rerender to a different value to confirm the latch persists.
+      await rerender({});
+      await nextTick();
+      expect(form?.style.gridTemplateAreas).toContain('"left . right"');
+    });
+
+    it('does NOT latch on borderline scrollHeight (single emoji-line @ 36 px)', async () => {
+      mockScrollHeight(36); // 1.5 × LINE_HEIGHT — emoji/CJK sub-pixel rendering
+      const Parent = defineComponent({
+        components: { CkPromptInput },
+        setup() {
+          return { text: ref('hi 👋') };
+        },
+        template: `<CkPromptInput :model-value="text" />`,
+      });
+      const { container } = render(Parent);
+      await nextTick();
+      // Single-line layout: textarea + toolbars on the same row.
+      const form = container.querySelector('form');
+      expect(form?.style.gridTemplateAreas).toContain('"left input right"');
+      expect(form?.style.gridTemplateAreas).not.toContain('"left . right"');
+    });
+
+    it('latches when the user inserts an explicit newline (Shift+Enter)', async () => {
+      mockScrollHeight(24); // jsdom never reports >24 reliably; rely on \n
+      const Parent = defineComponent({
+        components: { CkPromptInput },
+        setup() {
+          return { text: ref('line one') };
+        },
+        template: `
+          <CkPromptInput :model-value="text" @update:model-value="text = $event" />
+        `,
+      });
+      const { container } = render(Parent);
+      await nextTick();
+      const form = container.querySelector('form');
+      expect(form?.style.gridTemplateAreas).toContain('"left input right"');
+
+      // Now the modelValue contains a newline.
+      const ParentTwoLines = defineComponent({
+        components: { CkPromptInput },
+        setup() {
+          return { text: ref('line one\nline two') };
+        },
+        template: `<CkPromptInput :model-value="text" />`,
+      });
+      const { container: c2 } = render(ParentTwoLines);
+      await nextTick();
+      expect(c2.querySelector('form')?.style.gridTemplateAreas).toContain(
+        '"left . right"',
+      );
+    });
+
+    it('un-latches multi-line state when the field is emptied', async () => {
+      mockScrollHeight(48);
+      const Parent = defineComponent({
+        components: { CkPromptInput },
+        setup() {
+          return { text: ref('something') };
+        },
+        template: `
+          <CkPromptInput :model-value="text" @update:model-value="text = $event" />
+        `,
+      });
+      const { container, getByRole } = render(Parent);
+      await nextTick();
+      const form = container.querySelector('form');
+      expect(form?.style.gridTemplateAreas).toContain('"left . right"');
+
+      mockScrollHeight(24);
+      await fireEvent.update(getByRole('textbox'), '');
+      await nextTick();
+
+      expect(form?.style.gridTemplateAreas).toContain('"left input right"');
+    });
+  });
 });