feat: manually mirror opencoze's code from bytedance

Change-Id: I09a73aadda978ad9511264a756b2ce51f5761adf

frontend/packages/agent-ide/workflow/.storybook/main.js

@@ -0,0 +1,31 @@
+import { mergeConfig } from 'vite';
+import svgr from 'vite-plugin-svgr';
+
+/** @type { import('@storybook/react-vite').StorybookConfig } */
+const config = {
+  stories: ['../stories/**/*.mdx', '../stories/**/*.stories.tsx'],
+  addons: [
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@storybook/addon-onboarding',
+    '@storybook/addon-interactions',
+  ],
+  framework: {
+    name: '@storybook/react-vite',
+    options: {},
+  },
+  docs: {
+    autodocs: 'tag',
+  },
+  viteFinal: config =>
+    mergeConfig(config, {
+      plugins: [
+        svgr({
+          svgrOptions: {
+            native: false,
+          },
+        }),
+      ],
+    }),
+};
+export default config;

frontend/packages/agent-ide/workflow/.storybook/preview.js

@@ -0,0 +1,14 @@
+/** @type { import('@storybook/react').Preview } */
+const preview = {
+  parameters: {
+    actions: { argTypesRegex: "^on[A-Z].*" },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+  },
+};
+
+export default preview;

frontend/packages/agent-ide/workflow/.stylelintrc.js

@@ -0,0 +1,5 @@
+const { defineConfig } = require('@coze-arch/stylelint-config');
+
+module.exports = defineConfig({
+  extends: [],
+});

frontend/packages/agent-ide/workflow/README.md

@@ -0,0 +1,16 @@
+# @coze-agent-ide/workflow
+
+> Project template for react component with storybook.
+
+## Features
+
+- [x] eslint & ts
+- [x] esm bundle
+- [x] umd bundle
+- [x] storybook
+
+## Commands
+
+- init: `rush update`
+- dev: `npm run dev`
+- build: `npm run build`

frontend/packages/agent-ide/workflow/config/rush-project.json

@@ -0,0 +1,12 @@
+{
+  "operationSettings": [
+    {
+      "operationName": "test:cov",
+      "outputFolderNames": ["coverage"]
+    },
+    {
+      "operationName": "ts-check",
+      "outputFolderNames": ["./dist"]
+    }
+  ]
+}

frontend/packages/agent-ide/workflow/eslint.config.js

@@ -0,0 +1,7 @@
+const { defineConfig } = require('@coze-arch/eslint-config');
+
+module.exports = defineConfig({
+  packageRoot: __dirname,
+  preset: 'web',
+  rules: {},
+});

frontend/packages/agent-ide/workflow/package.json

