feat(workbench-block): improve block height and layout responsiveness (#6321)

- Add dynamic height calculations for workbench block
- Support height adjustments for different layouts (grid/list)
- Implement responsive styling with designable mode considerations

packages/plugins/@nocobase/plugin-block-workbench/src/client/WorkbenchBlock.tsx

@@ -11,16 +11,18 @@ import { observer, useFieldSchema } from '@formily/react';
 import {
   CollectionContext,
   createStyles,
+  css,
   DataSourceContext,
   DndContext,
   Icon,
   NocoBaseRecursionField,
+  useBlockHeight,
   useDesignable,
   useOpenModeContext,
   useSchemaInitializerRender,
   withDynamicSchemaProps,
 } from '@nocobase/client';
-import { Avatar, Space } from 'antd';
+import { Avatar, Space, theme } from 'antd';
 import { Grid, List } from 'antd-mobile';
 import React, { createContext } from 'react';
 import { WorkbenchLayout } from './workbenchBlockSettings';
@@ -142,9 +144,33 @@ export const WorkbenchBlock: any = withDynamicSchemaProps(
     const fieldSchema = useFieldSchema();
     const { layout = 'grid' } = fieldSchema['x-component-props'] || {};
     const { styles } = useStyles();
+    const { title } = fieldSchema['x-decorator-props'] || {};
+    const targetHeight = useBlockHeight();
+    const { token } = theme.useToken();
+    const { designable } = useDesignable();
+    const titleHeight = title ? token.fontSizeLG * token.lineHeightLG + token.padding * 2 : 0;
+    let containerHeight = targetHeight - 2 * token.paddingLG - titleHeight;
+
+    // 减去 1rem 的 margin，减去 padding，减去按钮高度，给 Initializer 按钮留出空间
+    let wrapperHeight = `calc(${containerHeight}px - 1rem - ${token.controlHeight}px)`;
+
+    if (layout === 'list') {
+      // list 有一个负的 margin
+      containerHeight = targetHeight - titleHeight;
+      wrapperHeight = `calc(${containerHeight}px - 1rem - ${token.controlHeight + token.paddingLG}px)`;
+    }
+
+    const heightClass = css`
+      height: ${targetHeight ? containerHeight + 'px' : '100%'};
+
+      .nb-action-panel-warp {
+        height: ${designable ? wrapperHeight : '100%'};
+        overflow-y: auto;
+      }
+    `;
 
     return (
-      <div className={`nb-action-penal-container ${layout} ${styles.containerClass}`}>
+      <div className={`nb-action-penal-container ${layout} ${styles.containerClass} ${heightClass}`}>
         <WorkbenchBlockContext.Provider value={{ layout }}>
           <DataSourceContext.Provider value={undefined}>
             <CollectionContext.Provider value={undefined}>{props.children}</CollectionContext.Provider>