@flowgram.ai/form-materials 0.1.0-alpha.12 → 0.1.0-alpha.14

package/dist/esm/index.js

@@ -1,750 +1,38 @@
-// src/components/variable-selector/index.tsx
-import React11, { useMemo } from "react";
-import { Popover } from "@douyinfe/semi-ui";
-import { IconChevronDownStroked, IconIssueStroked } from "@douyinfe/semi-icons";
-
-// src/components/variable-selector/use-variable-tree.tsx
-import React10, { useCallback } from "react";
-import { JsonSchemaUtils as JsonSchemaUtils2 } from "@flowgram.ai/json-schema";
-import { ASTMatch as ASTMatch2, useAvailableVariables } from "@flowgram.ai/editor";
-import { Icon } from "@douyinfe/semi-ui";
-
-// src/plugins/json-schema-preset/index.tsx
-import React9 from "react";
-import {
-  JsonSchemaUtils,
-  useTypeManager as useOriginTypeManager,
-  TypePresetProvider as OriginTypePresetProvider
-} from "@flowgram.ai/json-schema";
-
-// src/plugins/json-schema-preset/type-definition/index.tsx
-import { jsonSchemaTypeManager } from "@flowgram.ai/json-schema";
-
-// src/plugins/json-schema-preset/type-definition/string.tsx
-import React from "react";
-import { Input } from "@douyinfe/semi-ui";
-var stringRegistry = {
-  type: "string",
-  ConstantRenderer: (props) => /* @__PURE__ */ React.createElement(Input, { placeholder: "Please Input String", size: "small", disabled: props.readonly, ...props })
-};
-
-// src/plugins/json-schema-preset/type-definition/object.tsx
-import React4 from "react";
-
-// src/components/code-editor-mini/index.tsx
-import React3 from "react";
-import styled from "styled-components";
-
-// src/components/code-editor/index.tsx
-import React2, { useEffect, useRef } from "react";
 import {
-  ActiveLinePlaceholder,
-  createRenderer,
-  EditorProvider
-} from "@coze-editor/editor/react";
-import preset from "@coze-editor/editor/preset-code";
-import { EditorView } from "@codemirror/view";
-
-// src/components/code-editor/utils.ts
-function getSuffixByLanguageId(languageId) {
-  if (languageId === "python") {
-    return ".py";
-  }
-  if (languageId === "typescript") {
-    return ".ts";
-  }
-  if (languageId === "shell") {
-    return ".sh";
-  }
-  if (languageId === "json") {
-    return ".json";
-  }
-  return "";
-}
-
-// src/components/code-editor/language-features.ts
-import { languages } from "@coze-editor/editor/preset-code";
-import { typescript } from "@coze-editor/editor/language-typescript";
-import { shell } from "@coze-editor/editor/language-shell";
-import { python } from "@coze-editor/editor/language-python";
-import { json } from "@coze-editor/editor/language-json";
-import { mixLanguages } from "@coze-editor/editor";
-languages.register("python", python);
-languages.register("shell", shell);
-languages.register("typescript", typescript);
-languages.register("json", {
-  // mixLanguages is used to solve the problem that interpolation also uses parentheses, which causes incorrect highlighting
-  language: mixLanguages({
-    outerLanguage: json.language
-  }),
-  languageService: json.languageService
-});
-var tsWorkerInit = false;
-var initTsWorker = () => {
-  if (tsWorkerInit) {
-    return;
-  }
-  tsWorkerInit = true;
-  const tsWorker = new Worker(
-    new URL(`@coze-editor/editor/language-typescript/worker`, import.meta.url),
-    { type: "module" }
-  );
-  typescript.languageService.initialize(tsWorker, {
-    compilerOptions: {
-      // eliminate Promise error
-      lib: ["es2015", "dom"],
-      noImplicitAny: false
-    }
-  });
-};
-
-// src/components/code-editor/theme/index.ts
-import { themes } from "@coze-editor/editor/preset-code";
-
-// src/components/code-editor/theme/light.ts
-import { createTheme, tags as t } from "@coze-editor/editor/preset-code";
-var colors = {
-  background: "#F7F7FC",
-  // syntax
-  comment: "#000A298A",
-  key: "#00818C",
-  string: "#D1009D",
-  number: "#C74200",
-  boolean: "#2B57D9",
-  null: "#2B57D9",
-  separator: "#0F1529D1"
-};
-var lightTheme = createTheme({
-  variant: "light",
-  settings: {
-    background: "#fff",
-    foreground: "#000",
-    caret: "#000",
-    selection: "#d9d9d9",
-    gutterBackground: "#f0f0f0",
-    gutterForeground: "#666",
-    gutterBorderColor: "transparent",
-    gutterBorderWidth: 0,
-    lineHighlight: "#e1e1e180",
-    bracketColors: ["#FFD700", "#DD99FF", "#78B0FF"],
-    tooltip: {
-      backgroundColor: "#f0f0f0",
-      color: "#000",
-      border: "1px solid #ccc"
-    },
-    link: {
-      color: "#007bff"
-    },
-    completionItemHover: {
-      backgroundColor: "#f0f0f0"
-    },
-    completionItemSelected: {
-      backgroundColor: "#e0e0e0"
-    },
-    completionItemIcon: {
-      color: "#333"
-    },
-    completionItemLabel: {
-      color: "#333"
-    },
-    completionItemInfo: {
-      color: "#333"
-    },
-    completionItemDetail: {
-      color: "#666"
-    }
-  },
-  styles: [
-    // JSON
-    {
-      tag: t.comment,
-      color: colors.comment
-    },
-    {
-      tag: [t.propertyName],
-      color: colors.key
-    },
-    {
-      tag: [t.string],
-      color: colors.string
-    },
-    {
-      tag: [t.number],
-      color: colors.number
-    },
-    {
-      tag: [t.bool],
-      color: colors.boolean
-    },
-    {
-      tag: [t.null],
-      color: colors.null
-    },
-    {
-      tag: [t.separator],
-      color: colors.separator
-    },
-    // markdown
-    {
-      tag: [t.heading],
-      color: "#3e76ef"
-    },
-    {
-      tag: [t.processingInstruction],
-      color: "#3e76ef"
-    },
-    // shell
-    // curl
-    {
-      tag: [t.standard(t.variableName)],
-      color: "#00804A"
-    },
-    // -X
-    {
-      tag: [t.attributeName],
-      color: "#C74200"
-    },
-    // url in string (includes quotes), e.g. "https://..."
-    {
-      tag: [t.special(t.string)],
-      color: "#2B57D9"
-    }
-  ]
-});
-
-// src/components/code-editor/theme/dark.ts
-import { createTheme as createTheme2, tags as t2 } from "@coze-editor/editor/preset-code";
-var colors2 = {
-  background: "#151B27",
-  // syntax
-  comment: "#FFFFFF63",
-  key: "#39E5D7",
-  string: "#FF94D2",
-  number: "#FF9933",
-  boolean: "#78B0FF",
-  null: "#78B0FF",
-  separator: "#FFFFFFC9"
-};
-var darkTheme = createTheme2({
-  variant: "dark",
-  settings: {
-    background: colors2.background,
-    foreground: "#fff",
-    caret: "#AEAFAD",
-    selection: "#d9d9d942",
-    gutterBackground: colors2.background,
-    gutterForeground: "#FFFFFF63",
-    gutterBorderColor: "transparent",
-    gutterBorderWidth: 0,
-    lineHighlight: "#272e3d36",
-    bracketColors: ["#FFEF61", "#DD99FF", "#78B0FF"],
-    tooltip: {
-      backgroundColor: "#363D4D",
-      color: "#fff",
-      border: "none"
-    },
-    link: {
-      color: "#4daafc"
-    },
-    completionItemHover: {
-      backgroundColor: "#FFFFFF0F"
-    },
-    completionItemSelected: {
-      backgroundColor: "#FFFFFF17"
-    },
-    completionItemIcon: {
-      color: "#FFFFFFC9"
-    },
-    completionItemLabel: {
-      color: "#FFFFFFC9"
-    },
-    completionItemInfo: {
-      color: "#FFFFFFC9"
-    },
-    completionItemDetail: {
-      color: "#FFFFFF63"
-    }
-  },
-  styles: [
-    // json
-    {
-      tag: t2.comment,
-      color: colors2.comment
-    },
-    {
-      tag: [t2.propertyName],
-      color: colors2.key
-    },
-    {
-      tag: [t2.string],
-      color: colors2.string
-    },
-    {
-      tag: [t2.number],
-      color: colors2.number
-    },
-    {
-      tag: [t2.bool],
-      color: colors2.boolean
-    },
-    {
-      tag: [t2.null],
-      color: colors2.null
-    },
-    {
-      tag: [t2.separator],
-      color: colors2.separator
-    },
-    // markdown
-    {
-      tag: [t2.heading],
-      color: "#6b6bff"
-    },
-    {
-      tag: [t2.processingInstruction],
-      color: "#6b6bff"
-    },
-    // shell
-    // curl
-    {
-      tag: [t2.standard(t2.variableName)],
-      color: "#3BEB84"
-    },
-    // -X
-    {
-      tag: [t2.attributeName],
-      color: "#FF9933"
-    },
-    // url in string (includes quotes), e.g. "https://..."
-    {
-      tag: [t2.special(t2.string)],
-      color: "#78B0FF"
-    }
-  ]
-});
-
-// src/components/code-editor/theme/index.ts
-themes.register("dark", darkTheme);
-themes.register("light", lightTheme);
-
-// src/components/code-editor/index.tsx
-var OriginCodeEditor = createRenderer(preset, [
-  EditorView.theme({
-    "&.cm-focused": {
-      outline: "none"
-    }
-  })
-]);
-function CodeEditor({
-  value,
-  onChange,
-  languageId = "python",
-  theme = "light",
-  children,
-  placeholder,
-  activeLinePlaceholder,
-  options,
-  readonly
-}) {
-  const editorRef = useRef(null);
-  useEffect(() => {
-    if (languageId === "typescript") {
-      initTsWorker();
-    }
-  }, [languageId]);
-  useEffect(() => {
-    if (editorRef.current?.getValue() !== value) {
-      editorRef.current?.setValue(String(value || ""));
-    }
-  }, [value]);
-  return /* @__PURE__ */ React2.createElement(EditorProvider, null, /* @__PURE__ */ React2.createElement(
-    OriginCodeEditor,
-    {
-      defaultValue: value,
-      options: {
-        uri: `file:///untitled${getSuffixByLanguageId(languageId)}`,
-        languageId,
-        theme,
-        placeholder,
-        readOnly: readonly,
-        editable: !readonly,
-        ...options || {}
-      },
-      didMount: (editor) => {
-        editorRef.current = editor;
-      },
-      onChange: (e) => onChange?.(e.value)
-    },
-    activeLinePlaceholder && /* @__PURE__ */ React2.createElement(ActiveLinePlaceholder, null, activeLinePlaceholder),
-    children
-  ));
-}
-
-// src/components/code-editor-mini/index.tsx
-var UIMini = styled.div`
-  .ͼ1 .cm-content {
-    padding: 0;
-  }
-`;
-function CodeEditorMini(props) {
-  return /* @__PURE__ */ React3.createElement(UIMini, null, /* @__PURE__ */ React3.createElement(
-    CodeEditor,
-    {
-      ...props,
-      options: {
-        lineNumbersGutter: false,
-        foldGutter: false,
-        ...props.options || {}
-      }
-    }
-  ));
-}
-
-// src/plugins/json-schema-preset/type-definition/object.tsx
-var objectRegistry = {
-  type: "object",
-  ConstantRenderer: (props) => /* @__PURE__ */ React4.createElement(
-    CodeEditorMini,
-    {
-      value: props.value,
-      onChange: (v) => props.onChange?.(v),
-      languageId: "json",
-      placeholder: "Please Input Object",
-      readonly: props.readonly
-    }
-  )
-};
-
-// src/plugins/json-schema-preset/type-definition/number.tsx
-import React5 from "react";
-import { InputNumber } from "@douyinfe/semi-ui";
-var numberRegistry = {
-  type: "number",
-  ConstantRenderer: (props) => /* @__PURE__ */ React5.createElement(
-    InputNumber,
-    {
-      placeholder: "Please Input Number",
-      size: "small",
-      disabled: props.readonly,
-      hideButtons: true,
-      ...props
-    }
-  )
-};
-
-// src/plugins/json-schema-preset/type-definition/integer.tsx
-import React6 from "react";
-import { InputNumber as InputNumber2 } from "@douyinfe/semi-ui";
-var integerRegistry = {
-  type: "integer",
-  ConstantRenderer: (props) => /* @__PURE__ */ React6.createElement(
-    InputNumber2,
-    {
-      placeholder: "Please Input Integer",
-      size: "small",
-      disabled: props.readonly,
-      precision: 0,
-      ...props
-    }
-  )
-};
-
-// src/plugins/json-schema-preset/type-definition/boolean.tsx
-import React7 from "react";
-import { Select } from "@douyinfe/semi-ui";
-var booleanRegistry = {
-  type: "boolean",
-  ConstantRenderer: (props) => {
-    const { value, onChange, ...rest } = props;
-    return /* @__PURE__ */ React7.createElement(
-      Select,
-      {
-        placeholder: "Please Select Boolean",
-        size: "small",
-        disabled: props.readonly,
-        optionList: [
-          { label: "True", value: 1 },
-          { label: "False", value: 0 }
-        ],
-        value: value ? 1 : 0,
-        onChange: (value2) => onChange?.(!!value2),
-        ...rest
-      }
-    );
-  }
-};
-
-// src/plugins/json-schema-preset/type-definition/array.tsx
-import React8 from "react";
-var arrayRegistry = {
-  type: "array",
-  ConstantRenderer: (props) => /* @__PURE__ */ React8.createElement(
-    CodeEditorMini,
-    {
-      value: props.value,
-      languageId: "json",
-      onChange: (v) => props.onChange?.(v),
-      placeholder: "Please Input Array",
-      readonly: props.readonly
-    }
-  )
-};
-
-// src/plugins/json-schema-preset/type-definition/index.tsx
-var jsonSchemaTypePreset = [
-  stringRegistry,
-  objectRegistry,
-  numberRegistry,
-  integerRegistry,
-  booleanRegistry,
-  arrayRegistry
-];
-jsonSchemaTypePreset.forEach((_type) => jsonSchemaTypeManager.register(_type));
-
-// src/plugins/json-schema-preset/create-type-preset-plugin.tsx
+  PromptEditor
+} from "./chunk-727SU246.js";
 import {
-  BaseTypeManager,
-  jsonSchemaContainerModule
-} from "@flowgram.ai/json-schema";
-import { definePluginCreator } from "@flowgram.ai/editor";
-var createTypePresetPlugin = definePluginCreator({
-  onInit(ctx, opts) {
-    const typeManager = ctx.get(BaseTypeManager);
-    jsonSchemaTypePreset.forEach((_type) => typeManager.register(_type));
-    opts.types?.forEach((_type) => typeManager.register(_type));
-    opts.unregisterTypes?.forEach((_type) => typeManager.unregister(_type));
-  },
-  containerModules: [jsonSchemaContainerModule]
-});
-
-// src/plugins/json-schema-preset/index.tsx
-var useTypeManager = () => useOriginTypeManager();
-var JsonSchemaTypePresetProvider = ({
-  types = [],
-  children
-}) => /* @__PURE__ */ React9.createElement(OriginTypePresetProvider, { types: [...jsonSchemaTypePreset, ...types] }, children);
-
-// src/plugins/disable-declaration-plugin/create-disable-declaration-plugin.ts
+  CodeEditor,
+  CodeEditorMini,
+  InjectVariableSelector,
+  JsonSchemaTypePresetProvider,
+  JsonSchemaUtils,
+  VariableSelector,
+  VariableSelectorProvider,
+  createDisableDeclarationPlugin,
+  createTypePresetPlugin,
+  useTypeManager,
+  useVariableTree
+} from "./chunk-DUOXDOUE.js";
 import {
-  ASTMatch,
-  definePluginCreator as definePluginCreator2,
-  VariableEngine
-} from "@flowgram.ai/editor";
-var createDisableDeclarationPlugin = definePluginCreator2({
-  onInit(ctx) {
-    const variableEngine = ctx.get(VariableEngine);
-    const handleEvent = (action) => {
-      if (ASTMatch.isVariableDeclaration(action.ast)) {
-        if (!action.ast.meta?.disabled) {
-          action.ast.updateMeta({
-            ...action.ast.meta || {},
-            disabled: true
-          });
-        }
-      }
-    };
-    variableEngine.onGlobalEvent("NewAST", handleEvent);
-    variableEngine.onGlobalEvent("UpdateAST", handleEvent);
-  }
-});
-
-// src/components/variable-selector/use-variable-tree.tsx
-function useVariableTree(params) {
-  const { includeSchema, excludeSchema, customSkip } = params;
-  const typeManager = useTypeManager();
-  const variables = useAvailableVariables();
-  const getVariableTypeIcon = useCallback((variable) => {
-    if (variable.meta?.icon) {
-      if (typeof variable.meta.icon === "string") {
-        return /* @__PURE__ */ React10.createElement("img", { style: { marginRight: 8 }, width: 12, height: 12, src: variable.meta.icon });
-      }
-      return variable.meta.icon;
-    }
-    const schema = JsonSchemaUtils2.astToSchema(variable.type, { drilldownObject: false });
-    return /* @__PURE__ */ React10.createElement(Icon, { size: "small", svg: typeManager.getDisplayIcon(schema || {}) });
-  }, []);
-  const renderVariable = (variable, parentFields = []) => {
-    let type = variable?.type;
-    if (!type) {
-      return null;
-    }
-    let children;
-    if (ASTMatch2.isObject(type)) {
-      children = (type.properties || []).map((_property) => renderVariable(_property, [...parentFields, variable])).filter(Boolean);
-    }
-    const keyPath = [...parentFields.map((_field) => _field.key), variable.key];
-    const key = keyPath.join(".");
-    const isSchemaInclude = includeSchema ? JsonSchemaUtils2.isASTMatchSchema(type, includeSchema) : true;
-    const isSchemaExclude = excludeSchema ? JsonSchemaUtils2.isASTMatchSchema(type, excludeSchema) : false;
-    const isCustomSkip = customSkip ? customSkip(variable) : false;
-    const isMetaDisabled = variable.meta?.disabled;
-    const isSchemaMatch = isSchemaInclude && !isSchemaExclude && !isCustomSkip && !isMetaDisabled;
-    if (!isSchemaMatch && !children?.length) {
-      return null;
-    }
-    return {
-      key,
-      label: variable.meta?.title || variable.key,
-      value: key,
-      keyPath,
-      icon: getVariableTypeIcon(variable),
-      children,
-      disabled: !isSchemaMatch,
-      rootMeta: parentFields[0]?.meta || variable.meta,
-      isRoot: !parentFields?.length
-    };
-  };
-  return [...variables.slice(0).reverse()].map((_variable) => renderVariable(_variable)).filter(Boolean);
-}
-
-// src/components/variable-selector/styles.tsx
-import styled2, { css } from "styled-components";
-import { Tag, TreeSelect } from "@douyinfe/semi-ui";
-var UIRootTitle = styled2.div`
-  margin-right: 4px;
-  min-width: 20px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  color: var(--semi-color-text-2);
-`;
-var UIVarName = styled2.div`
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-
-  ${({ $inSelector }) => $inSelector && css`
-      min-width: 50%;
-    `}
-`;
-var UITag = styled2(Tag)`
-  width: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-
-  & .semi-tag-content-center {
-    justify-content: flex-start;
-  }
-
-  &.semi-tag {
-    margin: 0;
-    height: 22px;
-  }
-`;
-var UITreeSelect = styled2(TreeSelect)`
-  outline: ${({ $error }) => $error ? "1px solid red" : "none"};
-
-  & .semi-tree-select-selection {
-    padding: 0px;
-    height: 22px;
-  }
-
-  & .semi-tree-select-selection-content {
-    width: 100%;
-  }
-
-  & .semi-tree-select-selection-placeholder {
-    padding-left: 10px;
-  }
-`;
-var UIPopoverContent = styled2.div`
-  padding: 10px;
-  display: inline-flex;
-  align-items: center;
-  justify-content: flex-start;
-  white-space: nowrap;
-`;
-
-// src/components/variable-selector/index.tsx
-var VariableSelector = ({
-  value,
-  config = {},
-  onChange,
-  style,
-  readonly = false,
-  includeSchema,
-  excludeSchema,
-  hasError,
-  triggerRender
-}) => {
-  const treeData = useVariableTree({ includeSchema, excludeSchema });
-  const treeValue = useMemo(() => {
-    if (typeof value === "string") {
-      console.warn(
-        "The Value of VariableSelector is a string, it should be an ARRAY. \n",
-        "Please check the value of VariableSelector \n"
-      );
-      return value;
-    }
-    return value?.join(".");
-  }, [value]);
-  const renderIcon = (icon) => {
-    if (typeof icon === "string") {
-      return /* @__PURE__ */ React11.createElement("img", { style: { marginRight: 8 }, width: 12, height: 12, src: icon });
-    }
-    return icon;
-  };
-  return /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(
-    UITreeSelect,
-    {
-      dropdownMatchSelectWidth: false,
-      disabled: readonly,
-      treeData,
-      size: "small",
-      value: treeValue,
-      clearIcon: null,
-      $error: hasError,
-      style,
-      validateStatus: hasError ? "error" : void 0,
-      onChange: (_, _config) => {
-        onChange(_config.keyPath);
-      },
-      renderSelectedItem: (_option) => {
-        if (!_option?.keyPath) {
-          return /* @__PURE__ */ React11.createElement(
-            UITag,
-            {
-              prefixIcon: /* @__PURE__ */ React11.createElement(IconIssueStroked, null),
-              color: "amber",
-              closable: !readonly,
-              onClose: () => onChange(void 0)
-            },
-            config?.notFoundContent ?? "Undefined"
-          );
-        }
-        const rootIcon = renderIcon(_option.rootMeta?.icon || _option?.icon);
-        const rootTitle = /* @__PURE__ */ React11.createElement(UIRootTitle, null, _option.rootMeta?.title ? `${_option.rootMeta?.title} ${_option.isRoot ? "" : "-"} ` : null);
-        return /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement(
-          Popover,
-          {
-            content: /* @__PURE__ */ React11.createElement(UIPopoverContent, null, rootIcon, rootTitle, /* @__PURE__ */ React11.createElement(UIVarName, null, _option.keyPath.slice(1).join(".")))
-          },
-          /* @__PURE__ */ React11.createElement(
-            UITag,
-            {
-              prefixIcon: rootIcon,
-              closable: !readonly,
-              onClose: () => onChange(void 0)
-            },
-            rootTitle,
-            !_option.isRoot && /* @__PURE__ */ React11.createElement(UIVarName, { $inSelector: true }, _option.label)
-          )
-        ));
-      },
-      showClear: false,
-      arrowIcon: /* @__PURE__ */ React11.createElement(IconChevronDownStroked, { size: "small" }),
-      triggerRender,
-      placeholder: config?.placeholder ?? "Select Variable"
-    }
-  ));
-};
+  FlowValueUtils,
+  createInjectMaterial,
+  formatLegacyRefOnInit,
+  formatLegacyRefOnSubmit,
+  formatLegacyRefToNewRef,
+  formatNewRefToLegacyRef,
+  isLegacyFlowRefValueSchema,
+  isNewFlowRefValueSchema,
+  lazySuspense,
+  polyfillCreateRoot,
+  unstableSetCreateRoot,
+  withSuspense
+} from "./chunk-DEZUEMUM.js";
 
 // src/components/type-selector/index.tsx
