feat: person @mentions edit-mode infrastructure (PR-B1, #362) #369
@@ -43,6 +43,7 @@ let debounceTimer: ReturnType<typeof setTimeout> | undefined;
|
|||||||
|
|
||||||
function attachTextarea(node: HTMLTextAreaElement) {
|
function attachTextarea(node: HTMLTextAreaElement) {
|
||||||
textarea = node;
|
textarea = node;
|
||||||
|
resizeTextarea();
|
||||||
const parentCleanup = captureTextarea?.(node);
|
const parentCleanup = captureTextarea?.(node);
|
||||||
return () => {
|
return () => {
|
||||||
parentCleanup?.();
|
parentCleanup?.();
|
||||||
@@ -50,6 +51,19 @@ function attachTextarea(node: HTMLTextAreaElement) {
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function resizeTextarea() {
|
||||||
|
if (!textarea) return;
|
||||||
|
textarea.style.height = 'auto';
|
||||||
|
textarea.style.height = `${textarea.scrollHeight}px`;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Autoresize on every value change — read `value` so this $effect
|
||||||
|
// re-runs whenever the bound prop is reassigned.
|
||||||
|
$effect(() => {
|
||||||
|
void value;
|
||||||
|
resizeTextarea();
|
||||||
|
});
|
||||||
|
|
||||||
function handleInput() {
|
function handleInput() {
|
||||||
if (!textarea) return;
|
if (!textarea) return;
|
||||||
const cursorPos = textarea.selectionStart;
|
const cursorPos = textarea.selectionStart;
|
||||||
|
|||||||
@@ -85,24 +85,11 @@ let textareaEl: HTMLTextAreaElement | null = null;
|
|||||||
|
|
||||||
function captureTextarea(node: HTMLTextAreaElement) {
|
function captureTextarea(node: HTMLTextAreaElement) {
|
||||||
textareaEl = node;
|
textareaEl = node;
|
||||||
resizeTextarea();
|
|
||||||
return () => {
|
return () => {
|
||||||
textareaEl = null;
|
textareaEl = null;
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
function resizeTextarea() {
|
|
||||||
if (!textareaEl) return;
|
|
||||||
textareaEl.style.height = 'auto';
|
|
||||||
textareaEl.style.height = `${textareaEl.scrollHeight}px`;
|
|
||||||
}
|
|
||||||
|
|
||||||
$effect(() => {
|
|
||||||
// Re-run autoresize whenever the bound text changes.
|
|
||||||
void localText;
|
|
||||||
resizeTextarea();
|
|
||||||
});
|
|
||||||
|
|
||||||
function emitChange() {
|
function emitChange() {
|
||||||
onTextChange(localText, localMentions);
|
onTextChange(localText, localMentions);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user