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

package/dist/esm/index.js

@@ -1,853 +1,37 @@
-// src/components/variable-selector/index.tsx
-import React12, { useMemo } from "react";
-import { I18n as I18n7 } from "@flowgram.ai/editor";
-import { Popover } from "@douyinfe/semi-ui";
-import { IconChevronDownStroked, IconIssueStroked } from "@douyinfe/semi-icons";
-
-// src/shared/format-legacy-refs/index.ts
-import { isObject } from "lodash";
-function formatLegacyRefOnSubmit(value) {
-  if (isObject(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 (isObject(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 isObject(value) && Object.keys(value).length === 2 && value.type === "ref" && typeof value.content === "string";
-}
-function isNewFlowRefValueSchema(value) {
-  return isObject(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/shared/inject-material/index.tsx
-import React from "react";
 import {
-  FlowRendererComponentType,
-  FlowRendererRegistry,
-  usePlaygroundContainer
-} from "@flowgram.ai/editor";
-function createInjectMaterial(Component, params) {
-  const InjectComponent = (props) => {
-    const container = usePlaygroundContainer();
-    if (!container?.isBound(FlowRendererRegistry)) {
-      return React.createElement(Component, { ...props });
-    }
-    const rendererRegistry = container.get(FlowRendererRegistry);
-    const renderKey = params?.renderKey || Component.renderKey || Component.name || "";
-    const renderer = rendererRegistry.tryToGetRendererComponent(renderKey);
-    if (renderer?.type !== FlowRendererComponentType.REACT) {
-      return React.createElement(Component, { ...props });
-    }
-    return React.createElement(renderer.renderer, {
-      ...props
-    });
-  };
-  return InjectComponent;
-}
-
-// src/components/variable-selector/use-variable-tree.tsx
-import React11, { 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 React10 from "react";
+  PromptEditor
+} from "./chunk-727SU246.js";
 import {
+  CodeEditor,
+  CodeEditorMini,
+  InjectVariableSelector,
+  JsonSchemaTypePresetProvider,
   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 React2 from "react";
-import { I18n } from "@flowgram.ai/editor";
-import { Input } from "@douyinfe/semi-ui";
-var stringRegistry = {
-  type: "string",
-  ConstantRenderer: (props) => /* @__PURE__ */ React2.createElement(
-    Input,
-    {
-      placeholder: I18n.t("Please Input String"),
-      size: "small",
-      disabled: props.readonly,
-      ...props
-    }
-  )
-};
-
-// src/plugins/json-schema-preset/type-definition/object.tsx
-import React5 from "react";
-import { I18n as I18n2 } from "@flowgram.ai/editor";
-
-// src/components/code-editor-mini/index.tsx
-import React4 from "react";
-import styled from "styled-components";
-
-// src/components/code-editor/index.tsx
-import React3, { 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__ */ React3.createElement(EditorProvider, null, /* @__PURE__ */ React3.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__ */ React3.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__ */ React4.createElement(UIMini, null, /* @__PURE__ */ React4.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__ */ React5.createElement(
-    CodeEditorMini,
-    {
-      value: props.value,
-      onChange: (v) => props.onChange?.(v),
-      languageId: "json",
-      placeholder: I18n2.t("Please Input Object"),
-      readonly: props.readonly
-    }
-  )
-};
-
-// src/plugins/json-schema-preset/type-definition/number.tsx
-import React6 from "react";
-import { I18n as I18n3 } from "@flowgram.ai/editor";
-import { InputNumber } from "@douyinfe/semi-ui";
-var numberRegistry = {
-  type: "number",
-  ConstantRenderer: (props) => /* @__PURE__ */ React6.createElement(
-    InputNumber,
-    {
-      placeholder: I18n3.t("Please Input Number"),
-      size: "small",
-      disabled: props.readonly,
-      hideButtons: true,
-      ...props
-    }
-  )
-};
-
-// src/plugins/json-schema-preset/type-definition/integer.tsx
-import React7 from "react";
-import { I18n as I18n4 } from "@flowgram.ai/editor";
-import { InputNumber as InputNumber2 } from "@douyinfe/semi-ui";
-var integerRegistry = {
-  type: "integer",
-  ConstantRenderer: (props) => /* @__PURE__ */ React7.createElement(
-    InputNumber2,
-    {
-      placeholder: I18n4.t("Please Input Integer"),
-      size: "small",
-      disabled: props.readonly,
-      precision: 0,
-      ...props
-    }
-  )
-};
-
-// src/plugins/json-schema-preset/type-definition/boolean.tsx
-import React8 from "react";
-import { I18n as I18n5 } from "@flowgram.ai/editor";
-import { Select } from "@douyinfe/semi-ui";
-var booleanRegistry = {
-  type: "boolean",
-  ConstantRenderer: (props) => {
-    const { value, onChange, ...rest } = props;
-    return /* @__PURE__ */ React8.createElement(
-      Select,
-      {
-        placeholder: I18n5.t("Please Select Boolean"),
-        size: "small",
-        disabled: props.readonly,
-        optionList: [
-          { label: I18n5.t("True"), value: 1 },
-          { label: I18n5.t("False"), value: 0 }
-        ],
-        value: value ? 1 : 0,
-        onChange: (value2) => onChange?.(!!value2),
-        ...rest
-      }
-    );
-  }
-};
-
-// src/plugins/json-schema-preset/type-definition/array.tsx
-import React9 from "react";
-import { I18n as I18n6 } from "@flowgram.ai/editor";
-var arrayRegistry = {
-  type: "array",
-  ConstantRenderer: (props) => /* @__PURE__ */ React9.createElement(
-    CodeEditorMini,
-    {
-      value: props.value,
-      languageId: "json",
-      onChange: (v) => props.onChange?.(v),
-      placeholder: I18n6.t("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
-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__ */ React10.createElement(OriginTypePresetProvider, { types: [...jsonSchemaTypePreset, ...types] }, children);
-
-// src/plugins/disable-declaration-plugin/create-disable-declaration-plugin.ts
+  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__ */ React11.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__ */ React11.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__ */ React12.createElement("img", { style: { marginRight: 8 }, width: 12, height: 12, src: icon });
-    }
-    return icon;
-  };
-  return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.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__ */ React12.createElement(
-            UITag,
-            {
-              prefixIcon: /* @__PURE__ */ React12.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__ */ React12.createElement(UIRootTitle, null, _option.rootMeta?.title ? `${_option.rootMeta?.title} ${_option.isRoot ? "" : "-"} ` : null);
-        return /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement(
-          Popover,
-          {
-            content: /* @__PURE__ */ React12.createElement(UIPopoverContent, null, rootIcon, rootTitle, /* @__PURE__ */ React12.createElement(UIVarName, null, _option.keyPath.slice(1).join(".")))
-          },
-          /* @__PURE__ */ React12.createElement(
-            UITag,
-            {
-              prefixIcon: rootIcon,
-              closable: !readonly,
-              onClose: () => onChange(void 0)
-            },
-            rootTitle,
-            !_option.isRoot && /* @__PURE__ */ React12.createElement(UIVarName, { $inSelector: true }, _option.label)
-          )
-        ));
-      },
-      showClear: false,
-      arrowIcon: /* @__PURE__ */ React12.createElement(IconChevronDownStroked, { size: "small" }),
-      triggerRender,
-      placeholder: config?.placeholder ?? I18n7.t("Select Variable")
-    }
-  ));
-};
-VariableSelector.renderKey = "variable-selector-render-key";
-var InjectVariableSelector = createInjectMaterial(VariableSelector);
+  FlowValueUtils,
+  createInjectMaterial,
+  formatLegacyRefOnInit,
+  formatLegacyRefOnSubmit,
+  formatLegacyRefToNewRef,
+  formatNewRefToLegacyRef,
+  isLegacyFlowRefValueSchema,
+  isNewFlowRefValueSchema,
+  lazySuspense,
+  polyfillCreateRoot,
+  unstableSetCreateRoot,
+  withSuspense
+} from "./chunk-DEZUEMUM.js";
 
 // src/components/type-selector/index.tsx
-import React13, { 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 getTypeSelectValue = (value) => {
   if (value?.type === "array" && value?.items) {
@@ -864,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__ */ React13.createElement("div", { style: labelStyle }, /* @__PURE__ */ React13.createElement(Icon2, { size: "small", svg: _type.icon }), typeManager.getTypeBySchema(_type)?.label || _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__ */ React13.createElement("div", { style: labelStyle }, /* @__PURE__ */ React13.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({
@@ -890,12 +74,24 @@ function TypeSelector(props) {
     }),
     []
   );
-  return /* @__PURE__ */ React13.createElement(
+  const isDisabled = readonly || disabled;
+  return /* @__PURE__ */ React.createElement(
     Cascader,
     {
-      disabled: readonly || disabled,
+      disabled: isDisabled,
       size: "small",
-      triggerRender: () => /* @__PURE__ */ React13.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,
@@ -909,8 +105,8 @@ TypeSelector.renderKey = "type-selector-render-key";
 var InjectTypeSelector = createInjectMaterial(TypeSelector);
 
 // src/components/json-schema-editor/index.tsx
-import React18, { useMemo as useMemo4, useState as useState3 } from "react";
-import { I18n as I18n9 } from "@flowgram.ai/editor";
+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,
@@ -921,62 +117,81 @@ import {
   IconMinus
 } from "@douyinfe/semi-icons";
 
+// 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 React14 from "react";
-import styled3, { css as css2 } from "styled-components";
-import Icon3 from "@douyinfe/semi-icons";
-var UIContainer = styled3.div`
+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;
@@ -987,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;
@@ -997,7 +212,7 @@ var UIPropertyLeft = styled3.div`
       `;
 }}
 `;
-var UIPropertyRight = styled3.div`
+var UITreeItemRight = styled.div`
   grid-column: 2;
   margin-bottom: 10px;
 
@@ -1005,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__ */ React14.createElement(
+var iconAddChildrenSvg = /* @__PURE__ */ React3.createElement(
   "svg",
   {
     className: "icon-icon icon-icon-coz_add_node ",
@@ -1060,7 +251,7 @@ var iconAddChildrenSvg = /* @__PURE__ */ React14.createElement(
     fill: "currentColor",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React14.createElement(
+  /* @__PURE__ */ React3.createElement(
     "path",
     {
       fillRule: "evenodd",
@@ -1068,13 +259,13 @@ var iconAddChildrenSvg = /* @__PURE__ */ React14.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__ */ React14.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__ */ React14.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 ConstantInputWrapper = styled3.div`
+var ConstantInputWrapper = styled.div`
   flex-grow: 1;
 
   & .semi-tree-select,
@@ -1085,8 +276,8 @@ var ConstantInputWrapper = styled3.div`
 `;
 
 // src/components/json-schema-editor/hooks.tsx
-import { useEffect as useEffect2, useState } from "react";
-import { difference, 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;
@@ -1097,8 +288,15 @@ function usePropertiesEdit(value, onChange) {
   const typeManager = useTypeManager2();
   const drilldownSchema = typeManager.getPropertiesParent(value || {});
   const canAddField = typeManager.canAddField(value || {});
-  const [propertyList, setPropertyList] = useState([]);
+  const [propertyList, setPropertyList] = useState2([]);
+  const effectVersion = useRef(0);
+  const changeVersion = useRef(0);
   useEffect2(() => {
+    effectVersion.current = effectVersion.current + 1;
+    if (effectVersion.current === changeVersion.current) {
+      return;
+    }
+    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);
@@ -1107,7 +305,7 @@ function usePropertiesEdit(value, onChange) {
         key: item.key,
         name: item.name,
         isPropertyRequired: drilldownSchema?.required?.includes(item.name || "") || false,
-        ...item
+        ...drilldownSchema?.properties?.[item.name || ""] || item || {}
       })).concat(
         addNames.map((_name) => ({
           key: genId(),
@@ -1119,6 +317,7 @@ function usePropertiesEdit(value, onChange) {
     });
   }, [drilldownSchema]);
   const updatePropertyList = (updater) => {
+    changeVersion.current = changeVersion.current + 1;
     setPropertyList((_list) => {
       const next = updater(_list);
       const nextProperties = {};
@@ -1174,71 +373,51 @@ function usePropertiesEdit(value, onChange) {
 }
 
 // src/components/json-schema-editor/default-value.tsx
-import React16 from "react";
-import { I18n as I18n8 } from "@flowgram.ai/editor";
+import React5 from "react";
+import { I18n } from "@flowgram.ai/editor";
 
 // src/components/constant-input/index.tsx
-import React15, { useMemo as useMemo3 } 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 = useMemo3(() => {
+  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 React15.createElement(fallbackRenderer, {
+      return React4.createElement(fallbackRenderer, {
         value,
         onChange,
         readonly,
         ...rest
       });
     }
-    return /* @__PURE__ */ React15.createElement(Input2, { size: "small", disabled: true, placeholder: "Unsupported type" });
+    return /* @__PURE__ */ React4.createElement(Input2, { size: "small", disabled: true, placeholder: "Unsupported type" });
   }
-  return /* @__PURE__ */ React15.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, onChange, placeholder } = props;
-  return /* @__PURE__ */ React16.createElement(ConstantInputWrapper, null, /* @__PURE__ */ React16.createElement(
+  return /* @__PURE__ */ React5.createElement(ConstantInputWrapper, null, /* @__PURE__ */ React5.createElement(
     ConstantInput,
     {
       value,
       onChange: (_v) => onChange(_v),
       schema: schema || { type: "string" },
-      placeholder: placeholder ?? I18n8.t("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 React17, { useEffect as useEffect3, useState as useState2 } from "react";
-import Input3 from "@douyinfe/semi-ui/lib/es/input";
-function BlurInput(props) {
-  const [value, setValue] = useState2("");
-  useEffect3(() => {
-    setValue(props.value);
-  }, [props.value]);
-  return /* @__PURE__ */ React17.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) {
@@ -1247,14 +426,13 @@ function JsonSchemaEditor(props) {
     value,
     onChangeProps
   );
-  return /* @__PURE__ */ React18.createElement(UIContainer, { className: props.className }, /* @__PURE__ */ React18.createElement(UIProperties, null, propertyList.map((_property, index) => /* @__PURE__ */ React18.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);
       },
@@ -1262,37 +440,24 @@ function JsonSchemaEditor(props) {
         onRemoveProperty(_property.key);
       }
     }
-  ))), /* @__PURE__ */ React18.createElement(
+  ))), /* @__PURE__ */ React6.createElement(
     Button,
     {
       disabled: readonly,
       size: "small",
       style: { marginTop: 10, marginLeft: 16 },
-      icon: /* @__PURE__ */ React18.createElement(IconPlus, null),
+      icon: /* @__PURE__ */ React6.createElement(IconPlus, null),
       onClick: onAddProperty
     },
-    config?.addButtonText ?? I18n9.t("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 { 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 = useMemo4(() => ({ type, items }), [type, items]);
+  const typeSelectorValue = useMemo3(() => ({ type, items }), [type, items]);
   const { propertyList, canAddField, onAddProperty, onRemoveProperty, onEditProperty } = usePropertiesEdit(value, onChangeProps);
   const onChange = (key, _value) => {
     onChangeProps?.({
@@ -1301,109 +466,84 @@ function PropertyEdit(props) {
     });
   };
   const showCollapse = canAddField && propertyList.length > 0;
-  return /* @__PURE__ */ React18.createElement(React18.Fragment, null, /* @__PURE__ */ React18.createElement(
-    UIPropertyLeft,
+  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__ */ React18.createElement(UICollapseTrigger, { onClick: () => setCollapse((_collapse) => !_collapse) }, collapse ? /* @__PURE__ */ React18.createElement(IconChevronDown, { size: "small" }) : /* @__PURE__ */ React18.createElement(IconChevronRight, { size: "small" }))
-  ), /* @__PURE__ */ React18.createElement(UIPropertyRight, null, /* @__PURE__ */ React18.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__ */ React18.createElement(UIRow, null, /* @__PURE__ */ React18.createElement(UIName, null, /* @__PURE__ */ React18.createElement(
-      BlurInput,
-      {
-        disabled: readonly,
-        placeholder: config?.placeholder ?? "Input Variable Name",
-        size: "small",
-        value: name,
-        onChange: (value2) => onChange("name", value2)
-      }
-    )), /* @__PURE__ */ React18.createElement(UIType, null, /* @__PURE__ */ React18.createElement(
-      InjectTypeSelector,
-      {
-        value: typeSelectorValue,
-        readonly,
-        onChange: (_value) => {
-          onChangeProps?.({
-            ...value || {},
-            ..._value
-          });
-        }
-      }
-    )), /* @__PURE__ */ React18.createElement(UIRequired, null, /* @__PURE__ */ React18.createElement(
-      Checkbox,
-      {
-        disabled: readonly,
-        checked: isPropertyRequired,
-        onChange: (e) => onChange("isPropertyRequired", e.target.checked)
-      }
-    )), /* @__PURE__ */ React18.createElement(UIActions, null, /* @__PURE__ */ React18.createElement(
-      IconButton2,
-      {
-        disabled: readonly,
-        size: "small",
-        theme: "borderless",
-        icon: expand ? /* @__PURE__ */ React18.createElement(IconShrink, { size: "small" }) : /* @__PURE__ */ React18.createElement(IconExpand, { size: "small" }),
-        onClick: () => {
-          setExpand((_expand) => !_expand);
-        }
-      }
-    ), canAddField && /* @__PURE__ */ React18.createElement(
-      IconButton2,
-      {
-        disabled: readonly,
-        size: "small",
-        theme: "borderless",
-        icon: /* @__PURE__ */ React18.createElement(IconAddChildren, null),
-        onClick: () => {
-          onAddProperty();
-          setCollapse(true);
-        }
-      }
-    ), /* @__PURE__ */ React18.createElement(
-      IconButton2,
-      {
-        disabled: readonly,
-        size: "small",
-        theme: "borderless",
-        icon: /* @__PURE__ */ React18.createElement(IconMinus, { size: "small" }),
-        onClick: onRemove
+      value: typeSelectorValue,
+      readonly,
+      onChange: (_value) => {
+        onChangeProps?.({
+          ...value || {},
+          ..._value
+        });
       }
-    ))),
-    expand && /* @__PURE__ */ React18.createElement(UIExpandDetail, null, /* @__PURE__ */ React18.createElement(UILabel, null, config?.descTitle ?? I18n9.t("Description")), /* @__PURE__ */ React18.createElement(
-      BlurInput,
-      {
-        disabled: readonly,
-        size: "small",
-        value: description,
-        onChange: (value2) => onChange("description", value2),
-        placeholder: config?.descPlaceholder ?? I18n9.t("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 && /* @__PURE__ */ React18.createElement(React18.Fragment, null, /* @__PURE__ */ React18.createElement(UILabel, { style: { marginTop: 10 } }, config?.defaultValueTitle ?? I18n9.t("Default Value")), /* @__PURE__ */ React18.createElement(DefaultValueWrapper, null, /* @__PURE__ */ React18.createElement(
-      DefaultValue,
-      {
-        value: defaultValue,
-        schema: value,
-        type,
-        placeholder: config?.defaultValuePlaceholder ?? I18n9.t("Default Value"),
-        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__ */ React18.createElement(UICollapsible, { $collapse: collapse }, /* @__PURE__ */ React18.createElement(UIProperties, { $shrink: true }, propertyList.map((_property, index) => /* @__PURE__ */ React18.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,
@@ -1411,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 React19 from "react";
+import React7 from "react";
 import { PrivateScopeProvider } from "@flowgram.ai/editor";
 var batchVariableSchema = {
   type: "array",
   extra: { weak: true }
 };
 function BatchVariableSelector(props) {
-  return /* @__PURE__ */ React19.createElement(PrivateScopeProvider, null, /* @__PURE__ */ React19.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 React20 from "react";
-import { JsonSchemaUtils as JsonSchemaUtils3 } from "@flowgram.ai/json-schema";
+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;
@@ -1456,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,
@@ -1473,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 useMemo5, useState as useState4 } 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 = useMemo5(() => {
+  const refVariable = useMemo4(() => {
     if (value?.type === "ref") {
       return available.getByKeyPath(value.content);
     }
@@ -1506,23 +654,45 @@ function useSelectSchema(schemaFromProps, constantProps, value) {
   if (value?.type === "constant") {
     defaultSelectSchema = value?.schema || defaultSelectSchema;
   }
+  const changeVersion = useRef2(0);
+  const effectVersion = useRef2(0);
   const [selectSchema, setSelectSchema] = useState4(defaultSelectSchema);
-  return [selectSchema, setSelectSchema];
+  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 = useMemo5(() => {
+  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,
@@ -1534,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__ */ React20.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__ */ React20.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__ */ React20.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
@@ -1570,40 +739,40 @@ function DynamicValueInput({
   };
   const renderMain = () => {
     if (value?.type === "ref") {
-      return /* @__PURE__ */ React20.createElement(
+      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__ */ React20.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__ */ React20.createElement(
+        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__ */ React20.createElement(
+  const renderTrigger = () => /* @__PURE__ */ React8.createElement(
     InjectVariableSelector,
     {
       style: { width: "100%" },
@@ -1611,34 +780,34 @@ function DynamicValueInput({
       onChange: (_v) => onChange({ type: "ref", content: _v }),
       includeSchema,
       readonly,
-      triggerRender: () => /* @__PURE__ */ React20.createElement(IconButton3, { disabled: readonly, size: "small", icon: /* @__PURE__ */ React20.createElement(IconSetting, { size: "small" }) })
+      triggerRender: () => /* @__PURE__ */ React8.createElement(IconButton3, { disabled: readonly, size: "small", icon: /* @__PURE__ */ React8.createElement(IconSetting, { size: "small" }) })
     }
   );
-  return /* @__PURE__ */ React20.createElement(UIContainer2, { style }, /* @__PURE__ */ React20.createElement(UIType2, null, renderTypeSelector()), /* @__PURE__ */ React20.createElement(UIMain, null, renderMain()), /* @__PURE__ */ React20.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 React22, { useMemo as useMemo8 } from "react";
-import { I18n as I18n11 } from "@flowgram.ai/editor";
-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;
@@ -1647,8 +816,8 @@ var UIValues = styled5.div`
 `;
 
 // src/components/condition-row/hooks/useRule.ts
-import { useMemo as useMemo6 } 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
@@ -1706,6 +875,14 @@ var defaultRules = {
   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 defaultOpConfigs = {
@@ -1774,37 +951,37 @@ var defaultOpConfigs = {
 // src/components/condition-row/hooks/useRule.ts
 function useRule(left, userRules) {
   const available = useScopeAvailable2();
-  const rules = useMemo6(() => ({ ...defaultRules, ...userRules || {} }), [userRules]);
-  const variable = useMemo6(() => {
+  const rules = useMemo5(() => ({ ...defaultRules, ...userRules || {} }), [userRules]);
+  const variable = useMemo5(() => {
     if (!left) return void 0;
     return available.getByKeyPath(left.content);
   }, [available, left]);
-  const rule = useMemo6(() => {
+  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, rules]);
   return { rule };
 }
 
 // src/components/condition-row/hooks/useOp.tsx
-import React21, { useMemo as useMemo7 } from "react";
-import { I18n as I18n10 } from "@flowgram.ai/editor";
-import { Button as Button2, Select as Select2 } from "@douyinfe/semi-ui";
-import { IconChevronDownStroked as IconChevronDownStroked2 } from "@douyinfe/semi-icons";
+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 = useMemo7(
+  const options = useMemo6(
     () => Object.keys(rule || {}).map((_op) => ({
       ...defaultOpConfigs[_op] || {},
       ...userOps?.[_op] || {},
       value: _op,
-      label: I18n10.t(userOps?.[_op]?.label || defaultOpConfigs[_op]?.label)
+      label: I18n3.t(userOps?.[_op]?.label || defaultOpConfigs[_op]?.label)
     })),
     [rule, userOps]
   );
-  const opConfig = useMemo7(() => defaultOpConfigs[op], [op]);
-  const renderOpSelect = () => /* @__PURE__ */ React21.createElement(
-    Select2,
+  const opConfig = useMemo6(() => defaultOpConfigs[op], [op]);
+  const renderOpSelect = () => /* @__PURE__ */ React9.createElement(
+    Select,
     {
       style: { height: 22 },
       disabled: readonly,
@@ -1814,7 +991,7 @@ function useOp({ rule, op, onChange, readonly, userOps }) {
       onChange: (v) => {
         onChange(v);
       },
-      triggerRender: ({ value }) => /* @__PURE__ */ React21.createElement(Button2, { size: "small", disabled: !rule }, opConfig?.abbreviation || /* @__PURE__ */ React21.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 };
@@ -1841,1041 +1018,403 @@ function ConditionRow({
     readonly,
     userOps: ruleConfig.ops
   });
-  const targetSchema = useMemo8(() => {
-    const targetType = rule?.[operator || ""] || null;
-    return targetType ? { type: targetType, extra: { weak: true } } : null;
-  }, [rule, opConfig]);
-  return /* @__PURE__ */ React22.createElement(UIContainer3, { style }, /* @__PURE__ */ React22.createElement(UIOperator, null, renderOpSelect()), /* @__PURE__ */ React22.createElement(UIValues, null, /* @__PURE__ */ React22.createElement(UILeft, null, /* @__PURE__ */ React22.createElement(
-    InjectVariableSelector,
-    {
-      readonly,
-      style: { width: "100%" },
-      value: left?.content,
-      onChange: (v) => onChange({
-        ...value,
-        left: {
-          type: "ref",
-          content: v
-        }
-      })
-    }
-  )), /* @__PURE__ */ React22.createElement(UIRight, null, targetSchema ? /* @__PURE__ */ React22.createElement(
-    InjectDynamicValueInput,
-    {
-      readonly: readonly || !rule,
-      value: right,
-      schema: targetSchema,
-      onChange: (v) => onChange({ ...value, right: v })
-    }
-  ) : /* @__PURE__ */ React22.createElement(
-    Input4,
-    {
-      size: "small",
-      disabled: true,
-      style: { pointerEvents: "none" },
-      value: opConfig?.rightDisplay || I18n11.t("Empty")
-    }
-  ))));
-}
-
-// src/components/batch-outputs/index.tsx
-import React23 from "react";
-import { Button as Button3, Input as Input5 } from "@douyinfe/semi-ui";
-import { IconDelete, IconPlus as IconPlus2 } from "@douyinfe/semi-icons";
-
-// src/hooks/use-object-list/index.tsx
-import { useEffect as useEffect4, useState as useState5 } from "react";
-import { nanoid } from "nanoid";
-import { difference as difference2, get, isObject as isObject2, set } from "lodash";
-function genId2() {
-  return nanoid();
-}
-function useObjectList({
-  value,
-  onChange,
-  sortIndexKey
-}) {
-  const [list, setList] = useState5([]);
-  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 = 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]
-        }))
-      );
-    });
-  }, [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 (isObject2(_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 };
+  const targetSchema = useMemo7(() => {
+    const targetType = rule?.[operator || ""] || null;
+    return targetType ? { type: targetType, extra: { weak: true } } : null;
+  }, [rule, opConfig]);
+  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%" },
+      value: left?.content,
+      onChange: (v) => onChange({
+        ...value,
+        left: {
+          type: "ref",
+          content: v
+        }
+      })
+    }
+  )), /* @__PURE__ */ React10.createElement(UIRight, null, targetSchema ? /* @__PURE__ */ React10.createElement(
+    InjectDynamicValueInput,
+    {
+      readonly: readonly || !rule,
+      value: right,
+      schema: targetSchema,
+      onChange: (v) => onChange({ ...value, right: v })
+    }
+  ) : /* @__PURE__ */ React10.createElement(
+    Input3,
+    {
+      size: "small",
+      disabled: true,
+      style: { pointerEvents: "none" },
+      value: opConfig?.rightDisplay || I18n4.t("Empty")
+    }
+  ))));
 }
+ConditionRow.defaultRules = defaultRules;
+ConditionRow.defaultOpConfigs = defaultOpConfigs;
 
-// src/components/batch-outputs/styles.tsx
-import styled6 from "styled-components";
-var UIRows = styled6.div`
+// 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/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;
-  gap: 10px;
-  margin-bottom: 10px;
+  align-items: center;
+  gap: 4px;
 `;
-var UIRow2 = styled6.div`
+var UIOptionLabel = styled4.div`
   display: flex;
   align-items: center;
-  gap: 5px;
+  gap: 10px;
+`;
+var UISelect = styled4(Select2)`
+  & .semi-select-selection {
+    margin-left: 5px;
+  }
 `;
 
-// src/components/batch-outputs/index.tsx
-function BatchOutputs(props) {
-  const { readonly, style } = props;
-  const { list, add, updateKey, updateValue, remove } = useObjectList(props);
-  return /* @__PURE__ */ React23.createElement("div", null, /* @__PURE__ */ React23.createElement(UIRows, { style }, list.map((item) => /* @__PURE__ */ React23.createElement(UIRow2, { key: item.id }, /* @__PURE__ */ React23.createElement(
-    Input5,
+// 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: { width: 100 },
+      style: { height: 22 },
       disabled: readonly,
       size: "small",
-      value: item.key,
-      onChange: (v) => updateKey(item.id, v)
+      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" }))
     }
-  ), /* @__PURE__ */ React23.createElement(
-    InjectVariableSelector,
-    {
-      style: { flexGrow: 1 },
-      readonly,
-      value: item.value?.content,
-      onChange: (v) => updateValue(item.id, { type: "ref", content: v })
+  );
+  return { renderOpSelect, opConfig };
+}
+
+// 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__ */ React23.createElement(
-    Button3,
+    return rules[option.schema.type];
+  }, [left, options, rules]);
+  const renderDBOptionSelect = () => /* @__PURE__ */ React12.createElement(
+    UISelect,
     {
       disabled: readonly,
-      icon: /* @__PURE__ */ React23.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__ */ React23.createElement(Button3, { disabled: readonly, icon: /* @__PURE__ */ React23.createElement(IconPlus2, null), size: "small", onClick: add }, "Add"));
-}
-
-// src/components/prompt-editor/index.tsx
-import React24, { useEffect as useEffect5, useRef as useRef2 } 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;
+  return { rule, renderDBOptionSelect };
 }
-var jinja_default = JinjaHighlight;
 
-// src/components/prompt-editor/index.tsx
-function PromptEditor(props) {
-  const {
-    value,
-    onChange,
+// src/components/db-condition-row/index.tsx
+var defaultRuleConfig2 = {
+  ops: {},
+  rules: {}
+};
+function DBConditionRow({
+  style,
+  value,
+  onChange,
+  readonly,
+  options,
+  ruleConfig = defaultRuleConfig2
+}) {
+  const { left, operator, right } = value || {};
+  const { rule, renderDBOptionSelect } = useLeft({
+    left,
+    options,
+    onChange: (leftKey) => onChange({ ...value, left: leftKey }),
     readonly,
-    placeholder,
-    activeLinePlaceholder,
-    style,
-    hasError,
-    children,
-    disableMarkdownHighlight
-  } = props || {};
-  const editorRef = useRef2(null);
-  useEffect5(() => {
-    if (editorRef.current?.getValue() !== value?.content) {
-      editorRef.current?.setValue(String(value?.content || ""));
-    }
-  }, [value]);
-  return /* @__PURE__ */ React24.createElement(UIContainer4, { $hasError: hasError, style }, /* @__PURE__ */ React24.createElement(EditorProvider2, null, /* @__PURE__ */ React24.createElement(
-    Renderer,
+    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,
     {
-      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__ */ React24.createElement(ActiveLinePlaceholder2, null, activeLinePlaceholder), !disableMarkdownHighlight && /* @__PURE__ */ React24.createElement(markdown_default, null), /* @__PURE__ */ React24.createElement(language_support_default, null), /* @__PURE__ */ React24.createElement(jinja_default, null), children));
-}
-
-// src/components/prompt-editor-with-variables/index.tsx
-import React27 from "react";
-
-// src/components/prompt-editor-with-variables/extensions/variable-tree.tsx
-import React25, { useEffect as useEffect6, useState as useState6 } 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] = useState6("");
-  const [visible, setVisible] = useState6(false);
-  const [position, setPosition] = useState6(-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;
+      readonly: readonly || !rule,
+      value: right,
+      schema: targetSchema,
+      onChange: (v) => onChange({ ...value, right: v })
     }
-  }, [editor, visible]);
-  const treeData = useVariableTree({});
-  return /* @__PURE__ */ React25.createElement(React25.Fragment, null, /* @__PURE__ */ React25.createElement(Mention, { triggerCharacters: ["{", "{}", "@"], onOpenChange: handleOpenChange }), /* @__PURE__ */ React25.createElement(
-    Popover2,
+  ) : /* @__PURE__ */ React13.createElement(
+    Input4,
     {
-      visible,
-      trigger: "custom",
-      position: "topLeft",
-      rePosKey: posKey,
-      content: /* @__PURE__ */ React25.createElement("div", { style: { width: 300 } }, /* @__PURE__ */ React25.createElement(
-        Tree,
-        {
-          treeData,
-          onSelect: (v) => {
-            insert(v);
-          }
-        }
-      ))
-    },
-    /* @__PURE__ */ React25.createElement(
-      PositionMirror,
-      {
-        position,
-        onChange: () => setPosKey(String(Math.random()))
-      }
-    )
-  ));
-}
-
-// src/components/prompt-editor-with-variables/extensions/variable-tag.tsx
-import ReactDOM from "react-dom";
-import React26, { 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__ */ React26.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__ */ React26.createElement(UITag2, { prefixIcon: /* @__PURE__ */ React26.createElement(IconIssueStroked2, null), color: "amber" }, "Unknown")
-      );
-      return;
+      size: "small",
+      disabled: true,
+      style: { pointerEvents: "none" },
+      value: opConfig?.rightDisplay || I18n6.t("Empty")
     }
-    const rootField = last(v.parentFields) || v;
-    const isRoot = v.parentFields.length === 0;
-    const rootTitle = /* @__PURE__ */ React26.createElement(UIRootTitle2, null, rootField?.meta.title ? `${rootField.meta.title} ${isRoot ? "" : "-"} ` : "");
-    const rootIcon = this.renderIcon(rootField?.meta.icon);
-    this.renderReact(
-      /* @__PURE__ */ React26.createElement(
-        Popover3,
-        {
-          content: /* @__PURE__ */ React26.createElement(UIPopoverContent2, null, rootIcon, rootTitle, /* @__PURE__ */ React26.createElement(UIVarName2, null, v?.keyPath.slice(1).join(".")))
-        },
-        /* @__PURE__ */ React26.createElement(UITag2, { prefixIcon: rootIcon }, rootTitle, !isRoot && /* @__PURE__ */ React26.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();
-  }
-};
-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__ */ React27.createElement(PromptEditor, { ...props }, /* @__PURE__ */ React27.createElement(VariableTree, null), /* @__PURE__ */ React27.createElement(VariableTagInject, null));
+// 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/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();
 }
-
-// src/components/prompt-editor-with-inputs/index.tsx
-import React30 from "react";
-
-// src/components/prompt-editor-with-inputs/extensions/inputs-tree.tsx
-import React29, { useEffect as useEffect7, useState as useState7 } 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 React28, { useMemo as useMemo9 } 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 useObjectList({
+  value,
+  onChange,
+  sortIndexKey
 }) {
-  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 [list, setList] = useState5([]);
+  const effectVersion = useRef3(0);
+  const changeVersion = useRef3(0);
+  const getSortIndex = (value2) => {
+    if (typeof sortIndexKey === "function") {
+      return get(value2, sortIndexKey(value2)) || 0;
     }
-    const key = keyPath.map((_key, idx) => _key === "[0]" || idx === 0 ? _key : `.${_key}`).join("");
-    return {
-      key,
-      label: last2(keyPath),
-      value: key,
-      children
-    };
+    return get(value2, sortIndexKey || "") || 0;
   };
-  const treeData = useMemo9(
-    () => 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__ */ React28.createElement(Tree2, { treeData, onSelect: (v) => onSelect(v) });
-}
-
-// src/components/prompt-editor-with-inputs/extensions/inputs-tree.tsx
-function InputsTree({ inputsValues }) {
-  const [posKey, setPosKey] = useState7("");
-  const [visible, setVisible] = useState7(false);
-  const [position, setPosition] = useState7(-1);
-  const editor = useEditor2();
-  function insert(variablePath) {
-    const range = getCurrentMentionReplaceRange2(editor.$view.state);
-    if (!range) {
+  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);
-  }
-  useEffect7(() => {
-    if (!editor) {
-      return;
-    }
-  }, [editor, visible]);
-  return /* @__PURE__ */ React29.createElement(React29.Fragment, null, /* @__PURE__ */ React29.createElement(Mention2, { triggerCharacters: ["{", "{}", "@"], onOpenChange: handleOpenChange }), /* @__PURE__ */ React29.createElement(
-    Popover4,
-    {
-      visible,
-      trigger: "custom",
-      position: "topLeft",
-      rePosKey: posKey,
-      content: /* @__PURE__ */ React29.createElement("div", { style: { width: 300 } }, /* @__PURE__ */ React29.createElement(
-        InputsPicker,
-        {
-          inputsValues,
-          onSelect: (v) => {
-            insert(v);
-          }
-        }
-      ))
-    },
-    /* @__PURE__ */ React29.createElement(
-      PositionMirror2,
+  }, [value]);
+  const add = (defaultValue) => {
+    setList((prevList) => [
+      ...prevList,
       {
-        position,
-        onChange: () => setPosKey(String(Math.random()))
+        id: genId2(),
+        value: defaultValue
       }
-    )
-  ));
-}
-
-// src/components/prompt-editor-with-inputs/index.tsx
-function PromptEditorWithInputs({ inputsValues, ...restProps }) {
-  return /* @__PURE__ */ React30.createElement(PromptEditor, { ...restProps }, /* @__PURE__ */ React30.createElement(InputsTree, { inputsValues }));
-}
-
-// src/components/json-editor-with-variables/index.tsx
-import React33 from "react";
-import { transformerCreator } from "@coze-editor/editor/preset-code";
-
-// src/components/json-editor-with-variables/extensions/variable-tree.tsx
-import React31, { useEffect as useEffect8, useState as useState8 } 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] = useState8("");
-  const [visible, setVisible] = useState8(false);
-  const [position, setPosition] = useState8(-1);
-  const editor = useEditor3();
-  function insert(variablePath) {
-    const range = getCurrentMentionReplaceRange3(editor.$view.state);
-    if (!range) {
-      return;
-    }
-    editor.replaceText({
-      ...range,
-      text: "{{" + variablePath + "}}"
+    ]);
+  };
+  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;
     });
-    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__ */ React31.createElement(React31.Fragment, null, /* @__PURE__ */ React31.createElement(Mention3, { triggerCharacters: ["@"], onOpenChange: handleOpenChange }), /* @__PURE__ */ React31.createElement(
-    Popover5,
-    {
-      visible,
-      trigger: "custom",
-      position: "topLeft",
-      rePosKey: posKey,
-      content: /* @__PURE__ */ React31.createElement("div", { style: { width: 300 } }, /* @__PURE__ */ React31.createElement(
-        Tree3,
-        {
-          treeData,
-          onSelect: (v) => {
-            insert(v);
-          }
+  };
+  const updateKey = (itemId, key) => {
+    changeVersion.current = changeVersion.current + 1;
+    setList((prevList) => {
+      const nextList = prevList.map((_item) => {
+        if (_item.id === itemId) {
+          return {
+            ..._item,
+            key
+          };
         }
-      ))
-    },
-    /* @__PURE__ */ React31.createElement(
-      PositionMirror3,
-      {
-        position,
-        onChange: () => setPosKey(String(Math.random()))
-      }
-    )
-  ));
+        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 React32, { 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__ */ React32.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__ */ React32.createElement(UITag3, { prefixIcon: /* @__PURE__ */ React32.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__ */ React32.createElement(UIRootTitle3, null, rootField?.meta.title ? `${rootField.meta.title} -` : "");
-    const rootIcon = this.renderIcon(rootField?.meta.icon);
-    this.root.render(
-      /* @__PURE__ */ React32.createElement(
-        Popover6,
-        {
-          content: /* @__PURE__ */ React32.createElement(UIPopoverContent3, null, rootIcon, rootTitle, /* @__PURE__ */ React32.createElement(UIVarName3, null, v?.keyPath.slice(1).join(".")))
-        },
-        /* @__PURE__ */ React32.createElement(UITag3, { prefixIcon: rootIcon }, rootTitle, /* @__PURE__ */ React32.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__ */ React33.createElement(
-    CodeEditor,
-    {
-      languageId: "json",
-      activeLinePlaceholder: "Press '@' to Select variable",
-      ...props,
-      options: {
-        transformer,
-        ...props.options || {}
-      }
-    },
-    /* @__PURE__ */ React33.createElement(VariableTree2, null),
-    /* @__PURE__ */ React33.createElement(VariableTagInject2, null)
-  );
-}
+var JsonEditorWithVariables = lazySuspense(
+  () => import("./editor-EYOQTGMT.js").then((module) => ({ default: module.JsonEditorWithVariables }))
+);
 
 // src/components/inputs-values/index.tsx
-import React35 from "react";
-import { I18n as I18n12 } from "@flowgram.ai/editor";
-import { Button as Button4, IconButton as IconButton4 } 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 React34, { useEffect as useEffect9, useState as useState9 } from "react";
-import Input6 from "@douyinfe/semi-ui/lib/es/input";
-function BlurInput2(props) {
-  const [value, setValue] = useState9("");
-  useEffect9(() => {
-    setValue(props.value);
-  }, [props.value]);
-  return /* @__PURE__ */ React34.createElement(
-    Input6,
-    {
-      ...props,
-      value,
-      onChange: (value2) => {
-        setValue(value2);
-      },
-      onBlur: (e) => props.onChange?.(value, e)
-    }
-  );
-}
-
 // src/components/inputs-values/index.tsx
 function InputsValues({
   value,
@@ -2891,17 +1430,17 @@ function InputsValues({
     onChange,
     sortIndexKey: "extra.index"
   });
-  return /* @__PURE__ */ React35.createElement("div", null, /* @__PURE__ */ React35.createElement(UIRows2, { style }, list.map((item) => /* @__PURE__ */ React35.createElement(UIRow3, { key: item.id }, /* @__PURE__ */ React35.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: I18n12.t("Input Key")
+      placeholder: I18n8.t("Input Key")
     }
-  ), /* @__PURE__ */ React35.createElement(
+  ), /* @__PURE__ */ React15.createElement(
     InjectDynamicValueInput,
     {
       style: { flexGrow: 1 },
@@ -2915,24 +1454,37 @@ function InputsValues({
         strategies: [...constantProps?.strategies || []]
       }
     }
-  ), /* @__PURE__ */ React35.createElement(
+  ), /* @__PURE__ */ React15.createElement(
     IconButton4,
     {
       disabled: readonly,
       theme: "borderless",
-      icon: /* @__PURE__ */ React35.createElement(IconDelete2, { size: "small" }),
+      icon: /* @__PURE__ */ React15.createElement(IconDelete2, { size: "small" }),
       size: "small",
       onClick: () => remove(item.id)
     }
-  )))), /* @__PURE__ */ React35.createElement(Button4, { disabled: readonly, icon: /* @__PURE__ */ React35.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 React36 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;
 
@@ -2945,7 +1497,7 @@ var TreeRow = styled11.div`
   height: 27px;
   white-space: nowrap;
 `;
-var HorizontalLine = styled11.div`
+var HorizontalLine = styled7.div`
   position: relative;
 
   &::before,
@@ -2962,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;
 
@@ -2980,7 +1532,7 @@ var TreeLevel = styled11.div`
     width: 1px;
   } */
 `;
-var TreeItem = styled11.div`
+var TreeItem = styled7.div`
   position: relative;
 
   &::before {
@@ -3003,7 +1555,7 @@ var TreeItem = styled11.div`
     left: -22px;
   }
 
-  ${(props) => props.depth === 0 && css4`
+  ${(props) => props.depth === 0 && css2`
       &::before {
         width: 0px !important;
       }
@@ -3012,7 +1564,7 @@ var TreeItem = styled11.div`
 
 // src/components/display-schema-tree/index.tsx
 function DisplaySchemaTree(props) {
-  return /* @__PURE__ */ React36.createElement(SchemaTree, { ...props });
+  return /* @__PURE__ */ React16.createElement(SchemaTree, { ...props });
 }
 function SchemaTree(props) {
   const {
@@ -3028,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__ */ React36.createElement(TreeItem, { depth, key: parentKey || "root" }, /* @__PURE__ */ React36.createElement(TreeRow, null, depth !== 0 && /* @__PURE__ */ React36.createElement(HorizontalLine, null), showIcon && icon && React36.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__ */ React36.createElement(TreeTitle, null, parentKey ? /* @__PURE__ */ React36.createElement(React36.Fragment, null, `${parentKey} (`, title, ")") : title)), childEntries?.length ? /* @__PURE__ */ React36.createElement(TreeLevel, null, childEntries.map(([key, value]) => /* @__PURE__ */ React36.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 React38, { 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 React37 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 {
@@ -3056,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;
@@ -3068,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__ */ React37.createElement(
-    Popover7,
+  return /* @__PURE__ */ React17.createElement(
+    Popover,
     {
-      content: /* @__PURE__ */ React37.createElement(PopoverContent, null, /* @__PURE__ */ React37.createElement(DisplaySchemaTree, { value, typeManager, showIcon: showIconInTree }))
+      content: /* @__PURE__ */ React17.createElement(PopoverContent, null, /* @__PURE__ */ React17.createElement(DisplaySchemaTree, { value, typeManager, showIcon: showIconInTree }))
     },
-    /* @__PURE__ */ React37.createElement(StyledTag, { color: warning ? "amber" : "white" }, icon && React37.cloneElement(icon, {
+    /* @__PURE__ */ React17.createElement(StyledTag, { color: warning ? "amber" : "white" }, icon && React17.cloneElement(icon, {
       className: "tag-icon"
-    }), title && /* @__PURE__ */ React37.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;
@@ -3089,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;
     }
@@ -3105,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__ */ React38.createElement(DisplayOutputsWrapper, null, childEntries.map(([key, schema]) => /* @__PURE__ */ React38.createElement(
+  return /* @__PURE__ */ React18.createElement(DisplayOutputsWrapper, null, childEntries.map(([key, schema]) => /* @__PURE__ */ React18.createElement(
     DisplaySchemaTag,
     {
       key,
@@ -3123,36 +1675,25 @@ function DisplayOutputs({ value, showIconInTree, displayFromScope }) {
 }
 
 // src/components/display-flow-value/index.tsx
-import React39, { useMemo as useMemo10 } 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 = useMemo10(() => {
+  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__ */ React39.createElement(
+  return /* @__PURE__ */ React19.createElement(
     DisplaySchemaTag,
     {
       title,
@@ -3164,11 +1705,13 @@ function DisplayFlowValue({ value, title, showIconInTree }) {
 }
 
 // src/components/display-inputs-values/index.tsx
-import React40 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;
@@ -3177,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__ */ React40.createElement(DisplayInputsWrapper, null, childEntries.map(([key, value2]) => /* @__PURE__ */ React40.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 React43 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 React42 from "react";
+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 React41, { useEffect as useEffect11, useState as useState10 } from "react";
-import Input7 from "@douyinfe/semi-ui/lib/es/input";
-function BlurInput3(props) {
-  const [value, setValue] = useState10("");
-  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__ */ React41.createElement(
-    Input7,
+  return /* @__PURE__ */ React21.createElement(
+    Input6,
     {
       ...props,
       value,
@@ -3222,7 +1793,7 @@ function AssignRow(props) {
     onDelete,
     readonly
   } = props;
-  return /* @__PURE__ */ React42.createElement("div", { style: { display: "flex", alignItems: "center", gap: 5 } }, /* @__PURE__ */ React42.createElement("div", { style: { width: 150, minWidth: 150, maxWidth: 150 } }, value?.operator === "assign" ? /* @__PURE__ */ React42.createElement(
+  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 },
@@ -3233,8 +1804,8 @@ function AssignRow(props) {
         left: { type: "ref", content: v }
       })
     }
-  ) : /* @__PURE__ */ React42.createElement(
-    BlurInput3,
+  ) : /* @__PURE__ */ React22.createElement(
+    BlurInput2,
     {
       style: { height: 26 },
       size: "small",
@@ -3245,7 +1816,7 @@ function AssignRow(props) {
         left: v
       })
     }
-  )), /* @__PURE__ */ React42.createElement("div", { style: { flexGrow: 1 } }, /* @__PURE__ */ React42.createElement(
+  )), /* @__PURE__ */ React22.createElement("div", { style: { flexGrow: 1 } }, /* @__PURE__ */ React22.createElement(
     InjectDynamicValueInput,
     {
       readonly,
@@ -3255,12 +1826,12 @@ function AssignRow(props) {
         right: v
       })
     }
-  )), onDelete && /* @__PURE__ */ React42.createElement("div", null, /* @__PURE__ */ React42.createElement(
+  )), onDelete && /* @__PURE__ */ React22.createElement("div", null, /* @__PURE__ */ React22.createElement(
     IconButton5,
     {
       size: "small",
       theme: "borderless",
-      icon: /* @__PURE__ */ React42.createElement(IconMinus2, null),
+      icon: /* @__PURE__ */ React22.createElement(IconMinus2, null),
       onClick: () => onDelete?.()
     }
   )));
@@ -3269,7 +1840,7 @@ function AssignRow(props) {
 // src/components/assign-rows/index.tsx
 function AssignRows(props) {
   const { name, readonly } = props;
-  return /* @__PURE__ */ React43.createElement(FieldArray, { name }, ({ field }) => /* @__PURE__ */ React43.createElement(React43.Fragment, null, field.map((childField, index) => /* @__PURE__ */ React43.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,
@@ -3280,27 +1851,341 @@ function AssignRows(props) {
       },
       onDelete: () => field.remove(index)
     }
-  )), /* @__PURE__ */ React43.createElement("div", { style: { display: "flex", gap: 5 } }, /* @__PURE__ */ React43.createElement(
-    Button5,
+  )), /* @__PURE__ */ React23.createElement("div", { style: { display: "flex", gap: 5 } }, /* @__PURE__ */ React23.createElement(
+    Button6,
     {
       size: "small",
       theme: "borderless",
-      icon: /* @__PURE__ */ React43.createElement(IconPlus4, null),
+      icon: /* @__PURE__ */ React23.createElement(IconPlus4, null),
       onClick: () => field.append({ operator: "assign" })
     },
     "Assign"
-  ), /* @__PURE__ */ React43.createElement(
-    Button5,
+  ), /* @__PURE__ */ React23.createElement(
+    Button6,
     {
       size: "small",
       theme: "borderless",
-      icon: /* @__PURE__ */ React43.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,
@@ -3337,7 +2222,6 @@ var provideBatchInputEffect = createEffectFromVariableProvider({
 });
 
 // src/effects/auto-rename-ref/index.ts
-import { isArray, isObject as isObject3, uniq } from "lodash";
 import {
   DataEvent,
   VariableFieldKeyRenameService
@@ -3364,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)) {
@@ -3394,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 (isObject3(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,
@@ -3445,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)
     })
   ]
 });
@@ -3473,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,
@@ -3523,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
@@ -3539,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
@@ -3628,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) {
@@ -3644,7 +2496,7 @@ var createInferInputsPlugin = defineFormPluginCreator2({
       set2(
         formData,
         targetKey,
-        infer(
+        FlowValueUtils.inferJsonSchema(
           get2(formData, sourceKey),
           scope === "private" ? getNodePrivateScope3(ctx.node) : getNodeScope5(ctx.node)
         )
@@ -3653,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,
@@ -3740,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 || []
                     }) : {}
@@ -3756,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;
     });
@@ -3764,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;
@@ -3788,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) {
@@ -3801,31 +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,
@@ -3835,6 +2633,7 @@ export {
   PromptEditorWithVariables,
   TypeSelector,
   VariableSelector,
+  VariableSelectorProvider,
   autoRenameRefEffect,
   createBatchOutputsFormPlugin,
   createDisableDeclarationPlugin,
@@ -3849,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