@snowcone-app/canvas 0.1.0

package/dist/state/CanvasStateV1.d.ts

@@ -0,0 +1,373 @@
+import { z } from 'zod';
+import { ArtboardManager } from '../core/ArtboardManager.js';
+import { ArtboardElement } from '../core/ArtboardElement.js';
+import { BaseElement } from '../core/BaseElement.js';
+declare const StrokeConfigSchema: z.ZodObject<{
+    enabled: z.ZodBoolean;
+    color: z.ZodString;
+    width: z.ZodNumber;
+    dashArray: z.ZodOptional<z.ZodArray<z.ZodNumber>>;
+    lineCap: z.ZodOptional<z.ZodEnum<{
+        butt: "butt";
+        round: "round";
+        square: "square";
+    }>>;
+    lineJoin: z.ZodOptional<z.ZodEnum<{
+        round: "round";
+        miter: "miter";
+        bevel: "bevel";
+    }>>;
+    miterLimit: z.ZodOptional<z.ZodNumber>;
+    opacity: z.ZodOptional<z.ZodNumber>;
+    feather: z.ZodOptional<z.ZodNumber>;
+}, z.core.$strip>;
+declare const KnockoutConfigSchema: z.ZodObject<{
+    fill: z.ZodOptional<z.ZodBoolean>;
+    stroke: z.ZodOptional<z.ZodBoolean>;
+    scope: z.ZodOptional<z.ZodEnum<{
+        group: "group";
+        artboard: "artboard";
+    }>>;
+}, z.core.$strip>;
+declare const DistressEffectSchema: z.ZodObject<{
+    enabled: z.ZodBoolean;
+    style: z.ZodEnum<{
+        custom: "custom";
+        worn: "worn";
+        cracked: "cracked";
+        grunge: "grunge";
+        retro: "retro";
+    }>;
+    intensity: z.ZodNumber;
+    fadeAmount: z.ZodOptional<z.ZodNumber>;
+    grainAmount: z.ZodOptional<z.ZodNumber>;
+    scratchAmount: z.ZodOptional<z.ZodNumber>;
+    edgeWear: z.ZodOptional<z.ZodNumber>;
+    textureUrl: z.ZodOptional<z.ZodString>;
+    textureOpacity: z.ZodOptional<z.ZodNumber>;
+    textureBlendMode: z.ZodOptional<z.ZodEnum<{
+        multiply: "multiply";
+        screen: "screen";
+        overlay: "overlay";
+    }>>;
+    seed: z.ZodOptional<z.ZodNumber>;
+}, z.core.$strip>;
+declare const MaskDefinitionSchema: z.ZodObject<{
+    id: z.ZodString;
+    type: z.ZodEnum<{
+        clip: "clip";
+        alpha: "alpha";
+        luma: "luma";
+        distress: "distress";
+    }>;
+    maskElement: z.ZodLazy<z.ZodType<unknown, unknown, z.core.$ZodTypeInternals<unknown, unknown>>>;
+    inverted: z.ZodOptional<z.ZodBoolean>;
+    feather: z.ZodOptional<z.ZodNumber>;
+    opacity: z.ZodOptional<z.ZodNumber>;
+    blendMode: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+declare const CharacterStyleSchema: z.ZodObject<{
+    color: z.ZodOptional<z.ZodString>;
+    fontFamily: z.ZodOptional<z.ZodString>;
+    fontSize: z.ZodOptional<z.ZodNumber>;
+    bold: z.ZodOptional<z.ZodBoolean>;
+    italic: z.ZodOptional<z.ZodBoolean>;
+    underline: z.ZodOptional<z.ZodBoolean>;
+    strikethrough: z.ZodOptional<z.ZodBoolean>;
+}, z.core.$strip>;
+declare const TextSpanSchema: z.ZodObject<{
+    text: z.ZodString;
+    style: z.ZodObject<{
+        color: z.ZodOptional<z.ZodString>;
+        fontFamily: z.ZodOptional<z.ZodString>;
+        fontSize: z.ZodOptional<z.ZodNumber>;
+        bold: z.ZodOptional<z.ZodBoolean>;
+        italic: z.ZodOptional<z.ZodBoolean>;
+        underline: z.ZodOptional<z.ZodBoolean>;
+        strikethrough: z.ZodOptional<z.ZodBoolean>;
+    }, z.core.$strip>;
+}, z.core.$strip>;
+declare const RichTextSchema: z.ZodObject<{
+    spans: z.ZodArray<z.ZodObject<{
+        text: z.ZodString;
+        style: z.ZodObject<{
+            color: z.ZodOptional<z.ZodString>;
+            fontFamily: z.ZodOptional<z.ZodString>;
+            fontSize: z.ZodOptional<z.ZodNumber>;
+            bold: z.ZodOptional<z.ZodBoolean>;
+            italic: z.ZodOptional<z.ZodBoolean>;
+            underline: z.ZodOptional<z.ZodBoolean>;
+            strikethrough: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+    }, z.core.$strip>>;
+}, z.core.$strip>;
+declare const AnyTransformDataSchema: z.ZodDiscriminatedUnion<[z.ZodObject<{
+    type: z.ZodLiteral<"custom">;
+    controlPoints: z.ZodArray<z.ZodObject<{
+        x: z.ZodNumber;
+        y: z.ZodNumber;
+    }, z.core.$strip>>;
+}, z.core.$loose>, z.ZodObject<{
+    type: z.ZodLiteral<"distort">;
+}, z.core.$loose>, z.ZodObject<{
+    type: z.ZodLiteral<"circle">;
+    radius: z.ZodNumber;
+    scale: z.ZodNumber;
+    reverse: z.ZodBoolean;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"lean">;
+    leanAmount: z.ZodNumber;
+}, z.core.$loose>, z.ZodObject<{
+    type: z.ZodLiteral<"arch">;
+    archHeight: z.ZodNumber;
+}, z.core.$loose>, z.ZodObject<{
+    type: z.ZodLiteral<"ascend">;
+    ascendAngle: z.ZodNumber;
+}, z.core.$loose>, z.ZodObject<{
+    type: z.ZodLiteral<"wave">;
+    amplitude: z.ZodNumber;
+    frequency: z.ZodNumber;
+}, z.core.$loose>, z.ZodObject<{
+    type: z.ZodLiteral<"flag">;
+    amplitude: z.ZodNumber;
+    frequency: z.ZodNumber;
+}, z.core.$loose>, z.ZodObject<{
+    type: z.ZodLiteral<"image">;
+    width: z.ZodNumber;
+    height: z.ZodNumber;
+    cropX: z.ZodNumber;
+    cropY: z.ZodNumber;
+    cropWidth: z.ZodNumber;
+    cropHeight: z.ZodNumber;
+    flipHorizontal: z.ZodBoolean;
+    flipVertical: z.ZodBoolean;
+    borderRadius: z.ZodNumber;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"group">;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"shape">;
+    shapeType: z.ZodEnum<{
+        circle: "circle";
+        rectangle: "rectangle";
+        ellipse: "ellipse";
+        triangle: "triangle";
+        polygon: "polygon";
+        star: "star";
+        line: "line";
+    }>;
+    width: z.ZodNumber;
+    height: z.ZodNumber;
+    borderRadius: z.ZodOptional<z.ZodNumber>;
+    radiusX: z.ZodOptional<z.ZodNumber>;
+    radiusY: z.ZodOptional<z.ZodNumber>;
+    sides: z.ZodOptional<z.ZodNumber>;
+    points: z.ZodOptional<z.ZodNumber>;
+    innerRadius: z.ZodOptional<z.ZodNumber>;
+    fillColor: z.ZodOptional<z.ZodString>;
+    fillOpacity: z.ZodOptional<z.ZodNumber>;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"path">;
+    points: z.ZodArray<z.ZodObject<{
+        id: z.ZodString;
+        x: z.ZodNumber;
+        y: z.ZodNumber;
+        type: z.ZodEnum<{
+            corner: "corner";
+            smooth: "smooth";
+            bezier: "bezier";
+        }>;
+        handleIn: z.ZodOptional<z.ZodObject<{
+            x: z.ZodNumber;
+            y: z.ZodNumber;
+        }, z.core.$strip>>;
+        handleOut: z.ZodOptional<z.ZodObject<{
+            x: z.ZodNumber;
+            y: z.ZodNumber;
+        }, z.core.$strip>>;
+    }, z.core.$strip>>;
+    closed: z.ZodBoolean;
+    width: z.ZodNumber;
+    height: z.ZodNumber;
+    fillEnabled: z.ZodOptional<z.ZodBoolean>;
+    fillColor: z.ZodOptional<z.ZodString>;
+    fillOpacity: z.ZodOptional<z.ZodNumber>;
+    strokeEnabled: z.ZodOptional<z.ZodBoolean>;
+    strokeColor: z.ZodOptional<z.ZodString>;
+    strokeWidth: z.ZodOptional<z.ZodNumber>;
+}, z.core.$strip>], "type">;
+/**
+ * Discriminated union of all element config schemas.
+ * Discriminant field: `transformType`.
+ */
+declare const AnyElementConfigSchema: z.ZodType;
+declare const ClipShapeSchema: z.ZodUnion<readonly [z.ZodLiteral<"rectangle">, z.ZodLiteral<"circle">, z.ZodObject<{
+    type: z.ZodLiteral<"rounded">;
+    radius: z.ZodNumber;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"path">;
+    d: z.ZodString;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"composite-path">;
+    pieces: z.ZodArray<z.ZodObject<{
+        d: z.ZodString;
+        x: z.ZodNumber;
+        y: z.ZodNumber;
+        rotation: z.ZodOptional<z.ZodUnion<readonly [z.ZodLiteral<0>, z.ZodLiteral<90>, z.ZodLiteral<180>, z.ZodLiteral<270>]>>;
+        baseWidth: z.ZodOptional<z.ZodNumber>;
+        baseHeight: z.ZodOptional<z.ZodNumber>;
+    }, z.core.$strip>>;
+}, z.core.$strip>]>;
+declare const SerializedArtboardSchema: z.ZodObject<{
+    id: z.ZodString;
+    name: z.ZodString;
+    x: z.ZodNumber;
+    y: z.ZodNumber;
+    width: z.ZodNumber;
+    height: z.ZodNumber;
+    backgroundColor: z.ZodString;
+    backgroundType: z.ZodOptional<z.ZodEnum<{
+        color: "color";
+        transparent: "transparent";
+        texture: "texture";
+    }>>;
+    backgroundTexture: z.ZodOptional<z.ZodString>;
+    exportBackground: z.ZodOptional<z.ZodBoolean>;
+    clipShape: z.ZodOptional<z.ZodUnion<readonly [z.ZodLiteral<"rectangle">, z.ZodLiteral<"circle">, z.ZodObject<{
+        type: z.ZodLiteral<"rounded">;
+        radius: z.ZodNumber;
+    }, z.core.$strip>, z.ZodObject<{
+        type: z.ZodLiteral<"path">;
+        d: z.ZodString;
+    }, z.core.$strip>, z.ZodObject<{
+        type: z.ZodLiteral<"composite-path">;
+        pieces: z.ZodArray<z.ZodObject<{
+            d: z.ZodString;
+            x: z.ZodNumber;
+            y: z.ZodNumber;
+            rotation: z.ZodOptional<z.ZodUnion<readonly [z.ZodLiteral<0>, z.ZodLiteral<90>, z.ZodLiteral<180>, z.ZodLiteral<270>]>>;
+            baseWidth: z.ZodOptional<z.ZodNumber>;
+            baseHeight: z.ZodOptional<z.ZodNumber>;
+        }, z.core.$strip>>;
+    }, z.core.$strip>]>>;
+    previewBackgroundColor: z.ZodOptional<z.ZodString>;
+    distressTexture: z.ZodOptional<z.ZodObject<{
+        enabled: z.ZodBoolean;
+        textureUrl: z.ZodString;
+        intensity: z.ZodNumber;
+    }, z.core.$strip>>;
+    elementIds: z.ZodArray<z.ZodString>;
+}, z.core.$strip>;
+/**
+ * Top-level CanvasStateV1 schema.
+ *
+ * - `version` is always `1` (literal).
+ * - `artboards` contains serialized artboard configs with `elementIds`.
+ * - `elements` is a flat array of all elements across all artboards.
+ * - `activeArtboardId` identifies which artboard is currently active.
+ */
+declare const CanvasStateV1Schema: z.ZodObject<{
+    version: z.ZodLiteral<1>;
+    artboards: z.ZodArray<z.ZodObject<{
+        id: z.ZodString;
+        name: z.ZodString;
+        x: z.ZodNumber;
+        y: z.ZodNumber;
+        width: z.ZodNumber;
+        height: z.ZodNumber;
+        backgroundColor: z.ZodString;
+        backgroundType: z.ZodOptional<z.ZodEnum<{
+            color: "color";
+            transparent: "transparent";
+            texture: "texture";
+        }>>;
+        backgroundTexture: z.ZodOptional<z.ZodString>;
+        exportBackground: z.ZodOptional<z.ZodBoolean>;
+        clipShape: z.ZodOptional<z.ZodUnion<readonly [z.ZodLiteral<"rectangle">, z.ZodLiteral<"circle">, z.ZodObject<{
+            type: z.ZodLiteral<"rounded">;
+            radius: z.ZodNumber;
+        }, z.core.$strip>, z.ZodObject<{
+            type: z.ZodLiteral<"path">;
+            d: z.ZodString;
+        }, z.core.$strip>, z.ZodObject<{
+            type: z.ZodLiteral<"composite-path">;
+            pieces: z.ZodArray<z.ZodObject<{
+                d: z.ZodString;
+                x: z.ZodNumber;
+                y: z.ZodNumber;
+                rotation: z.ZodOptional<z.ZodUnion<readonly [z.ZodLiteral<0>, z.ZodLiteral<90>, z.ZodLiteral<180>, z.ZodLiteral<270>]>>;
+                baseWidth: z.ZodOptional<z.ZodNumber>;
+                baseHeight: z.ZodOptional<z.ZodNumber>;
+            }, z.core.$strip>>;
+        }, z.core.$strip>]>>;
+        previewBackgroundColor: z.ZodOptional<z.ZodString>;
+        distressTexture: z.ZodOptional<z.ZodObject<{
+            enabled: z.ZodBoolean;
+            textureUrl: z.ZodString;
+            intensity: z.ZodNumber;
+        }, z.core.$strip>>;
+        elementIds: z.ZodArray<z.ZodString>;
+    }, z.core.$strip>>;
+    elements: z.ZodArray<z.ZodType<unknown, unknown, z.core.$ZodTypeInternals<unknown, unknown>>>;
+    activeArtboardId: z.ZodString;
+}, z.core.$strip>;
+/** A serialized artboard (artboard config + elementIds, no nested elements). */
+type SerializedArtboard = z.infer<typeof SerializedArtboardSchema>;
+/** A serialized element (discriminated union on `transformType`). */
+type SerializedElement = z.infer<typeof AnyElementConfigSchema>;
+/** The full versioned state document. */
+type CanvasStateV1 = z.infer<typeof CanvasStateV1Schema>;
+/**
+ * Serialize the current editor state into a `CanvasStateV1` document.
+ *
+ * @param artboardManager - The ArtboardManager instance (provides artboard list + active ID).
+ * @param elements        - All elements currently in the editor (across all artboards).
+ * @returns A validated CanvasStateV1 object ready for JSON.stringify().
+ */
+declare function serializeState(artboardManager: ArtboardManager, elements: BaseElement[]): CanvasStateV1;
+/** Result of deserializing a CanvasStateV1 document. */
+interface DeserializeResult {
+    artboards: ArtboardElement[];
+    elements: BaseElement[];
+    activeArtboardId: string;
+}
+/**
+ * Deserialize a validated `CanvasStateV1` document back into runtime objects.
+ *
+ * Uses `ArtboardElement.fromJSON()` for artboards and `ElementFactory.createFromJSON()`
+ * for elements (preserving the existing factory pattern).
+ *
+ * @param state - A CanvasStateV1 object (should have been validated already).
+ * @returns Deserialized artboards, elements, and active artboard ID.
+ */
+declare function deserializeState(state: CanvasStateV1): DeserializeResult;
+/** Validation result with typed error details. */
+type ValidationResult = {
+    success: true;
+    data: CanvasStateV1;
+} | {
+    success: false;
+    errors: Array<{
+        path: string;
+        message: string;
+    }>;
+};
+/**
+ * Validate an unknown value against the CanvasStateV1 schema.
+ *
+ * @param data - Unknown data to validate (e.g. parsed JSON).
+ * @returns A discriminated result: `{ success: true, data }` or `{ success: false, errors }`.
+ */
+declare function validateState(data: unknown): ValidationResult;
+/**
+ * Migrate an unknown state payload to the latest version.
+ *
+ * Currently only version 1 exists. Future versions will add migration logic
+ * (e.g. v1 -> v2) here so that older documents can be loaded transparently.
+ *
+ * @param data - Unknown data (parsed JSON).
+ * @returns A validated CanvasStateV1 (or the latest version in the future).
+ * @throws Error if the data cannot be migrated.
+ */
+declare function migrateState(data: unknown): CanvasStateV1;
+export { CanvasStateV1Schema, SerializedArtboardSchema, AnyElementConfigSchema, AnyTransformDataSchema, StrokeConfigSchema, KnockoutConfigSchema, DistressEffectSchema, MaskDefinitionSchema, CharacterStyleSchema, TextSpanSchema, RichTextSchema, ClipShapeSchema, serializeState, deserializeState, validateState, migrateState, };
+export type { CanvasStateV1, SerializedArtboard, SerializedElement, DeserializeResult, ValidationResult, };

package/dist/state/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * State serialization module.
+ *
+ * Provides versioned, Zod-validated serialization/deserialization
+ * for the canvas editor state.
+ *
+ * @module
+ */
+export { CanvasStateV1Schema, SerializedArtboardSchema, AnyElementConfigSchema, AnyTransformDataSchema, StrokeConfigSchema, KnockoutConfigSchema, DistressEffectSchema, MaskDefinitionSchema, CharacterStyleSchema, TextSpanSchema, RichTextSchema, ClipShapeSchema, serializeState, deserializeState, validateState, migrateState, } from './CanvasStateV1.js';
+export type { CanvasStateV1, SerializedArtboard, SerializedElement, DeserializeResult, ValidationResult, } from './CanvasStateV1.js';