@flowgram.ai/form-materials 0.4.10 → 0.4.11

package/dist/esm/components/coze-editor-extensions/index.mjs

@@ -0,0 +1,18 @@
+import { lazy } from "react";
+import { createInjectMaterial } from "../../shared/index.mjs";
+const EditorVariableTree = createInjectMaterial(/*#__PURE__*/ lazy(()=>import("./extensions/variable-tree.mjs").then((module)=>({
+            default: module.VariableTree
+        }))), {
+    renderKey: 'EditorVariableTree'
+});
+const EditorVariableTagInject = createInjectMaterial(/*#__PURE__*/ lazy(()=>import("./extensions/variable-tag.mjs").then((module)=>({
+            default: module.VariableTagInject
+        }))), {
+    renderKey: 'EditorVariableTagInject'
+});
+const EditorInputsTree = createInjectMaterial(/*#__PURE__*/ lazy(()=>import("./extensions/inputs-tree.mjs").then((module)=>({
+            default: module.InputsTree
+        }))), {
+    renderKey: 'EditorInputsTree'
+});
+export { EditorInputsTree, EditorVariableTagInject, EditorVariableTree };

package/dist/esm/components/index.mjs

@@ -7,6 +7,7 @@ import { CodeEditor } from "./code-editor/index.mjs";
 import { CodeEditorMini } from "./code-editor-mini/index.mjs";
 import { ConditionRow } from "./condition-row/index.mjs";
 import { ConstantInput } from "./constant-input/index.mjs";
+import { EditorInputsTree, EditorVariableTagInject, EditorVariableTree } from "./coze-editor-extensions/index.mjs";
 import { DBConditionRow } from "./db-condition-row/index.mjs";
 import { DisplayFlowValue } from "./display-flow-value/index.mjs";
 import { DisplayInputsValueAllInTag, DisplayInputsValues } from "./display-inputs-values/index.mjs";
@@ -23,4 +24,4 @@ import { PromptEditorWithInputs } from "./prompt-editor-with-inputs/index.mjs";
 import { PromptEditorWithVariables } from "./prompt-editor-with-variables/index.mjs";
 import { InjectTypeSelector, TypeSelector, getTypeSelectValue, parseTypeSelectValue } from "./type-selector/index.mjs";
 import { InjectVariableSelector, VariableSelector, VariableSelectorProvider, useVariableTree } from "./variable-selector/index.mjs";
-export { AssignRow, AssignRows, BatchOutputs, BatchVariableSelector, BlurInput, CodeEditor, CodeEditorMini, ConditionRow, ConstantInput, DBConditionRow, DisplayFlowValue, DisplayInputsValueAllInTag, DisplayInputsValues, DisplayOutputs, DisplaySchemaTag, DisplaySchemaTree, DynamicValueInput, InjectDynamicValueInput, InjectTypeSelector, InjectVariableSelector, InputsValues, InputsValuesTree, JsonEditorWithVariables, JsonSchemaEditor, PromptEditor, PromptEditorWithInputs, PromptEditorWithVariables, TypeSelector, VariableSelector, VariableSelectorProvider, getTypeSelectValue, parseTypeSelectValue, useVariableTree };
+export { AssignRow, AssignRows, BatchOutputs, BatchVariableSelector, BlurInput, CodeEditor, CodeEditorMini, ConditionRow, ConstantInput, DBConditionRow, DisplayFlowValue, DisplayInputsValueAllInTag, DisplayInputsValues, DisplayOutputs, DisplaySchemaTag, DisplaySchemaTree, DynamicValueInput, EditorInputsTree, EditorVariableTagInject, EditorVariableTree, InjectDynamicValueInput, InjectTypeSelector, InjectVariableSelector, InputsValues, InputsValuesTree, JsonEditorWithVariables, JsonSchemaEditor, PromptEditor, PromptEditorWithInputs, PromptEditorWithVariables, TypeSelector, VariableSelector, VariableSelectorProvider, getTypeSelectValue, parseTypeSelectValue, useVariableTree };

package/dist/esm/components/json-editor-with-variables/editor.mjs

@@ -2,9 +2,11 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
 import { I18n } from "@flowgram.ai/editor";
 import { transformerCreator } from "@flowgram.ai/coze-editor/preset-code";
+import { EditorVariableTagInject, EditorVariableTree } from "../coze-editor-extensions/index.mjs";
 import { CodeEditor } from "../code-editor/index.mjs";
-import { VariableTree } from "./extensions/variable-tree.mjs";
-import { VariableTagInject } from "./extensions/variable-tag.mjs";
+const TRIGGER_CHARACTERS = [
+    '@'
+];
 function findAllMatches(inputString, regex) {
     const globalRegex = new RegExp(regex, regex.flags.includes('g') ? regex.flags : regex.flags + 'g');
     let match;
@@ -39,8 +41,10 @@ function JsonEditorWithVariables(props) {
             ...props.options || {}
         },
         children: [
-            /*#__PURE__*/ jsx(VariableTree, {}),
-            /*#__PURE__*/ jsx(VariableTagInject, {})
+            /*#__PURE__*/ jsx(EditorVariableTree, {
+                triggerCharacters: TRIGGER_CHARACTERS
+            }),
+            /*#__PURE__*/ jsx(EditorVariableTagInject, {})
         ]
     });
 }

package/dist/esm/components/prompt-editor-with-inputs/editor.mjs

@@ -1,11 +1,11 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
 import { PromptEditor } from "../prompt-editor/index.mjs";
