feat(mobile): collapsed pill composer and mobile input redesign
Mobile composer redesign: when the keyboard is closed the input collapses into a narrow pill (sessions, attach, placeholder, mic) with a round new-session button that fades away on the draft screen. Model and agent selectors move into a row above the textarea; the draft project/branch pickers and the attachment menu become searchable bottom sheets reusing MobileOverlayPanel; a drag handle (also available while dictating) swipes the composer into and out of a fullscreen mode. Keyboard-lifecycle hardening: composer controls (agent cycle, dictation and its overlay controls) no longer steal focus and dismiss the keyboard; overlays reopen the keyboard on close via a debounced restore chain that survives menu-to-picker handoffs and skips the native file picker; open overlays and dictation keep the composer expanded. Dictation starts directly from the pill and its overlay content fades in after the shape settles. The keyboard slide compensates the pill-to-full height change in one motion, and the mobile highlight mirror is disabled so the caret always matches the text layout.
This commit is contained in:
@@ -624,3 +624,21 @@
|
||||
:root.oc-capacitor-app.oc-keyboard-open .oc-mobile-composer {
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
/* Content cross-fade for the pill ↔ full composer morph. The wrapper animates
|
||||
its height (FLIP in ChatInput); the freshly mounted state fades in on top. */
|
||||
@keyframes oc-composer-morph-fade {
|
||||
from { opacity: 0; }
|
||||
to { opacity: 1; }
|
||||
}
|
||||
.oc-composer-morph-fade {
|
||||
animation: oc-composer-morph-fade 0.24s ease-out both;
|
||||
}
|
||||
|
||||
/* Voice overlay variant: the overlay BACKGROUND appears immediately (it rides
|
||||
the morphing shape), but its content stays hidden until the shape has mostly
|
||||
finished growing, then fades in — no clipped controls mid-morph. Timings
|
||||
follow the 340ms wrapper morph in ChatInput. */
|
||||
.oc-composer-morph-content-fade > * {
|
||||
animation: oc-composer-morph-fade 0.18s ease-out 0.26s both;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user