Skip to content

UX: Auto-resize the AI bot docked composer with content#39837

Merged
SamSaffron merged 5 commits intomainfrom
composer-auto
May 10, 2026
Merged

UX: Auto-resize the AI bot docked composer with content#39837
SamSaffron merged 5 commits intomainfrom
composer-auto

Conversation

@SamSaffron
Copy link
Copy Markdown
Member

Adds an @autoResize mode to the shared DockedComposer so the input
grows with its content up to a viewport-bounded max height instead of
requiring a manual resize handle. The textarea path uses CSS
field-sizing: content (with a JS fallback for older browsers), while
the rich editor relies on a capped max-height with internal scroll.

The AI bot docked composer adopts the new mode and drops its custom
resize-handle styling. The --docked-composer-max-resize-offset custom
property is now kept in sync on viewport and window resize so the cap
tracks available space on mobile keyboards.

Internally renames textarea to inputElement since the reference can
now point at either a <textarea> or the ProseMirror contenteditable.

Adds an `@autoResize` mode to the shared `DockedComposer` so the input
grows with its content up to a viewport-bounded max height instead of
requiring a manual resize handle. The textarea path uses CSS
`field-sizing: content` (with a JS fallback for older browsers), while
the rich editor relies on a capped `max-height` with internal scroll.

The AI bot docked composer adopts the new mode and drops its custom
resize-handle styling. The `--docked-composer-max-resize-offset` custom
property is now kept in sync on viewport and window resize so the cap
tracks available space on mobile keyboards.

Internally renames `textarea` to `inputElement` since the reference can
now point at either a `<textarea>` or the ProseMirror contenteditable.
Copy link
Copy Markdown
Member

@keegangeorge keegangeorge left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great! Thank you!

@SamSaffron
Copy link
Copy Markdown
Member Author

@patch-triage can you rebase?

# Conflicts:
#	frontend/discourse/app/components/docked-composer.gjs
#	plugins/discourse-ai/assets/javascripts/discourse/components/ai-bot-docked-composer.gjs
@SamSaffron
Copy link
Copy Markdown
Member Author

@patch-triage ... fix linting

@discourse-patch-triage
Copy link
Copy Markdown
Contributor

Applied suggestions and committed the fix.

Fix indentation linting in docked composer components

  • frontend/discourse/app/components/docked-composer.gjs
  • plugins/discourse-ai/assets/javascripts/discourse/components/ai-bot-docked-composer.gjs

69720b4

@SamSaffron
Copy link
Copy Markdown
Member Author

@patch-triage oh my ... previous commit utf-8 mangled some lines fix that

@discourse-patch-triage
Copy link
Copy Markdown
Contributor

Could not apply all suggestions:

  • frontend/discourse/app/components/docked-composer.gjs: search string not found — the code may have already changed or the suggestion is stale. Copy the exact text from read_file output:
// Reusable chat-style "docked" composer. There is deliberately no
// markdown-preview toggle  users who want to see rendered output
// switch to the rich editor via the toolbar's RTE toggle, which is
  • frontend/discourse/app/components/docked-composer.gjs: search string not found — the code may have already changed or the suggestion is stale. Copy the exact text from read_file output:
// @onSubmit is required; all other args are optional. See the
// styleguide entry (/styleguide  Organisms  Docked Composer) for
// the live API surface.
  • frontend/discourse/app/components/docked-composer.gjs: search string not found — the code may have already changed or the suggestion is stale. Copy the exact text from read_file output:
      // Falsy return  don't clear; consumer can short-circuit on
      // validation failure without losing the user's input.
      if (!result) {

@SamSaffron SamSaffron merged commit 38ab100 into main May 10, 2026
17 checks passed
@SamSaffron SamSaffron deleted the composer-auto branch May 10, 2026 22:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Development

Successfully merging this pull request may close these issues.

2 participants