@opengeni/react 2.5.0-canary.1 → 2.5.0-canary.2

package/dist/composer.js

@@ -37,7 +37,7 @@ import {
   useChatComposer,
   useChatComposerController,
   useVoiceInput
-} from "./chunk-KSDXER4X.js";
+} from "./chunk-ZUT5QSQB.js";
 import "./chunk-T7VAYG2I.js";
 import {
   BillingClassMark,

package/dist/index.js

@@ -109,7 +109,7 @@ import {
   useSlashCommands,
   useTranscription,
   useVoiceInput
-} from "./chunk-KSDXER4X.js";
+} from "./chunk-ZUT5QSQB.js";
 import {
   FILE_ONLY_MESSAGE_TEXT,
   composeSendInput,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeni/react",
-  "version": "2.5.0-canary.1",
+  "version": "2.5.0-canary.2",
   "description": "React hooks and styled components for OpenGeni: live session streaming, chat composer, message timeline, session status, and fleet views — token-themed (CSS variables), dark-first, built on Tailwind v4 + Radix + Motion.",
   "license": "Apache-2.0",
   "repository": {
@@ -116,7 +116,7 @@
     "@dnd-kit/utilities": "3.2.2",
     "@fontsource-variable/noto-sans-arabic": "5.2.10",
     "@fontsource-variable/noto-sans-jp": "5.2.10",
-    "@opengeni/sdk": "^2.5.0-canary.1",
+    "@opengeni/sdk": "^2.5.0-canary.2",
     "clsx": "^2.1.1",
     "lucide-react": "^1.8.0",
     "motion": "^12.0.0",

package/src/components/composer.tsx

@@ -20,6 +20,7 @@ import {
   useContext,
   useEffect,
   useId,
+  useLayoutEffect,
   useMemo,
   useRef,
   useState,
@@ -369,18 +370,27 @@ export function useChatComposerController({
   const mountedRef = useRef(true);
   const deliveredValueRef = useRef(delivery.value);
   const liveValueRef = useRef(delivery.value);
-  if (delivery.value !== deliveredValueRef.current) {
+  const [renderedValue, setRenderedValue] = useState(delivery.value);
+  const deliveryChanged = delivery.value !== deliveredValueRef.current;
+  if (deliveryChanged) {
     deliveredValueRef.current = delivery.value;
     liveValueRef.current = delivery.value;
   }
   const setComposerValue = useCallback(
     (next: string) => {
       liveValueRef.current = next;
+      setRenderedValue(next);
       delivery.setValue(next);
     },
     [delivery.setValue],
   );
-  const visibleValue = liveValueRef.current;
+  const visibleValue = deliveryChanged ? delivery.value : renderedValue;
+
+  useLayoutEffect(() => {
+    if (renderedValue !== liveValueRef.current) {
+      setRenderedValue(liveValueRef.current);
+    }
+  }, [delivery.value, renderedValue]);
 
   useEffect(() => {
     mountedRef.current = true;