Skip to content

feat(chat): stack the composer's header, chips and field - #1682

Open
bmc08gt wants to merge 1 commit into
feat/chat-media-transportfrom
feat/chat-media-composer
Open

bmc08gt wants to merge 1 commit into
feat/chat-media-transportfrom
feat/chat-media-composer

Conversation

@bmc08gt

@bmc08gt bmc08gt commented Oct 5, 2026

Copy link
Copy Markdown
Collaborator

The composer layout photos need, without the photos. ChatInput becomes a
custom Layout (ComposerMeasurePolicy) that stacks an optional header row
(reply strip or photo chips) over the text field and lays out the
accessory and send button around it, matching the iOS composer.

  • composerStacks() decides when the field goes multi-line; it is pure and
    covered by ComposerStackingTest.
  • Height changes, the single-line to multi-line switch and the header
    arriving or leaving all ease on one spring (dampingRatio 1, ~0.28s, the
    iOS replySurface curve), so the field and its text move together.
  • Corners stay concentric: the field's corner is the header chip's corner
    plus the inset, on one line or stacked.
  • The header strip fades only at an edge it has scrolled past.
  • Sizes come from the static grid; the one-line field is FieldPadding +
    AccessorySize + FieldPadding, the same 50dp as the $ button.

Stacked on #1681.

@bmc08gt bmc08gt self-assigned this Oct 5, 2026
@github-actions github-actions Bot added the area: ui Compose UI, theme, components, resources label Oct 5, 2026
@bmc08gt
bmc08gt force-pushed the feat/chat-media-transport branch from 37fc323 to cca6d0b Compare October 6, 2026 00:58
@bmc08gt
bmc08gt force-pushed the feat/chat-media-composer branch from 893df75 to b4fb16f Compare October 6, 2026 00:58
@github-actions github-actions Bot added the type: feature New functionality label Oct 6, 2026
The composer layout photos need, without the photos. ChatInput becomes a
custom Layout (ComposerMeasurePolicy) that stacks an optional header row
(reply strip or photo chips) over the text field and lays out the
accessory and send button around it, matching the iOS composer.

- composerStacks() decides when the field goes multi-line; it is pure and
  covered by ComposerStackingTest.
- Height changes, the single-line to multi-line switch and the header
  arriving or leaving all ease on one spring (dampingRatio 1, ~0.28s, the
  iOS replySurface curve), so the field and its text move together.
- Corners stay concentric: the field's corner is the header chip's corner
  plus the inset, on one line or stacked.
- The header strip fades only at an edge it has scrolled past.
- Sizes come from the static grid; the one-line field is FieldPadding +
  AccessorySize + FieldPadding, the same 50dp as the $ button.
@bmc08gt
bmc08gt force-pushed the feat/chat-media-composer branch from b4fb16f to 011af03 Compare October 6, 2026 01:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area: ui Compose UI, theme, components, resources type: feature New functionality

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant