@baishuyun/ai-design 2.0.37 → 2.0.39

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @baishuyun/ai-design
 
+## 2.0.39
+
+### Patch Changes
+
+- token usage report
+- Updated dependencies
+  - @baishuyun/ai-feat-utils@2.0.35
+  - @baishuyun/types@3.0.32
+
+## 2.0.38
+
+### Patch Changes
+
+- bugfix
+- Updated dependencies
+  - @baishuyun/ai-feat-utils@2.0.34
+  - @baishuyun/types@3.0.31
+
 ## 2.0.37
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@baishuyun/ai-design",
-  "version": "2.0.37",
+  "version": "2.0.39",
   "description": "AI 功能 UI 组件库 - 所有 AI 功能的 UI 表现唯一真相来源",
   "type": "module",
   "main": "src/index.ts",
@@ -60,8 +60,8 @@
     "tw-animate-css": "^1.4.0",
     "vaul": "^1.1.2",
     "zod": "^4.1.13",
-    "@baishuyun/ai-feat-utils": "2.0.33",
-    "@baishuyun/types": "3.0.30"
+    "@baishuyun/ai-feat-utils": "2.0.35",
+    "@baishuyun/types": "3.0.32"
   },
   "peerDependencies": {
     "react": "^19.0.0",
@@ -83,8 +83,8 @@
     "typescript": "^5.5.0",
     "vite": "^5.1.4",
     "vite-plugin-dts": "^4.5.4",
-    "@baishuyun/types": "3.0.30",
     "@baishuyun/tailwind-config": "3.0.9",
+    "@baishuyun/types": "3.0.32",
     "@baishuyun/typescript-config": "2.0.9"
   },
   "keywords": [],

package/src/components/agent-helper/prompt-input/index.tsx

@@ -28,8 +28,10 @@ function createFieldTagDom(label: string): HTMLSpanElement {
 
 function resolveFieldWidgetInfo(
   fields: IField[],
-  key: string,
+  fullKey: string,
 ): { widgetName: string; label: string } | undefined {
+  const  key = fullKey.replace('virtual.', '');
+
   const dotIndex = key.indexOf('.');
   if (dotIndex > 0) {
     const parentName = key.substring(0, dotIndex);
@@ -41,13 +43,13 @@ function resolveFieldWidgetInfo(
           'widget' in item && item.widget?.widgetName === childName,
       );
       if (child) {
-        return { widgetName: key, label: child.label };
+        return { widgetName: fullKey, label: child.label };
       }
     }
   } else {
     const field = fields.find((f) => f.widget?.widgetName === key);
     if (field) {
-      return { widgetName: key, label: field.label };
+      return { widgetName: fullKey, label: field.label };
     }
   }
   return undefined;
@@ -63,7 +65,11 @@ function addFieldToCM(
   cm.replaceSelection('${' + widgetName + '}');
   const to = cm.getCursor();
 
-  const tagNode = createFieldTagDom(displayLabel);
+  const isVirtual = widgetName?.includes("virtual");
+
+  const label = isVirtual ? `触发行.${displayLabel}` : displayLabel;
+
+  const tagNode = createFieldTagDom(label);
   tagNode.setAttribute('data-field-key', widgetName);
 
   cm.markText(from, to, {

package/src/components/office-container.tsx

@@ -1,4 +1,4 @@
-import { FC, useCallback, useEffect, useRef } from 'react';
+import { FC, useCallback, useEffect, useLayoutEffect, useRef } from 'react';
 import { useResizableWidth } from '../hooks/use-resizable-width';
 import { useColumnAppear } from '../hooks/use-column-appear';
 import classNames from 'classnames';
@@ -57,6 +57,11 @@ export const OfficeContainer: FC<IOfficeContainerProps> = ({
     const transitioningRef = useRef(false);
     const mountRef = useRef(true);
     const containerRef = useRef<HTMLDivElement>(null);
+    const onResizeRef = useRef(onResize);
+
+    useEffect(() => {
+        onResizeRef.current = onResize;
+    }, [onResize]);
 
     const { width, handleMouseDown, isDragging } = useResizableWidth({
         range: activeRange,
@@ -107,24 +112,43 @@ export const OfficeContainer: FC<IOfficeContainerProps> = ({
         return `calc(100% - ${width}px)`;
     }, [hideLeftCol, isLeftFullscreen, isRightFullscreen, isRightResizable, width]);
 
-    useEffect(() => {
+    const getTargetColWidths = useCallback((): [number, number] => {
+        const containerWidth = containerRef.current?.offsetWidth ?? 0;
+
+        if (isLeftFullscreen) return [containerWidth, 0];
+        if (isRightFullscreen) return [0, containerWidth];
+
+        if (hideLeftCol) {
+            if (isRightResizable) return [0, width];
+            return [0, Math.max(containerWidth - width, 0)];
+        }
+
+        if (isRightResizable) {
+            return [Math.max(containerWidth - width, 0), width];
+        }
+
+        return [width, Math.max(containerWidth - width, 0)];
+    }, [hideLeftCol, isLeftFullscreen, isRightFullscreen, isRightResizable, width]);
+
+    useLayoutEffect(() => {
         if (!onResize || transitioningRef.current) return;
-        const raf = requestAnimationFrame(() => {
-            const leftW = leftColRef.current?.offsetWidth ?? 0;
-            const rightW = rightColRef.current?.offsetWidth ?? 0;
-            onResize(leftW, rightW);
-        });
-        return () => cancelAnimationFrame(raf);
+        const leftW = leftColRef.current?.offsetWidth ?? 0;
+        const rightW = rightColRef.current?.offsetWidth ?? 0;
+        onResize(leftW, rightW);
     }, [width, fullscreenPart, hideLeftCol, isRightResizable, onResize]);
 
     // Set guard when fullscreen/hide triggers CSS transitions. Skip mount.
-    useEffect(() => {
+    // Immediately report the final target widths so the host portal can size
+    // itself before paint, instead of waiting for the width transition to end.
+    useLayoutEffect(() => {
         if (mountRef.current) {
             mountRef.current = false;
             return;
         }
         transitioningRef.current = true;
-    }, [fullscreenPart, hideLeftCol]);
+        const [leftW, rightW] = getTargetColWidths();
+        onResizeRef.current?.(leftW, rightW);
+    }, [fullscreenPart, hideLeftCol, getTargetColWidths]);
 
     // Fire onResize after CSS width transitions complete
     useEffect(() => {