docs(materials): explain WIP in materials (#938)

* docs: scope chain docs

* docs: explain WIP for materials

apps/docs/components/form-materials/components/db-condition-row.tsx

@@ -0,0 +1,64 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import React from 'react';
+
+import { Field } from '@flowgram.ai/fixed-layout-editor';
+
+import { FreeFormMetaStoryBuilder, FormHeader } from '../../free-form-meta-story-builder';
+
+const DBConditionRow = React.lazy(() =>
+  import('@flowgram.ai/form-materials').then((module) => ({
+    default: module.DBConditionRow,
+  }))
+);
+
+export const BasicStory = () => (
+  <FreeFormMetaStoryBuilder
+    filterEndNode
+    formMeta={{
+      render: () => (
+        <>
+          <FormHeader />
+          <Field<any | undefined> name="db_condition_row">
+            {({ field }) => (
+              <DBConditionRow
+                options={[
+                  {
+                    label: 'TransactionID',
+                    value: 'transaction_id',
+                    schema: { type: 'integer' },
+                  },
+                  {
+                    label: 'Amount',
+                    value: 'amount',
+                    schema: { type: 'number' },
+                  },
+                  {
+                    label: 'Description',
+                    value: 'description',
+                    schema: { type: 'string' },
+                  },
+                  {
+                    label: 'Archived',
+                    value: 'archived',
+                    schema: { type: 'boolean' },
+                  },
+                  {
+                    label: 'CreateTime',
+                    value: 'create_time',
+                    schema: { type: 'date-time' },
+                  },
+                ]}
+                value={field.value}
+                onChange={(value) => field.onChange(value)}
+              />
+            )}
+          </Field>
+        </>
+      ),
+    }}
+  />
+);

apps/docs/components/form-materials/components/display-schema-tag.tsx

@@ -0,0 +1,55 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import React from 'react';
+
+import { FreeFormMetaStoryBuilder, FormHeader } from '../../free-form-meta-story-builder';
+
+const DisplaySchemaTag = React.lazy(() =>
+  import('@flowgram.ai/form-materials').then((module) => ({
+    default: module.DisplaySchemaTag,
+  }))
+);
+
+export const BasicStory = () => (
+  <FreeFormMetaStoryBuilder
+    filterEndNode
+    formMeta={{
+      render: () => (
+        <>
+          <FormHeader />
+          <DisplaySchemaTag
+            value={{
+              type: 'object',
+              properties: {
+                transaction_id: { type: 'integer' },
+                amount: { type: 'number' },
+                description: { type: 'string' },
+                archived: { type: 'boolean' },
+                owner: {
+                  type: 'object',
+                  properties: {
+                    id: { type: 'integer' },
+                    username: { type: 'string' },
+                    friends: {
+                      type: 'array',
+                      items: {
+                        type: 'object',
+                        properties: {
+                          id: { type: 'integer' },
+                          username: { type: 'string' },
+                        },
+                      },
+                    },
+                  },
+                },
+              },
+            }}
+          />
+        </>
+      ),
+    }}
+  />
+);

apps/docs/components/form-materials/components/display-schema-tree.tsx

@@ -0,0 +1,55 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import React from 'react';
+
+import { FreeFormMetaStoryBuilder, FormHeader } from '../../free-form-meta-story-builder';
+
+const DisplaySchemaTree = React.lazy(() =>
+  import('@flowgram.ai/form-materials').then((module) => ({
+    default: module.DisplaySchemaTree,
+  }))
+);
+
+export const BasicStory = () => (
+  <FreeFormMetaStoryBuilder
+    filterEndNode
+    formMeta={{
+      render: () => (
+        <>
+          <FormHeader />
+          <DisplaySchemaTree
+            value={{
+              type: 'object',
+              properties: {
+                transaction_id: { type: 'integer' },
+                amount: { type: 'number' },
+                description: { type: 'string' },
+                archived: { type: 'boolean' },
+                owner: {
+                  type: 'object',
+                  properties: {
+                    id: { type: 'integer' },
+                    username: { type: 'string' },
+                    friends: {
+                      type: 'array',
+                      items: {
+                        type: 'object',
+                        properties: {
+                          id: { type: 'integer' },
+                          username: { type: 'string' },
+                        },
+                      },
+                    },
+                  },
+                },
+              },
+            }}
+          />
+        </>
+      ),
+    }}
+  />
+);

apps/docs/components/form-materials/components/inputs-values-tree.tsx

@@ -0,0 +1,53 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import React from 'react';
+
+import { Field } from '@flowgram.ai/fixed-layout-editor';
+
+import { FreeFormMetaStoryBuilder, FormHeader } from '../../free-form-meta-story-builder';
+
+const InputsValuesTree = React.lazy(() =>
+  import('@flowgram.ai/form-materials').then((module) => ({
+    default: module.InputsValuesTree,
+  }))
+);
+
+export const BasicStory = () => (
+  <FreeFormMetaStoryBuilder
+    filterEndNode
+    formMeta={{
+      render: () => (
+        <>
+          <FormHeader />
+          <Field<Record<string, any> | undefined>
+            name="inputs_values"
+            defaultValue={{
+              a: {
+                b: {
+                  type: 'ref',
+                  content: ['start_0', 'str'],
+                },
+                c: {
+                  type: 'constant',
+                  content: 'hello',
+                },
+              },
+              d: {
+                type: 'constant',
+                content: '{ "a": "b"}',
+                schema: { type: 'object' },
+              },
+            }}
+          >
+            {({ field }) => (
+              <InputsValuesTree value={field.value} onChange={(value) => field.onChange(value)} />
+            )}
+          </Field>
+        </>
+      ),
+    }}
+  />
+);

apps/docs/components/form-materials/components/prompt-editor.tsx

@@ -0,0 +1,42 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import React from 'react';
+
+import { Field } from '@flowgram.ai/fixed-layout-editor';
+
+import { FreeFormMetaStoryBuilder, FormHeader } from '../../free-form-meta-story-builder';
+
+const PromptEditor = React.lazy(() =>
+  import('@flowgram.ai/form-materials').then((module) => ({
+    default: module.PromptEditor,
+  }))
+);
+
+export const BasicStory = () => (
+  <FreeFormMetaStoryBuilder
+    filterEndNode
+    formMeta={{
+      render: () => (
+        <>
+          <FormHeader />
+          <Field<any | undefined>
+            name="prompt_editor"
+            defaultValue={{
+              type: 'template',
+              content: `# Role
+You are a helpful assistant
+`,
+            }}
+          >
+            {({ field }) => (
+              <PromptEditor value={field.value} onChange={(value) => field.onChange(value)} />
+            )}
+          </Field>
+        </>
+      ),
+    }}
+  />
+);

apps/docs/src/en/guide/variable/_meta.json

@@ -2,5 +2,6 @@
   "basic",
   "concept",
   "variable-output",
-  "variable-consume"
+  "variable-consume",
+  "custom-scope-chain"
 ]

