chore: update variable output sync api in demo

apps/demo-fixed-layout/src/plugins/variable-plugin/utils.ts

@@ -1,29 +1,16 @@
-import { get, set } from 'lodash-es';
-import {
-  type ArrayType,
-  ASTKind,
-  type ASTNodeJSON,
-  type BaseType,
-  type ObjectType,
-} from '@flowgram.ai/fixed-layout-editor';
+import { get } from 'lodash-es';
+import { ASTKind, type ASTNodeJSON } from '@flowgram.ai/fixed-layout-editor';
 
 import { type JsonSchema } from '../../typings';
 
 function sortProperties(properties: Record<string, JsonSchema>) {
   return Object.entries(properties).sort(
-    (a, b) => (get(a?.[1], 'extra.index') || 0) - (get(b?.[1], 'extra.index') || 0),
+    (a, b) => (get(a?.[1], 'extra.index') || 0) - (get(b?.[1], 'extra.index') || 0)
   );
 }
 
 export function createASTFromJSONSchema(jsonSchema: JsonSchema): ASTNodeJSON | undefined {
-  const { type, $ref } = jsonSchema || {};
-
-  if ($ref) {
-    return {
-      kind: 'RefCustomType',
-      $ref,
-    };
-  }
+  const { type } = jsonSchema || {};
 
   if (!type) {
     return undefined;
@@ -54,37 +41,3 @@ export function createASTFromJSONSchema(jsonSchema: JsonSchema): ASTNodeJSON | u
       };
   }
 }
-
-export function parseASTToJSONSchema(type?: BaseType): JsonSchema | undefined {
-  switch (type?.kind) {
-    case ASTKind.Object:
-      return {
-        type: 'object',
-        properties: (type as ObjectType).properties.reduce<Record<string, JsonSchema>>(
-          (acm: any, curr, index) => {
-            acm[curr.key] = parseASTToJSONSchema(curr.type);
-            set(acm[curr.key], 'extra.index', index);
-            return acm;
-          },
-          {},
-        ),
-      };
-
-    case ASTKind.Array:
-      return {
-        type: 'array',
-        items: parseASTToJSONSchema((type as ArrayType).items),
-      };
-
-    case 'RefCustomType':
-      return {
-        $ref: type?.$ref as string,
-      };
-
-    default:
-      return {
-        type: type?.kind.toLowerCase() as JsonSchema['type'],
-        enum: type?.enum as string[],
-      };
-  }
-}

apps/demo-fixed-layout/src/plugins/variable-plugin/variable-plugin.ts

@@ -1,10 +1,10 @@
 import {
-  ASTKind,
   definePluginCreator,
   FixedLayoutPluginContext,
   FlowNodeVariableData,
   getNodeForm,
   PluginCreator,
+  ASTFactory,
 } from '@flowgram.ai/fixed-layout-editor';
 
 import { createASTFromJSONSchema } from './utils';