-import { InputsTree } from "./extensions/inputs-tree.mjs";
+import { EditorInputsTree } from "../coze-editor-extensions/index.mjs";
 function PromptEditorWithInputs({ inputsValues, ...restProps }) {
     return /*#__PURE__*/ jsx(PromptEditor, {
         ...restProps,
-        children: /*#__PURE__*/ jsx(InputsTree, {
+        children: /*#__PURE__*/ jsx(EditorInputsTree, {
             inputsValues: inputsValues
         })
     });

package/dist/esm/components/prompt-editor-with-variables/editor.mjs

@@ -1,14 +1,13 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
 import { PromptEditor } from "../prompt-editor/index.mjs";
-import { VariableTree } from "./extensions/variable-tree.mjs";
-import { VariableTagInject } from "./extensions/variable-tag.mjs";
+import { EditorVariableTagInject, EditorVariableTree } from "../coze-editor-extensions/index.mjs";
 function PromptEditorWithVariables(props) {
     return /*#__PURE__*/ jsxs(PromptEditor, {
         ...props,
         children: [
-            /*#__PURE__*/ jsx(VariableTree, {}),
-            /*#__PURE__*/ jsx(VariableTagInject, {})
+            /*#__PURE__*/ jsx(EditorVariableTree, {}),
+            /*#__PURE__*/ jsx(EditorVariableTagInject, {})
         ]
     });
 }

package/dist/esm/components/variable-selector/index.mjs

@@ -34,6 +34,7 @@ const VariableSelector = ({ value, config = {}, onChange, style, readonly = fals
         });
         return icon;
     };
+    console.log('debugger treeValue', treeValue);
     return /*#__PURE__*/ jsx(Fragment, {
         children: /*#__PURE__*/ jsx(UITreeSelect, {
             dropdownMatchSelectWidth: false,

package/dist/esm/index.mjs

@@ -1,8 +1,8 @@
-import { AssignRow, AssignRows, BatchOutputs, BatchVariableSelector, BlurInput, CodeEditor, CodeEditorMini, ConditionRow, ConstantInput, DBConditionRow, DisplayFlowValue, DisplayInputsValueAllInTag, DisplayInputsValues, DisplayOutputs, DisplaySchemaTag, DisplaySchemaTree, DynamicValueInput, InjectDynamicValueInput, InjectTypeSelector, InjectVariableSelector, InputsValues, InputsValuesTree, JsonEditorWithVariables, JsonSchemaEditor, PromptEditor, PromptEditorWithInputs, PromptEditorWithVariables, TypeSelector, VariableSelector, VariableSelectorProvider, getTypeSelectValue, parseTypeSelectValue, useVariableTree } from "./components/index.mjs";
+import { AssignRow, AssignRows, BatchOutputs, BatchVariableSelector, BlurInput, CodeEditor, CodeEditorMini, ConditionRow, ConstantInput, DBConditionRow, DisplayFlowValue, DisplayInputsValueAllInTag, DisplayInputsValues, DisplayOutputs, DisplaySchemaTag, DisplaySchemaTree, DynamicValueInput, EditorInputsTree, EditorVariableTagInject, EditorVariableTree, InjectDynamicValueInput, InjectTypeSelector, InjectVariableSelector, InputsValues, InputsValuesTree, JsonEditorWithVariables, JsonSchemaEditor, PromptEditor, PromptEditorWithInputs, PromptEditorWithVariables, TypeSelector, VariableSelector, VariableSelectorProvider, getTypeSelectValue, parseTypeSelectValue, useVariableTree } from "./components/index.mjs";
 import { autoRenameRefEffect, listenRefSchemaChange, listenRefValueChange, provideBatchInputEffect, provideJsonSchemaOutputs, syncVariableTitle, validateWhenVariableSync } from "./effects/index.mjs";
 import { createBatchOutputsFormPlugin, createInferAssignPlugin, createInferInputsPlugin, provideBatchOutputsEffect } from "./form-plugins/index.mjs";
 import { useObjectList } from "./hooks/index.mjs";
 import { JsonSchemaTypePresetProvider, JsonSchemaUtils, createDisableDeclarationPlugin, createTypePresetPlugin, useTypeManager } from "./plugins/index.mjs";
 import { FlowValueUtils, createInjectMaterial, formatLegacyRefOnInit, formatLegacyRefOnSubmit, formatLegacyRefToNewRef, formatNewRefToLegacyRef, isLegacyFlowRefValueSchema, isNewFlowRefValueSchema, lazySuspense, polyfillCreateRoot, unstableSetCreateRoot, withSuspense } from "./shared/index.mjs";
 import { validateFlowValue } from "./validate/index.mjs";
-export { AssignRow, AssignRows, BatchOutputs, BatchVariableSelector, BlurInput, CodeEditor, CodeEditorMini, ConditionRow, ConstantInput, DBConditionRow, DisplayFlowValue, DisplayInputsValueAllInTag, DisplayInputsValues, DisplayOutputs, DisplaySchemaTag, DisplaySchemaTree, DynamicValueInput, FlowValueUtils, InjectDynamicValueInput, InjectTypeSelector, InjectVariableSelector, InputsValues, InputsValuesTree, JsonEditorWithVariables, JsonSchemaEditor, JsonSchemaTypePresetProvider, JsonSchemaUtils, PromptEditor, PromptEditorWithInputs, PromptEditorWithVariables, TypeSelector, VariableSelector, VariableSelectorProvider, autoRenameRefEffect, createBatchOutputsFormPlugin, createDisableDeclarationPlugin, createInferAssignPlugin, createInferInputsPlugin, createInjectMaterial, createTypePresetPlugin, formatLegacyRefOnInit, formatLegacyRefOnSubmit, formatLegacyRefToNewRef, formatNewRefToLegacyRef, getTypeSelectValue, isLegacyFlowRefValueSchema, isNewFlowRefValueSchema, lazySuspense, listenRefSchemaChange, listenRefValueChange, parseTypeSelectValue, polyfillCreateRoot, provideBatchInputEffect, provideBatchOutputsEffect, provideJsonSchemaOutputs, syncVariableTitle, unstableSetCreateRoot, useObjectList, useTypeManager, useVariableTree, validateFlowValue, validateWhenVariableSync, withSuspense };
+export { AssignRow, AssignRows, BatchOutputs, BatchVariableSelector, BlurInput, CodeEditor, CodeEditorMini, ConditionRow, ConstantInput, DBConditionRow, DisplayFlowValue, DisplayInputsValueAllInTag, DisplayInputsValues, DisplayOutputs, DisplaySchemaTag, DisplaySchemaTree, DynamicValueInput, EditorInputsTree, EditorVariableTagInject, EditorVariableTree, FlowValueUtils, InjectDynamicValueInput, InjectTypeSelector, InjectVariableSelector, InputsValues, InputsValuesTree, JsonEditorWithVariables, JsonSchemaEditor, JsonSchemaTypePresetProvider, JsonSchemaUtils, PromptEditor, PromptEditorWithInputs, PromptEditorWithVariables, TypeSelector, VariableSelector, VariableSelectorProvider, autoRenameRefEffect, createBatchOutputsFormPlugin, createDisableDeclarationPlugin, createInferAssignPlugin, createInferInputsPlugin, createInjectMaterial, createTypePresetPlugin, formatLegacyRefOnInit, formatLegacyRefOnSubmit, formatLegacyRefToNewRef, formatNewRefToLegacyRef, getTypeSelectValue, isLegacyFlowRefValueSchema, isNewFlowRefValueSchema, lazySuspense, listenRefSchemaChange, listenRefValueChange, parseTypeSelectValue, polyfillCreateRoot, provideBatchInputEffect, provideBatchOutputsEffect, provideJsonSchemaOutputs, syncVariableTitle, unstableSetCreateRoot, useObjectList, useTypeManager, useVariableTree, validateFlowValue, validateWhenVariableSync, withSuspense };

package/dist/esm/shared/inject-material/index.mjs

@@ -1,13 +1,13 @@
 import react from "react";
 import { FlowRendererComponentType, FlowRendererRegistry, usePlaygroundContainer } from "@flowgram.ai/editor";
 function createInjectMaterial(Component, params) {
+    const renderKey = params?.renderKey || Component.renderKey || Component.name || '';
     const InjectComponent = (props)=>{
         const container = usePlaygroundContainer();
         if (!container?.isBound(FlowRendererRegistry)) return /*#__PURE__*/ react.createElement(Component, {
             ...props
         });
         const rendererRegistry = container.get(FlowRendererRegistry);
-        const renderKey = params?.renderKey || Component.renderKey || Component.name || '';
         const renderer = rendererRegistry.tryToGetRendererComponent(renderKey);
         if (renderer?.type !== FlowRendererComponentType.REACT) return /*#__PURE__*/ react.createElement(Component, {
             ...props
@@ -16,6 +16,7 @@ function createInjectMaterial(Component, params) {
             ...props
         });
     };
+    InjectComponent.renderKey = renderKey;
     return InjectComponent;
 }
 export { createInjectMaterial };

package/dist/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"root":["../src/index.ts","../src/components/index.ts","../src/components/assign-row/index.tsx","../src/components/assign-row/types.ts","../src/components/assign-rows/index.tsx","../src/components/batch-outputs/index.tsx","../src/components/batch-outputs/styles.tsx","../src/components/batch-outputs/types.ts","../src/components/batch-variable-selector/index.tsx","../src/components/blur-input/index.tsx","../src/components/code-editor/editor.tsx","../src/components/code-editor/index.tsx","../src/components/code-editor/init-worker.ts","../src/components/code-editor/language-features.ts","../src/components/code-editor/utils.ts","../src/components/code-editor/theme/dark.ts","../src/components/code-editor/theme/index.ts","../src/components/code-editor/theme/light.ts","../src/components/code-editor-mini/index.tsx","../src/components/condition-row/constants.ts","../src/components/condition-row/index.tsx","../src/components/condition-row/styles.tsx","../src/components/condition-row/types.ts","../src/components/condition-row/hooks/useOp.tsx","../src/components/condition-row/hooks/useRule.ts","../src/components/constant-input/index.tsx","../src/components/constant-input/types.ts","../src/components/db-condition-row/index.tsx","../src/components/db-condition-row/styles.tsx","../src/components/db-condition-row/types.ts","../src/components/db-condition-row/hooks/use-left.tsx","../src/components/db-condition-row/hooks/use-op.tsx","../src/components/display-flow-value/index.tsx","../src/components/display-inputs-values/index.tsx","../src/components/display-inputs-values/styles.ts","../src/components/display-outputs/index.tsx","../src/components/display-outputs/styles.ts","../src/components/display-schema-tag/index.tsx","../src/components/display-schema-tag/styles.ts","../src/components/display-schema-tree/index.tsx","../src/components/display-schema-tree/styles.tsx","../src/components/dynamic-value-input/hooks.ts","../src/components/dynamic-value-input/index.tsx","../src/components/dynamic-value-input/styles.tsx","../src/components/inputs-values/index.tsx","../src/components/inputs-values/styles.tsx","../src/components/inputs-values/types.ts","../src/components/inputs-values-tree/index.tsx","../src/components/inputs-values-tree/row.tsx","../src/components/inputs-values-tree/styles.tsx","../src/components/inputs-values-tree/types.ts","../src/components/inputs-values-tree/hooks/use-child-list.tsx","../src/components/json-editor-with-variables/editor.tsx","../src/components/json-editor-with-variables/index.tsx","../src/components/json-editor-with-variables/styles.tsx","../src/components/json-editor-with-variables/extensions/variable-tag.tsx","../src/components/json-editor-with-variables/extensions/variable-tree.tsx","../src/components/json-schema-editor/default-value.tsx","../src/components/json-schema-editor/hooks.tsx","../src/components/json-schema-editor/index.tsx","../src/components/json-schema-editor/styles.tsx","../src/components/json-schema-editor/types.ts","../src/components/prompt-editor/editor.tsx","../src/components/prompt-editor/index.tsx","../src/components/prompt-editor/styles.tsx","../src/components/prompt-editor/types.tsx","../src/components/prompt-editor/extensions/jinja.tsx","../src/components/prompt-editor/extensions/language-support.tsx","../src/components/prompt-editor/extensions/markdown.tsx","../src/components/prompt-editor-with-inputs/editor.tsx","../src/components/prompt-editor-with-inputs/index.tsx","../src/components/prompt-editor-with-inputs/inputs-picker.tsx","../src/components/prompt-editor-with-inputs/extensions/inputs-tree.tsx","../src/components/prompt-editor-with-variables/editor.tsx","../src/components/prompt-editor-with-variables/index.tsx","../src/components/prompt-editor-with-variables/styles.tsx","../src/components/prompt-editor-with-variables/extensions/variable-tag.tsx","../src/components/prompt-editor-with-variables/extensions/variable-tree.tsx","../src/components/type-selector/index.tsx","../src/components/variable-selector/context.tsx","../src/components/variable-selector/index.tsx","../src/components/variable-selector/styles.tsx","../src/components/variable-selector/use-variable-tree.tsx","../src/effects/index.ts","../src/effects/auto-rename-ref/index.ts","../src/effects/listen-ref-schema-change/index.ts","../src/effects/listen-ref-value-change/index.ts","../src/effects/provide-batch-input/index.ts","../src/effects/provide-json-schema-outputs/index.ts","../src/effects/sync-variable-title/index.ts","../src/effects/validate-when-variable-sync/index.ts","../src/form-plugins/index.ts","../src/form-plugins/batch-outputs-plugin/index.ts","../src/form-plugins/infer-assign-plugin/index.ts","../src/form-plugins/infer-inputs-plugin/index.ts","../src/hooks/index.ts","../src/hooks/use-object-list/index.tsx","../src/plugins/index.ts","../src/plugins/disable-declaration-plugin/create-disable-declaration-plugin.ts","../src/plugins/disable-declaration-plugin/index.tsx","../src/plugins/json-schema-preset/create-type-preset-plugin.tsx","../src/plugins/json-schema-preset/index.tsx","../src/plugins/json-schema-preset/manager.ts","../src/plugins/json-schema-preset/type-definition/array.tsx","../src/plugins/json-schema-preset/type-definition/boolean.tsx","../src/plugins/json-schema-preset/type-definition/date-time.tsx","../src/plugins/json-schema-preset/type-definition/index.tsx","../src/plugins/json-schema-preset/type-definition/integer.tsx","../src/plugins/json-schema-preset/type-definition/number.tsx","../src/plugins/json-schema-preset/type-definition/object.tsx","../src/plugins/json-schema-preset/type-definition/string.tsx","../src/shared/index.ts","../src/shared/flow-value/index.ts","../src/shared/flow-value/schema.ts","../src/shared/flow-value/types.ts","../src/shared/flow-value/utils.ts","../src/shared/format-legacy-refs/index.ts","../src/shared/inject-material/index.tsx","../src/shared/lazy-suspense/index.tsx","../src/shared/polyfill-create-root/index.tsx","../src/validate/index.ts","../src/validate/validate-flow-value/index.tsx"],"version":"5.8.3"}
+{"root":["../src/index.ts","../src/components/index.ts","../src/components/assign-row/index.tsx","../src/components/assign-row/types.ts","../src/components/assign-rows/index.tsx","../src/components/batch-outputs/index.tsx","../src/components/batch-outputs/styles.tsx","../src/components/batch-outputs/types.ts","../src/components/batch-variable-selector/index.tsx","../src/components/blur-input/index.tsx","../src/components/code-editor/editor.tsx","../src/components/code-editor/index.tsx","../src/components/code-editor/init-worker.ts","../src/components/code-editor/language-features.ts","../src/components/code-editor/utils.ts","../src/components/code-editor/theme/dark.ts","../src/components/code-editor/theme/index.ts","../src/components/code-editor/theme/light.ts","../src/components/code-editor-mini/index.tsx","../src/components/condition-row/constants.ts","../src/components/condition-row/index.tsx","../src/components/condition-row/styles.tsx","../src/components/condition-row/types.ts","../src/components/condition-row/hooks/useOp.tsx","../src/components/condition-row/hooks/useRule.ts","../src/components/constant-input/index.tsx","../src/components/constant-input/types.ts","../src/components/coze-editor-extensions/index.tsx","../src/components/coze-editor-extensions/styles.tsx","../src/components/coze-editor-extensions/extensions/inputs-tree.tsx","../src/components/coze-editor-extensions/extensions/variable-tag.tsx","../src/components/coze-editor-extensions/extensions/variable-tree.tsx","../src/components/db-condition-row/index.tsx","../src/components/db-condition-row/styles.tsx","../src/components/db-condition-row/types.ts","../src/components/db-condition-row/hooks/use-left.tsx","../src/components/db-condition-row/hooks/use-op.tsx","../src/components/display-flow-value/index.tsx","../src/components/display-inputs-values/index.tsx","../src/components/display-inputs-values/styles.ts","../src/components/display-outputs/index.tsx","../src/components/display-outputs/styles.ts","../src/components/display-schema-tag/index.tsx","../src/components/display-schema-tag/styles.ts","../src/components/display-schema-tree/index.tsx","../src/components/display-schema-tree/styles.tsx","../src/components/dynamic-value-input/hooks.ts","../src/components/dynamic-value-input/index.tsx","../src/components/dynamic-value-input/styles.tsx","../src/components/inputs-values/index.tsx","../src/components/inputs-values/styles.tsx","../src/components/inputs-values/types.ts","../src/components/inputs-values-tree/index.tsx","../src/components/inputs-values-tree/row.tsx","../src/components/inputs-values-tree/styles.tsx","../src/components/inputs-values-tree/types.ts","../src/components/inputs-values-tree/hooks/use-child-list.tsx","../src/components/json-editor-with-variables/editor.tsx","../src/components/json-editor-with-variables/index.tsx","../src/components/json-schema-editor/default-value.tsx","../src/components/json-schema-editor/hooks.tsx","../src/components/json-schema-editor/index.tsx","../src/components/json-schema-editor/styles.tsx","../src/components/json-schema-editor/types.ts","../src/components/prompt-editor/editor.tsx","../src/components/prompt-editor/index.tsx","../src/components/prompt-editor/styles.tsx","../src/components/prompt-editor/types.tsx","../src/components/prompt-editor/extensions/jinja.tsx","../src/components/prompt-editor/extensions/language-support.tsx","../src/components/prompt-editor/extensions/markdown.tsx","../src/components/prompt-editor-with-inputs/editor.tsx","../src/components/prompt-editor-with-inputs/index.tsx","../src/components/prompt-editor-with-variables/editor.tsx","../src/components/prompt-editor-with-variables/index.tsx","../src/components/type-selector/index.tsx","../src/components/variable-selector/context.tsx","../src/components/variable-selector/index.tsx","../src/components/variable-selector/styles.tsx","../src/components/variable-selector/use-variable-tree.tsx","../src/effects/index.ts","../src/effects/auto-rename-ref/index.ts","../src/effects/listen-ref-schema-change/index.ts","../src/effects/listen-ref-value-change/index.ts","../src/effects/provide-batch-input/index.ts","../src/effects/provide-json-schema-outputs/index.ts","../src/effects/sync-variable-title/index.ts","../src/effects/validate-when-variable-sync/index.ts","../src/form-plugins/index.ts","../src/form-plugins/batch-outputs-plugin/index.ts","../src/form-plugins/infer-assign-plugin/index.ts","../src/form-plugins/infer-inputs-plugin/index.ts","../src/hooks/index.ts","../src/hooks/use-object-list/index.tsx","../src/plugins/index.ts","../src/plugins/disable-declaration-plugin/create-disable-declaration-plugin.ts","../src/plugins/disable-declaration-plugin/index.tsx","../src/plugins/json-schema-preset/create-type-preset-plugin.tsx","../src/plugins/json-schema-preset/index.tsx","../src/plugins/json-schema-preset/manager.ts","../src/plugins/json-schema-preset/type-definition/array.tsx","../src/plugins/json-schema-preset/type-definition/boolean.tsx","../src/plugins/json-schema-preset/type-definition/date-time.tsx","../src/plugins/json-schema-preset/type-definition/index.tsx","../src/plugins/json-schema-preset/type-definition/integer.tsx","../src/plugins/json-schema-preset/type-definition/number.tsx","../src/plugins/json-schema-preset/type-definition/object.tsx","../src/plugins/json-schema-preset/type-definition/string.tsx","../src/shared/index.ts","../src/shared/flow-value/index.ts","../src/shared/flow-value/schema.ts","../src/shared/flow-value/types.ts","../src/shared/flow-value/utils.ts","../src/shared/format-legacy-refs/index.ts","../src/shared/inject-material/index.tsx","../src/shared/lazy-suspense/index.tsx","../src/shared/polyfill-create-root/index.tsx","../src/validate/index.ts","../src/validate/validate-flow-value/index.tsx"],"version":"5.8.3"}

package/dist/types/components/blur-input/index.d.ts

@@ -1,7 +1,13 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
 /**
  * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
  * SPDX-License-Identifier: MIT
  */
 import React from 'react';
-import { InputProps } from '@douyinfe/semi-ui/lib/es/input';
+import { Input } from '@douyinfe/semi-ui';
+type InputProps = React.ComponentPropsWithoutRef<typeof Input>;
 export declare function BlurInput(props: InputProps): React.JSX.Element;
+export {};

package/dist/types/components/{prompt-editor-with-inputs/inputs-picker.d.ts → coze-editor-extensions/extensions/inputs-tree.d.ts}

@@ -3,7 +3,12 @@
  * SPDX-License-Identifier: MIT
  */
 import React from 'react';
+import { IFlowValue } from '../../../shared';
 export declare function InputsPicker({ inputsValues, onSelect, }: {
     inputsValues: any;
     onSelect: (v: string) => void;
 }): React.JSX.Element;
+export declare function InputsTree({ inputsValues, triggerCharacters, }: {
+    inputsValues: Record<string, IFlowValue>;
+    triggerCharacters?: string[];
+}): React.JSX.Element;

package/dist/types/components/{prompt-editor-with-variables → coze-editor-extensions}/extensions/variable-tree.d.ts

@@ -3,4 +3,6 @@
  * SPDX-License-Identifier: MIT
  */
 import React from 'react';
-export declare function VariableTree(): React.JSX.Element;
+export declare function VariableTree({ triggerCharacters, }: {
+    triggerCharacters?: string[];
+}): React.JSX.Element;

package/dist/types/components/coze-editor-extensions/index.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+export declare const EditorVariableTree: import("react").FC<{
+    triggerCharacters?: string[];
+}> & {
+    renderKey?: string;
+};
+export declare const EditorVariableTagInject: import("react").FC<unknown> & {
+    renderKey?: string;
+};
+export declare const EditorInputsTree: import("react").FC<{
+    inputsValues: Record<string, import("../../shared").IFlowValue>;
+    triggerCharacters?: string[];
+}> & {
+    renderKey?: string;
+};

package/dist/types/components/dynamic-value-input/index.d.ts

@@ -23,5 +23,7 @@ export declare function DynamicValueInput({ value, onChange, readonly, style, sc
 export declare namespace DynamicValueInput {
     var renderKey: string;
 }
-export declare const InjectDynamicValueInput: React.FC<PropsType>;
+export declare const InjectDynamicValueInput: React.FC<PropsType> & {
+    renderKey?: string;
+};
 export {};

package/dist/types/components/index.d.ts

@@ -11,6 +11,7 @@ export { CodeEditor, type CodeEditorPropsType } from './code-editor';
 export { CodeEditorMini } from './code-editor-mini';
 export { ConditionRow, type ConditionRowValueType } from './condition-row';
 export { ConstantInput, type ConstantInputStrategy } from './constant-input';
+export { EditorVariableTagInject, EditorVariableTree, EditorInputsTree, } from './coze-editor-extensions';
 export { DBConditionRow, type DBConditionOptionType, type DBConditionRowValueType, } from './db-condition-row';
 export { DisplayFlowValue } from './display-flow-value';
 export { DisplayInputsValueAllInTag, DisplayInputsValues } from './display-inputs-values';

package/dist/types/components/type-selector/index.d.ts

@@ -20,4 +20,6 @@ export declare function TypeSelector(props: TypeSelectorProps): React.JSX.Elemen
 export declare namespace TypeSelector {
     var renderKey: string;
 }
-export declare const InjectTypeSelector: React.FC<TypeSelectorProps>;
+export declare const InjectTypeSelector: React.FC<TypeSelectorProps> & {
+    renderKey?: string;
+};

package/dist/types/components/variable-selector/index.d.ts

@@ -25,5 +25,7 @@ export declare const VariableSelector: {
     ({ value, config, onChange, style, readonly, includeSchema, excludeSchema, hasError, triggerRender, }: VariableSelectorProps): React.JSX.Element;
     renderKey: string;
 };
-export declare const InjectVariableSelector: React.FC<VariableSelectorProps>;
+export declare const InjectVariableSelector: React.FC<VariableSelectorProps> & {
+    renderKey?: string;
+};
 export { VariableSelectorProvider } from './context';

package/dist/types/index.d.ts

@@ -2,7 +2,7 @@
  * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
  * SPDX-License-Identifier: MIT
  */
-export { AssignRow, AssignRows, BatchOutputs, BatchVariableSelector, BlurInput, CodeEditor, CodeEditorMini, ConditionRow, ConstantInput, DBConditionRow, DisplayFlowValue, DisplayInputsValueAllInTag, DisplayInputsValues, DisplayOutputs, DisplaySchemaTag, DisplaySchemaTree, DynamicValueInput, InjectDynamicValueInput, InjectTypeSelector, InjectVariableSelector, InputsValues, InputsValuesTree, JsonEditorWithVariables, JsonSchemaEditor, PromptEditor, PromptEditorWithInputs, PromptEditorWithVariables, TypeSelector, VariableSelector, VariableSelectorProvider, getTypeSelectValue, parseTypeSelectValue, type AssignValueType, type CodeEditorPropsType, type ConditionRowValueType, type ConstantInputStrategy, type DBConditionOptionType, type DBConditionRowValueType, type JsonEditorWithVariablesProps, type PromptEditorPropsType, type PromptEditorWithInputsProps, type PromptEditorWithVariablesProps, type TypeSelectorProps, type VariableSelectorProps, useVariableTree, } from './components';
+export { AssignRow, AssignRows, BatchOutputs, BatchVariableSelector, BlurInput, CodeEditor, CodeEditorMini, ConditionRow, ConstantInput, DBConditionRow, DisplayFlowValue, DisplayInputsValueAllInTag, DisplayInputsValues, DisplayOutputs, DisplaySchemaTag, DisplaySchemaTree, DynamicValueInput, InjectDynamicValueInput, InjectTypeSelector, InjectVariableSelector, InputsValues, InputsValuesTree, JsonEditorWithVariables, JsonSchemaEditor, PromptEditor, PromptEditorWithInputs, PromptEditorWithVariables, TypeSelector, VariableSelector, VariableSelectorProvider, EditorVariableTagInject, EditorVariableTree, EditorInputsTree, getTypeSelectValue, parseTypeSelectValue, type AssignValueType, type CodeEditorPropsType, type ConditionRowValueType, type ConstantInputStrategy, type DBConditionOptionType, type DBConditionRowValueType, type JsonEditorWithVariablesProps, type PromptEditorPropsType, type PromptEditorWithInputsProps, type PromptEditorWithVariablesProps, type TypeSelectorProps, type VariableSelectorProps, useVariableTree, } from './components';
 export { autoRenameRefEffect, listenRefSchemaChange, listenRefValueChange, provideBatchInputEffect, provideJsonSchemaOutputs, syncVariableTitle, validateWhenVariableSync, } from './effects';
 export { createBatchOutputsFormPlugin, createInferAssignPlugin, createInferInputsPlugin, provideBatchOutputsEffect, } from './form-plugins';
 export { useObjectList } from './hooks';

package/dist/types/shared/inject-material/index.d.ts

@@ -3,6 +3,9 @@
  * SPDX-License-Identifier: MIT
  */
 import React from 'react';
+type WithRenderKey<T> = T & {
+    renderKey?: string;
+};
 /**
  * Creates a material component wrapper with dependency injection support
  *
@@ -39,8 +42,7 @@ import React from 'react';
  * @param params.renderKey - Custom render key name, highest priority
  * @returns Wrapper component with dependency injection support
  */
-export declare function createInjectMaterial<Props>(Component: React.FC<Props> & {
-    renderKey?: string;
-}, params?: {
+export declare function createInjectMaterial<Props>(Component: WithRenderKey<React.FC<Props> | React.ExoticComponent<Props>>, params?: {
     renderKey?: string;
-}): React.FC<Props>;
+}): WithRenderKey<React.FC<Props>>;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flowgram.ai/form-materials",
-  "version": "0.4.10",
+  "version": "0.4.11",
   "homepage": "https://flowgram.ai/",
   "repository": "https://github.com/bytedance/flowgram.ai",
   "license": "MIT",
@@ -30,9 +30,9 @@
     "@codemirror/view": "~6.38.0",
     "@codemirror/state": "~6.5.2",
     "zod": "^3.24.4",
-    "@flowgram.ai/editor": "0.4.10",
-    "@flowgram.ai/json-schema": "0.4.10",
-    "@flowgram.ai/coze-editor": "0.4.10"
+    "@flowgram.ai/json-schema": "0.4.11",
+    "@flowgram.ai/coze-editor": "0.4.11",
+    "@flowgram.ai/editor": "0.4.11"
   },
   "devDependencies": {
     "@types/lodash-es": "^4.17.12",
@@ -48,9 +48,10 @@
     "typescript": "^5.8.3",
     "vitest": "^0.34.6",
     "@rslib/core": "~0.12.4",
+    "cross-env": "~7.0.3",
     "@rsbuild/plugin-react": "^1.1.1",
-    "@flowgram.ai/eslint-config": "0.4.10",
-    "@flowgram.ai/ts-config": "0.4.10"
+    "@flowgram.ai/eslint-config": "0.4.11",
+    "@flowgram.ai/ts-config": "0.4.11"
   },
   "peerDependencies": {
     "react": ">=16.8",
@@ -62,9 +63,9 @@
     "registry": "https://registry.npmjs.org/"
   },
   "scripts": {
-    "build": "rslib build",
-    "build:fast": "rslib build",
-    "build:watch": "rslib build",
+    "build": "cross-env NODE_ENV=production rslib build",
+    "build:fast": "cross-env NODE_ENV=development rslib build",
+    "build:watch": "npm run build:fast",
     "name-export": "node scripts/name-export.js",
     "clean": "rimraf dist",
     "test": "exit 0",

package/src/components/blur-input/index.tsx

@@ -3,9 +3,17 @@
  * SPDX-License-Identifier: MIT
  */
 
+/* eslint-disable react/prop-types */
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 import React, { useEffect, useState } from 'react';
 
-import Input, { InputProps } from '@douyinfe/semi-ui/lib/es/input';
+import { Input } from '@douyinfe/semi-ui';
+
+type InputProps = React.ComponentPropsWithoutRef<typeof Input>;
 
 export function BlurInput(props: InputProps) {
   const [value, setValue] = useState('');

package/src/components/{prompt-editor-with-inputs/inputs-picker.tsx → coze-editor-extensions/extensions/inputs-tree.tsx}

@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: MIT
  */
 
-import React, { useMemo } from 'react';
+import React, { useMemo, useEffect, useState } from 'react';
 
 import { isPlainObject, last } from 'lodash-es';
 import {
@@ -13,10 +13,18 @@ import {
   type BaseVariableField,
   useScopeAvailable,
 } from '@flowgram.ai/editor';
-import { TreeNodeData } from '@douyinfe/semi-ui/lib/es/tree';
-import { Tree } from '@douyinfe/semi-ui';
-
-import { FlowValueUtils } from '@/shared';
+import {
+  Mention,
+  MentionOpenChangeEvent,
+  getCurrentMentionReplaceRange,
+  useEditor,
+  PositionMirror,
+} from '@flowgram.ai/coze-editor/react';
+import { EditorAPI } from '@flowgram.ai/coze-editor/preset-prompt';
+import { type TreeNodeData } from '@douyinfe/semi-ui/lib/es/tree';
+import { Tree, Popover } from '@douyinfe/semi-ui';
+
+import { IFlowValue, FlowValueUtils } from '@/shared';
 
 type VariableField = BaseVariableField<{ icon?: string | JSX.Element; title?: string }>;
 
@@ -115,3 +123,85 @@ export function InputsPicker({
 
   return <Tree treeData={treeData} onSelect={(v) => onSelect(v)} />;
 }
+
+const DEFAULT_TRIGGER_CHARACTERS = ['{', '{}', '@'];
+
+export function InputsTree({
+  inputsValues,
+  triggerCharacters = DEFAULT_TRIGGER_CHARACTERS,
+}: {
+  inputsValues: Record<string, IFlowValue>;
+  triggerCharacters?: string[];
+}) {
+  const [posKey, setPosKey] = useState('');
+  const [visible, setVisible] = useState(false);
+  const [position, setPosition] = useState(-1);
+  const editor = useEditor<EditorAPI>();
+
+  function insert(variablePath: string) {
+    const range = getCurrentMentionReplaceRange(editor.$view.state);
+
+    if (!range) {
+      return;
+    }
+
+    /**
+     * When user input {{xxxx}}, {{{xxx}}}(more brackets if possible), replace all brackets with {{xxxx}}
+     */
+    let { from, to } = range;
+    while (editor.$view.state.doc.sliceString(from - 1, from) === '{') {
+      from--;
+    }
+    while (editor.$view.state.doc.sliceString(to, to + 1) === '}') {
+      to++;
+    }
+
+    editor.replaceText({
+      ...range,
+      text: '{{' + variablePath + '}}',
+    });
+
+    setVisible(false);
+  }
+
+  function handleOpenChange(e: MentionOpenChangeEvent) {
+    setPosition(e.state.selection.main.head);
+    setVisible(e.value);
+  }
+
+  useEffect(() => {
+    if (!editor) {
+      return;
+    }
+  }, [editor, visible]);
+
+  return (
+    <>
+      <Mention triggerCharacters={triggerCharacters} onOpenChange={handleOpenChange} />
+
+      <Popover
+        visible={visible}
+        trigger="custom"
+        position="topLeft"
+        rePosKey={posKey}
+        content={
+          <div style={{ width: 300, maxHeight: 300, overflowY: 'auto' }}>
+            <InputsPicker
+              inputsValues={inputsValues}
+              onSelect={(v) => {
+                insert(v);
+              }}
+            />
+          </div>
+        }
+      >
+        {/* PositionMirror allows the Popover to appear at the specified cursor position */}
+        <PositionMirror
+          position={position}
+          // When Doc scroll, update position
+          onChange={() => setPosKey(String(Math.random()))}
+        />
+      </Popover>
+    </>
+  );
+}

package/src/components/{prompt-editor-with-variables → coze-editor-extensions}/extensions/variable-tree.tsx

@@ -17,7 +17,13 @@ import { Popover, Tree } from '@douyinfe/semi-ui';
 
 import { useVariableTree } from '@/components/variable-selector';
 
-export function VariableTree() {
+const DEFAULT_TRIGGER_CHARACTER = ['{', '{}', '@'];
+
+export function VariableTree({
+  triggerCharacters = DEFAULT_TRIGGER_CHARACTER,
+}: {
+  triggerCharacters?: string[];
+}) {
   const [posKey, setPosKey] = useState('');
   const [visible, setVisible] = useState(false);
   const [position, setPosition] = useState(-1);
@@ -65,7 +71,7 @@ export function VariableTree() {
 
   return (
     <>
-      <Mention triggerCharacters={['{', '{}', '@']} onOpenChange={handleOpenChange} />
+      <Mention triggerCharacters={triggerCharacters} onOpenChange={handleOpenChange} />
 
       <Popover
         visible={visible}
@@ -73,7 +79,7 @@ export function VariableTree() {
         position="topLeft"
         rePosKey={posKey}
         content={
-          <div style={{ width: 300 }}>
+          <div style={{ width: 300, maxHeight: 300, overflowY: 'auto' }}>
             <Tree
               treeData={treeData}
               onSelect={(v) => {

package/src/components/coze-editor-extensions/index.tsx

@@ -0,0 +1,33 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { lazy } from 'react';
+
+import { createInjectMaterial } from '@/shared';
+
+export const EditorVariableTree = createInjectMaterial(
+  lazy(() =>
+    import('./extensions/variable-tree').then((module) => ({ default: module.VariableTree }))
+  ),
+  {
+    renderKey: 'EditorVariableTree',
+  }
+);
+
+export const EditorVariableTagInject = createInjectMaterial(
+  lazy(() =>
+    import('./extensions/variable-tag').then((module) => ({ default: module.VariableTagInject }))
+  ),
+  {
+    renderKey: 'EditorVariableTagInject',
+  }
+);
+
+export const EditorInputsTree = createInjectMaterial(
+  lazy(() => import('./extensions/inputs-tree').then((module) => ({ default: module.InputsTree }))),
+  {
+    renderKey: 'EditorInputsTree',
+  }
+);

package/src/components/index.ts

@@ -12,6 +12,11 @@ export { CodeEditor, type CodeEditorPropsType } from './code-editor';
 export { CodeEditorMini } from './code-editor-mini';
 export { ConditionRow, type ConditionRowValueType } from './condition-row';
 export { ConstantInput, type ConstantInputStrategy } from './constant-input';
+export {
+  EditorVariableTagInject,
+  EditorVariableTree,
+  EditorInputsTree,
+} from './coze-editor-extensions';
 export {
   DBConditionRow,
   type DBConditionOptionType,

package/src/components/json-editor-with-variables/editor.tsx

@@ -9,10 +9,10 @@ import { I18n } from '@flowgram.ai/editor';
 import { transformerCreator } from '@flowgram.ai/coze-editor/preset-code';
 import { Text } from '@flowgram.ai/coze-editor/language-json';
 
+import { EditorVariableTree, EditorVariableTagInject } from '@/components/coze-editor-extensions';
 import { CodeEditor, type CodeEditorPropsType } from '@/components/code-editor';
 
-import { VariableTree } from './extensions/variable-tree';
-import { VariableTagInject } from './extensions/variable-tag';
+const TRIGGER_CHARACTERS = ['@'];
 
 type Match = { match: string; range: [number, number] };
 function findAllMatches(inputString: string, regex: RegExp): Match[] {
@@ -62,8 +62,8 @@ export function JsonEditorWithVariables(props: JsonEditorWithVariablesProps) {
         ...(props.options || {}),
       }}
     >
-      <VariableTree />
-      <VariableTagInject />
+      <EditorVariableTree triggerCharacters={TRIGGER_CHARACTERS} />
+      <EditorVariableTagInject />
     </CodeEditor>
   );
 }

package/src/components/prompt-editor-with-inputs/editor.tsx

@@ -6,8 +6,7 @@
 import React from 'react';
 
 import { PromptEditor, PromptEditorPropsType } from '@/components/prompt-editor';
-
-import { InputsTree } from './extensions/inputs-tree';
+import { EditorInputsTree } from '@/components/coze-editor-extensions';
 
 export interface PromptEditorWithInputsProps extends PromptEditorPropsType {
   inputsValues: any;
@@ -19,7 +18,7 @@ export function PromptEditorWithInputs({
 }: PromptEditorWithInputsProps) {
   return (
     <PromptEditor {...restProps}>
-      <InputsTree inputsValues={inputsValues} />
+      <EditorInputsTree inputsValues={inputsValues} />
     </PromptEditor>
   );
 }