apps/docs/src/en/guide/variable/custom-scope-chain.mdx

@@ -0,0 +1,58 @@
+---
+description: How to customize the scope chain
+---
+
+# Scope Chain
+
+## Default Scope Chain Logic
+
+For details, see: [Scope in Canvas](./concept#variables-in-canvas)
+
+
+## Customize in `editor-props`
+
+The customization logic for the scope is usually done in `editor-props` through `variableEngine.chainConfig`.
+
+```tsx pure title="use-editor-props.tsx" {6-8}
+// ...
+{
+  // ...
+  variableEngine: {
+    enable: true,
+    chainConfig: {
+      // Customize scope chain logic
+    }
+  }
+  // ...
+}
+// ...
+```
+
+
+### Whether child nodes can be depended on by subsequent nodes
+
+**By default, child nodes cannot be depended on by subsequent nodes of the parent node**.
+
+If you need to customize this logic, you need to configure it in `variableEngine.chainConfig.isNodeChildrenPrivate`.
+
+
+```tsx pure title="use-editor-props.tsx" {8-15}
+{
+  variableEngine: {
+    enable: true,
+    chainConfig: {
+      /**
+       * Customize: Whether child nodes can be depended on by subsequent nodes of the parent node
+       */
+      isNodeChildrenPrivate(node) {
+        // When a certain type of custom node is hit, allow its child nodes to be depended on by subsequent nodes
+        if (node.flowNodeType === 'Your_Custom_Type') {
+          return false;
+        }
+        // Otherwise: by default, child nodes are not allowed to be depended on by subsequent nodes
+        return true;
+      },
+    }
+  }
+}
+```

apps/docs/src/en/materials/common/disable-declaration-plugin.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # DisableDeclarationPlugin (WIP)
 
 <SourceCode

apps/docs/src/en/materials/common/inject-material.mdx

@@ -1,6 +1,10 @@
 import { SourceCode } from '@theme';
 
-# InjectMaterial (WIP)
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
+# Material Dependency Injection (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/shared/inject-material"

apps/docs/src/en/materials/common/json-schema-preset.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # JsonSchemaPreset (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/assign-row.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # AssignRow (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/assign-rows.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # AssignRows (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/batch-outputs.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # BatchOutputs (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/batch-variable-selector.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # BatchVariableSelector (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/blur-input.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # BlurInput (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/condition-context.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # ConditionContext (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/constant-input.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # ConstantInput (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/coze-editor-extensions.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # CozeEditorExtensions (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/db-condition-row.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # DbConditionRow (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/display-flow-value.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # DisplayFlowValue (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/display-inputs-values.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # DisplayInputsValues (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/display-outputs.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # DisplayOutputs (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/display-schema-tag.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # DisplaySchemaTag (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/display-schema-tree.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # DisplaySchemaTree (WIP)
 
 <SourceCode

apps/docs/src/en/materials/components/inputs-values-tree.mdx

@@ -1,7 +1,62 @@
 import { SourceCode } from '@theme';
+import { BasicStory } from 'components/form-materials/components/inputs-values-tree';
+
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
 
 # InputsValuesTree (WIP)
 
+## Demo
+
+### Basic Usage
+
+<BasicStory />
+
+```typescript
+import { InputsValuesTree } from '@flowgram.ai/form-materials';
+
+const formMeta = {
+  render: () => (
+    <>
+      <FormHeader />
+      <Field<Record<string, any> | undefined>
+        name="inputs_values"
+        defaultValue={{
+          a: {
+            b: {
+              type: 'ref',
+              content: ['start_0', 'str'],
+            },
+            c: {
+              type: 'constant',
+              content: 'hello',
+            },
+          },
+          d: {
+            type: 'constant',
+            content: '{ "a": "b"}',
+            schema: { type: 'object' },
+          },
+        }}
+      >
+        {({ field }) => (
+          <InputsValuesTree value={field.value} onChange={(value) => field.onChange(value)} />
+        )}
+      </Field>
+    </>
+  ),
+}
+```
+
+## Source Code Guide
+
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/inputs-values-tree"
-/>
+/>
+
+Use the CLI command to copy the source code locally:
+
+```bash
+npx @flowgram.ai/cli@latest materials components/inputs-values-tree
+```

apps/docs/src/en/materials/components/prompt-editor.mdx

@@ -1,7 +1,27 @@
 import { SourceCode } from '@theme';
+import { BasicStory } from 'components/form-materials/components/prompt-editor';
+
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
 
 # PromptEditor (WIP)
 
+## Demo
+
+### Basic Usage
+
+<BasicStory />
+
+## Source Code Guide
+
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/prompt-editor"
-/>
+/>
+
+Use the CLI command to copy the source code locally:
+
+```bash
+npx @flowgram.ai/cli@latest materials components/prompt-editor
+```
+

apps/docs/src/en/materials/effects/provide-batch-input.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # provideBatchInput (WIP)
 
 <SourceCode

apps/docs/src/en/materials/effects/provide-json-schema-outputs.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # provideJsonSchemaOutputs (WIP)
 
 <SourceCode

apps/docs/src/en/materials/effects/sync-variable-title.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # syncVariableTitle (WIP)
 
 <SourceCode

apps/docs/src/en/materials/effects/validate-when-variable-sync.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # validateWhenVariableSync (WIP)
 
 <SourceCode

apps/docs/src/en/materials/form-plugins/batch-outputs-plugin.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # batchOutputsPlugin (WIP)
 
 <SourceCode

apps/docs/src/en/materials/form-plugins/infer-assign-plugin.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # inferAssignPlugin (WIP)
 
 <SourceCode

apps/docs/src/en/materials/form-plugins/infer-inputs-plugin.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # inferInputsPlugin (WIP)
 
 <SourceCode

apps/docs/src/en/materials/validate/validate-flow-value.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+The material has been developed and the documentation is still being improved. Contributions are welcome.
+:::
+
 # validateFlowValue (WIP)
 
 <SourceCode

apps/docs/src/zh/guide/variable/_meta.json

@@ -2,5 +2,6 @@
   "basic",
   "concept",
   "variable-output",
-  "variable-consume"
+  "variable-consume",
+  "custom-scope-chain"
 ]