@@ -28,7 +28,7 @@ export const createVariablePlugin: PluginCreator<VariablePluginOptions> = define
 
       const syncOutputs = (value: any) => {
         if (!value) {
-          variableData.public.ast.remove('outputs');
+          variableData.clearVar();
           return;
         }
 
@@ -36,23 +36,25 @@ export const createVariablePlugin: PluginCreator<VariablePluginOptions> = define
 
         if (typeAST) {
           const title = form?.getValueIn('title') || node.id;
-          variableData.public.ast.set('outputs', {
-            kind: ASTKind.VariableDeclaration,
-            meta: {
-              title: `${title}.outputs`,
-            },
-            key: `${node.id}.outputs`,
-            type: typeAST,
-          });
+
+          variableData.setVar(
+            ASTFactory.createVariableDeclaration({
+              meta: {
+                title: `${title}.outputs`,
+              },
+              key: `${node.id}.outputs`,
+              type: typeAST,
+            })
+          );
           return;
         } else {
-          variableData.public.ast.remove('outputs');
+          variableData.clearVar();
         }
       };
       if (form) {
         syncOutputs(form.getValueIn('outputs'));
         // Listen outputs change
-        form.onFormValuesChange(props => {
+        form.onFormValuesChange((props) => {
           if (props.name.match(/^outputs/)) {
             syncOutputs(form.getValueIn('outputs'));
           }

apps/demo-free-layout/src/plugins/variable-plugin/utils.ts

@@ -1,29 +1,16 @@
-import { get, set } from 'lodash-es';
-import {
-  type ArrayType,
-  ASTKind,
-  type ASTNodeJSON,
-  type BaseType,
-  type ObjectType,
-} from '@flowgram.ai/free-layout-editor';
+import { get } from 'lodash-es';
+import { ASTKind, type ASTNodeJSON } from '@flowgram.ai/free-layout-editor';
 
 import { type JsonSchema } from '../../typings';
 
 function sortProperties(properties: Record<string, JsonSchema>) {
   return Object.entries(properties).sort(
-    (a, b) => (get(a?.[1], 'extra.index') || 0) - (get(b?.[1], 'extra.index') || 0),
+    (a, b) => (get(a?.[1], 'extra.index') || 0) - (get(b?.[1], 'extra.index') || 0)
   );
 }
 
 export function createASTFromJSONSchema(jsonSchema: JsonSchema): ASTNodeJSON | undefined {
-  const { type, $ref } = jsonSchema || {};
-
-  if ($ref) {
-    return {
-      kind: 'RefCustomType',
-      $ref,
-    };
-  }
+  const { type } = jsonSchema || {};
 
   if (!type) {
     return undefined;
@@ -54,37 +41,3 @@ export function createASTFromJSONSchema(jsonSchema: JsonSchema): ASTNodeJSON | u
       };
   }
 }
-
-export function parseASTToJSONSchema(type?: BaseType): JsonSchema | undefined {
-  switch (type?.kind) {
-    case ASTKind.Object:
-      return {
-        type: 'object',
-        properties: (type as ObjectType).properties.reduce<Record<string, JsonSchema>>(
-          (acm: any, curr, index) => {
-            acm[curr.key] = parseASTToJSONSchema(curr.type);
-            set(acm[curr.key], 'extra.index', index);
-            return acm;
-          },
-          {},
-        ),
-      };
-
-    case ASTKind.Array:
-      return {
-        type: 'array',
-        items: parseASTToJSONSchema((type as ArrayType).items),
-      };
-
-    case 'RefCustomType':
-      return {
-        $ref: type?.$ref as string,
-      };
-
-    default:
-      return {
-        type: type?.kind.toLowerCase() as JsonSchema['type'],
-        enum: type?.enum as string[],
-      };
-  }
-}

apps/demo-free-layout/src/plugins/variable-plugin/variable-plugin.ts

@@ -1,10 +1,10 @@
 import {
-  ASTKind,
   definePluginCreator,
   FlowNodeVariableData,
   getNodeForm,
   PluginCreator,
   FreeLayoutPluginContext,
+  ASTFactory,
 } from '@flowgram.ai/free-layout-editor';
 
 import { createASTFromJSONSchema } from './utils';
@@ -28,7 +28,7 @@ export const createVariablePlugin: PluginCreator<VariablePluginOptions> = define
 
       const syncOutputs = (value: any) => {
         if (!value) {
-          variableData.public.ast.remove('outputs');
+          variableData.clearVar();
           return;
         }
 
@@ -36,23 +36,25 @@ export const createVariablePlugin: PluginCreator<VariablePluginOptions> = define
 
         if (typeAST) {
           const title = form?.getValueIn('title') || node.id;
-          variableData.public.ast.set('outputs', {
-            kind: ASTKind.VariableDeclaration,
-            meta: {
-              title: `${title}.outputs`,
-            },
-            key: `${node.id}.outputs`,
-            type: typeAST,
-          });
+
+          variableData.setVar(
+            ASTFactory.createVariableDeclaration({
+              meta: {
+                title: `${title}.outputs`,
+              },
+              key: `${node.id}.outputs`,
+              type: typeAST,
+            })
+          );
           return;
         } else {
-          variableData.public.ast.remove('outputs');
+          variableData.clearVar();
         }
       };
       if (form) {
         syncOutputs(form.getValueIn('outputs'));
         // Listen outputs change
-        form.onFormValuesChange(props => {
+        form.onFormValuesChange((props) => {
           if (props.name.match(/^outputs/)) {
             syncOutputs(form.getValueIn('outputs'));
           }