@@ -0,0 +1,73 @@
+{
+  "name": "@coze-agent-ide/workflow",
+  "version": "0.0.1",
+  "description": "bot 与 workflow 交互的内容",
+  "license": "Apache-2.0",
+  "author": "meixuliang.3@bytedance.com",
+  "maintainers": [],
+  "main": "src/index.tsx",
+  "scripts": {
+    "build": "exit 0",
+    "lint": "eslint ./ --cache",
+    "test": "vitest --run --passWithNoTests",
+    "test:cov": "npm run test -- --coverage"
+  },
+  "dependencies": {
+    "@coze-agent-ide/bot-plugin-export": "workspace:*",
+    "@coze-agent-ide/navigate": "workspace:*",
+    "@coze-agent-ide/plugin-shared": "workspace:*",
+    "@coze-agent-ide/space-bot": "workspace:*",
+    "@coze-agent-ide/tool": "workspace:*",
+    "@coze-agent-ide/workflow-as-agent-adapter": "workspace:*",
+    "@coze-arch/bot-api": "workspace:*",
+    "@coze-arch/bot-error": "workspace:*",
+    "@coze-arch/bot-flags": "workspace:*",
+    "@coze-arch/bot-hooks": "workspace:*",
+    "@coze-arch/bot-icons": "workspace:*",
+    "@coze-arch/bot-semi": "workspace:*",
+    "@coze-arch/bot-studio-store": "workspace:*",
+    "@coze-arch/bot-utils": "workspace:*",
+    "@coze-arch/coze-design": "0.0.6-alpha.346d77",
+    "@coze-arch/i18n": "workspace:*",
+    "@coze-arch/idl": "workspace:*",
+    "@coze-arch/report-events": "workspace:*",
+    "@coze-arch/report-tti": "workspace:*",
+    "@coze-common/assets": "workspace:*",
+    "@coze-studio/bot-detail-store": "workspace:*",
+    "@coze-studio/components": "workspace:*",
+    "@coze-workflow/base": "workspace:*",
+    "@coze-workflow/components": "workspace:*",
+    "ahooks": "^3.7.8",
+    "classnames": "^2.3.2",
+    "copy-to-clipboard": "^3.3.3",
+    "immer": "^10.0.3",
+    "lodash-es": "^4.17.21",
+    "zustand": "^4.4.7"
+  },
+  "devDependencies": {
+    "@coze-arch/bot-env": "workspace:*",
+    "@coze-arch/bot-typings": "workspace:*",
+    "@coze-arch/eslint-config": "workspace:*",
+    "@coze-arch/stylelint-config": "workspace:*",
+    "@coze-arch/ts-config": "workspace:*",
+    "@coze-arch/vitest-config": "workspace:*",
+    "@testing-library/jest-dom": "^6.1.5",
+    "@testing-library/react": "^14.1.2",
+    "@testing-library/react-hooks": "^8.0.1",
+    "@types/lodash-es": "^4.17.10",
+    "@types/react": "18.2.37",
+    "@types/react-dom": "18.2.15",
+    "@vitest/coverage-v8": "~3.0.5",
+    "react": "~18.2.0",
+    "react-dom": "~18.2.0",
+    "stylelint": "^15.11.0",
+    "vite-plugin-svgr": "~3.3.0",
+    "vitest": "~3.0.5"
+  },
+  "peerDependencies": {
+    "react": ">=18.2.0",
+    "react-dom": ">=18.2.0"
+  },
+  "// deps": "immer@^10.0.3 为脚本自动补齐，请勿改动"
+}
+

frontend/packages/agent-ide/workflow/src/components/index.module.less

