@babylonjs/smart-filters 0.1.0-alpha → 0.3.0-alpha

package/src/blocks/inputBlock.deserializer.ts

@@ -0,0 +1,38 @@
+import { InputBlock } from "./inputBlock.js";
+import type { SerializedInputBlockData } from "./inputBlock.serialization.types.js";
+import { ConnectionPointType } from "../connection/connectionPointType.js";
+import type { SmartFilter } from "../smartFilter.js";
+import type { ISerializedBlockV1 } from "../serialization/v1/serialization.types.js";
+import { createImageTexture } from "../utils/textureLoaders.js";
+import type { ThinEngine } from "@babylonjs/core/Engines/thinEngine.js";
+
+/**
+ * V1 Input Block Deserializer
+ * @param smartFilter - The SmartFilter to deserialize the block into
+ * @param serializedBlock - The serialized block data
+ * @param engine - The ThinEngine to use for loading textures
+ * @returns A deserialized InputBlock
+ */
+export function inputBlockDeserializer(
+    smartFilter: SmartFilter,
+    serializedBlock: ISerializedBlockV1,
+    engine: ThinEngine
+) {
+    const blockData = serializedBlock.data as SerializedInputBlockData;
+
+    switch (blockData.inputType) {
+        case ConnectionPointType.Boolean:
+            return new InputBlock(smartFilter, serializedBlock.name, ConnectionPointType.Boolean, blockData.value);
+        case ConnectionPointType.Float:
+            return new InputBlock(smartFilter, serializedBlock.name, ConnectionPointType.Float, blockData.value);
+        case ConnectionPointType.Texture:
+            return new InputBlock(
+                smartFilter,
+                serializedBlock.name,
+                ConnectionPointType.Texture,
+                blockData.url !== null ? createImageTexture(engine, blockData.url) : null
+            );
+    }
+
+    throw new Error("Could not deserialize input block, unknown input type");
+}

package/src/blocks/inputBlock.serialization.types.ts

@@ -0,0 +1,80 @@
+import type { Nullable } from "@babylonjs/core";
+import type { ConnectionPointType } from "../connection/connectionPointType.js";
+import type { IColor3Like, IColor4Like, IVector2Like } from "@babylonjs/core/Maths/math.like.js";
+
+/**
+ * The data for an InputBlock for ConnectionPointType.Texture inputs
+ */
+export type TextureInputBlockData = {
+    /** The type of the input block */
+    inputType: ConnectionPointType.Texture;
+
+    /** The URL, if available, of the texture */
+    url: Nullable<string>;
+};
+
+/**
+ * The data for an InputBlock for ConnectionPointType.Boolean inputs
+ */
+export type BooleanInputBlockData = {
+    /** The type of the input block */
+    inputType: ConnectionPointType.Boolean;
+
+    /** The value of the input block */
+    value: boolean;
+};
+
+/**
+ * The data for an InputBlock for ConnectionPointType.Float inputs
+ */
+export type FloatInputBlockData = {
+    /** The type of the input block */
+    inputType: ConnectionPointType.Float;
+
+    /** The value of the input block */
+    value: number;
+};
+
+/**
+ * The data for an InputBlock for ConnectionPointType.Color3 inputs
+ */
+export type Color3InputBlockData = {
+    /** The type of the input block */
+    inputType: ConnectionPointType.Color3;
+
+    /** The value of the input block */
+    value: IColor3Like;
+};
+
+/**
+ * The data for an InputBlock for ConnectionPointType.Color4 inputs
+ */
+export type Color4InputBlockData = {
+    /** The type of the input block */
+    inputType: ConnectionPointType.Color4;
+
+    /** The value of the input block */
+    value: IColor4Like;
+};
+
+/**
+ * The data for an InputBlock for ConnectionPointType.Vector2 inputs
+ */
+export type Vector2InputBlockData = {
+    /** The type of the input block */
+    inputType: ConnectionPointType.Vector2;
+
+    /** The value of the input block */
+    value: IVector2Like;
+};
+
+/**
+ * Type union of all possible InputBlock data types
+ */
+export type SerializedInputBlockData =
+    | TextureInputBlockData
+    | BooleanInputBlockData
+    | FloatInputBlockData
+    | Color3InputBlockData
+    | Color4InputBlockData
+    | Vector2InputBlockData;