apps/docs/src/zh/guide/variable/custom-scope-chain.mdx

@@ -2,15 +2,58 @@
 description: 介绍如何定制作用域链
 ---
 
-# 定制作用域链(WIP)
+# 作用域链
 
-## 常见场景
+## 默认作用域链逻辑
 
+详见：[画布中的作用域](./concept#画布中的变量)
 
-## 配置 variableEngine.chainConfig
 
-## 通过 ScopeChainTransformService
+## 在 `editor-props` 中定制
 
+作用域的定制逻辑，通常在 `editor-props` 中，通过 `variableEngine.chainConfig` 定制。
 
+```tsx pure title="use-editor-props.tsx" {6-8}
+// ...
+{
+  // ...
+  variableEngine: {
+    enable: true,
+    chainConfig: {
+      // 作用域链逻辑定制
+    }
+  }
+  // ...
+}
+// ...
+```
+
+
+### 子节点能否被后续节点依赖
+
+**默认情况下，子节点是不可以被父节点的后续节点依赖的**。
+
+如果需要定制这个逻辑，需要在 `variableEngine.chainConfig.isNodeChildrenPrivate` 中配置。
+
+
+```tsx pure title="use-editor-props.tsx" {8-15}
+{
+  variableEngine: {
+    enable: true,
+    chainConfig: {
+      /**
+       * 定制：子节点是否可以被父节点的后续节点依赖
+       */
+      isNodeChildrenPrivate(node) {
+        // 当命中用户某类自定义节点时，允许其子节点被后续节点依赖
+        if (node.flowNodeType === 'Your_Custom_Type') {
+          return false;
+        }
+        // 否则：默认不允许子节点被后续节点依赖
+        return true;
+      },
+    }
+  }
+}
+```
 
-## 通过插件定制作用域链

apps/docs/src/zh/materials/common/disable-declaration-plugin.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # DisableDeclarationPlugin (WIP)
 
 <SourceCode

apps/docs/src/zh/materials/common/inject-material.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # 物料依赖注入 (WIP)
 
 <SourceCode

apps/docs/src/zh/materials/common/json-schema-preset.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # JsonSchemaPreset (WIP)
 
 <SourceCode

apps/docs/src/zh/materials/components/_meta.json

@@ -4,27 +4,26 @@
   "variable-selector",
   "dynamic-value-input",
   "condition-row",
+  "db-condition-row",
+  "condition-context",
   "inputs-values",
-  "code-editor",
-  "json-editor-with-variables",
+  "inputs-values-tree",
+  "prompt-editor",
   "prompt-editor-with-variables",
   "prompt-editor-with-inputs",
+  "code-editor",
+  "json-editor-with-variables",
   "sql-editor-with-variables",
+  "coze-editor-extensions",
   "assign-row",
   "assign-rows",
   "batch-outputs",
   "batch-variable-selector",
   "blur-input",
-  "code-editor-mini",
-  "condition-context",
   "constant-input",
-  "coze-editor-extensions",
-  "db-condition-row",
   "display-flow-value",
   "display-inputs-values",
   "display-outputs",
   "display-schema-tag",
-  "display-schema-tree",
-  "inputs-values-tree",
-  "prompt-editor"
+  "display-schema-tree"
 ]

