@flowgram.ai/form-materials 0.3.0 → 0.3.1

package/dist/index.js

@@ -54,6 +54,7 @@ __export(src_exports, {
   VariableSelector: () => VariableSelector,
   autoRenameRefEffect: () => autoRenameRefEffect,
   createBatchOutputsFormPlugin: () => createBatchOutputsFormPlugin,
+  createDisableDeclarationPlugin: () => createDisableDeclarationPlugin,
   createInferInputsPlugin: () => createInferInputsPlugin,
   createTypePresetPlugin: () => createTypePresetPlugin,
   formatLegacyRefOnInit: () => formatLegacyRefOnInit,
@@ -85,79 +86,17 @@ var import_semi_icons = require("@douyinfe/semi-icons");
 // src/components/variable-selector/use-variable-tree.tsx
 var import_react11 = __toESM(require("react"));
 var import_json_schema4 = require("@flowgram.ai/json-schema");
-var import_editor3 = require("@flowgram.ai/editor");
+var import_editor4 = require("@flowgram.ai/editor");
 var import_semi_ui5 = require("@douyinfe/semi-ui");
 
-// src/shared/format-legacy-refs/index.ts
-var import_lodash = require("lodash");
-function formatLegacyRefOnSubmit(value) {
-  if ((0, import_lodash.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 ((0, import_lodash.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 (0, import_lodash.isObject)(value) && Object.keys(value).length === 2 && value.type === "ref" && typeof value.content === "string";
-}
-function isNewFlowRefValueSchema(value) {
-  return (0, import_lodash.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/json-schema-preset/index.tsx
+// src/plugins/json-schema-preset/index.tsx
 var import_react10 = __toESM(require("react"));
 var import_json_schema3 = require("@flowgram.ai/json-schema");
 
-// src/shared/json-schema-preset/type-definition/index.tsx
+// src/plugins/json-schema-preset/type-definition/index.tsx
 var import_json_schema = require("@flowgram.ai/json-schema");
 
-// src/shared/json-schema-preset/type-definition/string.tsx
+// src/plugins/json-schema-preset/type-definition/string.tsx
 var import_react = __toESM(require("react"));
 var import_semi_ui = require("@douyinfe/semi-ui");
 var stringRegistry = {
@@ -165,7 +104,7 @@ var stringRegistry = {
   ConstantRenderer: (props) => /* @__PURE__ */ import_react.default.createElement(import_semi_ui.Input, { placeholder: "Please Input String", size: "small", disabled: props.readonly, ...props })
 };
 
-// src/shared/json-schema-preset/type-definition/object.tsx
+// src/plugins/json-schema-preset/type-definition/object.tsx
 var import_react5 = __toESM(require("react"));
 
 // src/components/code-editor-mini/index.tsx
@@ -533,7 +472,7 @@ function CodeEditorMini(props) {
   ));
 }
 
-// src/shared/json-schema-preset/type-definition/object.tsx
+// src/plugins/json-schema-preset/type-definition/object.tsx
 var objectRegistry = {
   type: "object",
   ConstantRenderer: (props) => /* @__PURE__ */ import_react5.default.createElement(
@@ -548,7 +487,7 @@ var objectRegistry = {
   )
 };
 
-// src/shared/json-schema-preset/type-definition/number.tsx
+// src/plugins/json-schema-preset/type-definition/number.tsx
 var import_react6 = __toESM(require("react"));
 var import_semi_ui2 = require("@douyinfe/semi-ui");
 var numberRegistry = {
@@ -565,7 +504,7 @@ var numberRegistry = {
   )
 };
 
-// src/shared/json-schema-preset/type-definition/integer.tsx
+// src/plugins/json-schema-preset/type-definition/integer.tsx
 var import_react7 = __toESM(require("react"));
 var import_semi_ui3 = require("@douyinfe/semi-ui");
 var integerRegistry = {
@@ -582,7 +521,7 @@ var integerRegistry = {
   )
 };
 
-// src/shared/json-schema-preset/type-definition/boolean.tsx
+// src/plugins/json-schema-preset/type-definition/boolean.tsx
 var import_react8 = __toESM(require("react"));
 var import_semi_ui4 = require("@douyinfe/semi-ui");
 var booleanRegistry = {
@@ -607,7 +546,7 @@ var booleanRegistry = {
   }
 };
 
-// src/shared/json-schema-preset/type-definition/array.tsx
+// src/plugins/json-schema-preset/type-definition/array.tsx
 var import_react9 = __toESM(require("react"));
 var arrayRegistry = {
   type: "array",
@@ -623,7 +562,7 @@ var arrayRegistry = {
   )
 };
 
-// src/shared/json-schema-preset/type-definition/index.tsx
+// src/plugins/json-schema-preset/type-definition/index.tsx
 var jsonSchemaTypePreset = [
   stringRegistry,
   objectRegistry,
@@ -634,30 +573,51 @@ var jsonSchemaTypePreset = [
 ];
 jsonSchemaTypePreset.forEach((_type) => import_json_schema.jsonSchemaTypeManager.register(_type));
 
-// src/shared/json-schema-preset/create-type-preset-plugin.tsx
+// src/plugins/json-schema-preset/create-type-preset-plugin.tsx
 var import_json_schema2 = require("@flowgram.ai/json-schema");
 var import_editor2 = require("@flowgram.ai/editor");
 var createTypePresetPlugin = (0, import_editor2.definePluginCreator)({
   onInit(ctx, opts) {
     const typeManager = ctx.get(import_json_schema2.BaseTypeManager);
     jsonSchemaTypePreset.forEach((_type) => typeManager.register(_type));
-    opts.types.forEach((_type) => typeManager.register(_type));
+    opts.types?.forEach((_type) => typeManager.register(_type));
+    opts.unregisterTypes?.forEach((_type) => typeManager.unregister(_type));
   },
   containerModules: [import_json_schema2.jsonSchemaContainerModule]
 });
 
-// src/shared/json-schema-preset/index.tsx
+// src/plugins/json-schema-preset/index.tsx
 var useTypeManager = () => (0, import_json_schema3.useTypeManager)();
 var JsonSchemaTypePresetProvider = ({
   types = [],
   children
 }) => /* @__PURE__ */ import_react10.default.createElement(import_json_schema3.TypePresetProvider, { types: [...jsonSchemaTypePreset, ...types] }, children);
 
+// src/plugins/disable-declaration-plugin/create-disable-declaration-plugin.ts
+var import_editor3 = require("@flowgram.ai/editor");
+var createDisableDeclarationPlugin = (0, import_editor3.definePluginCreator)({
+  onInit(ctx) {
+    const variableEngine = ctx.get(import_editor3.VariableEngine);
+    const handleEvent = (action) => {
+      if (import_editor3.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 = (0, import_editor3.useAvailableVariables)();
+  const variables = (0, import_editor4.useAvailableVariables)();
   const getVariableTypeIcon = (0, import_react11.useCallback)((variable) => {
     if (variable.meta?.icon) {
       if (typeof variable.meta.icon === "string") {
@@ -674,7 +634,7 @@ function useVariableTree(params) {
       return null;
     }
     let children;
-    if (import_editor3.ASTMatch.isObject(type)) {
+    if (import_editor4.ASTMatch.isObject(type)) {
       children = (type.properties || []).map((_property) => renderVariable(_property, [...parentFields, variable])).filter(Boolean);
     }
     const keyPath = [...parentFields.map((_field) => _field.key), variable.key];
@@ -1102,7 +1062,7 @@ var ConstantInputWrapper = import_styled_components3.default.div`
 
 // src/components/json-schema-editor/hooks.tsx
 var import_react15 = require("react");
-var import_lodash2 = require("lodash");
+var import_lodash = require("lodash");
 var _id = 0;
 function genId() {
   return _id++;
@@ -1175,7 +1135,7 @@ function usePropertiesEdit(value, onChange) {
         if (!_property.name) {
           continue;
         }
-        nextProperties[_property.name] = (0, import_lodash2.omit)(_property, ["key", "name", "isPropertyRequired"]);
+        nextProperties[_property.name] = (0, import_lodash.omit)(_property, ["key", "name", "isPropertyRequired"]);
         if (_property.isPropertyRequired) {
           nextRequired.push(_property.name);
         }
@@ -1562,13 +1522,13 @@ function PropertyEdit(props) {
 
 // src/components/batch-variable-selector/index.tsx
 var import_react20 = __toESM(require("react"));
-var import_editor4 = require("@flowgram.ai/editor");
+var import_editor5 = require("@flowgram.ai/editor");
 var batchVariableSchema = {
   type: "array",
   extra: { weak: true }
 };
 function BatchVariableSelector(props) {
-  return /* @__PURE__ */ import_react20.default.createElement(import_editor4.PrivateScopeProvider, null, /* @__PURE__ */ import_react20.default.createElement(VariableSelector, { ...props, includeSchema: batchVariableSchema }));
+  return /* @__PURE__ */ import_react20.default.createElement(import_editor5.PrivateScopeProvider, null, /* @__PURE__ */ import_react20.default.createElement(VariableSelector, { ...props, includeSchema: batchVariableSchema }));
 }
 
 // src/components/dynamic-value-input/index.tsx
@@ -1624,9 +1584,9 @@ var UITrigger = import_styled_components4.default.div`
 
 // src/components/dynamic-value-input/hooks.ts
 var import_react21 = require("react");
-var import_editor5 = require("@flowgram.ai/editor");
+var import_editor6 = require("@flowgram.ai/editor");
 function useRefVariable(value) {
-  const available = (0, import_editor5.useScopeAvailable)();
+  const available = (0, import_editor6.useScopeAvailable)();
   const refVariable = (0, import_react21.useMemo)(() => {
     if (value?.type === "ref") {
       return available.getByKeyPath(value.content);
@@ -1779,7 +1739,7 @@ var UIValues = import_styled_components5.default.div`
 // src/components/condition-row/hooks/useRule.ts
 var import_react23 = require("react");
 var import_json_schema6 = require("@flowgram.ai/json-schema");
-var import_editor6 = require("@flowgram.ai/editor");
+var import_editor7 = require("@flowgram.ai/editor");
 
 // src/components/condition-row/constants.ts
 var rules = {
@@ -1827,7 +1787,11 @@ var rules = {
   },
   array: {
     ["is_empty" /* IS_EMPTY */]: null,
-    ["is_not_empty" /* IS_NOT_EMPTY */]: null
+    ["is_not_empty" /* IS_NOT_EMPTY */]: null,
+    ["contains" /* CONTAINS */]: "array",
+    ["not_contains" /* NOT_CONTAINS */]: "array",
+    ["eq" /* EQ */]: "array",
+    ["neq" /* NEQ */]: "array"
   },
   map: {
     ["is_empty" /* IS_EMPTY */]: null,
@@ -1899,7 +1863,7 @@ var opConfigs = {
 
 // src/components/condition-row/hooks/useRule.ts
 function useRule(left) {
-  const available = (0, import_editor6.useScopeAvailable)();
+  const available = (0, import_editor7.useScopeAvailable)();
   const variable = (0, import_react23.useMemo)(() => {
     if (!left) return void 0;
     return available.getByKeyPath(left.content);
@@ -1997,7 +1961,7 @@ var import_semi_icons7 = require("@douyinfe/semi-icons");
 // src/hooks/use-object-list/index.tsx
 var import_react26 = require("react");
 var import_nanoid = require("nanoid");
-var import_lodash3 = require("lodash");
+var import_lodash2 = require("lodash");
 function genId2() {
   return (0, import_nanoid.nanoid)();
 }
@@ -2009,9 +1973,9 @@ function useObjectList({
   const [list, setList] = (0, import_react26.useState)([]);
   (0, import_react26.useEffect)(() => {
     setList((_prevList) => {
-      const newKeys = Object.entries(value || {}).sort((a, b) => (0, import_lodash3.get)(a[1], sortIndexKey || 0) - (0, import_lodash3.get)(b[1], sortIndexKey || 0)).map(([key]) => key);
+      const newKeys = Object.entries(value || {}).sort((a, b) => (0, import_lodash2.get)(a[1], sortIndexKey || 0) - (0, import_lodash2.get)(b[1], sortIndexKey || 0)).map(([key]) => key);
       const oldKeys = _prevList.map((item) => item.key).filter(Boolean);
-      const addKeys = (0, import_lodash3.difference)(newKeys, oldKeys);
+      const addKeys = (0, import_lodash2.difference)(newKeys, oldKeys);
       return _prevList.filter((item) => !item.key || newKeys.includes(item.key)).map((item) => ({
         id: item.id,
         key: item.key,
@@ -2047,8 +2011,8 @@ function useObjectList({
       onChange(
         Object.fromEntries(
           nextList.filter((item) => item.key).map((item) => [item.key, item.value]).map((_res, idx) => {
-            if ((0, import_lodash3.isObject)(_res[1]) && sortIndexKey) {
-              (0, import_lodash3.set)(_res[1], sortIndexKey, idx);
+            if ((0, import_lodash2.isObject)(_res[1]) && sortIndexKey) {
+              (0, import_lodash2.set)(_res[1], sortIndexKey, idx);
             }
             return _res;
           })
@@ -2156,13 +2120,13 @@ var UIContainer4 = import_styled_components7.default.div`
 // src/components/prompt-editor/extensions/markdown.tsx
 var import_react28 = require("react");
 var import_react29 = require("@coze-editor/editor/react");
-var import_editor7 = require("@coze-editor/editor");
+var import_editor8 = require("@coze-editor/editor");
 var import_view2 = require("@codemirror/view");
 function MarkdownHighlight() {
   const injector = (0, import_react29.useInjector)();
   (0, import_react28.useLayoutEffect)(
     () => injector.inject([
-      import_editor7.astDecorator.whole.of((cursor) => {
+      import_editor8.astDecorator.whole.of((cursor) => {
         if (cursor.name.startsWith("ATXHeading")) {
           return {
             type: "className",
@@ -2224,13 +2188,13 @@ var language_support_default = LanguageSupport;
 // src/components/prompt-editor/extensions/jinja.tsx
 var import_react32 = require("react");
 var import_react33 = require("@coze-editor/editor/react");
-var import_editor8 = require("@coze-editor/editor");
+var import_editor9 = require("@coze-editor/editor");
 var import_view3 = require("@codemirror/view");
 function JinjaHighlight() {
   const injector = (0, import_react33.useInjector)();
   (0, import_react32.useLayoutEffect)(
     () => injector.inject([
-      import_editor8.astDecorator.whole.of((cursor) => {
+      import_editor9.astDecorator.whole.of((cursor) => {
         if (cursor.name === "JinjaStatementStart" || cursor.name === "JinjaStatementEnd") {
           return {
             type: "className",
@@ -2370,8 +2334,8 @@ function VariableTree() {
 // src/components/prompt-editor-with-variables/extensions/variable-tag.tsx
 var import_react_dom = __toESM(require("react-dom"));
 var import_react38 = __toESM(require("react"));
-var import_lodash4 = require("lodash");
-var import_editor9 = require("@flowgram.ai/editor");
+var import_lodash3 = require("lodash");
+var import_editor10 = require("@flowgram.ai/editor");
 var import_semi_ui18 = require("@douyinfe/semi-ui");
 var import_semi_icons8 = require("@douyinfe/semi-icons");
 var import_react39 = require("@coze-editor/editor/react");
@@ -2418,7 +2382,7 @@ var UIPopoverContent2 = import_styled_components8.default.div`
 var VariableTagWidget = class extends import_view4.WidgetType {
   constructor({ keyPath, scope }) {
     super();
-    this.toDispose = new import_editor9.DisposableCollection();
+    this.toDispose = new import_editor10.DisposableCollection();
     this.renderIcon = (icon) => {
       if (typeof icon === "string") {
         return /* @__PURE__ */ import_react38.default.createElement("img", { style: { marginRight: 8 }, width: 12, height: 12, src: icon });
@@ -2438,7 +2402,7 @@ var VariableTagWidget = class extends import_view4.WidgetType {
       );
       return;
     }
-    const rootField = (0, import_lodash4.last)(v.parentFields) || v;
+    const rootField = (0, import_lodash3.last)(v.parentFields) || v;
     const isRoot = v.parentFields.length === 0;
     const rootTitle = /* @__PURE__ */ import_react38.default.createElement(UIRootTitle2, null, rootField?.meta.title ? `${rootField.meta.title} ${isRoot ? "" : "-"} ` : "");
     const rootIcon = this.renderIcon(rootField?.meta.icon);
@@ -2456,7 +2420,7 @@ var VariableTagWidget = class extends import_view4.WidgetType {
     const dom = document.createElement("span");
     this.rootDOM = dom;
     this.toDispose.push(
-      import_editor9.Disposable.create(() => {
+      import_editor10.Disposable.create(() => {
         import_react_dom.default.unmountComponentAtNode(this.rootDOM);
       })
     );
@@ -2473,7 +2437,7 @@ var VariableTagWidget = class extends import_view4.WidgetType {
     return dom;
   }
   eq(other) {
-    return (0, import_lodash4.isEqual)(this.keyPath, other.keyPath);
+    return (0, import_lodash3.isEqual)(this.keyPath, other.keyPath);
   }
   ignoreEvent() {
     return false;
@@ -2484,7 +2448,7 @@ var VariableTagWidget = class extends import_view4.WidgetType {
 };
 function VariableTagInject() {
   const injector = (0, import_react39.useInjector)();
-  const scope = (0, import_editor9.useCurrentScope)();
+  const scope = (0, import_editor10.useCurrentScope)();
   (0, import_react38.useLayoutEffect)(() => {
     const atMatcher = new import_view4.MatchDecorator({
       regexp: /\{\{([^\}]+)\}\}/g,
@@ -2535,16 +2499,16 @@ var import_react43 = require("@coze-editor/editor/react");
 
 // src/components/prompt-editor-with-inputs/inputs-picker.tsx
 var import_react41 = __toESM(require("react"));
-var import_lodash5 = require("lodash");
-var import_editor10 = require("@flowgram.ai/editor");
+var import_lodash4 = require("lodash");
+var import_editor11 = require("@flowgram.ai/editor");
 var import_semi_ui19 = require("@douyinfe/semi-ui");
 function InputsPicker({
   inputsValues,
   onSelect
 }) {
-  const available = (0, import_editor10.useScopeAvailable)();
+  const available = (0, import_editor11.useScopeAvailable)();
   const getArrayDrilldown = (type, depth = 1) => {
-    if (import_editor10.ASTMatch.isArray(type.items)) {
+    if (import_editor11.ASTMatch.isArray(type.items)) {
       return getArrayDrilldown(type.items, depth + 1);
     }
     return { type: type.items, depth };
@@ -2552,12 +2516,12 @@ function InputsPicker({
   const renderVariable = (variable, keyPath) => {
     let type = variable?.type;
     let children;
-    if (import_editor10.ASTMatch.isObject(type)) {
+    if (import_editor11.ASTMatch.isObject(type)) {
       children = (type.properties || []).map((_property) => renderVariable(_property, [...keyPath, _property.key])).filter(Boolean);
     }
-    if (import_editor10.ASTMatch.isArray(type)) {
+    if (import_editor11.ASTMatch.isArray(type)) {
       const drilldown = getArrayDrilldown(type);
-      if (import_editor10.ASTMatch.isObject(drilldown.type)) {
+      if (import_editor11.ASTMatch.isObject(drilldown.type)) {
         children = (drilldown.type.properties || []).map(
           (_property) => renderVariable(_property, [
             ...keyPath,
@@ -2570,7 +2534,7 @@ function InputsPicker({
     const key = keyPath.map((_key, idx) => _key === "[0]" || idx === 0 ? _key : `.${_key}`).join("");
     return {
       key,
-      label: (0, import_lodash5.last)(keyPath),
+      label: (0, import_lodash4.last)(keyPath),
       value: key,
       children
     };
@@ -2716,8 +2680,8 @@ function VariableTree2() {
 // src/components/json-editor-with-variables/extensions/variable-tag.tsx
 var import_react47 = __toESM(require("react"));
 var import_client = require("react-dom/client");
-var import_lodash6 = require("lodash");
-var import_editor11 = require("@flowgram.ai/editor");
+var import_lodash5 = require("lodash");
+var import_editor12 = require("@flowgram.ai/editor");
 var import_semi_ui23 = require("@douyinfe/semi-ui");
 var import_semi_icons9 = require("@douyinfe/semi-icons");
 var import_react48 = require("@coze-editor/editor/react");
@@ -2764,7 +2728,7 @@ var UIPopoverContent3 = import_styled_components9.default.div`
 var VariableTagWidget2 = class extends import_view5.WidgetType {
   constructor({ keyPath, scope }) {
     super();
-    this.toDispose = new import_editor11.DisposableCollection();
+    this.toDispose = new import_editor12.DisposableCollection();
     this.renderIcon = (icon) => {
       if (typeof icon === "string") {
         return /* @__PURE__ */ import_react47.default.createElement("img", { style: { marginRight: 8 }, width: 12, height: 12, src: icon });
@@ -2781,7 +2745,7 @@ var VariableTagWidget2 = class extends import_view5.WidgetType {
       );
       return;
     }
-    const rootField = (0, import_lodash6.last)(v.parentFields);
+    const rootField = (0, import_lodash5.last)(v.parentFields);
     const rootTitle = /* @__PURE__ */ import_react47.default.createElement(UIRootTitle3, null, rootField?.meta.title ? `${rootField.meta.title} -` : "");
     const rootIcon = this.renderIcon(rootField?.meta.icon);
     this.root.render(
@@ -2798,7 +2762,7 @@ var VariableTagWidget2 = class extends import_view5.WidgetType {
     const dom = document.createElement("span");
     this.root = (0, import_client.createRoot)(dom);
     this.toDispose.push(
-      import_editor11.Disposable.create(() => {
+      import_editor12.Disposable.create(() => {
         this.root.unmount();
       })
     );
@@ -2815,7 +2779,7 @@ var VariableTagWidget2 = class extends import_view5.WidgetType {
     return dom;
   }
   eq(other) {
-    return (0, import_lodash6.isEqual)(this.keyPath, other.keyPath);
+    return (0, import_lodash5.isEqual)(this.keyPath, other.keyPath);
   }
   ignoreEvent() {
     return false;
@@ -2826,7 +2790,7 @@ var VariableTagWidget2 = class extends import_view5.WidgetType {
 };
 function VariableTagInject2() {
   const injector = (0, import_react48.useInjector)();
-  const scope = (0, import_editor11.useCurrentScope)();
+  const scope = (0, import_editor12.useCurrentScope)();
   (0, import_react47.useLayoutEffect)(() => {
     const atMatcher = new import_view5.MatchDecorator({
       regexp: /\{\{([^\}]+)\}\}/g,
@@ -3108,7 +3072,7 @@ function SchemaTree(props) {
 // src/components/display-outputs/index.tsx
 var import_react54 = __toESM(require("react"));
 var import_json_schema7 = require("@flowgram.ai/json-schema");
-var import_editor12 = require("@flowgram.ai/editor");
+var import_editor13 = require("@flowgram.ai/editor");
 
 // src/components/display-schema-tag/index.tsx
 var import_react53 = __toESM(require("react"));
@@ -3161,8 +3125,8 @@ var DisplayOutputsWrapper = import_styled_components13.default.div`
 
 // src/components/display-outputs/index.tsx
 function DisplayOutputs({ value, showIconInTree, displayFromScope }) {
-  const scope = (0, import_editor12.useCurrentScope)();
-  const refresh = (0, import_editor12.useRefresh)();
+  const scope = (0, import_editor13.useCurrentScope)();
+  const refresh = (0, import_editor13.useRefresh)();
   (0, import_react54.useEffect)(() => {
     if (!displayFromScope) {
       return () => null;
@@ -3188,9 +3152,9 @@ function DisplayOutputs({ value, showIconInTree, displayFromScope }) {
 // src/components/display-flow-value/index.tsx
 var import_react55 = __toESM(require("react"));
 var import_json_schema8 = require("@flowgram.ai/json-schema");
-var import_editor13 = require("@flowgram.ai/editor");
+var import_editor14 = require("@flowgram.ai/editor");
 function DisplayFlowValue({ value, title, showIconInTree }) {
-  const available = (0, import_editor13.useScopeAvailable)();
+  const available = (0, import_editor14.useScopeAvailable)();
   const variable = value?.type === "ref" ? available.getByKeyPath(value?.content) : void 0;
   const schema = (0, import_react55.useMemo)(() => {
     if (value?.type === "ref") {
@@ -3244,29 +3208,29 @@ function DisplayInputsValues({ value, showIconInTree }) {
 }
 
 // src/effects/provide-batch-input/index.ts
-var import_editor14 = require("@flowgram.ai/editor");
-var provideBatchInputEffect = (0, import_editor14.createEffectFromVariableProvider)({
+var import_editor15 = require("@flowgram.ai/editor");
+var provideBatchInputEffect = (0, import_editor15.createEffectFromVariableProvider)({
   private: true,
   parse: (value, ctx) => [
-    import_editor14.ASTFactory.createVariableDeclaration({
+    import_editor15.ASTFactory.createVariableDeclaration({
       key: `${ctx.node.id}_locals`,
       meta: {
-        title: (0, import_editor14.getNodeForm)(ctx.node)?.getValueIn("title"),
+        title: (0, import_editor15.getNodeForm)(ctx.node)?.getValueIn("title"),
         icon: ctx.node.getNodeRegistry().info?.icon
       },
-      type: import_editor14.ASTFactory.createObject({
+      type: import_editor15.ASTFactory.createObject({
         properties: [
-          import_editor14.ASTFactory.createProperty({
+          import_editor15.ASTFactory.createProperty({
             key: "item",
-            initializer: import_editor14.ASTFactory.createEnumerateExpression({
-              enumerateFor: import_editor14.ASTFactory.createKeyPathExpression({
+            initializer: import_editor15.ASTFactory.createEnumerateExpression({
+              enumerateFor: import_editor15.ASTFactory.createKeyPathExpression({
                 keyPath: value.content || []
               })
             })
           }),
-          import_editor14.ASTFactory.createProperty({
+          import_editor15.ASTFactory.createProperty({
             key: "index",
-            type: import_editor14.ASTFactory.createNumber()
+            type: import_editor15.ASTFactory.createNumber()
           })
         ]
       })
@@ -3275,14 +3239,14 @@ var provideBatchInputEffect = (0, import_editor14.createEffectFromVariableProvid
 });
 
 // src/effects/auto-rename-ref/index.ts
-var import_lodash7 = require("lodash");
-var import_editor15 = require("@flowgram.ai/editor");
+var import_lodash6 = require("lodash");
+var import_editor16 = require("@flowgram.ai/editor");
 var autoRenameRefEffect = [
   {
-    event: import_editor15.DataEvent.onValueInit,
+    event: import_editor16.DataEvent.onValueInit,
     effect: (params) => {
       const { context, form, name } = params;
-      const renameService = context.node.getService(import_editor15.VariableFieldKeyRenameService);
+      const renameService = context.node.getService(import_editor16.VariableFieldKeyRenameService);
       const disposable = renameService.onRename(({ before, after }) => {
         const beforeKeyPath = [
           ...before.parentFields.map((_field) => _field.key).reverse(),
@@ -3331,7 +3295,7 @@ function isKeyPathMatch(keyPath = [], targetKeyPath) {
 }
 function getTemplateKeyPaths(value) {
   const keyPathReg = /{{(.*?)}}/g;
-  return (0, import_lodash7.uniq)(value.content?.match(keyPathReg) || []).map(
+  return (0, import_lodash6.uniq)(value.content?.match(keyPathReg) || []).map(
     (_keyPath) => _keyPath.slice(2, -2).split(".")
   );
 }
@@ -3342,7 +3306,7 @@ function isTemplate(value) {
   return value?.type === "template" && typeof value?.content === "string";
 }
 function traverseRef(name, value, cb) {
-  if ((0, import_lodash7.isObject)(value)) {
+  if ((0, import_lodash6.isObject)(value)) {
     if (isRef(value)) {
       cb(name, value);
       return;
@@ -3356,7 +3320,7 @@ function traverseRef(name, value, cb) {
     });
     return;
   }
-  if ((0, import_lodash7.isArray)(value)) {
+  if ((0, import_lodash6.isArray)(value)) {
     value.forEach((_value, idx) => {
       traverseRef(`${name}[${idx}]`, _value, cb);
     });
@@ -3367,13 +3331,13 @@ function traverseRef(name, value, cb) {
 
 // src/effects/provide-json-schema-outputs/index.ts
 var import_json_schema9 = require("@flowgram.ai/json-schema");
-var import_editor16 = require("@flowgram.ai/editor");
-var provideJsonSchemaOutputs = (0, import_editor16.createEffectFromVariableProvider)({
+var import_editor17 = require("@flowgram.ai/editor");
+var provideJsonSchemaOutputs = (0, import_editor17.createEffectFromVariableProvider)({
   parse: (value, ctx) => [
-    import_editor16.ASTFactory.createVariableDeclaration({
+    import_editor17.ASTFactory.createVariableDeclaration({
       key: `${ctx.node.id}`,
       meta: {
-        title: (0, import_editor16.getNodeForm)(ctx.node)?.getValueIn("title") || ctx.node.id,
+        title: (0, import_editor17.getNodeForm)(ctx.node)?.getValueIn("title") || ctx.node.id,
         icon: ctx.node.getNodeRegistry().info?.icon
       },
       type: import_json_schema9.JsonSchemaUtils.schemaToAST(value)
@@ -3382,12 +3346,12 @@ var provideJsonSchemaOutputs = (0, import_editor16.createEffectFromVariableProvi
 });
 
 // src/effects/sync-variable-title/index.ts
-var import_editor17 = require("@flowgram.ai/editor");
+var import_editor18 = require("@flowgram.ai/editor");
 var syncVariableTitle = [
   {
-    event: import_editor17.DataEvent.onValueChange,
+    event: import_editor18.DataEvent.onValueChange,
     effect: ({ value, context }) => {
-      context.node.getData(import_editor17.FlowNodeVariableData).allScopes.forEach((_scope) => {
+      context.node.getData(import_editor18.FlowNodeVariableData).allScopes.forEach((_scope) => {
         _scope.output.variables.forEach((_var) => {
           _var.updateMeta({
             ..._var.meta || {},
@@ -3400,22 +3364,84 @@ var syncVariableTitle = [
   }
 ];
 
+// src/shared/format-legacy-refs/index.ts
+var import_lodash7 = require("lodash");
+function formatLegacyRefOnSubmit(value) {
+  if ((0, import_lodash7.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 ((0, import_lodash7.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 (0, import_lodash7.isObject)(value) && Object.keys(value).length === 2 && value.type === "ref" && typeof value.content === "string";
+}
+function isNewFlowRefValueSchema(value) {
+  return (0, import_lodash7.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/form-plugins/batch-outputs-plugin/index.ts
-var import_editor18 = require("@flowgram.ai/editor");
-var provideBatchOutputsEffect = (0, import_editor18.createEffectFromVariableProvider)({
+var import_editor19 = require("@flowgram.ai/editor");
+var provideBatchOutputsEffect = (0, import_editor19.createEffectFromVariableProvider)({
   parse: (value, ctx) => [
-    import_editor18.ASTFactory.createVariableDeclaration({
+    import_editor19.ASTFactory.createVariableDeclaration({
       key: `${ctx.node.id}`,
       meta: {
-        title: (0, import_editor18.getNodeForm)(ctx.node)?.getValueIn("title"),
+        title: (0, import_editor19.getNodeForm)(ctx.node)?.getValueIn("title"),
         icon: ctx.node.getNodeRegistry().info?.icon
       },
-      type: import_editor18.ASTFactory.createObject({
+      type: import_editor19.ASTFactory.createObject({
         properties: Object.entries(value).map(
-          ([_key, value2]) => import_editor18.ASTFactory.createProperty({
+          ([_key, value2]) => import_editor19.ASTFactory.createProperty({
             key: _key,
-            initializer: import_editor18.ASTFactory.createWrapArrayExpression({
-              wrapFor: import_editor18.ASTFactory.createKeyPathExpression({
+            initializer: import_editor19.ASTFactory.createWrapArrayExpression({
+              wrapFor: import_editor19.ASTFactory.createKeyPathExpression({
                 keyPath: value2?.content || []
               })
             })
@@ -3425,7 +3451,7 @@ var provideBatchOutputsEffect = (0, import_editor18.createEffectFromVariableProv
     })
   ]
 });
-var createBatchOutputsFormPlugin = (0, import_editor18.defineFormPluginCreator)({
+var createBatchOutputsFormPlugin = (0, import_editor19.defineFormPluginCreator)({
   name: "batch-outputs-plugin",
   onSetupFormMeta({ mergeEffect }, { outputKey }) {
     mergeEffect({
@@ -3433,7 +3459,7 @@ var createBatchOutputsFormPlugin = (0, import_editor18.defineFormPluginCreator)(
     });
   },
   onInit(ctx, { outputKey }) {
-    const chainTransformService = ctx.node.getService(import_editor18.ScopeChainTransformService);
+    const chainTransformService = ctx.node.getService(import_editor19.ScopeChainTransformService);
     const batchNodeType = ctx.node.flowNodeType;
     const transformerId = `${batchNodeType}-outputs`;
     if (chainTransformService.hasTransformer(transformerId)) {
@@ -3443,21 +3469,21 @@ var createBatchOutputsFormPlugin = (0, import_editor18.defineFormPluginCreator)(
       transformCovers: (covers, ctx2) => {
         const node = ctx2.scope.meta?.node;
         if (node?.parent?.flowNodeType === batchNodeType) {
-          return [...covers, (0, import_editor18.getNodeScope)(node.parent)];
+          return [...covers, (0, import_editor19.getNodeScope)(node.parent)];
         }
         return covers;
       },
       transformDeps(scopes, ctx2) {
         const scopeMeta = ctx2.scope.meta;
-        if (scopeMeta?.type === import_editor18.FlowNodeScopeType.private) {
+        if (scopeMeta?.type === import_editor19.FlowNodeScopeType.private) {
           return scopes;
         }
         const node = scopeMeta?.node;
         if (node?.flowNodeType === batchNodeType) {
           const childBlocks = node.blocks;
           return [
-            (0, import_editor18.getNodePrivateScope)(node),
-            ...childBlocks.map((_childBlock) => (0, import_editor18.getNodeScope)(_childBlock))
+            (0, import_editor19.getNodePrivateScope)(node),
+            ...childBlocks.map((_childBlock) => (0, import_editor19.getNodeScope)(_childBlock))
           ];
         }
         return scopes;
@@ -3469,8 +3495,8 @@ var createBatchOutputsFormPlugin = (0, import_editor18.defineFormPluginCreator)(
 // src/form-plugins/infer-inputs-plugin/index.ts
 var import_lodash8 = require("lodash");
 var import_json_schema10 = require("@flowgram.ai/json-schema");
-var import_editor19 = require("@flowgram.ai/editor");
-var createInferInputsPlugin = (0, import_editor19.defineFormPluginCreator)({
+var import_editor20 = require("@flowgram.ai/editor");
+var createInferInputsPlugin = (0, import_editor20.defineFormPluginCreator)({
   onSetupFormMeta({ addFormatOnSubmit }, { sourceKey, targetKey, scope }) {
     if (!sourceKey || !targetKey) {
       return;
@@ -3481,7 +3507,7 @@ var createInferInputsPlugin = (0, import_editor19.defineFormPluginCreator)({
         targetKey,
         infer(
           (0, import_lodash8.get)(formData, sourceKey),
-          scope === "private" ? (0, import_editor19.getNodePrivateScope)(ctx.node) : (0, import_editor19.getNodeScope)(ctx.node)
+          scope === "private" ? (0, import_editor20.getNodePrivateScope)(ctx.node) : (0, import_editor20.getNodeScope)(ctx.node)
         )
       );
       return formData;
@@ -3567,6 +3593,7 @@ var infer = (values, scope) => {
   VariableSelector,
   autoRenameRefEffect,
   createBatchOutputsFormPlugin,
+  createDisableDeclarationPlugin,
   createInferInputsPlugin,
   createTypePresetPlugin,
   formatLegacyRefOnInit,