extended refer

This commit is contained in:
Nate Kelley 2025-09-26 12:11:41 -06:00
parent f4102880e5
commit b46d4fbd73
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
2 changed files with 18 additions and 13 deletions

View File

@ -28,7 +28,7 @@ export interface InputTextAreaProps
onPressEnter?: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void; onPressEnter?: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;
} }
export interface InputTextAreaRef { export interface InputTextAreaRef extends HTMLTextAreaElement {
forceRecalculateHeight: () => void; forceRecalculateHeight: () => void;
} }
@ -50,15 +50,20 @@ export const InputTextArea = React.forwardRef<InputTextAreaRef, InputTextAreaPro
useImperativeHandle( useImperativeHandle(
ref, ref,
() => ({ () => {
forceRecalculateHeight: () => { if (!textareaRef.current) {
if (textareaRef.current) { return null as unknown as InputTextAreaRef;
// Force a recalculation by triggering an input event }
const event = new Event('input', { bubbles: true }); return Object.assign(textareaRef.current, {
textareaRef.current.dispatchEvent(event); forceRecalculateHeight: () => {
} if (textareaRef.current) {
}, // Force a recalculation by triggering an input event
}), const event = new Event('input', { bubbles: true });
textareaRef.current.dispatchEvent(event);
}
},
});
},
[] []
); );

View File

@ -4,7 +4,7 @@ import { cn } from '@/lib/classMerge';
import { Button } from '../buttons/Button'; import { Button } from '../buttons/Button';
import ShapeSquare from '../icons/NucleoIconFilled/shape-square'; import ShapeSquare from '../icons/NucleoIconFilled/shape-square';
import { ArrowUp } from '../icons/NucleoIconOutlined'; import { ArrowUp } from '../icons/NucleoIconOutlined';
import { InputTextArea, type InputTextAreaProps } from './InputTextArea'; import { InputTextArea, type InputTextAreaProps, type InputTextAreaRef } from './InputTextArea';
const inputTextAreaButtonVariants = cva( const inputTextAreaButtonVariants = cva(
'relative flex flex-col w-full items-center overflow-visible rounded-xl cursor-text border border-border transition-all duration-200', 'relative flex flex-col w-full items-center overflow-visible rounded-xl cursor-text border border-border transition-all duration-200',
@ -29,7 +29,7 @@ export interface InputTextAreaButtonProps extends Omit<InputTextAreaProps, 'vari
inputClassName?: string; inputClassName?: string;
} }
export const InputTextAreaButton = forwardRef<HTMLTextAreaElement, InputTextAreaButtonProps>( export const InputTextAreaButton = forwardRef<InputTextAreaRef, InputTextAreaButtonProps>(
( (
{ {
className, className,
@ -51,7 +51,7 @@ export const InputTextAreaButton = forwardRef<HTMLTextAreaElement, InputTextArea
) => { ) => {
const onSubmitPreflight = () => { const onSubmitPreflight = () => {
if (disabled) return; if (disabled) return;
const text = (textRef as React.RefObject<HTMLTextAreaElement | null>).current?.value || ''; const text = (textRef as React.RefObject<InputTextAreaRef | null>).current?.value || '';
onSubmit(text); onSubmit(text);
}; };