apps/docs/src/zh/materials/components/assign-row.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # AssignRow (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/assign-row"
-/>
+/>

apps/docs/src/zh/materials/components/assign-rows.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # AssignRows (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/assign-rows"
-/>
+/>

apps/docs/src/zh/materials/components/batch-outputs.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # BatchOutputs (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/batch-outputs"
-/>
+/>

apps/docs/src/zh/materials/components/batch-variable-selector.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # BatchVariableSelector (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/batch-variable-selector"
-/>
+/>

apps/docs/src/zh/materials/components/blur-input.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # BlurInput (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/blur-input"
-/>
+/>

apps/docs/src/zh/materials/components/code-editor-mini.mdx

@@ -1,7 +0,0 @@
-import { SourceCode } from '@theme';
-
-# CodeEditorMini (WIP)
-
-<SourceCode
-  href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/code-editor-mini"
-/>

apps/docs/src/zh/materials/components/condition-context.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # ConditionContext (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/condition-context"
-/>
+/>

apps/docs/src/zh/materials/components/constant-input.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # ConstantInput (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/constant-input"
-/>
+/>

apps/docs/src/zh/materials/components/coze-editor-extensions.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # CozeEditorExtensions (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/coze-editor-extensions"
-/>
+/>

apps/docs/src/zh/materials/components/db-condition-row.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # DbConditionRow (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/db-condition-row"
-/>
+/>