package/src/blocks/inputBlock.serializer.ts

@@ -0,0 +1,127 @@
+import { InputBlockBase, type InputBlock } from "./inputBlock.js";
+import type { BaseBlock } from "./baseBlock.js";
+import { ConnectionPointType } from "../connection/connectionPointType.js";
+import type {
+    BooleanInputBlockData,
+    Color3InputBlockData,
+    Color4InputBlockData,
+    FloatInputBlockData,
+    SerializedInputBlockData,
+    TextureInputBlockData,
+    Vector2InputBlockData,
+} from "./inputBlock.serialization.types";
+import type { IBlockSerializerV1 } from "../serialization/v1/serialization.types";
+
+/**
+ * Determines which generic type of InputBlock we are trying to serialize and calls the appropriate function
+ * to serialize the specifics for that type of InputBlock
+ * @param inputBlock - The InputBlock to serialize
+ * @returns Serialized data for the InputBlock
+ */
+function serializeInputBlockData(inputBlock: InputBlockBase): SerializedInputBlockData {
+    switch (inputBlock.type) {
+        case ConnectionPointType.Texture:
+            return serializeTextureInputBlock(inputBlock as InputBlock<ConnectionPointType.Texture>);
+        case ConnectionPointType.Boolean:
+            return serializeBooleanInputBlock(inputBlock as InputBlock<ConnectionPointType.Boolean>);
+        case ConnectionPointType.Float:
+            return serializeFloatInputBlock(inputBlock as InputBlock<ConnectionPointType.Float>);
+        case ConnectionPointType.Color3:
+            return serializeColor3InputBlock(inputBlock as InputBlock<ConnectionPointType.Color3>);
+        case ConnectionPointType.Color4:
+            return serializeColor4InputBlock(inputBlock as InputBlock<ConnectionPointType.Color4>);
+        case ConnectionPointType.Vector2:
+            return serializeVector2InputBlock(inputBlock as InputBlock<ConnectionPointType.Vector2>);
+    }
+}
+
+/**
+ * Generates the serialized data for a Texture InputBlock
+ * @param inputBlock - The Texture InputBlock to serialize
+ * @returns The serialized data for the InputBlock
+ */
+function serializeTextureInputBlock(inputBlock: InputBlock<ConnectionPointType.Texture>): TextureInputBlockData {
+    return {
+        inputType: ConnectionPointType.Texture,
+        url: inputBlock.runtimeValue.value?.getInternalTexture()?.url || null,
+    };
+}
+
+/**
+ * Generates the serialized data for a Boolean InputBlock
+ * @param inputBlock - The Boolean InputBlock to serialize
+ * @returns The serialized data for the InputBlock
+ */
+function serializeBooleanInputBlock(inputBlock: InputBlock<ConnectionPointType.Boolean>): BooleanInputBlockData {
+    return {
+        inputType: ConnectionPointType.Boolean,
+        value: inputBlock.runtimeValue.value,
+    };
+}
+
+/**
+ * Generates the serialized data for a Float InputBlock
+ * @param inputBlock - The Float InputBlock to serialize
+ * @returns The serialized data for the InputBlock
+ */
+function serializeFloatInputBlock(inputBlock: InputBlock<ConnectionPointType.Float>): FloatInputBlockData {
+    return {
+        inputType: ConnectionPointType.Float,
+        value: inputBlock.runtimeValue.value,
+    };
+}
+
+/**
+ * Generates the serialized data for a Color3 InputBlock
+ * @param inputBlock - The Color3 InputBlock to serialize
+ * @returns The serialized data for the InputBlock
+ */
+function serializeColor3InputBlock(inputBlock: InputBlock<ConnectionPointType.Color3>): Color3InputBlockData {
+    return {
+        inputType: ConnectionPointType.Color3,
+        value: inputBlock.runtimeValue.value,
+    };
+}
+
+/**
+ * Generates the serialized data for a Color4 InputBlock
+ * @param inputBlock - The Color4 InputBlock to serialize
+ * @returns The serialized data for the InputBlock
+ */
+function serializeColor4InputBlock(inputBlock: InputBlock<ConnectionPointType.Color4>): Color4InputBlockData {
+    return {
+        inputType: ConnectionPointType.Color4,
+        value: inputBlock.runtimeValue.value,
+    };
+}
+
+/**
+ * Generates the serialized data for a Vector2 InputBlock
+ * @param inputBlock - The Vector2 InputBlock to serialize
+ * @returns The serialized data for the InputBlock
+ */
+function serializeVector2InputBlock(inputBlock: InputBlock<ConnectionPointType.Vector2>): Vector2InputBlockData {
+    return {
+        inputType: ConnectionPointType.Vector2,
+        value: inputBlock.runtimeValue.value,
+    };
+}
+
+/**
+ * The V1 serializer for an InputBlock
+ */
+export const inputBlockSerializer: IBlockSerializerV1 = {
+    className: InputBlockBase.ClassName,
+    serialize: (block: BaseBlock) => {
+        if (block.getClassName() !== InputBlockBase.ClassName) {
+            throw new Error("Was asked to serialize an unrecognized block type");
+        }
+        return {
+            name: block.name,
+            uniqueId: block.uniqueId,
+            className: InputBlockBase.ClassName,
+            comments: block.comments,
+            data: serializeInputBlockData(block as unknown as InputBlockBase),
+        };
+    },
+};

