抽取平台批量操作工具栏

新增 PlatformBatchActionToolbar 和组件测试

项目页选择模式底部工具栏复用平台批量工具栏

更新 TRACKING 记录批量操作组件收口

src/components/common/PlatformBatchActionToolbar.test.tsx

@@ -0,0 +1,22 @@
+/* @vitest-environment jsdom */
+
+import { render, screen } from '@testing-library/react';
+import { describe, expect, it } from 'vitest';
+
+import { PlatformBatchActionToolbar } from './PlatformBatchActionToolbar';
+
+describe('PlatformBatchActionToolbar', () => {
+  it('renders a labelled toolbar around batch actions', () => {
+    render(
+      <PlatformBatchActionToolbar label="素材批量操作">
+        <button type="button">删除</button>
+      </PlatformBatchActionToolbar>,
+    );
+
+    const toolbar = screen.getByRole('toolbar', { name: '素材批量操作' });
+
+    expect(toolbar).toBeTruthy();
+    expect(toolbar.className).toContain('platform-batch-action-toolbar');
+    expect(screen.getByRole('button', { name: '删除' })).toBeTruthy();
+  });
+});

src/components/common/PlatformBatchActionToolbar.tsx

@@ -0,0 +1,33 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+
+type PlatformBatchActionToolbarProps = Omit<
+  HTMLAttributes<HTMLDivElement>,
+  'children'
+> & {
+  children: ReactNode;
+  label?: string;
+};
+
+/**
+ * 平台批量操作浮动工具栏。
+ * 只统一容器 chrome 与 toolbar 语义，具体选择逻辑和动作按钮由业务组件传入。
+ */
+export function PlatformBatchActionToolbar({
+  children,
+  label = '批量操作',
+  className,
+  ...divProps
+}: PlatformBatchActionToolbarProps) {
+  return (
+    <div
+      {...divProps}
+      className={['platform-batch-action-toolbar', className]
+        .filter(Boolean)
+        .join(' ')}
+      role="toolbar"
+      aria-label={label}
+    >
+      {children}
+    </div>
+  );
+}