apps/docs/src/zh/materials/components/display-flow-value.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # DisplayFlowValue (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/display-flow-value"
-/>
+/>

apps/docs/src/zh/materials/components/display-inputs-values.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # DisplayInputsValues (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/display-inputs-values"
-/>
+/>

apps/docs/src/zh/materials/components/display-outputs.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # DisplayOutputs (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/display-outputs"
-/>
+/>

apps/docs/src/zh/materials/components/display-schema-tag.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # DisplaySchemaTag (WIP)
 
 <SourceCode

apps/docs/src/zh/materials/components/display-schema-tree.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # DisplaySchemaTree (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/display-schema-tree"
-/>
+/>

apps/docs/src/zh/materials/components/inputs-values-tree.mdx

@@ -1,7 +1,65 @@
 import { SourceCode } from '@theme';
+import { BasicStory } from 'components/form-materials/components/inputs-values-tree';
+
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
 
 # InputsValuesTree (WIP)
 
+## 案例演示
+
+### 基本使用
+
+<BasicStory />
+
+```typescript
+import { InputsValuesTree } from '@flowgram.ai/form-materials';
+
+const formMeta = {
+  render: () => (
+    <>
+      <FormHeader />
+      <Field<Record<string, any> | undefined>
+        name="inputs_values"
+        defaultValue={{
+          a: {
+            b: {
+              type: 'ref',
+              content: ['start_0', 'str'],
+            },
+            c: {
+              type: 'constant',
+              content: 'hello',
+            },
+          },
+          d: {
+            type: 'constant',
+            content: '{ "a": "b"}',
+            schema: { type: 'object' },
+          },
+        }}
+      >
+        {({ field }) => (
+          <InputsValuesTree value={field.value} onChange={(value) => field.onChange(value)} />
+        )}
+      </Field>
+    </>
+  ),
+}
+```
+
+
+
+## 源码导读
+
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/inputs-values-tree"
-/>
+/>
+
+
+使用 CLI 命令可以复制源代码到本地：
+
+```bash
+npx @flowgram.ai/cli@latest materials components/inputs-values-tree
+```

apps/docs/src/zh/materials/components/prompt-editor.mdx

@@ -1,7 +1,26 @@
 import { SourceCode } from '@theme';
+import { BasicStory } from 'components/form-materials/components/prompt-editor';
+
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
 
 # PromptEditor (WIP)
 
+## 案例演示
+
+### 基本使用
+
+<BasicStory />
+
+## 源码导读
+
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/components/prompt-editor"
-/>
+/>
+
+使用 CLI 命令可以复制源代码到本地：
+
+```bash
+npx @flowgram.ai/cli@latest materials components/prompt-editor
+```

apps/docs/src/zh/materials/effects/provide-batch-input.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # provideBatchInput (WIP)
 
 <SourceCode

apps/docs/src/zh/materials/effects/provide-json-schema-outputs.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # provideJsonSchemaOutputs (WIP)
 
 <SourceCode

apps/docs/src/zh/materials/effects/sync-variable-title.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # syncVariableTitle (WIP)
 
 <SourceCode

apps/docs/src/zh/materials/effects/validate-when-variable-sync.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # validateWhenVariableSync (WIP)
 
 <SourceCode

apps/docs/src/zh/materials/form-plugins/batch-outputs-plugin.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # batchOutputsPlugin (WIP)
 
 <SourceCode

apps/docs/src/zh/materials/form-plugins/infer-assign-plugin.mdx

@@ -1,5 +1,9 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # inferAssignPlugin (WIP)
 
 <SourceCode

apps/docs/src/zh/materials/form-plugins/infer-inputs-plugin.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # inferInputsPlugin (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/form-plugins/infer-inputs-plugin"
-/>
+/>

apps/docs/src/zh/materials/introduction.mdx

@@ -48,4 +48,3 @@ CLI 运行成功后，相关物料会自动添加到当前项目下的 `src/form
 3. 一些物料会依赖另外一些官方物料，这些被依赖的物料源代码在 CLI 运行时会一起被添加到项目中去
 
 :::
-

apps/docs/src/zh/materials/validate/validate-flow-value.mdx

@@ -1,7 +1,11 @@
 import { SourceCode } from '@theme';
 
+:::warning
+物料已完成开发，文档还在完善中，欢迎参与贡献
+:::
+
 # validateFlowValue (WIP)
 
 <SourceCode
   href="https://github.com/bytedance/flowgram.ai/tree/main/packages/materials/form-materials/src/validate/validate-flow-value"
-/>
+/>