package/src/blocks/inputBlock.ts

@@ -15,7 +15,7 @@ import { ConnectionPointType } from "../connection/connectionPointType.js";
 function isRuntimeData<U extends ConnectionPointType>(
     value: ConnectionPointValue<U> | RuntimeData<U>
 ): value is RuntimeData<U> {
-    return (value as RuntimeData<ConnectionPointType>).value !== undefined;
+    return value && (value as RuntimeData<ConnectionPointType>).value !== undefined;
 }
 
 /**
@@ -37,18 +37,29 @@ export function isDisableableBlock(block: BaseBlock): block is DisableableBlock
 }
 
 /**
- * This represents any inputs used in the graph.
- *
- * This is used to provide a way to connect the graph to the outside world.
- *
- * The value is dynamically set by the user.
+ * This base class exists to provide a type that the serializer can use to represent
+ * any InputBlock without knowing the exact type it is.
  */
-export class InputBlock<U extends ConnectionPointType> extends BaseBlock {
+export abstract class InputBlockBase extends BaseBlock {
     /**
      * The class name of the block.
      */
     public static override ClassName = "InputBlock";
 
+    /**
+     * The type of the input.
+     */
+    public abstract readonly type: ConnectionPointType;
+}
+
+/**
+ * This represents any inputs used in the graph.
+ *
+ * This is used to provide a way to connect the graph to the outside world.
+ *
+ * The value is dynamically set by the user.
+ */
+export class InputBlock<U extends ConnectionPointType> extends InputBlockBase {
     /**
      * The output connection point of the block.
      */

package/src/connection/connectionPointType.ts

@@ -1,5 +1,6 @@
 import type { ThinTexture } from "@babylonjs/core/Materials/Textures/thinTexture";
-import type { IColor3Like, IColor4Like } from "@babylonjs/core/Maths/math.like";
+import type { IColor3Like, IColor4Like, IVector2Like } from "@babylonjs/core/Maths/math.like";
+import type { Nullable } from "@babylonjs/core/types";
 
 /**
  * Defines the type of a connection point.
@@ -15,6 +16,8 @@ export enum ConnectionPointType {
     Color4 = 4,
     /** Boolean */
     Boolean = 5,
+    /** Vector2 */
+    Vector2 = 6,
 }
 
 /**
@@ -23,8 +26,9 @@ export enum ConnectionPointType {
 // prettier-ignore
 export type ConnectionPointValue<T extends ConnectionPointType = ConnectionPointType> =
     T extends ConnectionPointType.Float ? number :
-    T extends ConnectionPointType.Texture ? ThinTexture :
+    T extends ConnectionPointType.Texture ? Nullable<ThinTexture> :
     T extends ConnectionPointType.Color3 ? IColor3Like :
     T extends ConnectionPointType.Color4 ? IColor4Like :
     T extends ConnectionPointType.Boolean ? boolean :
+    T extends ConnectionPointType.Vector2 ? IVector2Like :
     never;

package/src/index.ts

@@ -34,3 +34,4 @@ export { SmartFilter } from "./smartFilter.js";
 
 export { SmartFilterOptimizer } from "./optimization/smartFilterOptimizer.js";
 export * from "./utils/textureLoaders.js";
+export * from "./serialization/index.js";

package/src/optimization/optimizedShaderBlock.ts

@@ -1,10 +1,8 @@
 import type { Effect } from "@babylonjs/core/Materials/effect";
 import type { Nullable } from "@babylonjs/core/types";
-import type { ThinTexture } from "@babylonjs/core/Materials/Textures/thinTexture";
 
 import type { SmartFilter } from "../smartFilter";
 import type { ShaderProgram } from "../utils/shaderCodeUtils";
-import type { StrongRef } from "../runtime/strongRef";
 import type { RuntimeData } from "../connection/connectionPoint";
 import { ShaderBlock } from "../blocks/shaderBlock.js";
 import { Binding } from "../runtime/shaderRuntime.js";
@@ -16,14 +14,17 @@ import { ConnectionPointType } from "../connection/connectionPointType.js";
  */
 export class OptimizedShaderBinding extends Binding {
     private _shaderBindings: Binding[];
-    private _inputTextures: { [name: string]: StrongRef<ThinTexture> };
+    private _inputTextures: { [name: string]: RuntimeData<ConnectionPointType.Texture> };
 
     /**
      * Creates a new shader binding instance for the OptimizedShader block.
      * @param shaderBindings - The list of shader bindings to process
      * @param inputTextures - The list of input textures to bind
      */
-    constructor(shaderBindings: Binding[], inputTextures: { [name: string]: StrongRef<ThinTexture> }) {
+    constructor(
+        shaderBindings: Binding[],
+        inputTextures: { [name: string]: RuntimeData<ConnectionPointType.Texture> }
+    ) {
         super();
 
         this._shaderBindings = shaderBindings;
@@ -56,7 +57,7 @@ export class OptimizedShaderBinding extends Binding {
  */
 export class OptimizedShaderBlock extends ShaderBlock {
     private _shaderBindings: Nullable<Binding[]>;
-    private _inputTextures: { [name: string]: StrongRef<ThinTexture> } = {};
+    private _inputTextures: { [name: string]: RuntimeData<ConnectionPointType.Texture> } = {};
     private _shaderProgram: ShaderProgram;
 
     /**

package/src/runtime/renderTargetGenerator.ts

@@ -93,7 +93,11 @@ export class RenderTargetGenerator {
                             continue;
                         }
                         const connectedBlock = input.connectedTo.ownerBlock;
-                        if (connectedBlock instanceof ShaderBlock && connectedBlock.output.runtimeData) {
+                        if (
+                            connectedBlock instanceof ShaderBlock &&
+                            connectedBlock.output.runtimeData &&
+                            connectedBlock.output.runtimeData.value
+                        ) {
                             this._releaseTexture(connectedBlock.output.runtimeData.value, connectedBlock.textureRatio);
                         }
                     }

package/src/serialization/index.ts

@@ -0,0 +1,4 @@
+export * from "./v1/index.js";
+export * from "./serializedSmartFilter.js";
+export * from "./smartFilterDeserializer.js";
+export * from "./smartFilterSerializer.js";

package/src/serialization/serializedSmartFilter.ts

@@ -0,0 +1,6 @@
+import type { SerializedSmartFilterV1 } from "./v1/serialization.types";
+
+/**
+ * Type union of all versions of serialized SmartFilters
+ */
+export type SerializedSmartFilter = SerializedSmartFilterV1;

package/src/serialization/smartFilterDeserializer.ts

@@ -0,0 +1,127 @@
+import type { BaseBlock } from "../blocks/baseBlock";
+import type { SerializedSmartFilter } from "./serializedSmartFilter.js";
+import { SmartFilter } from "../smartFilter.js";
+import { inputBlockDeserializer } from "../blocks/inputBlock.deserializer.js";
+import { OutputBlock } from "../blocks/outputBlock.js";
+import type { ThinEngine } from "@babylonjs/core/Engines/thinEngine";
+import { InputBlock } from "../blocks/inputBlock.js";
+import type {
+    DeserializeBlockV1,
+    ISerializedBlockV1,
+    ISerializedConnectionV1,
+    SerializedSmartFilterV1,
+} from "./v1/serialization.types";
+import { UniqueIdGenerator } from "../utils/uniqueIdGenerator.js";
+
+/**
+ * Deserializes serialized SmartFilters. The caller passes in a map of block deserializers it wants to use,
+ * which allows the caller to provide custom deserializers for blocks beyond the core blocks.
+ * The deserializer supports versioned serialized SmartFilters.
+ */
+export class SmartFilterDeserializer {
+    private readonly _blockDeserializersV1: Map<string, DeserializeBlockV1> = new Map();
+
+    /**
+     * Creates a new SmartFilterDeserializer
+     * @param blockDeserializers - The map of block serializers to use, beyond those for the core blocks
+     */
+    public constructor(blockDeserializers: Map<string, DeserializeBlockV1>) {
+        this._blockDeserializersV1 = blockDeserializers;
+
+        // Add in the core block deserializers - they are not delay loaded, so they are wrapped in Promise.resolve()
+        this._blockDeserializersV1.set(
+            InputBlock.ClassName,
+            (smartFilter: SmartFilter, serializedBlock: ISerializedBlockV1, engine: ThinEngine) =>
+                Promise.resolve(inputBlockDeserializer(smartFilter, serializedBlock, engine))
+        );
+    }
+
+    /**
+     * Deserializes a SmartFilter from a JSON object - can be safely called multiple times and has no side effects within the class.
+     * @param engine - The ThinEngine to pass to the new SmartFilter
+     * @param smartFilterJson - The JSON object to deserialize
+     * @returns A promise that resolves to the deserialized SmartFilter
+     */
+    public async deserialize(engine: ThinEngine, smartFilterJson: any): Promise<SmartFilter> {
+        const serializedSmartFilter: SerializedSmartFilter = smartFilterJson;
+        switch (serializedSmartFilter.version) {
+            case 1:
+                return await this._deserializeV1(engine, serializedSmartFilter);
+        }
+    }
+
+    private async _deserializeV1(
+        engine: ThinEngine,
+        serializedSmartFilter: SerializedSmartFilterV1
+    ): Promise<SmartFilter> {
+        const smartFilter = new SmartFilter(serializedSmartFilter.name);
+        const blockMap = new Map<string, BaseBlock>();
+
+        // Deserialize the SmartFilter level data
+        smartFilter.comments = serializedSmartFilter.comments;
+        smartFilter.editorData = serializedSmartFilter.editorData;
+
+        // Deserialize the blocks
+        const blockDeserializationWork: Promise<void>[] = [];
+        serializedSmartFilter.blocks.forEach((serializedBlock: ISerializedBlockV1) => {
+            if (serializedBlock.className === OutputBlock.ClassName) {
+                blockMap.set(smartFilter.output.ownerBlock.name, smartFilter.output.ownerBlock);
+            } else {
+                const blockDeserializer = this._blockDeserializersV1.get(serializedBlock.className);
+                if (!blockDeserializer) {
+                    throw new Error(`No deserializer found for block type ${serializedBlock.className}`);
+                }
+                blockDeserializationWork.push(
+                    blockDeserializer(smartFilter, serializedBlock, engine).then((newBlock) => {
+                        // Deserializers are not responsible for setting the uniqueId or comments.
+                        // This is so they don't have to be passed into the constructors when programmatically creating
+                        // blocks, and so each deserializer doesn't have to remember to do it.
+                        newBlock.uniqueId = serializedBlock.uniqueId;
+                        newBlock.comments = serializedBlock.comments;
+
+                        // We need to ensure any uniqueIds generated in the future (e.g. a new block is added to the SmartFilter)
+                        // are higher than this one.
+                        UniqueIdGenerator.EnsureIdsGreaterThan(newBlock.uniqueId);
+
+                        // Save in the map
+                        blockMap.set(newBlock.name, newBlock);
+                    })
+                );
+            }
+        });
+        await Promise.all(blockDeserializationWork);
+
+        // Deserialize the connections
+        serializedSmartFilter.connections.forEach((connection: ISerializedConnectionV1) => {
+            // Find the source block and its connection point's connectTo function
+            const sourceBlock = blockMap.get(connection.outputBlock);
+            if (!sourceBlock) {
+                throw new Error(`Source block ${connection.outputBlock} not found`);
+            }
+            const sourceConnectionPoint = (sourceBlock as any)[connection.outputConnectionPoint];
+            if (!sourceConnectionPoint || typeof sourceConnectionPoint.connectTo !== "function") {
+                throw new Error(
+                    `Block ${connection.outputBlock} does not have an connection point named ${connection.outputConnectionPoint}`
+                );
+            }
+            const sourceConnectToFunction = sourceConnectionPoint.connectTo.bind(sourceConnectionPoint);
+
+            // Find the target block and its connection point
+            const targetBlock = blockMap.get(connection.inputBlock);
+            if (!targetBlock) {
+                throw new Error(`Target block ${connection.inputBlock} not found`);
+            }
+            const targetConnectionPoint = (targetBlock as any)[connection.inputConnectionPoint];
+            if (!targetConnectionPoint || typeof targetConnectionPoint !== "object") {
+                throw new Error(
+                    `Block ${connection.inputBlock} does not have a connection point named ${connection.inputConnectionPoint}`
+                );
+            }
+
+            // Create the connection
+            sourceConnectToFunction.call(sourceBlock, targetConnectionPoint);
+        });
+
+        return smartFilter;
+    }
+}

package/src/serialization/smartFilterSerializer.ts

@@ -0,0 +1,113 @@
+import type { SmartFilter } from "../smartFilter";
+import type { BaseBlock } from "../blocks/baseBlock";
+import { inputBlockSerializer } from "../blocks/inputBlock.serializer.js";
+import type { ConnectionPoint } from "../connection/connectionPoint";
+import { defaultBlockSerializer } from "./v1/defaultBlockSerializer.js";
+import { OutputBlock } from "../blocks/outputBlock.js";
+import type {
+    IBlockSerializerV1,
+    ISerializedBlockV1,
+    ISerializedConnectionV1,
+    SerializeBlockV1,
+    SerializedSmartFilterV1,
+} from "./v1/serialization.types";
+
+/**
+ * Determines if two serialized connection points are equivalent to each other
+ * @param a - The first connection point to compare
+ * @param b - The second connection point to compare
+ * @returns True if the connection points are equivalent, false otherwise
+ */
+function serializedConnectionPointsEqual(a: ISerializedConnectionV1, b: ISerializedConnectionV1): boolean {
+    return (
+        a.inputBlock === b.inputBlock &&
+        a.inputConnectionPoint === b.inputConnectionPoint &&
+        a.outputBlock === b.outputBlock &&
+        a.outputConnectionPoint === b.outputConnectionPoint
+    );
+}
+
+/**
+ * Serializes SmartFilters using the latest SmartFilter serialization version.
+ * The caller passes in information necessary to serialize the blocks in the SmartFilter.
+ * This allows the caller to provide custom serializers for blocks beyond the core blocks.
+ */
+export class SmartFilterSerializer {
+    private readonly _blockSerializers: Map<string, SerializeBlockV1> = new Map();
+
+    /**
+     * Creates a new SmartFilterSerializer
+     * @param blocksUsingDefaultSerialization - A list of the classNames of blocks which can use default serialization (they only have ConnectionPoint properties and no constructor parameters)
+     * @param additionalBlockSerializers - An array of block serializers to use, beyond those for the core blocks
+     */
+    public constructor(blocksUsingDefaultSerialization: string[], additionalBlockSerializers: IBlockSerializerV1[]) {
+        this._blockSerializers.set(inputBlockSerializer.className, inputBlockSerializer.serialize);
+        this._blockSerializers.set(OutputBlock.ClassName, defaultBlockSerializer);
+        blocksUsingDefaultSerialization.forEach((block) => {
+            this._blockSerializers.set(block, defaultBlockSerializer);
+        });
+        additionalBlockSerializers.forEach((serializer) =>
+            this._blockSerializers.set(serializer.className, serializer.serialize)
+        );
+    }
+
+    /**
+     * Serializes a SmartFilter to a JSON object of the latest version
+     * @param smartFilter - The SmartFilter to serialize
+     * @returns The serialized SmartFilter
+     */
+    public serialize(smartFilter: SmartFilter): SerializedSmartFilterV1 {
+        const connections: ISerializedConnectionV1[] = [];
+
+        const blocks = smartFilter.attachedBlocks.map((block: BaseBlock) => {
+            // Serialize the block itself
+            const serializeFn = this._blockSerializers.get(block.getClassName());
+            if (!serializeFn) {
+                throw new Error(`No serializer was provided for a block of type ${block.getClassName()}`);
+            }
+            const serializedBlock: ISerializedBlockV1 = serializeFn(block);
+
+            // Serialize the connections to the inputs
+            block.inputs.forEach((input: ConnectionPoint) => {
+                const connectedTo = input.connectedTo;
+                if (connectedTo) {
+                    const newConnection: ISerializedConnectionV1 = {
+                        inputBlock: block.name,
+                        inputConnectionPoint: input.name,
+                        outputBlock: connectedTo.ownerBlock.name,
+                        outputConnectionPoint: connectedTo.name,
+                    };
+                    if (!connections.find((other) => serializedConnectionPointsEqual(newConnection, other))) {
+                        connections.push(newConnection);
+                    }
+                }
+            });
+
+            // Serialize the connections to the outputs
+            block.outputs.forEach((output: ConnectionPoint) => {
+                output.endpoints.forEach((input: ConnectionPoint) => {
+                    const newConnection: ISerializedConnectionV1 = {
+                        inputBlock: input.ownerBlock.name,
+                        inputConnectionPoint: input.name,
+                        outputBlock: block.name,
+                        outputConnectionPoint: output.name,
+                    };
+                    if (!connections.find((other) => serializedConnectionPointsEqual(newConnection, other))) {
+                        connections.push(newConnection);
+                    }
+                });
+            });
+
+            return serializedBlock;
+        });
+
+        return {
+            version: 1,
+            name: smartFilter.name,
+            comments: smartFilter.comments,
+            editorData: smartFilter.editorData,
+            blocks,
+            connections,
+        };
+    }
+}

package/src/serialization/v1/defaultBlockSerializer.ts

@@ -0,0 +1,18 @@
+import type { BaseBlock } from "../../blocks/baseBlock";
+import type { ISerializedBlockV1, SerializeBlockV1 } from "./serialization.types";
+
+/**
+ * The default V1 block serializer which can be used for any block that relies only on ConnectionPoints
+ * and does not have any constructor parameters or class properties that need to be serialized.
+ * @param block - The block to serialize
+ * @returns The serialized block
+ */
+export const defaultBlockSerializer: SerializeBlockV1 = (block: BaseBlock): ISerializedBlockV1 => {
+    return {
+        name: block.name,
+        uniqueId: block.uniqueId,
+        className: block.getClassName(),
+        comments: block.comments,
+        data: undefined,
+    };
+};

package/src/serialization/v1/index.ts

@@ -0,0 +1,2 @@
+export * from "./defaultBlockSerializer.js";
+export * from "./serialization.types.js";