@@ -0,0 +1,135 @@
+/* stylelint-disable declaration-no-important */
+@import '@coze-common/assets/style/common.less';
+@import '@coze-common/assets/style/mixins.less';
+
+.api-table {
+  /* 133.333% */
+  table-layout: fixed;
+  border-collapse: collapse;
+
+  width: 100%;
+
+  font-size: 12px;
+  font-weight: 400;
+  line-height: 16px;
+  color: var(--light-usage-text-color-text-2, rgb(28 31 35 / 60%));
+  word-wrap: break-word;
+
+  thead {
+    margin-bottom: 4px;
+
+    th {
+      height: 26px;
+      padding: 0;
+
+      font-size: 12px;
+      font-weight: 400;
+      line-height: 16px; // 133.333%
+      color: var(--light-usage-text-color-text-2, rgb(28 31 35 / 60%));
+      text-align: left;
+    }
+  }
+
+  .api-row {
+    td {
+      overflow: hidden;
+      margin-bottom: 4px;
+      // vertical-align: text-top;
+    }
+
+    &.border-top {
+      cursor: pointer;
+      position: relative;
+
+      td {
+        margin-top: 8px;
+      }
+    }
+
+    :global {
+      .semi-tag-grey-light {
+        background: var(--light-color-white-white, #fff);
+        border-radius: 6px;
+      }
+
+      .semi-tag-content {
+        align-items: center;
+        justify-content: space-between;
+      }
+    }
+  }
+
+  .api-method {
+    justify-content: space-between;
+    width: 100%;
+    height: 100%;
+    text-align: center;
+
+    span {
+      color: var(--light-color-grey-grey-5, rgb(107 107 117 / 100%));
+
+    }
+
+    .icon-copy {
+      cursor: pointer;
+      .common-svg-icon(16px, rgba(107, 109, 117, 1));
+    }
+  }
+
+  .api-method-read {
+    justify-content: flex-end;
+  }
+
+  .api-name,
+  .api-desc {
+    width: 126px;
+    padding-right: 4px;
+
+    font-size: 12px;
+    font-weight: 400;
+    font-style: normal;
+    line-height: 16px; // 133.333%
+    color: rgb(29 28 35 / 80%);
+  }
+
+  .icon-tips {
+    cursor: pointer;
+    .common-svg-icon(14px, rgba(107, 109, 117, 1));
+  }
+}
+
+// 能力模块默认说明文案样式
+.tip-text {
+  font-size: 14px;
+  font-weight: 400;
+  font-style: normal;
+  line-height: 22px;
+  color: var(--light-usage-text-color-text-2, rgb(28 29 35 / 60%));
+}
+
+.icon-button-16 {
+  cursor: pointer;
+
+  &:hover {
+    border-radius: 4px;
+  }
+
+  :global {
+    .semi-button {
+      &.semi-button-size-small {
+        height: 16px;
+        padding: 1px !important;
+
+        svg {
+           @apply text-foreground-2;
+        }
+      }
+    }
+  }
+}
+
+.default-text {
+  .tip-text;
+}
+
+// .workflow-modal {}

frontend/packages/agent-ide/workflow/src/components/workflow-as-agent/workflow-config-area/index.tsx

@@ -0,0 +1,175 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { useEffect, type FC } from 'react';
+
+import { useShallow } from 'zustand/react/shallow';
+import classNames from 'classnames';
+import { useSafeState } from 'ahooks';
+import { useWorkflowPublishedModel } from '@coze-agent-ide/space-bot/hook';
+import { useBotSkillStore } from '@coze-studio/bot-detail-store/bot-skill';
+import { useBotInfoStore } from '@coze-studio/bot-detail-store/bot-info';
+import {
+  type WorkFlowItemType,
+  useBotDetailIsReadonly,
+} from '@coze-studio/bot-detail-store';
+import { useReportTti } from '@coze-arch/report-tti';
+import { PluginType, WorkflowMode } from '@coze-arch/idl/developer_api';
+import { I18n } from '@coze-arch/i18n';
+import { IconCozPlus } from '@coze-arch/coze-design/icons';
+import { CustomError } from '@coze-arch/bot-error';
+import { PluginDevelopApi } from '@coze-arch/bot-api';
+import { WorkflowCard } from '@coze-agent-ide/workflow-as-agent-adapter';
+
+import { useBotWorkFlowListModal } from './use-agent-workflow-modal';
+const addCardStyle = classNames(
+  'w-full h-[120px]',
+  'flex items-center justify-center gap-[8px]',
+  'border border-solid coz-stroke-primary rounded-[10px]',
+  'coz-mg-hglt hover:coz-mg-hglt-hovered active:coz-mg-hglt-pressed',
+);
+
+export const WorkflowConfigArea: FC = () => {
+  const isReadonly = useBotDetailIsReadonly();
+  const { botId } = useBotInfoStore(
+    useShallow(state => ({
+      botId: state.botId,
+    })),
+  );
+  const { workflowId, pluginId } = useBotSkillStore(
+    useShallow(state => ({
+      workflowId: state.layoutInfo.workflow_id,
+      pluginId: state.layoutInfo.plugin_id,
+    })),
+  );
+  const [workflow, setWorkflow] = useSafeState<WorkFlowItemType | undefined>();
+
+  const onChange = (value: WorkFlowItemType | undefined) => {
+    setWorkflow(value);
+    useBotSkillStore.getState().updateSkillLayoutInfo({
+      workflow_id: value?.workflow_id,
+      plugin_id: value?.plugin_id,
+    });
+  };
+
+  const flowMode = WorkflowMode.ChatFlow;
+  const { node, open } = useBotWorkFlowListModal({
+    flowMode,
+    workflow,
+    setWorkflow: onChange,
+  });
+
+  useWorkflowPublishedModel({
+    flowMode,
+    addedWorkflows: workflow ? [workflow] : [],
+    onOk: val => {
+      onChange(val);
+    },
+  });
+
+  useEffect(() => {
+    if (
+      workflow?.workflow_id !== workflowId ||
+      workflow?.plugin_id !== pluginId
+    ) {
+      if (workflowId && pluginId) {
+        PluginDevelopApi.GetPlaygroundPluginList({
+          space_id: useBotInfoStore.getState().space_id ?? '',
+          page: 1,
+          size: 1,
+          plugin_ids: [pluginId],
+          plugin_types: [PluginType.WORKFLOW],
+        }).then(resp => {
+          const pluginInfos = resp.data?.plugin_list ?? [];
+          const target = pluginInfos?.at(0);
+          if (target) {
+            setWorkflow({
+              workflow_id: workflowId || '',
+              plugin_id: pluginId || '',
+              name: target?.name || '',
+              desc: target?.desc_for_human || '',
+              parameters: target?.plugin_apis?.at(0)?.parameters ?? [],
+              plugin_icon: target?.plugin_icon || '',
+              flow_mode:
+                target?.plugin_type === PluginType.IMAGEFLOW
+                  ? WorkflowMode.Imageflow
+                  : flowMode,
+            });
+          } else {
+            throw new CustomError(
+              'normal_error',
+              'workflow_as_agent_workflow_not_found',
+            );
+          }
+        });
+      } else {
+        setWorkflow(undefined);
+      }
+    }
+  }, [workflowId, pluginId]);
+
+  useReportTti({
+    isLive: true,
+    extra: {
+      mode: 'single-agent-workflow',
+    },
+  });
+
+  return (
+    <>
+      {node}
+      <div>
+        <div className="text-[14px] font-[500] leading-[20px] coz-fg-plus">
+          {I18n.t('workflow_agent_configure')}
+        </div>
+        <div className="mt-[16px]">
+          {workflow ? (
+            <WorkflowCard
+              botId={botId ?? ''}
+              workflow={workflow}
+              onRemove={() => {
+                onChange(undefined);
+              }}
+              isReadonly={isReadonly}
+            />
+          ) : (
+            <div
+              className={classNames(
+                addCardStyle,
+                isReadonly
+                  ? 'coz-fg-hglt-dim cursor-not-allowed'
+                  : 'coz-fg-hglt cursor-pointer',
+              )}
+              onClick={() => {
+                if (!isReadonly) {
+                  open();
+                }
+              }}
+            >
+              <IconCozPlus className="text-[18px]" />
+              <div className="text-[16px] leading-[22px] font-[500]">
+                {I18n.t('workflow_agent_add')}
+              </div>
+            </div>
+          )}
+        </div>
+        <div className="mt-[16px] text-[12px] leading-[16px] coz-fg-secondary">
+          {I18n.t('wf_chatflow_132')}
+        </div>
+      </div>
+    </>
+  );
+};

frontend/packages/agent-ide/workflow/src/components/workflow-as-agent/workflow-config-area/use-agent-workflow-modal.tsx

@@ -0,0 +1,221 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { type ReactNode, useState, useMemo, useEffect } from 'react';
+
+import { useShallow } from 'zustand/react/shallow';
+import {
+  DataSourceType,
+  WorkflowModalFrom,
+  type WorkflowModalProps,
+  type WorkflowModalState,
+  default as WorkflowModalBase,
+} from '@coze-workflow/components/workflow-modal';
+import { WorkflowMode } from '@coze-workflow/base/api';
+import { useBotPageStore } from '@coze-agent-ide/space-bot/store';
+import { I18n } from '@coze-arch/i18n';
+import { useSpaceStore } from '@coze-arch/bot-studio-store';
+import { useBotInfoStore } from '@coze-studio/bot-detail-store/bot-info';
+import { type WorkFlowItemType } from '@coze-studio/bot-detail-store';
+import { usePageJumpResponse, PageType, SceneType } from '@coze-arch/bot-hooks';
+import { useNavigateWorkflowEditPage } from '@coze-agent-ide/navigate';
+import { Toast, Space, Typography, Button } from '@coze-arch/coze-design';
+const { Text } = Typography;
+
+export interface UseWorkFlowListReturnValue {
+  node: ReactNode;
+  open: () => void;
+  close: () => void;
+}
+
+const getInitialVisible = ({
+  jumpResponse,
+  botID,
+  prevBotID,
+  defaultVisible,
+  flowMode,
+}: Record<string, any>) => {
+  if (botID !== prevBotID) {
+    return false;
+  }
+  if (jumpResponse?.scene === SceneType.WORKFLOW_PUBLISHED__BACK__BOT) {
+    return false;
+  }
+  if (
+    jumpResponse?.scene === SceneType.WORKFLOW__BACK__BOT &&
+    (jumpResponse?.flowMode || WorkflowMode.Workflow) !==
+      (flowMode || WorkflowMode.Workflow)
+  ) {
+    return false;
+  }
+
+  return defaultVisible;
+};
+
+export const useBotWorkFlowListModal = ({
+  flowMode = WorkflowMode.Workflow,
+  workflow,
+  setWorkflow,
+}: {
+  flowMode: WorkflowMode;
+  workflow?: WorkFlowItemType;
+  setWorkflow: (value: WorkFlowItemType) => void;
+}): UseWorkFlowListReturnValue => {
+  const { botID } = useBotInfoStore(
+    useShallow(state => ({
+      botID: state.botId,
+    })),
+  );
+
+  const { id: spaceId } = useSpaceStore(state => state.space);
+
+  const workflows = workflow ? [workflow] : [];
+
+  const onNavigate2Edit = useNavigateWorkflowEditPage({
+    flowMode,
+  });
+
+  const { defaultVisible, prevBotID, setWorkflowState } = useBotPageStore(
+    useShallow(state => ({
+      defaultVisible: state.tools.workflow.showModalDefault,
+      prevBotID: state.bot.previousBotID,
+      setWorkflowState: state.setWorkflowState,
+    })),
+  );
+  const jumpResponse = usePageJumpResponse(PageType.BOT);
+
+  const [visible, setVisible] = useState(
+    getInitialVisible({
+      jumpResponse,
+      botID,
+      prevBotID,
+      defaultVisible,
+      flowMode,
+    }),
+  );
+
+  const modalState = useMemo(() => {
+    // 在默认打开的状态下获取初始值
+    if (!jumpResponse || !defaultVisible) {
+      return;
+    }
+    return safeParse<WorkflowModalState>(
+      (jumpResponse as any).workflowModalState?.statusStr || '',
+    );
+  }, [jumpResponse, defaultVisible]);
+
+  useEffect(() => {
+    if (visible) {
+      setWorkflowState({ showModalDefault: false });
+    }
+  }, [visible]);
+
+  const handleClose = () => {
+    setVisible(false);
+  };
+
+  const handleOpen = () => {
+    setVisible(true);
+  };
+
+  const onItemClick: WorkflowModalProps['onItemClick'] = (val, modalStatus) => {
+    if (val.type === DataSourceType.Workflow) {
+      onNavigate2Edit(val.item.workflow_id || '', {
+        statusStr: JSON.stringify(modalStatus),
+      });
+    } else {
+      window.open(
+        `/store/workflow/${val.item.meta_info.entity_id}?workflow_id=true`,
+        '_blank',
+      );
+    }
+  };
+
+  const onCreateSuccess: WorkflowModalProps['onCreateSuccess'] = val => {
+    onNavigate2Edit(val.workflowId);
+  };
+
+  const onAdd: WorkflowModalProps['onAdd'] = (val, config) => {
+    handleClose();
+
+    Toast.success({
+      content: (
+        <Space spacing={6}>
+          <Text>{I18n.t('workflow_add_list_added_success')}</Text>
+          {config.isDup ? (
+            <Button
+              color="primary"
+              onClick={() => {
+                window.open(
+                  `/work_flow?space_id=${spaceId}&workflow_id=${val.workflow_id}`,
+                );
+              }}
+            >
+              {I18n.t('workflowstore_continue_editing')}
+            </Button>
+          ) : null}
+        </Space>
+      ),
+    });
+  };
+
+  const onRemove: WorkflowModalProps['onRemove'] = () => {
+    Toast.success({
+      content: I18n.t('workflow_add_list_removed_success'),
+      showClose: false,
+    });
+  };
+
+  const onClose = () => {
+    setVisible(false);
+  };
+
+  return {
+    node: visible ? (
+      <WorkflowModalBase
+        from={WorkflowModalFrom.WorkflowAgent}
+        flowMode={flowMode}
+        visible={visible}
+        onClose={onClose}
+        initState={{ ...modalState, listFlowMode: flowMode }}
+        hiddenListFlowModeFilter={true}
+        workFlowList={workflows}
+        onWorkFlowListChange={$newList => {
+          setWorkflow($newList[0]);
+        }}
+        onItemClick={onItemClick}
+        onCreateSuccess={onCreateSuccess}
+        onAdd={onAdd}
+        onRemove={onRemove}
+        onDupSuccess={() => null}
+      />
+    ) : null,
+    close: handleClose,
+    open: handleOpen,
+  };
+};
+
+function safeParse<T>(jsonString: string): T | undefined {
+  try {
+    // 尝试解析 JSON 字符串
+    return JSON.parse(jsonString);
+    // eslint-disable-next-line @coze-arch/use-error-in-catch
+  } catch (error) {
+    // 如果解析时出现错误，返回 null
+    return undefined;
+  }
+}

frontend/packages/agent-ide/workflow/src/index.tsx

@@ -0,0 +1,17 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+export { WorkflowConfigArea } from './components/workflow-as-agent/workflow-config-area';

frontend/packages/agent-ide/workflow/src/typings.d.ts

@@ -0,0 +1,17 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+/// <reference types='@coze-arch/bot-typings' />

frontend/packages/agent-ide/workflow/tsconfig.build.json

@@ -0,0 +1,102 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "@coze-arch/ts-config/tsconfig.web.json",
+  "compilerOptions": {
+    "types": [],
+    "strictNullChecks": true,
+    "noImplicitAny": true,
+    "rootDir": "./src",
+    "outDir": "./dist",
+    "tsBuildInfoFile": "./dist/tsconfig.build.tsbuildinfo"
+  },
+  "include": ["src"],
+  "references": [
+    {
+      "path": "../../arch/bot-api/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/bot-env/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/bot-error/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/bot-flags/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/bot-hooks/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/bot-store/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/bot-typings/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/bot-utils/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/i18n/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/idl/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/report-events/tsconfig.build.json"
+    },
+    {
+      "path": "../../arch/report-tti/tsconfig.build.json"
+    },
+    {
+      "path": "../bot-plugin/export/tsconfig.build.json"
+    },
+    {
+      "path": "../../common/assets/tsconfig.build.json"
+    },
+    {
+      "path": "../../components/bot-icons/tsconfig.build.json"
+    },
+    {
+      "path": "../../components/bot-semi/tsconfig.build.json"
+    },
+    {
+      "path": "../../../config/eslint-config/tsconfig.build.json"
+    },
+    {
+      "path": "../../../config/stylelint-config/tsconfig.build.json"
+    },
+    {
+      "path": "../../../config/ts-config/tsconfig.build.json"
+    },
+    {
+      "path": "../../../config/vitest-config/tsconfig.build.json"
+    },
+    {
+      "path": "../navigate/tsconfig.build.json"
+    },
+    {
+      "path": "../plugin-shared/tsconfig.build.json"
+    },
+    {
+      "path": "../space-bot/tsconfig.build.json"
+    },
+    {
+      "path": "../../studio/components/tsconfig.build.json"
+    },
+    {
+      "path": "../../studio/stores/bot-detail/tsconfig.build.json"
+    },
+    {
+      "path": "../tool/tsconfig.build.json"
+    },
+    {
+      "path": "../workflow-as-agent-adapter/tsconfig.build.json"
+    },
+    {
+      "path": "../../workflow/base/tsconfig.build.json"
+    },
+    {
+      "path": "../../workflow/components/tsconfig.build.json"
+    }
+  ]
+}

frontend/packages/agent-ide/workflow/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "compilerOptions": {
+    "composite": true
+  },
+  "references": [
+    {
+      "path": "./tsconfig.build.json"
+    },
+    {
+      "path": "./tsconfig.misc.json"
+    }
+  ],
+  "exclude": ["**/*"]
+}

frontend/packages/agent-ide/workflow/tsconfig.misc.json

@@ -0,0 +1,18 @@
+{
+  "extends": "@coze-arch/ts-config/tsconfig.web.json",
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "include": ["__tests__", "stories", "vitest.config.ts", "tailwind.config.ts"],
+  "exclude": ["./dist"],
+  "references": [
+    {
+      "path": "./tsconfig.build.json"
+    }
+  ],
+  "compilerOptions": {
+    "rootDir": "./",
+    "outDir": "./dist",
+    "types": ["vitest/globals"],
+    "strictNullChecks": true,
+    "noImplicitAny": true
+  }
+}

frontend/packages/agent-ide/workflow/vitest.config.ts

@@ -0,0 +1,22 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { defineConfig } from '@coze-arch/vitest-config';
+
+export default defineConfig({
+  dirname: __dirname,
+  preset: 'web',
+});