Signal/Desktop
1
0
Fork 0
mirror of https://github.com/signalapp/Signal-Desktop.git synced 2025-12-24 20:26:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

Composer: Listen for compose start/end and apply proper styling

Browse Source
This commit is contained in:
Scott Nonnenberg
2025-01-31 10:52:58 +10:00
committed by GitHub
parent 46ed9ed502
commit 6b2d65c1e7
6 changed files with 42 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
ts/components/CompositionInput.tsx
View File

@@ -9,6 +9,7 @@ import {
matchNewline,
matchBreak,
} from '@signalapp/quill-cjs/modules/clipboard';
import Emitter from '@signalapp/quill-cjs/core/emitter';
import classNames from 'classnames';
import { Manager, Reference } from 'react-popper';
import type { Range as RangeStatic } from '@signalapp/quill-cjs';
@@ -828,9 +829,16 @@ export function CompositionInput(props: Props): React.ReactElement {
quillRef.current = quill;
quill.on(Emitter.events.COMPOSITION_START, () => {
quill.root.classList.toggle('ql-blank', false);
});
quill.on(Emitter.events.COMPOSITION_END, () => {
quill.root.classList.toggle('ql-blank', quill.editor.isBlank());
});
// When loading a multi-line message out of a draft, the cursor
// position needs to be pushed to the end of the input manually.
quill.once('editor-change', () => {
quill.once(Emitter.events.EDITOR_CHANGE, () => {
setTimeout(() => {
quill.setSelection(quill.getLength(), 0);
quill.root.classList.add('ql-editor--loaded');
@@ -838,7 +846,7 @@ export function CompositionInput(props: Props): React.ReactElement {
});
quill.on(
'selection-change',
Emitter.events.SELECTION_CHANGE,
(newRange: RangeStatic, oldRange: RangeStatic) => {
// If we lose focus, store the last edit point for emoji insertion
if (newRange == null) {