diff --git a/src-svelte/screenshots/baseline/screens/chat/conversation/extra-long-input.png b/src-svelte/screenshots/baseline/screens/chat/conversation/extra-long-input.png new file mode 100644 index 00000000..0e3d1226 Binary files /dev/null and b/src-svelte/screenshots/baseline/screens/chat/conversation/extra-long-input.png differ diff --git a/src-svelte/src/routes/chat/Chat.stories.ts b/src-svelte/src/routes/chat/Chat.stories.ts index ce40b318..1e4daeb6 100644 --- a/src-svelte/src/routes/chat/Chat.stories.ts +++ b/src-svelte/src/routes/chat/Chat.stories.ts @@ -116,6 +116,33 @@ MultilineChat.parameters = { }, }; +export const ExtraLongInput: StoryObj = Template.bind({}) as any; +ExtraLongInput.args = { + conversation, + initialMessage: `Hey, I have this definition for a book object: + +\`\`\`python +class Book: + def __init__(self, title, author, pages): + self.title = title + self.author = author + self.pages = pages + + def book_info(self): + return f"'{self.title}' by {self.author} has {self.pages} pages." + + def is_long(self): + return self.pages > 200 +\`\`\` + +Do you have any code comments for me?`, +}; +ExtraLongInput.parameters = { + viewport: { + defaultViewport: "smallTablet", + }, +}; + export const BottomScrollIndicator: StoryObj = Template.bind({}) as any; BottomScrollIndicator.args = { conversation, diff --git a/src-svelte/src/routes/chat/Form.svelte b/src-svelte/src/routes/chat/Form.svelte index 15dc43c3..53376524 100644 --- a/src-svelte/src/routes/chat/Form.svelte +++ b/src-svelte/src/routes/chat/Form.svelte @@ -70,6 +70,7 @@ font-family: var(--font-body); width: 100%; min-height: 1.2rem; + max-height: 9.8rem; resize: none; } diff --git a/src-svelte/src/routes/storybook.test.ts b/src-svelte/src/routes/storybook.test.ts index f97359b3..3bc436e2 100644 --- a/src-svelte/src/routes/storybook.test.ts +++ b/src-svelte/src/routes/storybook.test.ts @@ -127,6 +127,7 @@ const components: ComponentTestConfig[] = [ "empty", "not-empty", "multiline-chat", + "extra-long-input", "bottom-scroll-indicator", "typing-indicator-static", "full-message-width",