-import React12, { useMemo as useMemo2 } from "react";
-import { Cascader, Icon as Icon2, IconButton } from "@douyinfe/semi-ui";
+import React, { useMemo } from "react";
+import { Cascader, Icon, IconButton } from "@douyinfe/semi-ui";
 var labelStyle = { display: "flex", alignItems: "center", gap: 5 };
-var firstUppercase = (str) => str.charAt(0).toUpperCase() + str.slice(1);
 var getTypeSelectValue = (value) => {
   if (value?.type === "array" && value?.items) {
     return [value.type, ...getTypeSelectValue(value.items) || []];
@@ -760,18 +48,18 @@ var parseTypeSelectValue = (value) => {
 };
 function TypeSelector(props) {
   const { value, onChange, readonly, disabled, style } = props;
-  const selectValue = useMemo2(() => getTypeSelectValue(value), [value]);
+  const selectValue = useMemo(() => getTypeSelectValue(value), [value]);
   const typeManager = useTypeManager();
   const icon = typeManager.getDisplayIcon(value || {});
-  const options = useMemo2(
+  const options = useMemo(
     () => typeManager.getTypeRegistriesWithParentType().map((_type) => {
-      const isArray2 = _type.type === "array";
+      const isArray = _type.type === "array";
       return {
-        label: /* @__PURE__ */ React12.createElement("div", { style: labelStyle }, /* @__PURE__ */ React12.createElement(Icon2, { size: "small", svg: _type.icon }), firstUppercase(_type.type)),
+        label: /* @__PURE__ */ React.createElement("div", { style: labelStyle }, /* @__PURE__ */ React.createElement(Icon, { size: "small", svg: _type.icon }), typeManager.getTypeBySchema(_type)?.label || _type.type),
         value: _type.type,
-        children: isArray2 ? typeManager.getTypeRegistriesWithParentType("array").map((_type2) => ({
-          label: /* @__PURE__ */ React12.createElement("div", { style: labelStyle }, /* @__PURE__ */ React12.createElement(
-            Icon2,
+        children: isArray ? typeManager.getTypeRegistriesWithParentType("array").map((_type2) => ({
+          label: /* @__PURE__ */ React.createElement("div", { style: labelStyle }, /* @__PURE__ */ React.createElement(
+            Icon,
             {
               size: "small",
               svg: typeManager.getDisplayIcon({
@@ -779,19 +67,31 @@ function TypeSelector(props) {
                 items: { type: _type2.type }
               })
             }
-          ), firstUppercase(_type2.type)),
+          ), typeManager.getTypeBySchema(_type2)?.label || _type2.type),
           value: _type2.type
         })) : []
       };
     }),
     []
   );
-  return /* @__PURE__ */ React12.createElement(
+  const isDisabled = readonly || disabled;
+  return /* @__PURE__ */ React.createElement(
     Cascader,
     {
-      disabled: readonly || disabled,
+      disabled: isDisabled,
       size: "small",
-      triggerRender: () => /* @__PURE__ */ React12.createElement(IconButton, { size: "small", style, disabled: readonly || disabled, icon }),
+      triggerRender: () => /* @__PURE__ */ React.createElement(
+        IconButton,
+        {
+          size: "small",
+          style: {
+            ...isDisabled ? { pointerEvents: "none" } : {},
+            ...style || {}
+          },
+          disabled: isDisabled,
+          icon
+        }
+      ),
       treeData: options,
       value: selectValue,
       leafOnly: true,
@@ -801,10 +101,13 @@ function TypeSelector(props) {
     }
   );
 }
+TypeSelector.renderKey = "type-selector-render-key";
+var InjectTypeSelector = createInjectMaterial(TypeSelector);
 
 // src/components/json-schema-editor/index.tsx
-import React17, { useMemo as useMemo5, useState as useState4 } from "react";
-import { Button, Checkbox, IconButton as IconButton3 } from "@douyinfe/semi-ui";
+import React6, { useMemo as useMemo3, useState as useState3 } from "react";
+import { I18n as I18n2 } from "@flowgram.ai/editor";
+import { Button, Checkbox, IconButton as IconButton2 } from "@douyinfe/semi-ui";
 import {
   IconExpand,
   IconShrink,
@@ -814,62 +117,81 @@ import {
   IconMinus
 } from "@douyinfe/semi-icons";
 
-// src/components/json-schema-editor/styles.tsx
-import React13 from "react";
-import styled3, { css as css2 } from "styled-components";
-import Icon3 from "@douyinfe/semi-icons";
-var UIContainer = styled3.div`
+// src/components/blur-input/index.tsx
+import React2, { useEffect, useState } from "react";
+import Input from "@douyinfe/semi-ui/lib/es/input";
+function BlurInput(props) {
+  const [value, setValue] = useState("");
+  useEffect(() => {
+    setValue(props.value);
+  }, [props.value]);
+  return /* @__PURE__ */ React2.createElement(
+    Input,
+    {
+      ...props,
+      value,
+      onChange: (value2) => {
+        setValue(value2);
+      },
+      onBlur: (e) => props.onChange?.(value, e)
+    }
+  );
+}
+
+// src/components/json-schema-editor/styles.tsx
+import React3 from "react";
+import styled, { css } from "styled-components";
+import Icon2 from "@douyinfe/semi-icons";
+var UIContainer = styled.div`
   /* & .semi-input {
     background-color: #fff;
     border-radius: 6px;
     height: 24px;
   } */
 `;
-var UIRow = styled3.div`
+var UIRow = styled.div`
   display: flex;
   align-items: center;
   gap: 6px;
 `;
-var UICollapseTrigger = styled3.div`
+var UICollapseTrigger = styled.div`
   cursor: pointer;
   margin-right: 5px;
 `;
-var UIExpandDetail = styled3.div`
+var UIExpandDetail = styled.div`
   display: flex;
   flex-direction: column;
 `;
-var UILabel = styled3.div`
+var UILabel = styled.div`
   font-size: 12px;
   color: #999;
   font-weight: 400;
   margin-bottom: 2px;
 `;
-var UIProperties = styled3.div`
+var UITreeItems = styled.div`
   display: grid;
   grid-template-columns: auto 1fr;
 
-  ${({ $shrink }) => $shrink && css2`
-      padding-left: 10px;
+  ${({ $shrink }) => $shrink && css`
+      padding-left: 3px;
       margin-top: 10px;
     `}
 `;
-var UIPropertyLeft = styled3.div`
+var UITreeItemLeft = styled.div`
   grid-column: 1;
   position: relative;
   width: 16px;
 
-  ${({ $showLine, $isLast, $parentType }) => {
-  let height = "100%";
-  if ($parentType && $isLast) {
-    height = "24px";
-  }
-  return $showLine && css2`
+  ${({ $showLine, $isLast, $showCollapse }) => {
+  let height = $isLast ? "24px" : "100%";
+  let width = $showCollapse ? "12px" : "30px";
+  return $showLine && css`
         &::before {
           /* 竖线 */
           content: '';
           height: ${height};
           position: absolute;
-          left: -22px;
+          left: -14px;
           top: -16px;
           width: 1px;
           background: #d9d9d9;
@@ -880,9 +202,9 @@ var UIPropertyLeft = styled3.div`
           /* 横线 */
           content: '';
           position: absolute;
-          left: -22px; // 横线起点和竖线对齐
+          left: -14px; // 横线起点和竖线对齐
           top: 8px; // 跟随你的行高调整
-          width: 18px; // 横线长度
+          width: ${width}; // 横线长度
           height: 1px;
           background: #d9d9d9;
           display: block;
@@ -890,7 +212,7 @@ var UIPropertyLeft = styled3.div`
       `;
 }}
 `;
-var UIPropertyRight = styled3.div`
+var UITreeItemRight = styled.div`
   grid-column: 2;
   margin-bottom: 10px;
 
@@ -898,52 +220,28 @@ var UIPropertyRight = styled3.div`
     margin-bottom: 0px;
   }
 `;
-var UIPropertyMain = styled3.div`
+var UITreeItemMain = styled.div`
   display: flex;
   flex-direction: column;
   gap: 10px;
   position: relative;
-
-  ${({ $expand, type, $collapse, $showCollapse }) => {
-  const beforeElement = `
-      &::before {
-        /* \u7AD6\u7EBF */
-        content: '';
-        height: 100%;
-        position: absolute;
-        left: -12px;
-        top: 18px;
-        width: 1px;
-        background: #d9d9d9;
-        display: block;
-      }`;
-  return $expand && css2`
-        background-color: #f5f5f5;
-        padding: 10px;
-        border-radius: 4px;
-
-        ${$showCollapse && $collapse && (type === "array" || type === "object") && css2`
-          ${beforeElement}
-        `}
-      `;
-}}
 `;
-var UICollapsible = styled3.div`
+var UICollapsible = styled.div`
   display: none;
 
-  ${({ $collapse }) => $collapse && css2`
+  ${({ $collapse }) => $collapse && css`
       display: block;
     `}
 `;
-var UIName = styled3.div`
+var UIName = styled.div`
   flex-grow: 1;
 `;
-var UIType = styled3.div``;
-var UIRequired = styled3.div``;
-var UIActions = styled3.div`
+var UIType = styled.div``;
+var UIRequired = styled.div``;
+var UIActions = styled.div`
   white-space: nowrap;
 `;
-var iconAddChildrenSvg = /* @__PURE__ */ React13.createElement(
+var iconAddChildrenSvg = /* @__PURE__ */ React3.createElement(
   "svg",
   {
     className: "icon-icon icon-icon-coz_add_node ",
@@ -953,7 +251,7 @@ var iconAddChildrenSvg = /* @__PURE__ */ React13.createElement(
     fill: "currentColor",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React13.createElement(
+  /* @__PURE__ */ React3.createElement(
     "path",
     {
       fillRule: "evenodd",
@@ -961,38 +259,13 @@ var iconAddChildrenSvg = /* @__PURE__ */ React13.createElement(
       d: "M11 6.49988C11 8.64148 9.50397 10.4337 7.49995 10.8884V15.4998C7.49995 16.0521 7.94767 16.4998 8.49995 16.4998H11.208C11.0742 16.8061 11 17.1443 11 17.4998C11 17.8554 11.0742 18.1936 11.208 18.4998H8.49995C6.8431 18.4998 5.49995 17.1567 5.49995 15.4998V10.8884C3.49599 10.4336 2 8.64145 2 6.49988C2 4.0146 4.01472 1.99988 6.5 1.99988C8.98528 1.99988 11 4.0146 11 6.49988ZM6.5 8.99988C7.88071 8.99988 9 7.88059 9 6.49988C9 5.11917 7.88071 3.99988 6.5 3.99988C5.11929 3.99988 4 5.11917 4 6.49988C4 7.88059 5.11929 8.99988 6.5 8.99988Z"
     }
   ),
-  /* @__PURE__ */ React13.createElement("path", { d: "M17.5 12.4999C18.0523 12.4999 18.5 12.9476 18.5 13.4999V16.4999H21.5C22.0523 16.4999 22.5 16.9476 22.5 17.4999C22.5 18.0522 22.0523 18.4999 21.5 18.4999H18.5V21.4999C18.5 22.0522 18.0523 22.4999 17.5 22.4999C16.9477 22.4999 16.5 22.0522 16.5 21.4999V18.4999H13.5C12.9477 18.4999 12.5 18.0522 12.5 17.4999C12.5 16.9476 12.9477 16.4999 13.5 16.4999H16.5V13.4999C16.5 12.9476 16.9477 12.4999 17.5 12.4999Z" })
+  /* @__PURE__ */ React3.createElement("path", { d: "M17.5 12.4999C18.0523 12.4999 18.5 12.9476 18.5 13.4999V16.4999H21.5C22.0523 16.4999 22.5 16.9476 22.5 17.4999C22.5 18.0522 22.0523 18.4999 21.5 18.4999H18.5V21.4999C18.5 22.0522 18.0523 22.4999 17.5 22.4999C16.9477 22.4999 16.5 22.0522 16.5 21.4999V18.4999H13.5C12.9477 18.4999 12.5 18.0522 12.5 17.4999C12.5 16.9476 12.9477 16.4999 13.5 16.4999H16.5V13.4999C16.5 12.9476 16.9477 12.4999 17.5 12.4999Z" })
 );
-var IconAddChildren = () => /* @__PURE__ */ React13.createElement(Icon3, { size: "small", svg: iconAddChildrenSvg });
-var DefaultValueWrapper = styled3.div`
+var IconAddChildren = () => /* @__PURE__ */ React3.createElement(Icon2, { size: "small", svg: iconAddChildrenSvg });
+var DefaultValueWrapper = styled.div`
   margin: 0;
 `;
-var JSONViewerWrapper = styled3.div`
-  padding: 0 0 24px;
-  &:first-child {
-    margin-top: 0px;
-  }
-`;
-var JSONHeader = styled3.div`
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  background-color: var(--semi-color-fill-0);
-  border-radius: 6px 6px 0 0;
-  height: 36px;
-  padding: 0 8px 0 12px;
-`;
-var JSONHeaderLeft = styled3.div`
-  display: flex;
-  align-items: center;
-  gap: 10px;
-`;
-var JSONHeaderRight = styled3.div`
-  display: flex;
-  align-items: center;
-  gap: 10px;
-`;
-var ConstantInputWrapper = styled3.div`
+var ConstantInputWrapper = styled.div`
   flex-grow: 1;
 
   & .semi-tree-select,
@@ -1003,72 +276,48 @@ var ConstantInputWrapper = styled3.div`
 `;
 
 // src/components/json-schema-editor/hooks.tsx
-import { useEffect as useEffect2, useMemo as useMemo3, useRef as useRef2, useState } from "react";
-import { omit } from "lodash";
+import { useEffect as useEffect2, useRef, useState as useState2 } from "react";
+import { difference, omit } from "lodash-es";
+import { produce } from "immer";
+import { useTypeManager as useTypeManager2 } from "@flowgram.ai/json-schema";
 var _id = 0;
 function genId() {
   return _id++;
 }
-function getDrilldownSchema(value, path) {
-  if (!value) {
-    return {};
-  }
-  if (value.type === "array" && value.items) {
-    return getDrilldownSchema(value.items, [...path || [], "items"]);
-  }
-  return { schema: value, path };
-}
 function usePropertiesEdit(value, onChange) {
-  const drilldown = useMemo3(() => getDrilldownSchema(value), [value, value?.type, value?.items]);
-  const isDrilldownObject = drilldown.schema?.type === "object";
-  const initPropertyList = useMemo3(
-    () => isDrilldownObject ? Object.entries(drilldown.schema?.properties || {}).sort(([, a], [, b]) => (a.extra?.index ?? 0) - (b.extra?.index ?? 0)).map(
-      ([name, _value], index) => ({
-        key: genId(),
-        name,
-        isPropertyRequired: drilldown.schema?.required?.includes(name) || false,
-        ..._value,
-        extra: {
-          ..._value.extra || {},
-          index
-        }
-      })
-    ) : [],
-    [isDrilldownObject]
-  );
-  const [propertyList, setPropertyList] = useState(initPropertyList);
-  const mountRef = useRef2(false);
+  const typeManager = useTypeManager2();
+  const drilldownSchema = typeManager.getPropertiesParent(value || {});
+  const canAddField = typeManager.canAddField(value || {});
+  const [propertyList, setPropertyList] = useState2([]);
+  const effectVersion = useRef(0);
+  const changeVersion = useRef(0);
   useEffect2(() => {
-    if (mountRef.current) {
-      setPropertyList((_list) => {
-        const nameMap = /* @__PURE__ */ new Map();
-        for (const _property of _list) {
-          if (_property.name) {
-            nameMap.set(_property.name, _property);
-          }
-        }
-        return Object.entries(drilldown.schema?.properties || {}).sort(([, a], [, b]) => (a.extra?.index ?? 0) - (b.extra?.index ?? 0)).map(([name, _value]) => {
-          const _property = nameMap.get(name);
-          if (_property) {
-            return {
-              key: _property.key,
-              name,
-              isPropertyRequired: drilldown.schema?.required?.includes(name) || false,
-              ..._value
-            };
-          }
-          return {
-            key: genId(),
-            name,
-            isPropertyRequired: drilldown.schema?.required?.includes(name) || false,
-            ..._value
-          };
-        });
-      });
+    effectVersion.current = effectVersion.current + 1;
+    if (effectVersion.current === changeVersion.current) {
+      return;
     }
-    mountRef.current = true;
-  }, [drilldown.schema]);
+    effectVersion.current = changeVersion.current;
+    setPropertyList((_list) => {
+      const newNames = Object.entries(drilldownSchema?.properties || {}).sort(([, a], [, b]) => (a.extra?.index ?? 0) - (b.extra?.index ?? 0)).map(([key]) => key);
+      const oldNames = _list.map((item) => item.name).filter(Boolean);
+      const addNames = difference(newNames, oldNames);
+      return _list.filter((item) => !item.name || newNames.includes(item.name)).map((item) => ({
+        key: item.key,
+        name: item.name,
+        isPropertyRequired: drilldownSchema?.required?.includes(item.name || "") || false,
+        ...drilldownSchema?.properties?.[item.name || ""] || item || {}
+      })).concat(
+        addNames.map((_name) => ({
+          key: genId(),
+          name: _name,
+          isPropertyRequired: drilldownSchema?.required?.includes(_name) || false,
+          ...drilldownSchema?.properties?.[_name] || {}
+        }))
+      );
+    });
+  }, [drilldownSchema]);
   const updatePropertyList = (updater) => {
+    changeVersion.current = changeVersion.current + 1;
     setPropertyList((_list) => {
       const next = updater(_list);
       const nextProperties = {};
@@ -1082,18 +331,21 @@ function usePropertiesEdit(value, onChange) {
           nextRequired.push(_property.name);
         }
       }
-      let drilldownSchema = value || {};
-      if (drilldown.path) {
-        drilldownSchema = drilldown.path.reduce((acc, key) => acc[key], value || {});
-      }
-      drilldownSchema.properties = nextProperties;
-      drilldownSchema.required = nextRequired;
-      onChange?.(value || {});
+      onChange?.(
+        produce(value || {}, (draft) => {
+          const propertiesParent = typeManager.getPropertiesParent(draft);
+          if (propertiesParent) {
+            propertiesParent.properties = nextProperties;
+            propertiesParent.required = nextRequired;
+            return;
+          }
+        })
+      );
       return next;
     });
   };
   const onAddProperty = () => {
-    updatePropertyList((_list) => [
+    setPropertyList((_list) => [
       ..._list,
       { key: genId(), name: "", type: "string", extra: { index: _list.length + 1 } }
     ]);
@@ -1107,13 +359,13 @@ function usePropertiesEdit(value, onChange) {
     );
   };
   useEffect2(() => {
-    if (!isDrilldownObject) {
+    if (!canAddField) {
       setPropertyList([]);
     }
-  }, [isDrilldownObject]);
+  }, [canAddField]);
   return {
     propertyList,
-    isDrilldownObject,
+    canAddField,
     onAddProperty,
     onRemoveProperty,
     onEditProperty
@@ -1121,175 +373,66 @@ function usePropertiesEdit(value, onChange) {
 }
 
 // src/components/json-schema-editor/default-value.tsx
-import React15, { useRef as useRef3, useState as useState2, useCallback as useCallback2 } from "react";
-import { IconButton as IconButton2, JsonViewer, Tooltip } from "@douyinfe/semi-ui";
-import { IconBrackets } from "@douyinfe/semi-icons";
-
-// src/components/json-schema-editor/utils.ts
-function getValueType(value) {
-  const type = typeof value;
-  if (type === "string") {
-    return "string";
-  } else if (type === "number") {
-    return Number.isInteger(value) ? "integer" : "number";
-  } else if (type === "boolean") {
-    return "boolean";
-  } else if (type === "object") {
-    if (value === null) {
-      return "other";
-    }
-    return Array.isArray(value) ? "array" : "object";
-  } else {
-    return "other";
-  }
-}
+import React5 from "react";
+import { I18n } from "@flowgram.ai/editor";
 
 // src/components/constant-input/index.tsx
-import React14, { useMemo as useMemo4 } from "react";
+import React4, { useMemo as useMemo2 } from "react";
 import { Input as Input2 } from "@douyinfe/semi-ui";
 function ConstantInput(props) {
   const { value, onChange, schema, strategies, fallbackRenderer, readonly, ...rest } = props;
   const typeManager = useTypeManager();
-  const Renderer2 = useMemo4(() => {
+  const Renderer = useMemo2(() => {
     const strategy = (strategies || []).find((_strategy) => _strategy.hit(schema));
     if (!strategy) {
       return typeManager.getTypeBySchema(schema)?.ConstantRenderer;
     }
     return strategy?.Renderer;
   }, [strategies, schema]);
-  if (!Renderer2) {
+  if (!Renderer) {
     if (fallbackRenderer) {
-      return React14.createElement(fallbackRenderer, {
+      return React4.createElement(fallbackRenderer, {
         value,
         onChange,
         readonly,
         ...rest
       });
     }
-    return /* @__PURE__ */ React14.createElement(Input2, { size: "small", disabled: true, placeholder: "Unsupported type" });
+    return /* @__PURE__ */ React4.createElement(Input2, { size: "small", disabled: true, placeholder: "Unsupported type" });
   }
-  return /* @__PURE__ */ React14.createElement(Renderer2, { value, onChange, readonly, ...rest });
+  return /* @__PURE__ */ React4.createElement(Renderer, { value, onChange, readonly, ...rest });
 }
 
 // src/components/json-schema-editor/default-value.tsx
 function DefaultValue(props) {
-  const { value, schema, type, onChange, placeholder, jsonFormatText } = props;
-  const wrapperRef = useRef3(null);
-  const JsonViewerRef = useRef3(null);
-  const [internalJsonValue, setInternalJsonValue] = useState2(
-    getValueType(value) === "string" ? value : ""
-  );
-  const handleJsonChange = useCallback2((val) => {
-    if (val !== internalJsonValue) {
-      setInternalJsonValue(val);
-    }
-  }, []);
-  const handleEditComplete = useCallback2(() => {
-    onChange(internalJsonValue);
-    requestAnimationFrame(() => {
-      wrapperRef.current?.blur();
-    });
-    setJsonReadOnly(true);
-  }, [internalJsonValue, onChange]);
-  const [jsonReadOnly, setJsonReadOnly] = useState2(true);
-  const handleFormatJson = useCallback2(() => {
-    try {
-      const parsed = JSON.parse(internalJsonValue);
-      const formatted = JSON.stringify(parsed, null, 4);
-      setInternalJsonValue(formatted);
-      onChange(formatted);
-    } catch (error) {
-      console.error("Invalid JSON:", error);
-    }
-  }, [internalJsonValue, onChange]);
-  return type === "object" ? /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement(JSONHeader, null, /* @__PURE__ */ React15.createElement(JSONHeaderLeft, null, "json"), /* @__PURE__ */ React15.createElement(JSONHeaderRight, null, /* @__PURE__ */ React15.createElement(Tooltip, { content: jsonFormatText ?? "Format" }, /* @__PURE__ */ React15.createElement(
-    IconButton2,
-    {
-      icon: /* @__PURE__ */ React15.createElement(IconBrackets, { style: { color: "var(--semi-color-primary)" } }),
-      size: "small",
-      type: "tertiary",
-      theme: "borderless",
-      onClick: handleFormatJson
-    }
-  )))), /* @__PURE__ */ React15.createElement(
-    JSONViewerWrapper,
-    {
-      ref: wrapperRef,
-      tabIndex: -1,
-      onBlur: (e) => {
-        if (wrapperRef.current && !wrapperRef.current?.contains(e.relatedTarget)) {
-          handleEditComplete();
-        }
-      },
-      onClick: (e) => {
-        setJsonReadOnly(false);
-      }
-    },
-    /* @__PURE__ */ React15.createElement(
-      JsonViewer,
-      {
-        ref: JsonViewerRef,
-        value: getValueType(value) === "string" ? value : "",
-        height: 120,
-        width: "100%",
-        showSearch: false,
-        options: {
-          readOnly: jsonReadOnly,
-          formatOptions: { tabSize: 4, insertSpaces: true, eol: "\n" }
-        },
-        style: {
-          padding: 0
-        },
-        onChange: handleJsonChange
-      }
-    )
-  )) : /* @__PURE__ */ React15.createElement(ConstantInputWrapper, null, /* @__PURE__ */ React15.createElement(
+  const { value, schema, onChange, placeholder } = props;
+  return /* @__PURE__ */ React5.createElement(ConstantInputWrapper, null, /* @__PURE__ */ React5.createElement(
     ConstantInput,
     {
       value,
       onChange: (_v) => onChange(_v),
       schema: schema || { type: "string" },
-      placeholder: placeholder ?? "Default value if parameter is not provided"
+      placeholder: placeholder ?? I18n.t("Default value if parameter is not provided"),
+      enableMultiLineStr: true
     }
   ));
 }
 
-// src/components/json-schema-editor/components/blur-input.tsx
-import React16, { useEffect as useEffect3, useState as useState3 } from "react";
-import Input3 from "@douyinfe/semi-ui/lib/es/input";
-function BlurInput(props) {
-  const [value, setValue] = useState3("");
-  useEffect3(() => {
-    setValue(props.value);
-  }, [props.value]);
-  return /* @__PURE__ */ React16.createElement(
-    Input3,
-    {
-      ...props,
-      value,
-      onChange: (value2) => {
-        setValue(value2);
-      },
-      onBlur: (e) => props.onChange?.(value, e)
-    }
-  );
-}
-
 // src/components/json-schema-editor/index.tsx
+var DEFAULT = { type: "object" };
 function JsonSchemaEditor(props) {
-  const { value = { type: "object" }, config = {}, onChange: onChangeProps, readonly } = props;
+  const { value = DEFAULT, config = {}, onChange: onChangeProps, readonly } = props;
   const { propertyList, onAddProperty, onRemoveProperty, onEditProperty } = usePropertiesEdit(
     value,
     onChangeProps
   );
-  return /* @__PURE__ */ React17.createElement(UIContainer, { className: props.className }, /* @__PURE__ */ React17.createElement(UIProperties, null, propertyList.map((_property, index) => /* @__PURE__ */ React17.createElement(
+  return /* @__PURE__ */ React6.createElement(UIContainer, { className: props.className }, /* @__PURE__ */ React6.createElement(UITreeItems, null, propertyList.map((_property) => /* @__PURE__ */ React6.createElement(
     PropertyEdit,
     {
       readonly,
       key: _property.key,
       value: _property,
       config,
-      $index: index,
       onChange: (_v) => {
         onEditProperty(_property.key, _v);
       },
@@ -1297,148 +440,110 @@ function JsonSchemaEditor(props) {
         onRemoveProperty(_property.key);
       }
     }
-  ))), /* @__PURE__ */ React17.createElement(
+  ))), /* @__PURE__ */ React6.createElement(
     Button,
     {
       disabled: readonly,
       size: "small",
       style: { marginTop: 10, marginLeft: 16 },
-      icon: /* @__PURE__ */ React17.createElement(IconPlus, null),
+      icon: /* @__PURE__ */ React6.createElement(IconPlus, null),
       onClick: onAddProperty
     },
-    config?.addButtonText ?? "Add"
+    config?.addButtonText ?? I18n2.t("Add")
   ));
 }
 function PropertyEdit(props) {
-  const {
-    value,
-    config,
-    readonly,
-    $level = 0,
-    onChange: onChangeProps,
-    onRemove,
-    $index,
-    $isFirst,
-    $isLast,
-    $parentExpand = false,
-    $parentType = "",
-    $showLine
-  } = props;
-  const [expand, setExpand] = useState4(false);
-  const [collapse, setCollapse] = useState4(false);
+  const { value, config, readonly, $level = 0, onChange: onChangeProps, onRemove, $isLast } = props;
+  const [expand, setExpand] = useState3(false);
+  const [collapse, setCollapse] = useState3(false);
   const { name, type, items, default: defaultValue, description, isPropertyRequired } = value || {};
-  const typeSelectorValue = useMemo5(() => ({ type, items }), [type, items]);
-  const { propertyList, isDrilldownObject, onAddProperty, onRemoveProperty, onEditProperty } = usePropertiesEdit(value, onChangeProps);
+  const typeSelectorValue = useMemo3(() => ({ type, items }), [type, items]);
+  const { propertyList, canAddField, onAddProperty, onRemoveProperty, onEditProperty } = usePropertiesEdit(value, onChangeProps);
   const onChange = (key, _value) => {
     onChangeProps?.({
       ...value || {},
       [key]: _value
     });
   };
-  const showCollapse = isDrilldownObject && propertyList.length > 0;
-  return /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(
-    UIPropertyLeft,
+  const showCollapse = canAddField && propertyList.length > 0;
+  return /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(UITreeItemLeft, { $isLast, $showLine: $level > 0, $showCollapse: showCollapse }, showCollapse && /* @__PURE__ */ React6.createElement(UICollapseTrigger, { onClick: () => setCollapse((_collapse) => !_collapse) }, collapse ? /* @__PURE__ */ React6.createElement(IconChevronDown, { size: "small" }) : /* @__PURE__ */ React6.createElement(IconChevronRight, { size: "small" }))), /* @__PURE__ */ React6.createElement(UITreeItemRight, null, /* @__PURE__ */ React6.createElement(UITreeItemMain, null, /* @__PURE__ */ React6.createElement(UIRow, null, /* @__PURE__ */ React6.createElement(UIName, null, /* @__PURE__ */ React6.createElement(
+    BlurInput,
     {
-      type,
-      $index,
-      $isFirst,
-      $isLast,
-      $showLine,
-      $isExpand: expand,
-      $parentExpand,
-      $parentType
-    },
-    showCollapse && /* @__PURE__ */ React17.createElement(UICollapseTrigger, { onClick: () => setCollapse((_collapse) => !_collapse) }, collapse ? /* @__PURE__ */ React17.createElement(IconChevronDown, { size: "small" }) : /* @__PURE__ */ React17.createElement(IconChevronRight, { size: "small" }))
-  ), /* @__PURE__ */ React17.createElement(UIPropertyRight, null, /* @__PURE__ */ React17.createElement(
-    UIPropertyMain,
+      disabled: readonly,
+      placeholder: config?.placeholder ?? I18n2.t("Input Variable Name"),
+      size: "small",
+      value: name,
+      onChange: (value2) => onChange("name", value2)
+    }
+  )), /* @__PURE__ */ React6.createElement(UIType, null, /* @__PURE__ */ React6.createElement(
+    InjectTypeSelector,
     {
-      $showCollapse: showCollapse,
-      $collapse: collapse,
-      $expand: expand,
-      type
-    },
-    /* @__PURE__ */ React17.createElement(UIRow, null, /* @__PURE__ */ React17.createElement(UIName, null, /* @__PURE__ */ React17.createElement(
-      BlurInput,
-      {
-        disabled: readonly,
-        placeholder: config?.placeholder ?? "Input Variable Name",
-        size: "small",
-        value: name,
-        onChange: (value2) => onChange("name", value2)
-      }
-    )), /* @__PURE__ */ React17.createElement(UIType, null, /* @__PURE__ */ React17.createElement(
-      TypeSelector,
-      {
-        value: typeSelectorValue,
-        readonly,
-        onChange: (_value) => {
-          onChangeProps?.({
-            ...value || {},
-            ..._value
-          });
-        }
-      }
-    )), /* @__PURE__ */ React17.createElement(UIRequired, null, /* @__PURE__ */ React17.createElement(
-      Checkbox,
-      {
-        disabled: readonly,
-        checked: isPropertyRequired,
-        onChange: (e) => onChange("isPropertyRequired", e.target.checked)
-      }
-    )), /* @__PURE__ */ React17.createElement(UIActions, null, /* @__PURE__ */ React17.createElement(
-      IconButton3,
-      {
-        disabled: readonly,
-        size: "small",
-        theme: "borderless",
-        icon: expand ? /* @__PURE__ */ React17.createElement(IconShrink, { size: "small" }) : /* @__PURE__ */ React17.createElement(IconExpand, { size: "small" }),
-        onClick: () => {
-          setExpand((_expand) => !_expand);
-        }
-      }
-    ), isDrilldownObject && /* @__PURE__ */ React17.createElement(
-      IconButton3,
-      {
-        disabled: readonly,
-        size: "small",
-        theme: "borderless",
-        icon: /* @__PURE__ */ React17.createElement(IconAddChildren, null),
-        onClick: () => {
-          onAddProperty();
-          setCollapse(true);
-        }
-      }
-    ), /* @__PURE__ */ React17.createElement(
-      IconButton3,
-      {
-        disabled: readonly,
-        size: "small",
-        theme: "borderless",
-        icon: /* @__PURE__ */ React17.createElement(IconMinus, { size: "small" }),
-        onClick: onRemove
+      value: typeSelectorValue,
+      readonly,
+      onChange: (_value) => {
+        onChangeProps?.({
+          ...value || {},
+          ..._value
+        });
       }
-    ))),
-    expand && /* @__PURE__ */ React17.createElement(UIExpandDetail, null, /* @__PURE__ */ React17.createElement(UILabel, null, config?.descTitle ?? "Description"), /* @__PURE__ */ React17.createElement(
-      BlurInput,
-      {
-        disabled: readonly,
-        size: "small",
-        value: description,
-        onChange: (value2) => onChange("description", value2),
-        placeholder: config?.descPlaceholder ?? "Help LLM to understand the property"
+    }
+  )), /* @__PURE__ */ React6.createElement(UIRequired, null, /* @__PURE__ */ React6.createElement(
+    Checkbox,
+    {
+      disabled: readonly,
+      checked: isPropertyRequired,
+      onChange: (e) => onChange("isPropertyRequired", e.target.checked)
+    }
+  )), /* @__PURE__ */ React6.createElement(UIActions, null, /* @__PURE__ */ React6.createElement(
+    IconButton2,
+    {
+      disabled: readonly,
+      size: "small",
+      theme: "borderless",
+      icon: expand ? /* @__PURE__ */ React6.createElement(IconShrink, { size: "small" }) : /* @__PURE__ */ React6.createElement(IconExpand, { size: "small" }),
+      onClick: () => {
+        setExpand((_expand) => !_expand);
       }
-    ), $level === 0 && type && type !== "array" && /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(UILabel, { style: { marginTop: 10 } }, config?.defaultValueTitle ?? "Default Value"), /* @__PURE__ */ React17.createElement(DefaultValueWrapper, null, /* @__PURE__ */ React17.createElement(
-      DefaultValue,
-      {
-        value: defaultValue,
-        schema: value,
-        type,
-        placeholder: config?.defaultValuePlaceholder,
-        jsonFormatText: config?.jsonFormatText,
-        onChange: (value2) => onChange("default", value2)
+    }
+  ), canAddField && /* @__PURE__ */ React6.createElement(
+    IconButton2,
+    {
+      disabled: readonly,
+      size: "small",
+      theme: "borderless",
+      icon: /* @__PURE__ */ React6.createElement(IconAddChildren, null),
+      onClick: () => {
+        onAddProperty();
+        setCollapse(true);
       }
-    ))))
-  ), showCollapse && /* @__PURE__ */ React17.createElement(UICollapsible, { $collapse: collapse }, /* @__PURE__ */ React17.createElement(UIProperties, { $shrink: true }, propertyList.map((_property, index) => /* @__PURE__ */ React17.createElement(
+    }
+  ), /* @__PURE__ */ React6.createElement(
+    IconButton2,
+    {
+      disabled: readonly,
+      size: "small",
+      theme: "borderless",
+      icon: /* @__PURE__ */ React6.createElement(IconMinus, { size: "small" }),
+      onClick: onRemove
+    }
+  ))), expand && /* @__PURE__ */ React6.createElement(UIExpandDetail, null, /* @__PURE__ */ React6.createElement(UILabel, null, config?.descTitle ?? I18n2.t("Description")), /* @__PURE__ */ React6.createElement(
+    BlurInput,
+    {
+      disabled: readonly,
+      size: "small",
+      value: description,
+      onChange: (value2) => onChange("description", value2),
+      placeholder: config?.descPlaceholder ?? I18n2.t("Help LLM to understand the property")
+    }
+  ), $level === 0 && /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(UILabel, { style: { marginTop: 10 } }, config?.defaultValueTitle ?? I18n2.t("Default Value")), /* @__PURE__ */ React6.createElement(DefaultValueWrapper, null, /* @__PURE__ */ React6.createElement(
+    DefaultValue,
+    {
+      value: defaultValue,
+      schema: value,
+      placeholder: config?.defaultValuePlaceholder ?? I18n2.t("Default Value"),
+      onChange: (value2) => onChange("default", value2)
+    }
+  ))))), showCollapse && /* @__PURE__ */ React6.createElement(UICollapsible, { $collapse: collapse }, /* @__PURE__ */ React6.createElement(UITreeItems, { $shrink: true }, propertyList.map((_property, index) => /* @__PURE__ */ React6.createElement(
     PropertyEdit,
     {
       readonly,
@@ -1446,42 +551,40 @@ function PropertyEdit(props) {
       value: _property,
       config,
       $level: $level + 1,
-      $parentExpand: expand,
-      $parentType: type,
       onChange: (_v) => {
         onEditProperty(_property.key, _v);
       },
       onRemove: () => {
         onRemoveProperty(_property.key);
       },
-      $isLast: index === propertyList.length - 1,
-      $isFirst: index === 0,
-      $index: index,
-      $showLine: true
+      $isLast: index === propertyList.length - 1
     }
   ))))));
 }
 
 // src/components/batch-variable-selector/index.tsx
-import React18 from "react";
+import React7 from "react";
 import { PrivateScopeProvider } from "@flowgram.ai/editor";
 var batchVariableSchema = {
   type: "array",
   extra: { weak: true }
 };
 function BatchVariableSelector(props) {
-  return /* @__PURE__ */ React18.createElement(PrivateScopeProvider, null, /* @__PURE__ */ React18.createElement(VariableSelector, { ...props, includeSchema: batchVariableSchema }));
+  return /* @__PURE__ */ React7.createElement(PrivateScopeProvider, null, /* @__PURE__ */ React7.createElement(VariableSelector, { ...props, includeSchema: batchVariableSchema }));
 }
 
 // src/components/dynamic-value-input/index.tsx
-import React19 from "react";
-import { JsonSchemaUtils as JsonSchemaUtils3 } from "@flowgram.ai/json-schema";
-import { IconButton as IconButton4 } from "@douyinfe/semi-ui";
+import React8 from "react";
+import {
+  JsonSchemaUtils as JsonSchemaUtils2,
+  useTypeManager as useTypeManager3
+} from "@flowgram.ai/json-schema";
+import { IconButton as IconButton3 } from "@douyinfe/semi-ui";
 import { IconSetting } from "@douyinfe/semi-icons";
 
 // src/components/dynamic-value-input/styles.tsx
-import styled4 from "styled-components";
-var UIContainer2 = styled4.div`
+import styled2 from "styled-components";
+var UIContainer2 = styled2.div`
   display: flex;
   align-items: center;
   border-radius: 4px;
@@ -1491,10 +594,12 @@ var UIContainer2 = styled4.div`
 
   background-color: var(--semi-color-fill-0);
 `;
-var UIMain = styled4.div`
+var UIMain = styled2.div`
   flex-grow: 1;
   overflow: hidden;
   min-width: 0;
+  border-left: 1px solid var(--semi-color-border);
+  border-right: 1px solid var(--semi-color-border);
 
   & .semi-tree-select,
   & .semi-input-number,
@@ -1508,28 +613,36 @@ var UIMain = styled4.div`
     border: none;
     border-radius: 0;
   }
-`;
-var UIType2 = styled4.div`
-  border-right: 1px solid #e5e5e5;
 
+  & .semi-input-textarea-wrapper {
+    border: none;
+    border-radius: 0;
+  }
+
+  & .semi-input-textarea {
+    padding: 2px 6px;
+    border: none;
+    border-radius: 0;
+    word-break: break-all;
+  }
+`;
+var UIType2 = styled2.div`
   & .semi-button {
     border-radius: 0;
   }
 `;
-var UITrigger = styled4.div`
-  border-left: 1px solid #e5e5e5;
-
+var UITrigger = styled2.div`
   & .semi-button {
     border-radius: 0;
   }
 `;
 
 // src/components/dynamic-value-input/hooks.ts
-import { useMemo as useMemo6, useState as useState5 } from "react";
+import { useEffect as useEffect3, useMemo as useMemo4, useRef as useRef2, useState as useState4 } from "react";
 import { useScopeAvailable } from "@flowgram.ai/editor";
 function useRefVariable(value) {
   const available = useScopeAvailable();
-  const refVariable = useMemo6(() => {
+  const refVariable = useMemo4(() => {
     if (value?.type === "ref") {
       return available.getByKeyPath(value.content);
     }
@@ -1541,23 +654,45 @@ function useSelectSchema(schemaFromProps, constantProps, value) {
   if (value?.type === "constant") {
     defaultSelectSchema = value?.schema || defaultSelectSchema;
   }
-  const [selectSchema, setSelectSchema] = useState5(defaultSelectSchema);
-  return [selectSchema, setSelectSchema];
+  const changeVersion = useRef2(0);
+  const effectVersion = useRef2(0);
+  const [selectSchema, setSelectSchema] = useState4(defaultSelectSchema);
+  useEffect3(() => {
+    effectVersion.current += 1;
+    if (changeVersion.current === effectVersion.current) {
+      return;
+    }
+    effectVersion.current = changeVersion.current;
+    if (value?.type === "constant" && value?.schema) {
+      setSelectSchema(value?.schema);
+      return;
+    }
+  }, [value]);
+  const setSelectSchemaWithVersionUpdate = (schema) => {
+    setSelectSchema(schema);
+    changeVersion.current += 1;
+  };
+  return [selectSchema, setSelectSchemaWithVersionUpdate];
 }
 function useIncludeSchema(schemaFromProps) {
-  const includeSchema = useMemo6(() => {
+  const includeSchema = useMemo4(() => {
     if (!schemaFromProps) {
       return;
     }
     if (schemaFromProps?.type === "number") {
       return [schemaFromProps, { type: "integer" }];
     }
-    return { ...schemaFromProps, extra: { ...schemaFromProps?.extra, weak: true } };
+    return { ...schemaFromProps, extra: { weak: true, ...schemaFromProps?.extra } };
   }, [schemaFromProps]);
   return includeSchema;
 }
 
 // src/components/dynamic-value-input/index.tsx
+var DEFAULT_VALUE = {
+  type: "constant",
+  content: "",
+  schema: { type: "string" }
+};
 function DynamicValueInput({
   value,
   onChange,
@@ -1569,34 +704,33 @@ function DynamicValueInput({
   const refVariable = useRefVariable(value);
   const [selectSchema, setSelectSchema] = useSelectSchema(schemaFromProps, constantProps, value);
   const includeSchema = useIncludeSchema(schemaFromProps);
+  const typeManager = useTypeManager3();
   const renderTypeSelector = () => {
     if (schemaFromProps) {
-      return /* @__PURE__ */ React19.createElement(TypeSelector, { value: schemaFromProps, readonly: true });
+      return /* @__PURE__ */ React8.createElement(TypeSelector, { value: schemaFromProps, readonly: true });
     }
     if (value?.type === "ref") {
-      const schema = refVariable?.type ? JsonSchemaUtils3.astToSchema(refVariable?.type) : void 0;
-      return /* @__PURE__ */ React19.createElement(TypeSelector, { value: schema, readonly: true });
+      const schema = refVariable?.type ? JsonSchemaUtils2.astToSchema(refVariable?.type) : void 0;
+      return /* @__PURE__ */ React8.createElement(TypeSelector, { value: schema, readonly: true });
     }
-    return /* @__PURE__ */ React19.createElement(
+    return /* @__PURE__ */ React8.createElement(
       TypeSelector,
       {
         value: selectSchema,
         onChange: (_v) => {
           setSelectSchema(_v || { type: "string" });
-          let content;
+          const schema = _v || { type: "string" };
+          let content = typeManager.getDefaultValue(schema);
           if (_v?.type === "object") {
             content = "{}";
           }
           if (_v?.type === "array") {
             content = "[]";
           }
-          if (_v?.type === "boolean") {
-            content = false;
-          }
           onChange({
             type: "constant",
             content,
-            schema: _v || { type: "string" }
+            schema
           });
         },
         readonly
@@ -1605,72 +739,75 @@ function DynamicValueInput({
   };
   const renderMain = () => {
     if (value?.type === "ref") {
-      return /* @__PURE__ */ React19.createElement(
-        VariableSelector,
+      return /* @__PURE__ */ React8.createElement(
+        InjectVariableSelector,
         {
           style: { width: "100%" },
           value: value?.content,
-          onChange: (_v) => onChange(_v ? { type: "ref", content: _v } : void 0),
+          onChange: (_v) => onChange(_v ? { type: "ref", content: _v } : DEFAULT_VALUE),
           includeSchema,
           readonly
         }
       );
     }
     const constantSchema = schemaFromProps || selectSchema || { type: "string" };
-    return /* @__PURE__ */ React19.createElement(
+    return /* @__PURE__ */ React8.createElement(
       ConstantInput,
       {
         value: value?.content,
         onChange: (_v) => onChange({ type: "constant", content: _v, schema: constantSchema }),
         schema: constantSchema || { type: "string" },
         readonly,
-        strategies: [...constantProps?.strategies || []],
-        fallbackRenderer: () => /* @__PURE__ */ React19.createElement(
-          VariableSelector,
+        fallbackRenderer: () => /* @__PURE__ */ React8.createElement(
+          InjectVariableSelector,
           {
             style: { width: "100%" },
-            onChange: (_v) => onChange(_v ? { type: "ref", content: _v } : void 0),
+            onChange: (_v) => onChange(_v ? { type: "ref", content: _v } : DEFAULT_VALUE),
             includeSchema,
             readonly
           }
         ),
-        ...constantProps
+        ...constantProps,
+        strategies: [...constantProps?.strategies || []]
       }
     );
   };
-  const renderTrigger = () => /* @__PURE__ */ React19.createElement(
-    VariableSelector,
+  const renderTrigger = () => /* @__PURE__ */ React8.createElement(
+    InjectVariableSelector,
     {
       style: { width: "100%" },
       value: value?.type === "ref" ? value?.content : void 0,
       onChange: (_v) => onChange({ type: "ref", content: _v }),
       includeSchema,
       readonly,
-      triggerRender: () => /* @__PURE__ */ React19.createElement(IconButton4, { disabled: readonly, size: "small", icon: /* @__PURE__ */ React19.createElement(IconSetting, { size: "small" }) })
+      triggerRender: () => /* @__PURE__ */ React8.createElement(IconButton3, { disabled: readonly, size: "small", icon: /* @__PURE__ */ React8.createElement(IconSetting, { size: "small" }) })
     }
   );
-  return /* @__PURE__ */ React19.createElement(UIContainer2, { style }, /* @__PURE__ */ React19.createElement(UIType2, null, renderTypeSelector()), /* @__PURE__ */ React19.createElement(UIMain, null, renderMain()), /* @__PURE__ */ React19.createElement(UITrigger, null, renderTrigger()));
+  return /* @__PURE__ */ React8.createElement(UIContainer2, { style }, /* @__PURE__ */ React8.createElement(UIType2, null, renderTypeSelector()), /* @__PURE__ */ React8.createElement(UIMain, null, renderMain()), /* @__PURE__ */ React8.createElement(UITrigger, null, renderTrigger()));
 }
+DynamicValueInput.renderKey = "dynamic-value-input-render-key";
+var InjectDynamicValueInput = createInjectMaterial(DynamicValueInput);
 
 // src/components/condition-row/index.tsx
-import React21, { useMemo as useMemo9 } from "react";
-import { Input as Input4 } from "@douyinfe/semi-ui";
+import React10, { useMemo as useMemo7 } from "react";
+import { I18n as I18n4 } from "@flowgram.ai/editor";
+import { Input as Input3 } from "@douyinfe/semi-ui";
 
 // src/components/condition-row/styles.tsx
-import styled5 from "styled-components";
-var UIContainer3 = styled5.div`
+import styled3 from "styled-components";
+var UIContainer3 = styled3.div`
   display: flex;
   align-items: center;
   gap: 4px;
 `;
-var UIOperator = styled5.div``;
-var UILeft = styled5.div`
+var UIOperator = styled3.div``;
+var UILeft = styled3.div`
   width: 100%;
 `;
-var UIRight = styled5.div`
+var UIRight = styled3.div`
   width: 100%;
 `;
-var UIValues = styled5.div`
+var UIValues = styled3.div`
   flex-grow: 1;
   display: flex;
   flex-direction: column;
@@ -1679,12 +816,12 @@ var UIValues = styled5.div`
 `;
 
 // src/components/condition-row/hooks/useRule.ts
-import { useMemo as useMemo7 } from "react";
-import { JsonSchemaUtils as JsonSchemaUtils4 } from "@flowgram.ai/json-schema";
+import { useMemo as useMemo5 } from "react";
+import { JsonSchemaUtils as JsonSchemaUtils3 } from "@flowgram.ai/json-schema";
 import { useScopeAvailable as useScopeAvailable2 } from "@flowgram.ai/editor";
 
 // src/components/condition-row/constants.ts
-var rules = {
+var defaultRules = {
   string: {
     ["eq" /* EQ */]: "string",
     ["neq" /* NEQ */]: "string",
@@ -1738,9 +875,17 @@ var rules = {
   map: {
     ["is_empty" /* IS_EMPTY */]: null,
     ["is_not_empty" /* IS_NOT_EMPTY */]: null
+  },
+  ["date-time"]: {
+    ["eq" /* EQ */]: "date-time",
+    ["neq" /* NEQ */]: "date-time",
+    ["gt" /* GT */]: "date-time",
+    ["gte" /* GTE */]: "date-time",
+    ["lt" /* LT */]: "date-time",
+    ["lte" /* LTE */]: "date-time"
   }
 };
-var opConfigs = {
+var defaultOpConfigs = {
   ["eq" /* EQ */]: {
     label: "Equal",
     abbreviation: "="
@@ -1804,35 +949,39 @@ var opConfigs = {
 };
 
 // src/components/condition-row/hooks/useRule.ts
-function useRule(left) {
+function useRule(left, userRules) {
   const available = useScopeAvailable2();
-  const variable = useMemo7(() => {
+  const rules = useMemo5(() => ({ ...defaultRules, ...userRules || {} }), [userRules]);
+  const variable = useMemo5(() => {
     if (!left) return void 0;
     return available.getByKeyPath(left.content);
   }, [available, left]);
-  const rule = useMemo7(() => {
+  const rule = useMemo5(() => {
     if (!variable) return void 0;
-    const schema = JsonSchemaUtils4.astToSchema(variable.type, { drilldown: false });
+    const schema = JsonSchemaUtils3.astToSchema(variable.type, { drilldown: false });
     return rules[schema?.type];
-  }, [variable?.type]);
+  }, [variable?.type, rules]);
   return { rule };
 }
 
 // src/components/condition-row/hooks/useOp.tsx
-import React20, { useMemo as useMemo8 } from "react";
-import { Button as Button2, Select as Select2 } from "@douyinfe/semi-ui";
-import { IconChevronDownStroked as IconChevronDownStroked2 } from "@douyinfe/semi-icons";
-function useOp({ rule, op, onChange, readonly }) {
-  const options = useMemo8(
+import React9, { useMemo as useMemo6 } from "react";
+import { I18n as I18n3 } from "@flowgram.ai/editor";
+import { Button as Button2, Select } from "@douyinfe/semi-ui";
+import { IconChevronDownStroked } from "@douyinfe/semi-icons";
+function useOp({ rule, op, onChange, readonly, userOps }) {
+  const options = useMemo6(
     () => Object.keys(rule || {}).map((_op) => ({
-      ...opConfigs[_op] || {},
-      value: _op
+      ...defaultOpConfigs[_op] || {},
+      ...userOps?.[_op] || {},
+      value: _op,
+      label: I18n3.t(userOps?.[_op]?.label || defaultOpConfigs[_op]?.label)
     })),
-    [rule]
+    [rule, userOps]
   );
-  const opConfig = useMemo8(() => opConfigs[op], [op]);
-  const renderOpSelect = () => /* @__PURE__ */ React20.createElement(
-    Select2,
+  const opConfig = useMemo6(() => defaultOpConfigs[op], [op]);
+  const renderOpSelect = () => /* @__PURE__ */ React9.createElement(
+    Select,
     {
       style: { height: 22 },
       disabled: readonly,
@@ -1842,28 +991,39 @@ function useOp({ rule, op, onChange, readonly }) {
       onChange: (v) => {
         onChange(v);
       },
-      triggerRender: ({ value }) => /* @__PURE__ */ React20.createElement(Button2, { size: "small", disabled: !rule }, opConfig?.abbreviation || /* @__PURE__ */ React20.createElement(IconChevronDownStroked2, { size: "small" }))
+      triggerRender: ({ value }) => /* @__PURE__ */ React9.createElement(Button2, { size: "small", disabled: !rule }, opConfig?.abbreviation || /* @__PURE__ */ React9.createElement(IconChevronDownStroked, { size: "small" }))
     }
   );
   return { renderOpSelect, opConfig };
 }
 
 // src/components/condition-row/index.tsx
-function ConditionRow({ style, value, onChange, readonly }) {
+var defaultRuleConfig = {
+  ops: {},
+  rules: {}
+};
+function ConditionRow({
+  style,
+  value,
+  onChange,
+  readonly,
+  ruleConfig = defaultRuleConfig
+}) {
   const { left, operator, right } = value || {};
-  const { rule } = useRule(left);
+  const { rule } = useRule(left, ruleConfig.rules);
   const { renderOpSelect, opConfig } = useOp({
     rule,
     op: operator,
     onChange: (v) => onChange({ ...value, operator: v }),
-    readonly
+    readonly,
+    userOps: ruleConfig.ops
   });
-  const targetSchema = useMemo9(() => {
-    const targetType = rule?.[operator] || null;
+  const targetSchema = useMemo7(() => {
+    const targetType = rule?.[operator || ""] || null;
     return targetType ? { type: targetType, extra: { weak: true } } : null;
   }, [rule, opConfig]);
-  return /* @__PURE__ */ React21.createElement(UIContainer3, { style }, /* @__PURE__ */ React21.createElement(UIOperator, null, renderOpSelect()), /* @__PURE__ */ React21.createElement(UIValues, null, /* @__PURE__ */ React21.createElement(UILeft, null, /* @__PURE__ */ React21.createElement(
-    VariableSelector,
+  return /* @__PURE__ */ React10.createElement(UIContainer3, { style }, /* @__PURE__ */ React10.createElement(UIOperator, null, renderOpSelect()), /* @__PURE__ */ React10.createElement(UIValues, null, /* @__PURE__ */ React10.createElement(UILeft, null, /* @__PURE__ */ React10.createElement(
+    InjectVariableSelector,
     {
       readonly,
       style: { width: "100%" },
@@ -1876,1022 +1036,385 @@ function ConditionRow({ style, value, onChange, readonly }) {
         }
       })
     }
-  )), /* @__PURE__ */ React21.createElement(UIRight, null, targetSchema ? /* @__PURE__ */ React21.createElement(
-    DynamicValueInput,
+  )), /* @__PURE__ */ React10.createElement(UIRight, null, targetSchema ? /* @__PURE__ */ React10.createElement(
+    InjectDynamicValueInput,
     {
       readonly: readonly || !rule,
       value: right,
       schema: targetSchema,
       onChange: (v) => onChange({ ...value, right: v })
     }
-  ) : /* @__PURE__ */ React21.createElement(
-    Input4,
+  ) : /* @__PURE__ */ React10.createElement(
+    Input3,
     {
       size: "small",
       disabled: true,
       style: { pointerEvents: "none" },
-      value: opConfig?.rightDisplay || "Empty"
+      value: opConfig?.rightDisplay || I18n4.t("Empty")
     }
   ))));
 }
+ConditionRow.defaultRules = defaultRules;
+ConditionRow.defaultOpConfigs = defaultOpConfigs;
 
-// src/components/batch-outputs/index.tsx
-import React22 from "react";
-import { Button as Button3, Input as Input5 } from "@douyinfe/semi-ui";
-import { IconDelete, IconPlus as IconPlus2 } from "@douyinfe/semi-icons";
+// src/components/db-condition-row/index.tsx
+import React13, { useMemo as useMemo10 } from "react";
+import { I18n as I18n6 } from "@flowgram.ai/editor";
+import { Input as Input4 } from "@douyinfe/semi-ui";
 
-// src/hooks/use-object-list/index.tsx
-import { useEffect as useEffect4, useState as useState6 } from "react";
-import { nanoid } from "nanoid";
-import { difference, get, isObject, set } from "lodash";
-function genId2() {
-  return nanoid();
+// src/components/db-condition-row/styles.tsx
+import styled4 from "styled-components";
+import { Select as Select2 } from "@douyinfe/semi-ui";
+var UIContainer4 = styled4.div`
+  display: flex;
+  align-items: center;
+  gap: 4px;
+`;
+var UIOperator2 = styled4.div``;
+var UILeft2 = styled4.div`
+  width: 100%;
+`;
+var UIRight2 = styled4.div`
+  width: 100%;
+`;
+var UIValues2 = styled4.div`
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+`;
+var UIOptionLabel = styled4.div`
+  display: flex;
+  align-items: center;
+  gap: 10px;
+`;
+var UISelect = styled4(Select2)`
+  & .semi-select-selection {
+    margin-left: 5px;
+  }
+`;
+
+// src/components/db-condition-row/hooks/use-op.tsx
+import React11, { useMemo as useMemo8 } from "react";
+import { I18n as I18n5 } from "@flowgram.ai/editor";
+import { Button as Button3, Select as Select3 } from "@douyinfe/semi-ui";
+import { IconChevronDownStroked as IconChevronDownStroked2 } from "@douyinfe/semi-icons";
+var defaultOpConfigs2 = ConditionRow.defaultOpConfigs;
+function useOp2({ rule, op, onChange, readonly, userOps }) {
+  const options = useMemo8(
+    () => Object.keys(rule || {}).map((_op) => ({
+      ...defaultOpConfigs2[_op] || {},
+      ...userOps?.[_op] || {},
+      value: _op,
+      label: I18n5.t(userOps?.[_op]?.label || defaultOpConfigs2[_op]?.label)
+    })),
+    [rule, userOps]
+  );
+  const opConfig = useMemo8(() => defaultOpConfigs2[op], [op]);
+  const renderOpSelect = () => /* @__PURE__ */ React11.createElement(
+    Select3,
+    {
+      style: { height: 22 },
+      disabled: readonly,
+      size: "small",
+      value: op,
+      optionList: options,
+      onChange: (v) => {
+        onChange(v);
+      },
+      triggerRender: ({ value }) => /* @__PURE__ */ React11.createElement(Button3, { size: "small", disabled: !rule }, opConfig?.abbreviation || /* @__PURE__ */ React11.createElement(IconChevronDownStroked2, { size: "small" }))
+    }
+  );
+  return { renderOpSelect, opConfig };
 }
-function useObjectList({
-  value,
-  onChange,
-  sortIndexKey
-}) {
-  const [list, setList] = useState6([]);
-  useEffect4(() => {
-    setList((_prevList) => {
-      const newKeys = Object.entries(value || {}).sort((a, b) => get(a[1], sortIndexKey || 0) - get(b[1], sortIndexKey || 0)).map(([key]) => key);
-      const oldKeys = _prevList.map((item) => item.key).filter(Boolean);
-      const addKeys = difference(newKeys, oldKeys);
-      return _prevList.filter((item) => !item.key || newKeys.includes(item.key)).map((item) => ({
-        id: item.id,
-        key: item.key,
-        value: item.key ? value?.[item.key] : item.value
-      })).concat(
-        addKeys.map((_key) => ({
-          id: genId2(),
-          key: _key,
-          value: value?.[_key]
-        }))
-      );
-    });
-  }, [value]);
-  const add = () => {
-    setList((prevList) => [
-      ...prevList,
-      {
-        id: genId2()
-      }
-    ]);
-  };
-  const updateValue = (itemId, value2) => {
-    setList((prevList) => {
-      const nextList = prevList.map((_item) => {
-        if (_item.id === itemId) {
-          return {
-            ..._item,
-            value: value2
-          };
-        }
-        return _item;
-      });
-      onChange(
-        Object.fromEntries(
-          nextList.filter((item) => item.key).map((item) => [item.key, item.value]).map((_res, idx) => {
-            if (isObject(_res[1]) && sortIndexKey) {
-              set(_res[1], sortIndexKey, idx);
-            }
-            return _res;
-          })
-        )
-      );
-      return nextList;
-    });
-  };
-  const updateKey = (itemId, key) => {
-    setList((prevList) => {
-      const nextList = prevList.map((_item) => {
-        if (_item.id === itemId) {
-          return {
-            ..._item,
-            key
-          };
-        }
-        return _item;
-      });
-      onChange(
-        Object.fromEntries(
-          nextList.filter((item) => item.key).map((item) => [item.key, item.value])
-        )
-      );
-      return nextList;
-    });
-  };
-  const remove = (itemId) => {
-    setList((prevList) => {
-      const nextList = prevList.filter((_item) => _item.id !== itemId);
-      onChange(
-        Object.fromEntries(
-          nextList.filter((item) => item.key).map((item) => [item.key, item.value])
-        )
-      );
-      return nextList;
-    });
-  };
-  return { list, add, updateKey, updateValue, remove };
-}
-
-// src/components/batch-outputs/styles.tsx
-import styled6 from "styled-components";
-var UIRows = styled6.div`
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-  margin-bottom: 10px;
-`;
-var UIRow2 = styled6.div`
-  display: flex;
-  align-items: center;
-  gap: 5px;
-`;
 
-// src/components/batch-outputs/index.tsx
-function BatchOutputs(props) {
-  const { readonly, style } = props;
-  const { list, add, updateKey, updateValue, remove } = useObjectList(props);
-  return /* @__PURE__ */ React22.createElement("div", null, /* @__PURE__ */ React22.createElement(UIRows, { style }, list.map((item) => /* @__PURE__ */ React22.createElement(UIRow2, { key: item.id }, /* @__PURE__ */ React22.createElement(
-    Input5,
-    {
-      style: { width: 100 },
-      disabled: readonly,
-      size: "small",
-      value: item.key,
-      onChange: (v) => updateKey(item.id, v)
-    }
-  ), /* @__PURE__ */ React22.createElement(
-    VariableSelector,
-    {
-      style: { flexGrow: 1 },
-      readonly,
-      value: item.value?.content,
-      onChange: (v) => updateValue(item.id, { type: "ref", content: v })
+// src/components/db-condition-row/hooks/use-left.tsx
+import { useMemo as useMemo9 } from "react";
+import React12 from "react";
+import { useTypeManager as useTypeManager4 } from "@flowgram.ai/json-schema";
+import { Icon as Icon3 } from "@douyinfe/semi-ui";
+var defaultRules2 = ConditionRow.defaultRules;
+function useLeft({ left, options, userRules, readonly, onChange }) {
+  const rules = useMemo9(() => ({ ...defaultRules2, ...userRules || {} }), [userRules]);
+  const typeManager = useTypeManager4();
+  const rule = useMemo9(() => {
+    if (!left) return void 0;
+    const option = options?.find((item) => item.value === left);
+    if (!option?.schema?.type) {
+      return void 0;
     }
-  ), /* @__PURE__ */ React22.createElement(
-    Button3,
+    return rules[option.schema.type];
+  }, [left, options, rules]);
+  const renderDBOptionSelect = () => /* @__PURE__ */ React12.createElement(
+    UISelect,
     {
       disabled: readonly,
-      icon: /* @__PURE__ */ React22.createElement(IconDelete, null),
       size: "small",
-      onClick: () => remove(item.id)
+      style: { width: "100%" },
+      value: left,
+      onChange: (v) => onChange(v),
+      optionList: options?.map((item) => ({
+        label: /* @__PURE__ */ React12.createElement(UIOptionLabel, null, /* @__PURE__ */ React12.createElement(Icon3, { size: "small", svg: typeManager.getDisplayIcon(item.schema) }), item.label),
+        value: item.value
+      })) || []
     }
-  )))), /* @__PURE__ */ React22.createElement(Button3, { disabled: readonly, icon: /* @__PURE__ */ React22.createElement(IconPlus2, null), size: "small", onClick: add }, "Add"));
-}
-
-// src/components/prompt-editor/index.tsx
-import React23, { useEffect as useEffect5, useRef as useRef4 } from "react";
-import { Renderer, EditorProvider as EditorProvider2, ActiveLinePlaceholder as ActiveLinePlaceholder2 } from "@coze-editor/editor/react";
-import preset2 from "@coze-editor/editor/preset-prompt";
-
-// src/components/prompt-editor/styles.tsx
-import styled7, { css as css3 } from "styled-components";
-var UIContainer4 = styled7.div`
-  background-color: var(--semi-color-fill-0);
-  padding-left: 10px;
-  padding-right: 6px;
-
-  ${({ $hasError }) => $hasError && css3`
-      border: 1px solid var(--semi-color-danger-6);
-    `}
-`;
-
-// src/components/prompt-editor/extensions/markdown.tsx
-import { useLayoutEffect } from "react";
-import { useInjector } from "@coze-editor/editor/react";
-import { astDecorator } from "@coze-editor/editor";
-import { EditorView as EditorView2 } from "@codemirror/view";
-function MarkdownHighlight() {
-  const injector = useInjector();
-  useLayoutEffect(
-    () => injector.inject([
-      astDecorator.whole.of((cursor) => {
-        if (cursor.name.startsWith("ATXHeading")) {
-          return {
-            type: "className",
-            className: "heading"
-          };
-        }
-        if (cursor.name === "Emphasis") {
-          return {
-            type: "className",
-            className: "emphasis"
-          };
-        }
-        if (cursor.name === "StrongEmphasis") {
-          return {
-            type: "className",
-            className: "strong-emphasis"
-          };
-        }
-        if (cursor.name === "ListMark" || cursor.name === "QuoteMark") {
-          return {
-            type: "className",
-            className: "mark"
-          };
-        }
-      }),
-      EditorView2.theme({
-        ".heading": {
-          color: "#00818C",
-          fontWeight: "bold"
-        },
-        ".emphasis": {
-          fontStyle: "italic"
-        },
-        ".strong-emphasis": {
-          fontWeight: "bold"
-        },
-        ".mark": {
-          color: "#4E40E5"
-        }
-      })
-    ]),
-    [injector]
-  );
-  return null;
-}
-var markdown_default = MarkdownHighlight;
-
-// src/components/prompt-editor/extensions/language-support.tsx
-import { useLayoutEffect as useLayoutEffect2 } from "react";
-import { useInjector as useInjector2 } from "@coze-editor/editor/react";
-import { languageSupport } from "@coze-editor/editor/preset-prompt";
-function LanguageSupport() {
-  const injector = useInjector2();
-  useLayoutEffect2(() => injector.inject([languageSupport]), [injector]);
-  return null;
-}
-var language_support_default = LanguageSupport;
-
-// src/components/prompt-editor/extensions/jinja.tsx
-import { useLayoutEffect as useLayoutEffect3 } from "react";
-import { useInjector as useInjector3 } from "@coze-editor/editor/react";
-import { astDecorator as astDecorator2 } from "@coze-editor/editor";
-import { EditorView as EditorView3 } from "@codemirror/view";
-function JinjaHighlight() {
-  const injector = useInjector3();
-  useLayoutEffect3(
-    () => injector.inject([
-      astDecorator2.whole.of((cursor) => {
-        if (cursor.name === "JinjaStatementStart" || cursor.name === "JinjaStatementEnd") {
-          return {
-            type: "className",
-            className: "jinja-statement-bracket"
-          };
-        }
-        if (cursor.name === "JinjaComment") {
-          return {
-            type: "className",
-            className: "jinja-comment"
-          };
-        }
-        if (cursor.name === "JinjaExpression") {
-          return {
-            type: "className",
-            className: "jinja-expression"
-          };
-        }
-      }),
-      EditorView3.theme({
-        ".jinja-statement-bracket": {
-          color: "#D1009D"
-        },
-        ".jinja-comment": {
-          color: "#0607094D"
-        },
-        ".jinja-expression": {
-          color: "#4E40E5"
-        }
-      })
-    ]),
-    [injector]
   );
-  return null;
-}
-var jinja_default = JinjaHighlight;
-
-// src/components/prompt-editor/index.tsx
-function PromptEditor(props) {
-  const {
-    value,
-    onChange,
-    readonly,
-    placeholder,
-    activeLinePlaceholder,
-    style,
-    hasError,
-    children,
-    disableMarkdownHighlight
-  } = props || {};
-  const editorRef = useRef4(null);
-  useEffect5(() => {
-    if (editorRef.current?.getValue() !== value?.content) {
-      editorRef.current?.setValue(String(value?.content || ""));
-    }
-  }, [value]);
-  return /* @__PURE__ */ React23.createElement(UIContainer4, { $hasError: hasError, style }, /* @__PURE__ */ React23.createElement(EditorProvider2, null, /* @__PURE__ */ React23.createElement(
-    Renderer,
-    {
-      didMount: (editor) => {
-        editorRef.current = editor;
-      },
-      plugins: preset2,
-      defaultValue: String(value?.content),
-      options: {
-        readOnly: readonly,
-        editable: !readonly,
-        placeholder
-      },
-      onChange: (e) => {
-        onChange({ type: "template", content: e.value });
-      }
-    }
-  ), activeLinePlaceholder && /* @__PURE__ */ React23.createElement(ActiveLinePlaceholder2, null, activeLinePlaceholder), !disableMarkdownHighlight && /* @__PURE__ */ React23.createElement(markdown_default, null), /* @__PURE__ */ React23.createElement(language_support_default, null), /* @__PURE__ */ React23.createElement(jinja_default, null), children));
-}
-
-// src/components/prompt-editor-with-variables/index.tsx
-import React26 from "react";
-
-// src/components/prompt-editor-with-variables/extensions/variable-tree.tsx
-import React24, { useEffect as useEffect6, useState as useState7 } from "react";
-import { Popover as Popover2, Tree } from "@douyinfe/semi-ui";
-import {
-  Mention,
-  getCurrentMentionReplaceRange,
-  useEditor,
-  PositionMirror
-} from "@coze-editor/editor/react";
-function VariableTree() {
-  const [posKey, setPosKey] = useState7("");
-  const [visible, setVisible] = useState7(false);
-  const [position, setPosition] = useState7(-1);
-  const editor = useEditor();
-  function insert(variablePath) {
-    const range = getCurrentMentionReplaceRange(editor.$view.state);
-    if (!range) {
-      return;
-    }
-    editor.replaceText({
-      ...range,
-      text: "{{" + variablePath + "}}"
-    });
-    setVisible(false);
-  }
-  function handleOpenChange(e) {
-    setPosition(e.state.selection.main.head);
-    setVisible(e.value);
-  }
-  useEffect6(() => {
-    if (!editor) {
-      return;
-    }
-  }, [editor, visible]);
-  const treeData = useVariableTree({});
-  return /* @__PURE__ */ React24.createElement(React24.Fragment, null, /* @__PURE__ */ React24.createElement(Mention, { triggerCharacters: ["{", "{}", "@"], onOpenChange: handleOpenChange }), /* @__PURE__ */ React24.createElement(
-    Popover2,
-    {
-      visible,
-      trigger: "custom",
-      position: "topLeft",
-      rePosKey: posKey,
-      content: /* @__PURE__ */ React24.createElement("div", { style: { width: 300 } }, /* @__PURE__ */ React24.createElement(
-        Tree,
-        {
-          treeData,
-          onSelect: (v) => {
-            insert(v);
-          }
-        }
-      ))
-    },
-    /* @__PURE__ */ React24.createElement(
-      PositionMirror,
-      {
-        position,
-        onChange: () => setPosKey(String(Math.random()))
-      }
-    )
-  ));
+  return { rule, renderDBOptionSelect };
 }
 
-// src/components/prompt-editor-with-variables/extensions/variable-tag.tsx
-import ReactDOM from "react-dom";
-import React25, { useLayoutEffect as useLayoutEffect4 } from "react";
-import { isEqual, last } from "lodash";
-import {
-  Disposable,
-  DisposableCollection,
-  useCurrentScope
-} from "@flowgram.ai/editor";
-import { Popover as Popover3 } from "@douyinfe/semi-ui";
-import { IconIssueStroked as IconIssueStroked2 } from "@douyinfe/semi-icons";
-import { useInjector as useInjector4 } from "@coze-editor/editor/react";
-import {
-  Decoration,
-  EditorView as EditorView4,
-  MatchDecorator,
-  ViewPlugin,
-  WidgetType
-} from "@codemirror/view";
-
-// src/components/prompt-editor-with-variables/styles.tsx
-import styled8 from "styled-components";
-import { Tag as Tag2 } from "@douyinfe/semi-ui";
-var UIRootTitle2 = styled8.div`
-  margin-right: 4px;
-  min-width: 20px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  color: var(--semi-color-text-2);
-`;
-var UIVarName2 = styled8.div`
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`;
-var UITag2 = styled8(Tag2)`
-  display: inline-flex;
-  align-items: center;
-  justify-content: flex-start;
-  max-width: 300px;
-
-  & .semi-tag-content-center {
-    justify-content: flex-start;
-  }
-
-  &.semi-tag {
-    margin: 0 5px;
-  }
-`;
-var UIPopoverContent2 = styled8.div`
-  padding: 10px;
-  display: inline-flex;
-  align-items: center;
-  justify-content: flex-start;
-`;
-
-// src/components/prompt-editor-with-variables/extensions/variable-tag.tsx
-var VariableTagWidget = class extends WidgetType {
-  constructor({ keyPath, scope }) {
-    super();
-    this.toDispose = new DisposableCollection();
-    this.renderIcon = (icon) => {
-      if (typeof icon === "string") {
-        return /* @__PURE__ */ React25.createElement("img", { style: { marginRight: 8 }, width: 12, height: 12, src: icon });
-      }
-      return icon;
-    };
-    this.keyPath = keyPath;
-    this.scope = scope;
-  }
-  renderReact(jsx) {
-    ReactDOM.render(jsx, this.rootDOM);
-  }
-  renderVariable(v) {
-    if (!v) {
-      this.renderReact(
-        /* @__PURE__ */ React25.createElement(UITag2, { prefixIcon: /* @__PURE__ */ React25.createElement(IconIssueStroked2, null), color: "amber" }, "Unknown")
-      );
-      return;
-    }
-    const rootField = last(v.parentFields) || v;
-    const isRoot = v.parentFields.length === 0;
-    const rootTitle = /* @__PURE__ */ React25.createElement(UIRootTitle2, null, rootField?.meta.title ? `${rootField.meta.title} ${isRoot ? "" : "-"} ` : "");
-    const rootIcon = this.renderIcon(rootField?.meta.icon);
-    this.renderReact(
-      /* @__PURE__ */ React25.createElement(
-        Popover3,
-        {
-          content: /* @__PURE__ */ React25.createElement(UIPopoverContent2, null, rootIcon, rootTitle, /* @__PURE__ */ React25.createElement(UIVarName2, null, v?.keyPath.slice(1).join(".")))
-        },
-        /* @__PURE__ */ React25.createElement(UITag2, { prefixIcon: rootIcon }, rootTitle, !isRoot && /* @__PURE__ */ React25.createElement(UIVarName2, null, v?.key))
-      )
-    );
-  }
-  toDOM(view) {
-    const dom = document.createElement("span");
-    this.rootDOM = dom;
-    this.toDispose.push(
-      Disposable.create(() => {
-        ReactDOM.unmountComponentAtNode(this.rootDOM);
-      })
-    );
-    this.toDispose.push(
-      this.scope.available.trackByKeyPath(
-        this.keyPath,
-        (v) => {
-          this.renderVariable(v);
-        },
-        { triggerOnInit: false }
-      )
-    );
-    this.renderVariable(this.scope.available.getByKeyPath(this.keyPath));
-    return dom;
-  }
-  eq(other) {
-    return isEqual(this.keyPath, other.keyPath);
-  }
-  ignoreEvent() {
-    return false;
-  }
-  destroy(dom) {
-    this.toDispose.dispose();
-  }
+// src/components/db-condition-row/index.tsx
+var defaultRuleConfig2 = {
+  ops: {},
+  rules: {}
 };
-function VariableTagInject() {
-  const injector = useInjector4();
-  const scope = useCurrentScope();
-  useLayoutEffect4(() => {
-    const atMatcher = new MatchDecorator({
-      regexp: /\{\{([^\}]+)\}\}/g,
-      decoration: (match) => Decoration.replace({
-        widget: new VariableTagWidget({
-          keyPath: match[1]?.split(".") ?? [],
-          scope
-        })
-      })
-    });
-    return injector.inject([
-      ViewPlugin.fromClass(
-        class {
-          constructor(view) {
-            this.view = view;
-            this.decorations = atMatcher.createDeco(view);
-          }
-          update() {
-            this.decorations = atMatcher.createDeco(this.view);
-          }
-        },
-        {
-          decorations: (p) => p.decorations,
-          provide(p) {
-            return EditorView4.atomicRanges.of(
-              (view) => view.plugin(p)?.decorations ?? Decoration.none
-            );
-          }
-        }
-      )
-    ]);
-  }, [injector]);
-  return null;
-}
-
-// src/components/prompt-editor-with-variables/index.tsx
-function PromptEditorWithVariables(props) {
-  return /* @__PURE__ */ React26.createElement(PromptEditor, { ...props }, /* @__PURE__ */ React26.createElement(VariableTree, null), /* @__PURE__ */ React26.createElement(VariableTagInject, null));
-}
-
-// src/components/prompt-editor-with-inputs/index.tsx
-import React29 from "react";
-
-// src/components/prompt-editor-with-inputs/extensions/inputs-tree.tsx
-import React28, { useEffect as useEffect7, useState as useState8 } from "react";
-import { Popover as Popover4 } from "@douyinfe/semi-ui";
-import {
-  Mention as Mention2,
-  getCurrentMentionReplaceRange as getCurrentMentionReplaceRange2,
-  useEditor as useEditor2,
-  PositionMirror as PositionMirror2
-} from "@coze-editor/editor/react";
-
-// src/components/prompt-editor-with-inputs/inputs-picker.tsx
-import React27, { useMemo as useMemo10 } from "react";
-import { last as last2 } from "lodash";
-import {
-  ASTMatch as ASTMatch3,
-  useScopeAvailable as useScopeAvailable3
-} from "@flowgram.ai/editor";
-import { Tree as Tree2 } from "@douyinfe/semi-ui";
-function InputsPicker({
-  inputsValues,
-  onSelect
+function DBConditionRow({
+  style,
+  value,
+  onChange,
+  readonly,
+  options,
+  ruleConfig = defaultRuleConfig2
 }) {
-  const available = useScopeAvailable3();
-  const getArrayDrilldown = (type, depth = 1) => {
-    if (ASTMatch3.isArray(type.items)) {
-      return getArrayDrilldown(type.items, depth + 1);
-    }
-    return { type: type.items, depth };
-  };
-  const renderVariable = (variable, keyPath) => {
-    let type = variable?.type;
-    let children;
-    if (ASTMatch3.isObject(type)) {
-      children = (type.properties || []).map((_property) => renderVariable(_property, [...keyPath, _property.key])).filter(Boolean);
-    }
-    if (ASTMatch3.isArray(type)) {
-      const drilldown = getArrayDrilldown(type);
-      if (ASTMatch3.isObject(drilldown.type)) {
-        children = (drilldown.type.properties || []).map(
-          (_property) => renderVariable(_property, [
-            ...keyPath,
-            ...new Array(drilldown.depth).fill("[0]"),
-            _property.key
-          ])
-        ).filter(Boolean);
-      }
-    }
-    const key = keyPath.map((_key, idx) => _key === "[0]" || idx === 0 ? _key : `.${_key}`).join("");
-    return {
-      key,
-      label: last2(keyPath),
-      value: key,
-      children
-    };
-  };
-  const treeData = useMemo10(
-    () => Object.entries(inputsValues).map(([key, value]) => {
-      if (value?.type === "ref") {
-        const variable = available.getByKeyPath(value.content || []);
-        if (variable) {
-          return renderVariable(variable, [key]);
-        }
-      }
-      return {
-        key,
-        value: key,
-        label: key
-      };
-    }),
-    []
-  );
-  return /* @__PURE__ */ React27.createElement(Tree2, { treeData, onSelect: (v) => onSelect(v) });
-}
-
-// src/components/prompt-editor-with-inputs/extensions/inputs-tree.tsx
-function InputsTree({ inputsValues }) {
-  const [posKey, setPosKey] = useState8("");
-  const [visible, setVisible] = useState8(false);
-  const [position, setPosition] = useState8(-1);
-  const editor = useEditor2();
-  function insert(variablePath) {
-    const range = getCurrentMentionReplaceRange2(editor.$view.state);
-    if (!range) {
-      return;
-    }
-    editor.replaceText({
-      ...range,
-      text: "{{" + variablePath + "}}"
-    });
-    setVisible(false);
-  }
-  function handleOpenChange(e) {
-    setPosition(e.state.selection.main.head);
-    setVisible(e.value);
-  }
-  useEffect7(() => {
-    if (!editor) {
-      return;
+  const { left, operator, right } = value || {};
+  const { rule, renderDBOptionSelect } = useLeft({
+    left,
+    options,
+    onChange: (leftKey) => onChange({ ...value, left: leftKey }),
+    readonly,
+    userRules: ruleConfig.rules
+  });
+  const { renderOpSelect, opConfig } = useOp2({
+    rule,
+    op: operator,
+    onChange: (v) => onChange({ ...value, operator: v }),
+    readonly,
+    userOps: ruleConfig.ops
+  });
+  const targetSchema = useMemo10(() => {
+    const targetType = rule?.[operator || ""] || null;
+    return targetType ? { type: targetType, extra: { weak: true } } : null;
+  }, [rule, opConfig]);
+  return /* @__PURE__ */ React13.createElement(UIContainer4, { style }, /* @__PURE__ */ React13.createElement(UIOperator2, null, renderOpSelect()), /* @__PURE__ */ React13.createElement(UIValues2, null, /* @__PURE__ */ React13.createElement(UILeft2, null, renderDBOptionSelect()), /* @__PURE__ */ React13.createElement(UIRight2, null, targetSchema ? /* @__PURE__ */ React13.createElement(
+    InjectDynamicValueInput,
+    {
+      readonly: readonly || !rule,
+      value: right,
+      schema: targetSchema,
+      onChange: (v) => onChange({ ...value, right: v })
     }
-  }, [editor, visible]);
-  return /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement(Mention2, { triggerCharacters: ["{", "{}", "@"], onOpenChange: handleOpenChange }), /* @__PURE__ */ React28.createElement(
-    Popover4,
+  ) : /* @__PURE__ */ React13.createElement(
+    Input4,
     {
-      visible,
-      trigger: "custom",
-      position: "topLeft",
-      rePosKey: posKey,
-      content: /* @__PURE__ */ React28.createElement("div", { style: { width: 300 } }, /* @__PURE__ */ React28.createElement(
-        InputsPicker,
-        {
-          inputsValues,
-          onSelect: (v) => {
-            insert(v);
-          }
-        }
-      ))
-    },
-    /* @__PURE__ */ React28.createElement(
-      PositionMirror2,
-      {
-        position,
-        onChange: () => setPosKey(String(Math.random()))
-      }
-    )
-  ));
-}
-
-// src/components/prompt-editor-with-inputs/index.tsx
-function PromptEditorWithInputs({ inputsValues, ...restProps }) {
-  return /* @__PURE__ */ React29.createElement(PromptEditor, { ...restProps }, /* @__PURE__ */ React29.createElement(InputsTree, { inputsValues }));
+      size: "small",
+      disabled: true,
+      style: { pointerEvents: "none" },
+      value: opConfig?.rightDisplay || I18n6.t("Empty")
+    }
+  ))));
 }
 
-// src/components/json-editor-with-variables/index.tsx
-import React32 from "react";
-import { transformerCreator } from "@coze-editor/editor/preset-code";
+// src/components/batch-outputs/index.tsx
+import React14 from "react";
+import { I18n as I18n7 } from "@flowgram.ai/editor";
+import { Button as Button4, Input as Input5 } from "@douyinfe/semi-ui";
+import { IconDelete, IconPlus as IconPlus2 } from "@douyinfe/semi-icons";
 
-// src/components/json-editor-with-variables/extensions/variable-tree.tsx
-import React30, { useEffect as useEffect8, useState as useState9 } from "react";
-import { Popover as Popover5, Tree as Tree3 } from "@douyinfe/semi-ui";
-import {
-  Mention as Mention3,
-  getCurrentMentionReplaceRange as getCurrentMentionReplaceRange3,
-  useEditor as useEditor3,
-  PositionMirror as PositionMirror3
-} from "@coze-editor/editor/react";
-function VariableTree2() {
-  const [posKey, setPosKey] = useState9("");
-  const [visible, setVisible] = useState9(false);
-  const [position, setPosition] = useState9(-1);
-  const editor = useEditor3();
-  function insert(variablePath) {
-    const range = getCurrentMentionReplaceRange3(editor.$view.state);
-    if (!range) {
+// src/hooks/use-object-list/index.tsx
+import { useEffect as useEffect4, useRef as useRef3, useState as useState5 } from "react";
+import { nanoid } from "nanoid";
+import { difference as difference2, get, isObject, set } from "lodash-es";
+function genId2() {
+  return nanoid();
+}
+function useObjectList({
+  value,
+  onChange,
+  sortIndexKey
+}) {
+  const [list, setList] = useState5([]);
+  const effectVersion = useRef3(0);
+  const changeVersion = useRef3(0);
+  const getSortIndex = (value2) => {
+    if (typeof sortIndexKey === "function") {
+      return get(value2, sortIndexKey(value2)) || 0;
+    }
+    return get(value2, sortIndexKey || "") || 0;
+  };
+  useEffect4(() => {
+    effectVersion.current = effectVersion.current + 1;
+    if (effectVersion.current === changeVersion.current) {
       return;
     }
-    editor.replaceText({
-      ...range,
-      text: "{{" + variablePath + "}}"
+    effectVersion.current = changeVersion.current;
+    setList((_prevList) => {
+      const newKeys = Object.entries(value || {}).sort((a, b) => getSortIndex(a[1]) - getSortIndex(b[1])).map(([key]) => key);
+      const oldKeys = _prevList.map((item) => item.key).filter(Boolean);
+      const addKeys = difference2(newKeys, oldKeys);
+      return _prevList.filter((item) => !item.key || newKeys.includes(item.key)).map((item) => ({
+        id: item.id,
+        key: item.key,
+        value: item.key ? value?.[item.key] : item.value
+      })).concat(
+        addKeys.map((_key) => ({
+          id: genId2(),
+          key: _key,
+          value: value?.[_key]
+        }))
+      );
     });
-    setVisible(false);
-  }
-  function handleOpenChange(e) {
-    setPosition(e.state.selection.main.head);
-    setVisible(e.value);
-  }
-  useEffect8(() => {
-    if (!editor) {
-      return;
-    }
-  }, [editor, visible]);
-  const treeData = useVariableTree({});
-  return /* @__PURE__ */ React30.createElement(React30.Fragment, null, /* @__PURE__ */ React30.createElement(Mention3, { triggerCharacters: ["@"], onOpenChange: handleOpenChange }), /* @__PURE__ */ React30.createElement(
-    Popover5,
-    {
-      visible,
-      trigger: "custom",
-      position: "topLeft",
-      rePosKey: posKey,
-      content: /* @__PURE__ */ React30.createElement("div", { style: { width: 300 } }, /* @__PURE__ */ React30.createElement(
-        Tree3,
-        {
-          treeData,
-          onSelect: (v) => {
-            insert(v);
-          }
-        }
-      ))
-    },
-    /* @__PURE__ */ React30.createElement(
-      PositionMirror3,
+  }, [value]);
+  const add = (defaultValue) => {
+    setList((prevList) => [
+      ...prevList,
       {
-        position,
-        onChange: () => setPosKey(String(Math.random()))
+        id: genId2(),
+        value: defaultValue
       }
-    )
-  ));
+    ]);
+  };
+  const updateValue = (itemId, value2) => {
+    changeVersion.current = changeVersion.current + 1;
+    setList((prevList) => {
+      const nextList = prevList.map((_item) => {
+        if (_item.id === itemId) {
+          return {
+            ..._item,
+            value: value2
+          };
+        }
+        return _item;
+      });
+      onChange(
+        Object.fromEntries(
+          nextList.filter((item) => item.key).map((item) => [item.key, item.value]).map((_res, idx) => {
+            const indexKey = typeof sortIndexKey === "function" ? sortIndexKey(_res[1]) : sortIndexKey;
+            if (isObject(_res[1]) && indexKey) {
+              set(_res[1], indexKey, idx);
+            }
+            return _res;
+          })
+        )
+      );
+      return nextList;
+    });
+  };
+  const updateKey = (itemId, key) => {
+    changeVersion.current = changeVersion.current + 1;
+    setList((prevList) => {
+      const nextList = prevList.map((_item) => {
+        if (_item.id === itemId) {
+          return {
+            ..._item,
+            key
+          };
+        }
+        return _item;
+      });
+      onChange(
+        Object.fromEntries(
+          nextList.filter((item) => item.key).map((item) => [item.key, item.value])
+        )
+      );
+      return nextList;
+    });
+  };
+  const remove = (itemId) => {
+    changeVersion.current = changeVersion.current + 1;
+    setList((prevList) => {
+      const nextList = prevList.filter((_item) => _item.id !== itemId);
+      onChange(
+        Object.fromEntries(
+          nextList.filter((item) => item.key).map((item) => [item.key, item.value])
+        )
+      );
+      return nextList;
+    });
+  };
+  return { list, add, updateKey, updateValue, remove };
 }
 
-// src/components/json-editor-with-variables/extensions/variable-tag.tsx
-import React31, { useLayoutEffect as useLayoutEffect5 } from "react";
-import { createRoot } from "react-dom/client";
-import { isEqual as isEqual2, last as last3 } from "lodash";
-import {
-  Disposable as Disposable2,
-  DisposableCollection as DisposableCollection2,
-  useCurrentScope as useCurrentScope2
-} from "@flowgram.ai/editor";
-import { Popover as Popover6 } from "@douyinfe/semi-ui";
-import { IconIssueStroked as IconIssueStroked3 } from "@douyinfe/semi-icons";
-import { useInjector as useInjector5 } from "@coze-editor/editor/react";
-import {
-  Decoration as Decoration2,
-  EditorView as EditorView5,
-  MatchDecorator as MatchDecorator2,
-  ViewPlugin as ViewPlugin2,
-  WidgetType as WidgetType2
-} from "@codemirror/view";
-
-// src/components/json-editor-with-variables/styles.tsx
-import styled9 from "styled-components";
-import { Tag as Tag3 } from "@douyinfe/semi-ui";
-var UIRootTitle3 = styled9.div`
-  margin-right: 4px;
-  min-width: 20px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  color: var(--semi-color-text-2);
-`;
-var UIVarName3 = styled9.div`
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`;
-var UITag3 = styled9(Tag3)`
-  display: inline-flex;
-  align-items: center;
-  justify-content: flex-start;
-  max-width: 300px;
-
-  & .semi-tag-content-center {
-    justify-content: flex-start;
-  }
-
-  &.semi-tag {
-    margin: 0 5px;
-  }
+// src/components/batch-outputs/styles.tsx
+import styled5 from "styled-components";
+var UIRows = styled5.div`
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  margin-bottom: 10px;
 `;
-var UIPopoverContent3 = styled9.div`
-  padding: 10px;
-  display: inline-flex;
+var UIRow2 = styled5.div`
+  display: flex;
   align-items: center;
-  justify-content: flex-start;
+  gap: 5px;
 `;
 
-// src/components/json-editor-with-variables/extensions/variable-tag.tsx
-var VariableTagWidget2 = class extends WidgetType2 {
-  constructor({ keyPath, scope }) {
-    super();
-    this.toDispose = new DisposableCollection2();
-    this.renderIcon = (icon) => {
-      if (typeof icon === "string") {
-        return /* @__PURE__ */ React31.createElement("img", { style: { marginRight: 8 }, width: 12, height: 12, src: icon });
-      }
-      return icon;
-    };
-    this.keyPath = keyPath;
-    this.scope = scope;
-  }
-  renderVariable(v) {
-    if (!v) {
-      this.root.render(
-        /* @__PURE__ */ React31.createElement(UITag3, { prefixIcon: /* @__PURE__ */ React31.createElement(IconIssueStroked3, null), color: "amber" }, "Unknown")
-      );
-      return;
+// src/components/batch-outputs/index.tsx
+function BatchOutputs(props) {
+  const { readonly, style } = props;
+  const { list, add, updateKey, updateValue, remove } = useObjectList(props);
+  return /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement(UIRows, { style }, list.map((item) => /* @__PURE__ */ React14.createElement(UIRow2, { key: item.id }, /* @__PURE__ */ React14.createElement(
+    Input5,
+    {
+      style: { width: 100 },
+      disabled: readonly,
+      size: "small",
+      value: item.key,
+      onChange: (v) => updateKey(item.id, v)
     }
-    const rootField = last3(v.parentFields);
-    const rootTitle = /* @__PURE__ */ React31.createElement(UIRootTitle3, null, rootField?.meta.title ? `${rootField.meta.title} -` : "");
-    const rootIcon = this.renderIcon(rootField?.meta.icon);
-    this.root.render(
-      /* @__PURE__ */ React31.createElement(
-        Popover6,
-        {
-          content: /* @__PURE__ */ React31.createElement(UIPopoverContent3, null, rootIcon, rootTitle, /* @__PURE__ */ React31.createElement(UIVarName3, null, v?.keyPath.slice(1).join(".")))
-        },
-        /* @__PURE__ */ React31.createElement(UITag3, { prefixIcon: rootIcon }, rootTitle, /* @__PURE__ */ React31.createElement(UIVarName3, null, v?.key))
-      )
-    );
-  }
-  toDOM(view) {
-    const dom = document.createElement("span");
-    this.root = createRoot(dom);
-    this.toDispose.push(
-      Disposable2.create(() => {
-        this.root.unmount();
-      })
-    );
-    this.toDispose.push(
-      this.scope.available.trackByKeyPath(
-        this.keyPath,
-        (v) => {
-          this.renderVariable(v);
-        },
-        { triggerOnInit: false }
-      )
-    );
-    this.renderVariable(this.scope.available.getByKeyPath(this.keyPath));
-    return dom;
-  }
-  eq(other) {
-    return isEqual2(this.keyPath, other.keyPath);
-  }
-  ignoreEvent() {
-    return false;
-  }
-  destroy(dom) {
-    this.toDispose.dispose();
-  }
-};
-function VariableTagInject2() {
-  const injector = useInjector5();
-  const scope = useCurrentScope2();
-  useLayoutEffect5(() => {
-    const atMatcher = new MatchDecorator2({
-      regexp: /\{\{([^\}]+)\}\}/g,
-      decoration: (match) => Decoration2.replace({
-        widget: new VariableTagWidget2({
-          keyPath: match[1]?.split(".") ?? [],
-          scope
-        })
-      })
-    });
-    return injector.inject([
-      ViewPlugin2.fromClass(
-        class {
-          constructor(view) {
-            this.view = view;
-            this.decorations = atMatcher.createDeco(view);
-          }
-          update() {
-            this.decorations = atMatcher.createDeco(this.view);
-          }
-        },
-        {
-          decorations: (p) => p.decorations,
-          provide(p) {
-            return EditorView5.atomicRanges.of(
-              (view) => view.plugin(p)?.decorations ?? Decoration2.none
-            );
-          }
-        }
-      )
-    ]);
-  }, [injector]);
-  return null;
+  ), /* @__PURE__ */ React14.createElement(
+    InjectVariableSelector,
+    {
+      style: { flexGrow: 1 },
+      readonly,
+      value: item.value?.content,
+      onChange: (v) => updateValue(item.id, { type: "ref", content: v })
+    }
+  ), /* @__PURE__ */ React14.createElement(
+    Button4,
+    {
+      disabled: readonly,
+      icon: /* @__PURE__ */ React14.createElement(IconDelete, null),
+      size: "small",
+      onClick: () => remove(item.id)
+    }
+  )))), /* @__PURE__ */ React14.createElement(Button4, { disabled: readonly, icon: /* @__PURE__ */ React14.createElement(IconPlus2, null), size: "small", onClick: () => add() }, I18n7.t("Add")));
 }
 
+// src/components/prompt-editor-with-variables/index.tsx
+var PromptEditorWithVariables = lazySuspense(
+  () => import("./editor-VO6YAXRC.js").then((module) => ({ default: module.PromptEditorWithVariables }))
+);
+
+// src/components/prompt-editor-with-inputs/index.tsx
+var PromptEditorWithInputs = lazySuspense(
+  () => import("./editor-OXPGKPF5.js").then((module) => ({ default: module.PromptEditorWithInputs }))
+);
+
 // src/components/json-editor-with-variables/index.tsx
-function findAllMatches(inputString, regex) {
-  const globalRegex = new RegExp(
-    regex,
-    regex.flags.includes("g") ? regex.flags : regex.flags + "g"
-  );
-  let match;
-  const matches = [];
-  while ((match = globalRegex.exec(inputString)) !== null) {
-    if (match.index === globalRegex.lastIndex) {
-      globalRegex.lastIndex++;
-    }
-    matches.push({
-      match: match[0],
-      range: [match.index, match.index + match[0].length]
-    });
-  }
-  return matches;
-}
-var transformer = transformerCreator((text) => {
-  const originalSource = text.toString();
-  const matches = findAllMatches(originalSource, /\{\{([^\}]*)\}\}/g);
-  if (matches.length > 0) {
-    matches.forEach(({ range }) => {
-      text.replaceRange(range[0], range[1], "null");
-    });
-  }
-  return text;
-});
-function JsonEditorWithVariables(props) {
-  return /* @__PURE__ */ React32.createElement(
-    CodeEditor,
-    {
-      languageId: "json",
-      activeLinePlaceholder: "Press '@' to Select variable",
-      ...props,
-      options: {
-        transformer,
-        ...props.options || {}
-      }
-    },
-    /* @__PURE__ */ React32.createElement(VariableTree2, null),
-    /* @__PURE__ */ React32.createElement(VariableTagInject2, null)
-  );
-}
+var JsonEditorWithVariables = lazySuspense(
+  () => import("./editor-EYOQTGMT.js").then((module) => ({ default: module.JsonEditorWithVariables }))
+);
 
 // src/components/inputs-values/index.tsx
-import React34 from "react";
-import { Button as Button4, IconButton as IconButton5 } from "@douyinfe/semi-ui";
+import React15 from "react";
+import { I18n as I18n8 } from "@flowgram.ai/editor";
+import { Button as Button5, IconButton as IconButton4 } from "@douyinfe/semi-ui";
 import { IconDelete as IconDelete2, IconPlus as IconPlus3 } from "@douyinfe/semi-icons";
 
 // src/components/inputs-values/styles.tsx
-import styled10 from "styled-components";
-var UIRows2 = styled10.div`
+import styled6 from "styled-components";
+var UIRows2 = styled6.div`
   display: flex;
   flex-direction: column;
   gap: 10px;
   margin-bottom: 10px;
 `;
-var UIRow3 = styled10.div`
+var UIRow3 = styled6.div`
   display: flex;
-  align-items: center;
+  align-items: flex-start;
   gap: 5px;
 `;
 
-// src/components/inputs-values/components/blur-input.tsx
-import React33, { useEffect as useEffect9, useState as useState10 } from "react";
-import Input6 from "@douyinfe/semi-ui/lib/es/input";
-function BlurInput2(props) {
-  const [value, setValue] = useState10("");
-  useEffect9(() => {
-    setValue(props.value);
-  }, [props.value]);
-  return /* @__PURE__ */ React33.createElement(
-    Input6,
-    {
-      ...props,
-      value,
-      onChange: (value2) => {
-        setValue(value2);
-      },
-      onBlur: (e) => props.onChange?.(value, e)
-    }
-  );
-}
-
 // src/components/inputs-values/index.tsx
 function InputsValues({
   value,
@@ -2907,18 +1430,18 @@ function InputsValues({
     onChange,
     sortIndexKey: "extra.index"
   });
-  return /* @__PURE__ */ React34.createElement("div", null, /* @__PURE__ */ React34.createElement(UIRows2, { style }, list.map((item) => /* @__PURE__ */ React34.createElement(UIRow3, { key: item.id }, /* @__PURE__ */ React34.createElement(
-    BlurInput2,
+  return /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement(UIRows2, { style }, list.map((item) => /* @__PURE__ */ React15.createElement(UIRow3, { key: item.id }, /* @__PURE__ */ React15.createElement(
+    BlurInput,
     {
       style: { width: 100, minWidth: 100, maxWidth: 100 },
       disabled: readonly,
       size: "small",
       value: item.key,
       onChange: (v) => updateKey(item.id, v),
-      placeholder: "Input Key"
+      placeholder: I18n8.t("Input Key")
     }
-  ), /* @__PURE__ */ React34.createElement(
-    DynamicValueInput,
+  ), /* @__PURE__ */ React15.createElement(
+    InjectDynamicValueInput,
     {
       style: { flexGrow: 1 },
       readonly,
@@ -2931,24 +1454,37 @@ function InputsValues({
         strategies: [...constantProps?.strategies || []]
       }
     }
-  ), /* @__PURE__ */ React34.createElement(
-    IconButton5,
+  ), /* @__PURE__ */ React15.createElement(
+    IconButton4,
     {
       disabled: readonly,
       theme: "borderless",
-      icon: /* @__PURE__ */ React34.createElement(IconDelete2, { size: "small" }),
+      icon: /* @__PURE__ */ React15.createElement(IconDelete2, { size: "small" }),
       size: "small",
       onClick: () => remove(item.id)
     }
-  )))), /* @__PURE__ */ React34.createElement(Button4, { disabled: readonly, icon: /* @__PURE__ */ React34.createElement(IconPlus3, null), size: "small", onClick: add }, "Add"));
+  )))), /* @__PURE__ */ React15.createElement(
+    Button5,
+    {
+      disabled: readonly,
+      icon: /* @__PURE__ */ React15.createElement(IconPlus3, null),
+      size: "small",
+      onClick: () => add({
+        type: "constant",
+        content: "",
+        schema: { type: "string" }
+      })
+    },
+    I18n8.t("Add")
+  ));
 }
 
 // src/components/display-schema-tree/index.tsx
-import React35 from "react";
+import React16 from "react";
 
 // src/components/display-schema-tree/styles.tsx
-import styled11, { css as css4 } from "styled-components";
-var TreeRow = styled11.div`
+import styled7, { css as css2 } from "styled-components";
+var TreeRow = styled7.div`
   display: flex;
   align-items: center;
 
@@ -2961,7 +1497,7 @@ var TreeRow = styled11.div`
   height: 27px;
   white-space: nowrap;
 `;
-var HorizontalLine = styled11.div`
+var HorizontalLine = styled7.div`
   position: relative;
 
   &::before,
@@ -2978,11 +1514,11 @@ var HorizontalLine = styled11.div`
     height: 1px;
   }
 `;
-var TreeTitle = styled11.div`
+var TreeTitle = styled7.div`
   // overflow: hidden;
   // text-overflow: ellipsis;
 `;
-var TreeLevel = styled11.div`
+var TreeLevel = styled7.div`
   padding-left: 30px;
   position: relative;
 
@@ -2996,7 +1532,7 @@ var TreeLevel = styled11.div`
     width: 1px;
   } */
 `;
-var TreeItem = styled11.div`
+var TreeItem = styled7.div`
   position: relative;
 
   &::before {
@@ -3019,7 +1555,7 @@ var TreeItem = styled11.div`
     left: -22px;
   }
 
-  ${(props) => props.depth === 0 && css4`
+  ${(props) => props.depth === 0 && css2`
       &::before {
         width: 0px !important;
       }
@@ -3028,7 +1564,7 @@ var TreeItem = styled11.div`
 
 // src/components/display-schema-tree/index.tsx
 function DisplaySchemaTree(props) {
-  return /* @__PURE__ */ React35.createElement(SchemaTree, { ...props });
+  return /* @__PURE__ */ React16.createElement(SchemaTree, { ...props });
 }
 function SchemaTree(props) {
   const {
@@ -3044,27 +1580,27 @@ function SchemaTree(props) {
   const icon = typeManager?.getDisplayIcon(schema);
   let properties = drilldown && config ? config.getTypeSchemaProperties(schema) : {};
   const childEntries = Object.entries(properties || {});
-  return /* @__PURE__ */ React35.createElement(TreeItem, { depth, key: parentKey || "root" }, /* @__PURE__ */ React35.createElement(TreeRow, null, depth !== 0 && /* @__PURE__ */ React35.createElement(HorizontalLine, null), showIcon && icon && React35.cloneElement(icon, {
+  return /* @__PURE__ */ React16.createElement(TreeItem, { depth, key: parentKey || "root" }, /* @__PURE__ */ React16.createElement(TreeRow, null, depth !== 0 && /* @__PURE__ */ React16.createElement(HorizontalLine, null), showIcon && icon && React16.cloneElement(icon, {
     className: "tree-icon"
-  }), /* @__PURE__ */ React35.createElement(TreeTitle, null, parentKey ? /* @__PURE__ */ React35.createElement(React35.Fragment, null, `${parentKey} (`, title, ")") : title)), childEntries?.length ? /* @__PURE__ */ React35.createElement(TreeLevel, null, childEntries.map(([key, value]) => /* @__PURE__ */ React35.createElement(SchemaTree, { key, ...props, parentKey: key, value, depth: depth + 1 }))) : null);
+  }), /* @__PURE__ */ React16.createElement(TreeTitle, null, parentKey ? /* @__PURE__ */ React16.createElement(React16.Fragment, null, `${parentKey} (`, title, ")") : title)), childEntries?.length ? /* @__PURE__ */ React16.createElement(TreeLevel, null, childEntries.map(([key, value]) => /* @__PURE__ */ React16.createElement(SchemaTree, { key, ...props, parentKey: key, value, depth: depth + 1 }))) : null);
 }
 
 // src/components/display-outputs/index.tsx
-import React37, { useEffect as useEffect10 } from "react";
-import { JsonSchemaUtils as JsonSchemaUtils5 } from "@flowgram.ai/json-schema";
-import { useCurrentScope as useCurrentScope3, useRefresh } from "@flowgram.ai/editor";
+import React18, { useEffect as useEffect5 } from "react";
+import { JsonSchemaUtils as JsonSchemaUtils4 } from "@flowgram.ai/json-schema";
+import { useCurrentScope, useRefresh } from "@flowgram.ai/editor";
 
 // src/components/display-schema-tag/index.tsx
-import React36 from "react";
-import { Popover as Popover7 } from "@douyinfe/semi-ui";
+import React17 from "react";
+import { Popover } from "@douyinfe/semi-ui";
 
 // src/components/display-schema-tag/styles.ts
-import styled12 from "styled-components";
-import { Tag as Tag4 } from "@douyinfe/semi-ui";
-var PopoverContent = styled12.div`
+import styled8 from "styled-components";
+import { Tag } from "@douyinfe/semi-ui";
+var PopoverContent = styled8.div`
   padding: 10px;
 `;
-var StyledTag = styled12(Tag4)`
+var StyledTag = styled8(Tag)`
   padding: 4px;
 
   .tag-icon {
@@ -3072,7 +1608,7 @@ var StyledTag = styled12(Tag4)`
     height: 12px;
   }
 `;
-var TitleSpan = styled12.span`
+var TitleSpan = styled8.span`
   display: inline-block;
   margin-left: 4px;
   margin-top: -1px;
@@ -3084,20 +1620,20 @@ var TitleSpan = styled12.span`
 function DisplaySchemaTag({ value = {}, showIconInTree, title, warning }) {
   const typeManager = useTypeManager();
   const icon = typeManager?.getDisplayIcon(value) || typeManager.getDisplayIcon({ type: "unknown" });
-  return /* @__PURE__ */ React36.createElement(
-    Popover7,
+  return /* @__PURE__ */ React17.createElement(
+    Popover,
     {
-      content: /* @__PURE__ */ React36.createElement(PopoverContent, null, /* @__PURE__ */ React36.createElement(DisplaySchemaTree, { value, typeManager, showIcon: showIconInTree }))
+      content: /* @__PURE__ */ React17.createElement(PopoverContent, null, /* @__PURE__ */ React17.createElement(DisplaySchemaTree, { value, typeManager, showIcon: showIconInTree }))
     },
-    /* @__PURE__ */ React36.createElement(StyledTag, { color: warning ? "amber" : "white" }, icon && React36.cloneElement(icon, {
+    /* @__PURE__ */ React17.createElement(StyledTag, { color: warning ? "amber" : "white" }, icon && React17.cloneElement(icon, {
       className: "tag-icon"
-    }), title && /* @__PURE__ */ React36.createElement(TitleSpan, null, title))
+    }), title && /* @__PURE__ */ React17.createElement(TitleSpan, null, title))
   );
 }
 
 // src/components/display-outputs/styles.ts
-import styled13 from "styled-components";
-var DisplayOutputsWrapper = styled13.div`
+import styled9 from "styled-components";
+var DisplayOutputsWrapper = styled9.div`
   display: flex;
   gap: 5px;
   flex-wrap: wrap;
@@ -3105,9 +1641,9 @@ var DisplayOutputsWrapper = styled13.div`
 
 // src/components/display-outputs/index.tsx
 function DisplayOutputs({ value, showIconInTree, displayFromScope }) {
-  const scope = useCurrentScope3();
+  const scope = useCurrentScope();
   const refresh = useRefresh();
-  useEffect10(() => {
+  useEffect5(() => {
     if (!displayFromScope) {
       return () => null;
     }
@@ -3121,12 +1657,12 @@ function DisplayOutputs({ value, showIconInTree, displayFromScope }) {
   const properties = displayFromScope ? scope.output.variables?.reduce((acm, curr) => {
     acm = {
       ...acm,
-      ...JsonSchemaUtils5.astToSchema(curr.type)?.properties || {}
+      ...JsonSchemaUtils4.astToSchema(curr.type)?.properties || {}
     };
     return acm;
   }, {}) : value?.properties || {};
   const childEntries = Object.entries(properties || {});
-  return /* @__PURE__ */ React37.createElement(DisplayOutputsWrapper, null, childEntries.map(([key, schema]) => /* @__PURE__ */ React37.createElement(
+  return /* @__PURE__ */ React18.createElement(DisplayOutputsWrapper, null, childEntries.map(([key, schema]) => /* @__PURE__ */ React18.createElement(
     DisplaySchemaTag,
     {
       key,
@@ -3139,36 +1675,25 @@ function DisplayOutputs({ value, showIconInTree, displayFromScope }) {
 }
 
 // src/components/display-flow-value/index.tsx
-import React38, { useMemo as useMemo11 } from "react";
-import { JsonSchemaUtils as JsonSchemaUtils6 } from "@flowgram.ai/json-schema";
-import { useScopeAvailable as useScopeAvailable4 } from "@flowgram.ai/editor";
+import React19, { useMemo as useMemo11 } from "react";
+import { JsonSchemaUtils as JsonSchemaUtils5 } from "@flowgram.ai/json-schema";
+import { useScopeAvailable as useScopeAvailable3 } from "@flowgram.ai/editor";
 function DisplayFlowValue({ value, title, showIconInTree }) {
-  const available = useScopeAvailable4();
+  const available = useScopeAvailable3();
   const variable = value?.type === "ref" ? available.getByKeyPath(value?.content) : void 0;
   const schema = useMemo11(() => {
     if (value?.type === "ref") {
-      return JsonSchemaUtils6.astToSchema(variable?.type);
+      return JsonSchemaUtils5.astToSchema(variable?.type);
     }
     if (value?.type === "template") {
       return { type: "string" };
     }
     if (value?.type === "constant") {
-      if (value?.schema) {
-        return value?.schema;
-      }
-      if (typeof value?.content === "string") {
-        return { type: "string" };
-      }
-      if (typeof value?.content === "number") {
-        return { type: "number" };
-      }
-      if (typeof value?.content === "boolean") {
-        return { type: "boolean" };
-      }
+      return FlowValueUtils.inferConstantJsonSchema(value);
     }
     return { type: "unknown" };
   }, [value, variable?.hash]);
-  return /* @__PURE__ */ React38.createElement(
+  return /* @__PURE__ */ React19.createElement(
     DisplaySchemaTag,
     {
       title,
@@ -3180,11 +1705,13 @@ function DisplayFlowValue({ value, title, showIconInTree }) {
 }
 
 // src/components/display-inputs-values/index.tsx
-import React39 from "react";
+import React20, { useMemo as useMemo12 } from "react";
+import { isPlainObject } from "lodash-es";
+import { useScopeAvailable as useScopeAvailable4 } from "@flowgram.ai/editor";
 
 // src/components/display-inputs-values/styles.ts
-import styled14 from "styled-components";
-var DisplayInputsWrapper = styled14.div`
+import styled10 from "styled-components";
+var DisplayInputsWrapper = styled10.div`
   display: flex;
   gap: 5px;
   flex-wrap: wrap;
@@ -3193,30 +1720,58 @@ var DisplayInputsWrapper = styled14.div`
 // src/components/display-inputs-values/index.tsx
 function DisplayInputsValues({ value, showIconInTree }) {
   const childEntries = Object.entries(value || {});
-  return /* @__PURE__ */ React39.createElement(DisplayInputsWrapper, null, childEntries.map(([key, value2]) => /* @__PURE__ */ React39.createElement(DisplayFlowValue, { key, title: key, value: value2, showIconInTree })));
+  return /* @__PURE__ */ React20.createElement(DisplayInputsWrapper, null, childEntries.map(([key, value2]) => {
+    if (FlowValueUtils.isFlowValue(value2)) {
+      return /* @__PURE__ */ React20.createElement(DisplayFlowValue, { key, title: key, value: value2, showIconInTree });
+    }
+    if (isPlainObject(value2)) {
+      return /* @__PURE__ */ React20.createElement(
+        DisplayInputsValueAllInTag,
+        {
+          key,
+          title: key,
+          value: value2,
+          showIconInTree
+        }
+      );
+    }
+    return null;
+  }));
+}
+function DisplayInputsValueAllInTag({
+  value,
+  title,
+  showIconInTree
+}) {
+  const available = useScopeAvailable4();
+  const schema = useMemo12(
+    () => FlowValueUtils.inferJsonSchema(value, available.scope),
+    [available.version, value]
+  );
+  return /* @__PURE__ */ React20.createElement(DisplaySchemaTag, { title, value: schema, showIconInTree });
 }
 
 // src/components/assign-rows/index.tsx
-import React42 from "react";
+import React23 from "react";
 import { FieldArray } from "@flowgram.ai/editor";
-import { Button as Button5 } from "@douyinfe/semi-ui";
+import { Button as Button6 } from "@douyinfe/semi-ui";
 import { IconPlus as IconPlus4 } from "@douyinfe/semi-icons";
 
 // src/components/assign-row/index.tsx
-import React41 from "react";
-import { IconButton as IconButton6 } from "@douyinfe/semi-ui";
+import React22 from "react";
+import { IconButton as IconButton5 } from "@douyinfe/semi-ui";
 import { IconMinus as IconMinus2 } from "@douyinfe/semi-icons";
 
 // src/components/assign-row/components/blur-input.tsx
-import React40, { useEffect as useEffect11, useState as useState11 } from "react";
-import Input7 from "@douyinfe/semi-ui/lib/es/input";
-function BlurInput3(props) {
-  const [value, setValue] = useState11("");
-  useEffect11(() => {
+import React21, { useEffect as useEffect6, useState as useState6 } from "react";
+import Input6 from "@douyinfe/semi-ui/lib/es/input";
+function BlurInput2(props) {
+  const [value, setValue] = useState6("");
+  useEffect6(() => {
     setValue(props.value);
   }, [props.value]);
-  return /* @__PURE__ */ React40.createElement(
-    Input7,
+  return /* @__PURE__ */ React21.createElement(
+    Input6,
     {
       ...props,
       value,
@@ -3238,8 +1793,8 @@ function AssignRow(props) {
     onDelete,
     readonly
   } = props;
-  return /* @__PURE__ */ React41.createElement("div", { style: { display: "flex", alignItems: "center", gap: 5 } }, /* @__PURE__ */ React41.createElement("div", { style: { width: 150, minWidth: 150, maxWidth: 150 } }, value?.operator === "assign" ? /* @__PURE__ */ React41.createElement(
-    VariableSelector,
+  return /* @__PURE__ */ React22.createElement("div", { style: { display: "flex", alignItems: "center", gap: 5 } }, /* @__PURE__ */ React22.createElement("div", { style: { width: 150, minWidth: 150, maxWidth: 150 } }, value?.operator === "assign" ? /* @__PURE__ */ React22.createElement(
+    InjectVariableSelector,
     {
       style: { width: "100%", height: 26 },
       value: value?.left?.content,
@@ -3249,8 +1804,8 @@ function AssignRow(props) {
         left: { type: "ref", content: v }
       })
     }
-  ) : /* @__PURE__ */ React41.createElement(
-    BlurInput3,
+  ) : /* @__PURE__ */ React22.createElement(
+    BlurInput2,
     {
       style: { height: 26 },
       size: "small",
@@ -3261,8 +1816,8 @@ function AssignRow(props) {
         left: v
       })
     }
-  )), /* @__PURE__ */ React41.createElement("div", { style: { flexGrow: 1 } }, /* @__PURE__ */ React41.createElement(
-    DynamicValueInput,
+  )), /* @__PURE__ */ React22.createElement("div", { style: { flexGrow: 1 } }, /* @__PURE__ */ React22.createElement(
+    InjectDynamicValueInput,
     {
       readonly,
       value: value?.right,
@@ -3271,12 +1826,12 @@ function AssignRow(props) {
         right: v
       })
     }
-  )), onDelete && /* @__PURE__ */ React41.createElement("div", null, /* @__PURE__ */ React41.createElement(
-    IconButton6,
+  )), onDelete && /* @__PURE__ */ React22.createElement("div", null, /* @__PURE__ */ React22.createElement(
+    IconButton5,
     {
       size: "small",
       theme: "borderless",
-      icon: /* @__PURE__ */ React41.createElement(IconMinus2, null),
+      icon: /* @__PURE__ */ React22.createElement(IconMinus2, null),
       onClick: () => onDelete?.()
     }
   )));
@@ -3285,7 +1840,7 @@ function AssignRow(props) {
 // src/components/assign-rows/index.tsx
 function AssignRows(props) {
   const { name, readonly } = props;
-  return /* @__PURE__ */ React42.createElement(FieldArray, { name }, ({ field }) => /* @__PURE__ */ React42.createElement(React42.Fragment, null, field.map((childField, index) => /* @__PURE__ */ React42.createElement(
+  return /* @__PURE__ */ React23.createElement(FieldArray, { name }, ({ field }) => /* @__PURE__ */ React23.createElement(React23.Fragment, null, field.map((childField, index) => /* @__PURE__ */ React23.createElement(
     AssignRow,
     {
       key: childField.key,
@@ -3296,27 +1851,341 @@ function AssignRows(props) {
       },
       onDelete: () => field.remove(index)
     }
-  )), /* @__PURE__ */ React42.createElement("div", { style: { display: "flex", gap: 5 } }, /* @__PURE__ */ React42.createElement(
-    Button5,
+  )), /* @__PURE__ */ React23.createElement("div", { style: { display: "flex", gap: 5 } }, /* @__PURE__ */ React23.createElement(
+    Button6,
     {
       size: "small",
       theme: "borderless",
-      icon: /* @__PURE__ */ React42.createElement(IconPlus4, null),
+      icon: /* @__PURE__ */ React23.createElement(IconPlus4, null),
       onClick: () => field.append({ operator: "assign" })
     },
     "Assign"
-  ), /* @__PURE__ */ React42.createElement(
-    Button5,
+  ), /* @__PURE__ */ React23.createElement(
+    Button6,
     {
       size: "small",
       theme: "borderless",
-      icon: /* @__PURE__ */ React42.createElement(IconPlus4, null),
+      icon: /* @__PURE__ */ React23.createElement(IconPlus4, null),
       onClick: () => field.append({ operator: "declare" })
     },
     "Declaration"
   ))));
 }
 
+// src/components/inputs-values-tree/index.tsx
+import React26 from "react";
+import { I18n as I18n10 } from "@flowgram.ai/editor";
+import { Button as Button7 } from "@douyinfe/semi-ui";
+import { IconPlus as IconPlus5 } from "@douyinfe/semi-icons";
+
+// src/components/inputs-values-tree/styles.tsx
+import React24 from "react";
+import styled11, { css as css3 } from "styled-components";
+import Icon4 from "@douyinfe/semi-icons";
+var UIContainer5 = styled11.div``;
+var UIRow4 = styled11.div`
+  display: flex;
+  align-items: flex-start;
+  gap: 5px;
+`;
+var UICollapseTrigger2 = styled11.div`
+  cursor: pointer;
+  margin-right: 5px;
+`;
+var UITreeItems2 = styled11.div`
+  display: grid;
+  grid-template-columns: auto 1fr;
+
+  ${({ $shrink }) => $shrink && css3`
+      padding-left: 3px;
+      margin-top: 10px;
+    `}
+`;
+var UITreeItemLeft2 = styled11.div`
+  grid-column: 1;
+  position: relative;
+  width: 16px;
+
+  ${({ $showLine, $isLast, $showCollapse }) => {
+  let height = $isLast ? "24px" : "100%";
+  let width = $showCollapse ? "12px" : "30px";
+  return $showLine && css3`
+        &::before {
+          /* 竖线 */
+          content: '';
+          height: ${height};
+          position: absolute;
+          left: -14px;
+          top: -16px;
+          width: 1px;
+          background: #d9d9d9;
+          display: block;
+        }
+
+        &::after {
+          /* 横线 */
+          content: '';
+          position: absolute;
+          left: -14px; // 横线起点和竖线对齐
+          top: 8px; // 跟随你的行高调整
+          width: ${width}; // 横线长度
+          height: 1px;
+          background: #d9d9d9;
+          display: block;
+        }
+      `;
+}}
+`;
+var UITreeItemRight2 = styled11.div`
+  grid-column: 2;
+  margin-bottom: 10px;
+
+  &:last-child {
+    margin-bottom: 0px;
+  }
+`;
+var UITreeItemMain2 = styled11.div`
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  position: relative;
+`;
+var UICollapsible2 = styled11.div`
+  display: none;
+
+  ${({ $collapse }) => $collapse && css3`
+      display: block;
+    `}
+`;
+var UIActions2 = styled11.div`
+  white-space: nowrap;
+`;
+var iconAddChildrenSvg2 = /* @__PURE__ */ React24.createElement(
+  "svg",
+  {
+    className: "icon-icon icon-icon-coz_add_node ",
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    xmlns: "http://www.w3.org/2000/svg"
+  },
+  /* @__PURE__ */ React24.createElement(
+    "path",
+    {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M11 6.49988C11 8.64148 9.50397 10.4337 7.49995 10.8884V15.4998C7.49995 16.0521 7.94767 16.4998 8.49995 16.4998H11.208C11.0742 16.8061 11 17.1443 11 17.4998C11 17.8554 11.0742 18.1936 11.208 18.4998H8.49995C6.8431 18.4998 5.49995 17.1567 5.49995 15.4998V10.8884C3.49599 10.4336 2 8.64145 2 6.49988C2 4.0146 4.01472 1.99988 6.5 1.99988C8.98528 1.99988 11 4.0146 11 6.49988ZM6.5 8.99988C7.88071 8.99988 9 7.88059 9 6.49988C9 5.11917 7.88071 3.99988 6.5 3.99988C5.11929 3.99988 4 5.11917 4 6.49988C4 7.88059 5.11929 8.99988 6.5 8.99988Z"
+    }
+  ),
+  /* @__PURE__ */ React24.createElement("path", { d: "M17.5 12.4999C18.0523 12.4999 18.5 12.9476 18.5 13.4999V16.4999H21.5C22.0523 16.4999 22.5 16.9476 22.5 17.4999C22.5 18.0522 22.0523 18.4999 21.5 18.4999H18.5V21.4999C18.5 22.0522 18.0523 22.4999 17.5 22.4999C16.9477 22.4999 16.5 22.0522 16.5 21.4999V18.4999H13.5C12.9477 18.4999 12.5 18.0522 12.5 17.4999C12.5 16.9476 12.9477 16.4999 13.5 16.4999H16.5V13.4999C16.5 12.9476 16.9477 12.4999 17.5 12.4999Z" })
+);
+var IconAddChildren2 = () => /* @__PURE__ */ React24.createElement(Icon4, { size: "small", svg: iconAddChildrenSvg2 });
+
+// src/components/inputs-values-tree/row.tsx
+import React25, { useMemo as useMemo14, useState as useState7 } from "react";
+import { I18n as I18n9 } from "@flowgram.ai/editor";
+import { IconButton as IconButton6, Input as Input7 } from "@douyinfe/semi-ui";
+import { IconChevronDown as IconChevronDown2, IconChevronRight as IconChevronRight2, IconDelete as IconDelete3 } from "@douyinfe/semi-icons";
+
+// src/components/inputs-values-tree/hooks/use-child-list.tsx
+import { useMemo as useMemo13 } from "react";
+import { isPlainObject as isPlainObject2 } from "lodash-es";
+function useChildList(value, onChange) {
+  const canAddField = useMemo13(() => {
+    if (!isPlainObject2(value)) {
+      return false;
+    }
+    if (FlowValueUtils.isFlowValue(value)) {
+      return FlowValueUtils.isConstant(value) && value?.schema?.type === "object";
+    }
+    return true;
+  }, [value]);
+  const objectListValue = useMemo13(() => {
+    if (isPlainObject2(value)) {
+      if (FlowValueUtils.isFlowValue(value)) {
+        return void 0;
+      }
+      return value;
+    }
+    return void 0;
+  }, [value]);
+  const { list, add, updateKey, updateValue, remove } = useObjectList({
+    value: objectListValue,
+    onChange: (value2) => {
+      onChange?.(value2);
+    },
+    sortIndexKey: (value2) => FlowValueUtils.isFlowValue(value2) ? "extra.index" : ""
+  });
+  const hasChildren = useMemo13(
+    () => canAddField && (list.length > 0 || Object.keys(objectListValue || {}).length > 0),
+    [canAddField, list.length, Object.keys(objectListValue || {}).length]
+  );
+  return {
+    canAddField,
+    hasChildren,
+    list,
+    add,
+    updateKey,
+    updateValue,
+    remove
+  };
+}
+
+// src/components/inputs-values-tree/row.tsx
+var AddObjectChildStrategy = {
+  hit: (schema) => schema.type === "object",
+  Renderer: () => /* @__PURE__ */ React25.createElement(
+    Input7,
+    {
+      size: "small",
+      disabled: true,
+      style: { pointerEvents: "none" },
+      value: I18n9.t("Configure via child fields")
+    }
+  )
+};
+function InputValueRow(props) {
+  const {
+    keyName,
+    value,
+    $level = 0,
+    onUpdateKey,
+    onUpdateValue,
+    $isLast,
+    onRemove,
+    constantProps,
+    hasError,
+    readonly
+  } = props;
+  const [collapse, setCollapse] = useState7(false);
+  const { canAddField, hasChildren, list, add, updateKey, updateValue, remove } = useChildList(
+    value,
+    onUpdateValue
+  );
+  const strategies = useMemo14(
+    () => [...hasChildren ? [AddObjectChildStrategy] : [], ...constantProps?.strategies || []],
+    [hasChildren, constantProps?.strategies]
+  );
+  const flowDisplayValue = useMemo14(
+    () => hasChildren ? {
+      type: "constant",
+      schema: { type: "object" }
+    } : value,
+    [hasChildren, value]
+  );
+  return /* @__PURE__ */ React25.createElement(React25.Fragment, null, /* @__PURE__ */ React25.createElement(UITreeItemLeft2, { $isLast, $showLine: $level > 0, $showCollapse: hasChildren }, hasChildren && /* @__PURE__ */ React25.createElement(UICollapseTrigger2, { onClick: () => setCollapse((_collapse) => !_collapse) }, collapse ? /* @__PURE__ */ React25.createElement(IconChevronDown2, { size: "small" }) : /* @__PURE__ */ React25.createElement(IconChevronRight2, { size: "small" }))), /* @__PURE__ */ React25.createElement(UITreeItemRight2, null, /* @__PURE__ */ React25.createElement(UITreeItemMain2, null, /* @__PURE__ */ React25.createElement(UIRow4, null, /* @__PURE__ */ React25.createElement(
+    BlurInput,
+    {
+      style: { width: 100, minWidth: 100, maxWidth: 100 },
+      disabled: readonly,
+      size: "small",
+      value: keyName,
+      onChange: (v) => onUpdateKey?.(v),
+      placeholder: I18n9.t("Input Key")
+    }
+  ), /* @__PURE__ */ React25.createElement(
+    InjectDynamicValueInput,
+    {
+      style: { flexGrow: 1 },
+      readonly,
+      value: flowDisplayValue,
+      onChange: (v) => onUpdateValue(v),
+      hasError,
+      constantProps: {
+        ...constantProps,
+        strategies
+      }
+    }
+  ), /* @__PURE__ */ React25.createElement(UIActions2, null, canAddField && /* @__PURE__ */ React25.createElement(
+    IconButton6,
+    {
+      disabled: readonly,
+      size: "small",
+      theme: "borderless",
+      icon: /* @__PURE__ */ React25.createElement(IconAddChildren2, null),
+      onClick: () => {
+        add({
+          type: "constant",
+          content: "",
+          schema: { type: "string" }
+        });
+        setCollapse(true);
+      }
+    }
+  ), /* @__PURE__ */ React25.createElement(
+    IconButton6,
+    {
+      disabled: readonly,
+      theme: "borderless",
+      icon: /* @__PURE__ */ React25.createElement(IconDelete3, { size: "small" }),
+      size: "small",
+      onClick: () => onRemove?.()
+    }
+  )))), hasChildren && /* @__PURE__ */ React25.createElement(UICollapsible2, { $collapse: collapse }, /* @__PURE__ */ React25.createElement(UITreeItems2, { $shrink: true }, list.map((_item, index) => /* @__PURE__ */ React25.createElement(
+    InputValueRow,
+    {
+      readonly,
+      hasError,
+      constantProps,
+      key: _item.id,
+      keyName: _item.key,
+      value: _item.value,
+      $level: $level + 1,
+      onUpdateValue: (_v) => {
+        updateValue(_item.id, _v);
+      },
+      onUpdateKey: (k) => {
+        updateKey(_item.id, k);
+      },
+      onRemove: () => {
+        remove(_item.id);
+      },
+      $isLast: index === list.length - 1
+    }
+  ))))));
+}
+
+// src/components/inputs-values-tree/index.tsx
+function InputsValuesTree(props) {
+  const { value, onChange, readonly, hasError, constantProps } = props;
+  const { list, updateKey, updateValue, remove, add } = useObjectList({
+    value,
+    onChange,
+    sortIndexKey: (value2) => FlowValueUtils.isFlowValue(value2) ? "extra.index" : ""
+  });
+  return /* @__PURE__ */ React26.createElement("div", null, /* @__PURE__ */ React26.createElement(UITreeItems2, null, list.map((item) => /* @__PURE__ */ React26.createElement(
+    InputValueRow,
+    {
+      key: item.id,
+      keyName: item.key,
+      value: item.value,
+      onUpdateKey: (key) => updateKey(item.id, key),
+      onUpdateValue: (value2) => updateValue(item.id, value2),
+      onRemove: () => remove(item.id),
+      readonly,
+      hasError,
+      constantProps
+    }
+  ))), /* @__PURE__ */ React26.createElement(
+    Button7,
+    {
+      style: { marginTop: 10, marginLeft: 16 },
+      disabled: readonly,
+      icon: /* @__PURE__ */ React26.createElement(IconPlus5, null),
+      size: "small",
+      onClick: () => {
+        add({
+          type: "constant",
+          content: "",
+          schema: { type: "string" }
+        });
+      }
+    },
+    I18n10.t("Add")
+  ));
+}
+
 // src/effects/provide-batch-input/index.ts
 import {
   ASTFactory,
@@ -3353,7 +2222,6 @@ var provideBatchInputEffect = createEffectFromVariableProvider({
 });
 
 // src/effects/auto-rename-ref/index.ts
-import { isArray, isObject as isObject2, uniq } from "lodash";
 import {
   DataEvent,
   VariableFieldKeyRenameService
@@ -3380,7 +2248,7 @@ var autoRenameRefEffect = [
               form.setValueIn(_drilldownName, _v);
             }
           } else if (_v.type === "template") {
-            const templateKeyPaths = getTemplateKeyPaths(_v);
+            const templateKeyPaths = FlowValueUtils.getTemplateKeyPaths(_v);
             let hasMatch = false;
             templateKeyPaths.forEach((_keyPath) => {
               if (isKeyPathMatch(_keyPath, beforeKeyPath)) {
@@ -3410,44 +2278,17 @@ var autoRenameRefEffect = [
 function isKeyPathMatch(keyPath = [], targetKeyPath) {
   return targetKeyPath.every((_key, index) => _key === keyPath[index]);
 }
-function getTemplateKeyPaths(value) {
-  const keyPathReg = /{{(.*?)}}/g;
-  return uniq(value.content?.match(keyPathReg) || []).map(
-    (_keyPath) => _keyPath.slice(2, -2).split(".")
-  );
-}
-function isRef(value) {
-  return value?.type === "ref" && Array.isArray(value?.content) && typeof value?.content[0] === "string";
-}
-function isTemplate(value) {
-  return value?.type === "template" && typeof value?.content === "string";
-}
 function traverseRef(name, value, cb) {
-  if (isObject2(value)) {
-    if (isRef(value)) {
-      cb(name, value);
-      return;
-    }
-    if (isTemplate(value)) {
-      cb(name, value);
-      return;
-    }
-    Object.entries(value).forEach(([_key, _value]) => {
-      traverseRef(`${name}.${_key}`, _value, cb);
-    });
-    return;
-  }
-  if (isArray(value)) {
-    value.forEach((_value, idx) => {
-      traverseRef(`${name}[${idx}]`, _value, cb);
-    });
-    return;
+  for (const { value: _v, path } of FlowValueUtils.traverse(value, {
+    includeTypes: ["ref", "template"],
+    path: name
+  })) {
+    cb(path, _v);
   }
-  return;
 }
 
 // src/effects/provide-json-schema-outputs/index.ts
-import { JsonSchemaUtils as JsonSchemaUtils7 } from "@flowgram.ai/json-schema";
+import { JsonSchemaUtils as JsonSchemaUtils6 } from "@flowgram.ai/json-schema";
 import {
   ASTFactory as ASTFactory2,
   createEffectFromVariableProvider as createEffectFromVariableProvider2,
@@ -3461,7 +2302,7 @@ var provideJsonSchemaOutputs = createEffectFromVariableProvider2({
         title: getNodeForm2(ctx.node)?.getValueIn("title") || ctx.node.id,
         icon: ctx.node.getNodeRegistry().info?.icon
       },
-      type: JsonSchemaUtils7.schemaToAST(value)
+      type: JsonSchemaUtils6.schemaToAST(value)
     })
   ]
 });
@@ -3489,7 +2330,7 @@ var syncVariableTitle = [
 ];
 
 // src/effects/validate-when-variable-sync/index.ts
-import { isEmpty } from "lodash";
+import { isEmpty } from "lodash-es";
 import {
   DataEvent as DataEvent3,
   getNodeScope,
@@ -3539,7 +2380,7 @@ var listenRefValueChange = (cb) => [
 ];
 
 // src/effects/listen-ref-schema-change/index.ts
-import { JsonSchemaUtils as JsonSchemaUtils8 } from "@flowgram.ai/json-schema";
+import { JsonSchemaUtils as JsonSchemaUtils7 } from "@flowgram.ai/json-schema";
 import {
   DataEvent as DataEvent5,
   getNodeScope as getNodeScope3
@@ -3555,7 +2396,7 @@ var listenRefSchemaChange = (cb) => [
       const disposable = getNodeScope3(context.node).available.trackByKeyPath(
         value?.content || [],
         (_type) => {
-          cb({ ...params, schema: JsonSchemaUtils8.astToSchema(_type) });
+          cb({ ...params, schema: JsonSchemaUtils7.astToSchema(_type) });
         },
         {
           selector: (_v) => _v?.type
@@ -3568,68 +2409,6 @@ var listenRefSchemaChange = (cb) => [
   }
 ];
 
-// src/shared/format-legacy-refs/index.ts
-import { isObject as isObject3 } from "lodash";
-function formatLegacyRefOnSubmit(value) {
-  if (isObject3(value)) {
-    if (isLegacyFlowRefValueSchema(value)) {
-      return formatLegacyRefToNewRef(value);
-    }
-    return Object.fromEntries(
-      Object.entries(value).map(([key, value2]) => [
-        key,
-        formatLegacyRefOnSubmit(value2)
-      ])
-    );
-  }
-  if (Array.isArray(value)) {
-    return value.map(formatLegacyRefOnSubmit);
-  }
-  return value;
-}
-function formatLegacyRefOnInit(value) {
-  if (isObject3(value)) {
-    if (isNewFlowRefValueSchema(value)) {
-      return formatNewRefToLegacyRef(value);
-    }
-    return Object.fromEntries(
-      Object.entries(value).map(([key, value2]) => [
-        key,
-        formatLegacyRefOnInit(value2)
-      ])
-    );
-  }
-  if (Array.isArray(value)) {
-    return value.map(formatLegacyRefOnInit);
-  }
-  return value;
-}
-function isLegacyFlowRefValueSchema(value) {
-  return isObject3(value) && Object.keys(value).length === 2 && value.type === "ref" && typeof value.content === "string";
-}
-function isNewFlowRefValueSchema(value) {
-  return isObject3(value) && Object.keys(value).length === 2 && value.type === "ref" && Array.isArray(value.content);
-}
-function formatLegacyRefToNewRef(value) {
-  const keyPath = value.content.split(".");
-  if (keyPath[1] === "outputs") {
-    return {
-      type: "ref",
-      content: [`${keyPath[0]}.${keyPath[1]}`, ...keyPath.length > 2 ? keyPath.slice(2) : []]
-    };
-  }
-  return {
-    type: "ref",
-    content: keyPath
-  };
-}
-function formatNewRefToLegacyRef(value) {
-  return {
-    type: "ref",
-    content: value.content.join(".")
-  };
-}
-
 // src/form-plugins/batch-outputs-plugin/index.ts
 import {
   ASTFactory as ASTFactory3,
@@ -3706,13 +2485,8 @@ var createBatchOutputsFormPlugin = defineFormPluginCreator({
 });
 
 // src/form-plugins/infer-inputs-plugin/index.ts
-import { get as get2, set as set2 } from "lodash";
-import { JsonSchemaUtils as JsonSchemaUtils9 } from "@flowgram.ai/json-schema";
-import {
-  defineFormPluginCreator as defineFormPluginCreator2,
-  getNodePrivateScope as getNodePrivateScope3,
-  getNodeScope as getNodeScope5
-} from "@flowgram.ai/editor";
+import { get as get2, set as set2 } from "lodash-es";
+import { defineFormPluginCreator as defineFormPluginCreator2, getNodePrivateScope as getNodePrivateScope3, getNodeScope as getNodeScope5 } from "@flowgram.ai/editor";
 var createInferInputsPlugin = defineFormPluginCreator2({
   onSetupFormMeta({ addFormatOnSubmit }, { sourceKey, targetKey, scope }) {
     if (!sourceKey || !targetKey) {
@@ -3722,7 +2496,7 @@ var createInferInputsPlugin = defineFormPluginCreator2({
       set2(
         formData,
         targetKey,
-        infer(
+        FlowValueUtils.inferJsonSchema(
           get2(formData, sourceKey),
           scope === "private" ? getNodePrivateScope3(ctx.node) : getNodeScope5(ctx.node)
         )
@@ -3731,63 +2505,10 @@ var createInferInputsPlugin = defineFormPluginCreator2({
     });
   }
 });
-function isRef2(value) {
-  return value?.type === "ref" && Array.isArray(value?.content) && typeof value?.content[0] === "string";
-}
-function isTemplate2(value) {
-  return value?.type === "template" && typeof value?.content === "string";
-}
-function isConstant(value) {
-  return value?.type === "constant" && typeof value?.content !== "undefined";
-}
-var infer = (values, scope) => {
-  if (typeof values === "object") {
-    if (isConstant(values)) {
-      if (values?.schema) {
-        return values.schema;
-      }
-      if (typeof values.content === "string") {
-        return {
-          type: "string"
-        };
-      }
-      if (typeof values.content === "number") {
-        return {
-          type: "number"
-        };
-      }
-      if (typeof values.content === "boolean") {
-        return {
-          type: "boolean"
-        };
-      }
-    }
-    if (isRef2(values)) {
-      const variable = scope.available.getByKeyPath(values?.content);
-      const schema = variable?.type ? JsonSchemaUtils9.astToSchema(variable?.type) : void 0;
-      return schema;
-    }
-    if (isTemplate2(values)) {
-      return {
-        type: "string"
-      };
-    }
-    return {
-      type: "object",
-      properties: Object.keys(values).reduce((acc, key) => {
-        const schema = infer(values[key], scope);
-        if (schema) {
-          acc[key] = schema;
-        }
-        return acc;
-      }, {})
-    };
-  }
-};
 
 // src/form-plugins/infer-assign-plugin/index.ts
-import { set as set3, uniqBy } from "lodash";
-import { JsonSchemaUtils as JsonSchemaUtils10 } from "@flowgram.ai/json-schema";
+import { set as set3, uniqBy } from "lodash-es";
+import { JsonSchemaUtils as JsonSchemaUtils8 } from "@flowgram.ai/json-schema";
 import {
   ASTFactory as ASTFactory4,
   createEffectFromVariableProvider as createEffectFromVariableProvider4,
@@ -3818,7 +2539,7 @@ var createInferAssignPlugin = defineFormPluginCreator3({
                 properties: declareRows.map(
                   (_v) => ASTFactory4.createProperty({
                     key: _v.left,
-                    type: _v.right?.type === "constant" ? JsonSchemaUtils10.schemaToAST(_v.right?.schema || {}) : void 0,
+                    type: _v.right?.type === "constant" ? JsonSchemaUtils8.schemaToAST(_v.right?.schema || {}) : void 0,
                     initializer: _v.right?.type === "ref" ? ASTFactory4.createKeyPathExpression({
                       keyPath: _v.right?.content || []
                     }) : {}
@@ -3834,7 +2555,7 @@ var createInferAssignPlugin = defineFormPluginCreator3({
       set3(
         formData,
         outputKey,
-        JsonSchemaUtils10.astToSchema(getNodeScope6(ctx.node).output.variables?.[0]?.type)
+        JsonSchemaUtils8.astToSchema(getNodeScope6(ctx.node).output.variables?.[0]?.type)
       );
       return formData;
     });
@@ -3842,7 +2563,7 @@ var createInferAssignPlugin = defineFormPluginCreator3({
 });
 
 // src/validate/validate-flow-value/index.tsx
-import { isNil, uniq as uniq2 } from "lodash";
+import { isNil } from "lodash-es";
 import { FeedbackLevel, getNodeScope as getNodeScope7 } from "@flowgram.ai/editor";
 function validateFlowValue(value, ctx) {
   const { node, required, errorMessages } = ctx;
@@ -3866,7 +2587,7 @@ function validateFlowValue(value, ctx) {
     }
   }
   if (value?.type === "template") {
-    const allRefs = getTemplateKeyPaths2(value);
+    const allRefs = FlowValueUtils.getTemplateKeyPaths(value);
     for (const ref of allRefs) {
       const variable = getNodeScope7(node).available.getByKeyPath(ref);
       if (!variable) {
@@ -3879,28 +2600,30 @@ function validateFlowValue(value, ctx) {
   }
   return void 0;
 }
-function getTemplateKeyPaths2(value) {
-  const keyPathReg = /{{(.*?)}}/g;
-  return uniq2(value.content?.match(keyPathReg) || []).map(
-    (_keyPath) => _keyPath.slice(2, -2).split(".")
-  );
-}
 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,
@@ -3910,11 +2633,13 @@ export {
   PromptEditorWithVariables,
   TypeSelector,
   VariableSelector,
+  VariableSelectorProvider,
   autoRenameRefEffect,
   createBatchOutputsFormPlugin,
   createDisableDeclarationPlugin,
   createInferAssignPlugin,
   createInferInputsPlugin,
+  createInjectMaterial,
   createTypePresetPlugin,
   formatLegacyRefOnInit,
   formatLegacyRefOnSubmit,
@@ -3923,16 +2648,21 @@ export {
   getTypeSelectValue,
   isLegacyFlowRefValueSchema,
   isNewFlowRefValueSchema,
+  lazySuspense,
   listenRefSchemaChange,
   listenRefValueChange,
   parseTypeSelectValue,
+  polyfillCreateRoot,
   provideBatchInputEffect,
   provideBatchOutputsEffect,
   provideJsonSchemaOutputs,
   syncVariableTitle,
+  unstableSetCreateRoot,
+  useObjectList,
   useTypeManager,
   useVariableTree,
   validateFlowValue,
-  validateWhenVariableSync
+  validateWhenVariableSync,
+  withSuspense
 };
 //# sourceMappingURL=index.js.map