@image-marker/web 0.1.0

package/lib/commonjs/editor/core-contract.d.ts

@@ -0,0 +1,2 @@
+export * from '../core/index.js';
+export { default } from '../core/index.js';

package/lib/commonjs/editor/core-contract.js

@@ -0,0 +1,23 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+__exportStar(require("../core/index.js"), exports);
+var index_js_1 = require("../core/index.js");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(index_js_1).default; } });

package/lib/commonjs/editor/geometry.d.ts

@@ -0,0 +1,8 @@
+import type { EditorPoint, EditorSafeArea, EditorSnapContext, EditorSnapGuide } from './types.js';
+export declare function normalizeSafeArea(safeArea?: Partial<EditorSafeArea>): EditorSafeArea;
+export declare function snapLayerPosition(point: EditorPoint, context: EditorSnapContext): {
+    point: EditorPoint;
+    guides: EditorSnapGuide[];
+};
+export declare function distance(first: EditorPoint, second: EditorPoint): number;
+export declare function angle(first: EditorPoint, second: EditorPoint): number;

package/lib/commonjs/editor/geometry.js

@@ -0,0 +1,109 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.normalizeSafeArea = normalizeSafeArea;
+exports.snapLayerPosition = snapLayerPosition;
+exports.distance = distance;
+exports.angle = angle;
+const DEFAULT_SNAP_THRESHOLD = 6;
+function closest(value, candidates, threshold) {
+    return candidates
+        .map((candidate) => ({
+        ...candidate,
+        distance: Math.abs(candidate.value - value),
+    }))
+        .filter((candidate) => candidate.distance <= threshold)
+        .sort((left, right) => left.distance - right.distance)[0];
+}
+function normalizeSafeArea(safeArea = {}) {
+    return {
+        top: Math.max(0, safeArea.top ?? 0),
+        right: Math.max(0, safeArea.right ?? 0),
+        bottom: Math.max(0, safeArea.bottom ?? 0),
+        left: Math.max(0, safeArea.left ?? 0),
+    };
+}
+function snapLayerPosition(point, context) {
+    const safe = normalizeSafeArea(context.safeArea);
+    const threshold = context.threshold ?? DEFAULT_SNAP_THRESHOLD;
+    const canvasCenterX = context.canvas.width / 2;
+    const canvasCenterY = context.canvas.height / 2;
+    const layerCenterX = context.layer.width / 2;
+    const layerCenterY = context.layer.height / 2;
+    const right = context.canvas.width - safe.right - context.layer.width;
+    const bottom = context.canvas.height - safe.bottom - context.layer.height;
+    const xCandidates = [
+        {
+            value: 0,
+            guide: { axis: 'x', position: 0, kind: 'edge' },
+        },
+        {
+            value: safe.left,
+            guide: { axis: 'x', position: safe.left, kind: 'safe-area' },
+        },
+        {
+            value: canvasCenterX - layerCenterX,
+            guide: { axis: 'x', position: canvasCenterX, kind: 'center' },
+        },
+        {
+            value: right,
+            guide: {
+                axis: 'x',
+                position: context.canvas.width - safe.right,
+                kind: 'safe-area',
+            },
+        },
+        {
+            value: context.canvas.width - context.layer.width,
+            guide: {
+                axis: 'x',
+                position: context.canvas.width,
+                kind: 'edge',
+            },
+        },
+    ];
+    const yCandidates = [
+        {
+            value: 0,
+            guide: { axis: 'y', position: 0, kind: 'edge' },
+        },
+        {
+            value: safe.top,
+            guide: { axis: 'y', position: safe.top, kind: 'safe-area' },
+        },
+        {
+            value: canvasCenterY - layerCenterY,
+            guide: { axis: 'y', position: canvasCenterY, kind: 'center' },
+        },
+        {
+            value: bottom,
+            guide: {
+                axis: 'y',
+                position: context.canvas.height - safe.bottom,
+                kind: 'safe-area',
+            },
+        },
+        {
+            value: context.canvas.height - context.layer.height,
+            guide: {
+                axis: 'y',
+                position: context.canvas.height,
+                kind: 'edge',
+            },
+        },
+    ];
+    const snappedX = closest(point.x, xCandidates, threshold);
+    const snappedY = closest(point.y, yCandidates, threshold);
+    return {
+        point: {
+            x: snappedX?.value ?? point.x,
+            y: snappedY?.value ?? point.y,
+        },
+        guides: [snappedX?.guide, snappedY?.guide].filter((guide) => Boolean(guide)),
+    };
+}
+function distance(first, second) {
+    return Math.hypot(second.x - first.x, second.y - first.y);
+}
+function angle(first, second) {
+    return (Math.atan2(second.y - first.y, second.x - first.x) * 180) / Math.PI;
+}

package/lib/commonjs/editor/headless.d.ts

@@ -0,0 +1,5 @@
+export { ImageMarkerEditorController } from './controller.js';
+export { angle, distance, normalizeSafeArea, snapLayerPosition, } from './geometry.js';
+export { createEditorViewportProjection, fitEditorSizeWithinMax, projectEditorPoint, projectEditorRecipe, unprojectEditorPoint, type EditorViewportProjection, } from './projection.js';
+export { createBrandLogoLayer, createBrandTextLayer, createEditorBrandKit, createEditorTemplate, materializeEditorTemplate, } from './presets.js';
+export type { EditorAlignment, EditorAsset, EditorAutosaveOptions, EditorBrandKit, EditorClipboardDocument, EditorContentCredentialsExport, EditorDistribution, EditorExportOptions, EditorExportResult, EditorInvisibleExport, EditorKeyCommand, EditorLayerBounds, EditorPoint, EditorRect, EditorRenderRequest, EditorSafeArea, EditorSelectionMode, EditorSerializedState, EditorSize, EditorSnapContext, EditorSnapGuide, EditorState, EditorTemplate, EditorTextLayerPatch, EditorViewportState, ImageMarkerEditorControllerOptions, ImageMarkerEditorRenderAdapter, MarkerImageInfo, WatermarkBlendMode, WatermarkRecipeDefinition, WatermarkRecipeDefinitionLayer, WatermarkRecipeDocument, WatermarkRecipeInput, WatermarkTextStyle, } from './types.js';

package/lib/commonjs/editor/headless.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.materializeEditorTemplate = exports.createEditorTemplate = exports.createEditorBrandKit = exports.createBrandTextLayer = exports.createBrandLogoLayer = exports.unprojectEditorPoint = exports.projectEditorRecipe = exports.projectEditorPoint = exports.fitEditorSizeWithinMax = exports.createEditorViewportProjection = exports.snapLayerPosition = exports.normalizeSafeArea = exports.distance = exports.angle = exports.ImageMarkerEditorController = void 0;
+var controller_js_1 = require("./controller.js");
+Object.defineProperty(exports, "ImageMarkerEditorController", { enumerable: true, get: function () { return controller_js_1.ImageMarkerEditorController; } });
+var geometry_js_1 = require("./geometry.js");
+Object.defineProperty(exports, "angle", { enumerable: true, get: function () { return geometry_js_1.angle; } });
+Object.defineProperty(exports, "distance", { enumerable: true, get: function () { return geometry_js_1.distance; } });
+Object.defineProperty(exports, "normalizeSafeArea", { enumerable: true, get: function () { return geometry_js_1.normalizeSafeArea; } });
+Object.defineProperty(exports, "snapLayerPosition", { enumerable: true, get: function () { return geometry_js_1.snapLayerPosition; } });
+var projection_js_1 = require("./projection.js");
+Object.defineProperty(exports, "createEditorViewportProjection", { enumerable: true, get: function () { return projection_js_1.createEditorViewportProjection; } });
+Object.defineProperty(exports, "fitEditorSizeWithinMax", { enumerable: true, get: function () { return projection_js_1.fitEditorSizeWithinMax; } });
+Object.defineProperty(exports, "projectEditorPoint", { enumerable: true, get: function () { return projection_js_1.projectEditorPoint; } });
+Object.defineProperty(exports, "projectEditorRecipe", { enumerable: true, get: function () { return projection_js_1.projectEditorRecipe; } });
+Object.defineProperty(exports, "unprojectEditorPoint", { enumerable: true, get: function () { return projection_js_1.unprojectEditorPoint; } });
+var presets_js_1 = require("./presets.js");
+Object.defineProperty(exports, "createBrandLogoLayer", { enumerable: true, get: function () { return presets_js_1.createBrandLogoLayer; } });
+Object.defineProperty(exports, "createBrandTextLayer", { enumerable: true, get: function () { return presets_js_1.createBrandTextLayer; } });
+Object.defineProperty(exports, "createEditorBrandKit", { enumerable: true, get: function () { return presets_js_1.createEditorBrandKit; } });
+Object.defineProperty(exports, "createEditorTemplate", { enumerable: true, get: function () { return presets_js_1.createEditorTemplate; } });
+Object.defineProperty(exports, "materializeEditorTemplate", { enumerable: true, get: function () { return presets_js_1.materializeEditorTemplate; } });

package/lib/commonjs/editor/presets.d.ts

@@ -0,0 +1,19 @@
+import { type WatermarkRecipeDefinition, type WatermarkRecipeLayer, type WatermarkRecipeVariableContext } from '@image-marker/recipe';
+import type { EditorAsset, EditorBrandKit, EditorTemplate } from './types.js';
+export declare function createEditorBrandKit<Source = unknown>(brandKit: EditorBrandKit<Source>): EditorBrandKit<Source>;
+export declare function createEditorTemplate<Source = unknown>(template: EditorTemplate<Source>): EditorTemplate<Source>;
+/**
+ * Resolves `{{variable}}` placeholders and conditional layers with the same
+ * Recipe materializer used by Core, Node, and CLI.
+ */
+export declare function materializeEditorTemplate<Source = unknown>(template: EditorTemplate<Source>, context: WatermarkRecipeVariableContext): WatermarkRecipeDefinition<Source>;
+export declare function createBrandTextLayer(text: string, brandKit: EditorBrandKit, overrides?: Partial<Extract<WatermarkRecipeLayer, {
+    type: 'text';
+}>>): Extract<WatermarkRecipeLayer, {
+    type: 'text';
+}>;
+export declare function createBrandLogoLayer<Source>(asset: EditorAsset<Source>, overrides?: Partial<Extract<WatermarkRecipeLayer<Source>, {
+    type: 'image';
+}>>): Extract<WatermarkRecipeLayer<Source>, {
+    type: 'image';
+}>;

package/lib/commonjs/editor/presets.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createEditorBrandKit = createEditorBrandKit;
+exports.createEditorTemplate = createEditorTemplate;
+exports.materializeEditorTemplate = materializeEditorTemplate;
+exports.createBrandTextLayer = createBrandTextLayer;
+exports.createBrandLogoLayer = createBrandLogoLayer;
+const recipe_1 = require("@image-marker/recipe");
+function assertIdentifier(value, label) {
+    const normalized = value.trim();
+    if (!normalized)
+        throw new Error(`${label} must not be empty.`);
+    return normalized;
+}
+function createEditorBrandKit(brandKit) {
+    return {
+        colors: brandKit.colors
+            ? [...new Set(brandKit.colors.map((color) => color.trim()))].filter(Boolean)
+            : undefined,
+        fonts: brandKit.fonts
+            ? [...new Set(brandKit.fonts.map((font) => font.trim()))].filter(Boolean)
+            : undefined,
+        logos: brandKit.logos?.map((logo) => ({ ...logo })),
+    };
+}
+function createEditorTemplate(template) {
+    return {
+        ...template,
+        id: assertIdentifier(template.id, 'Template id'),
+        name: assertIdentifier(template.name, 'Template name'),
+        recipe: (0, recipe_1.migrateWatermarkRecipe)(template.recipe),
+        brandKit: template.brandKit
+            ? createEditorBrandKit(template.brandKit)
+            : undefined,
+    };
+}
+/**
+ * Resolves `{{variable}}` placeholders and conditional layers with the same
+ * Recipe materializer used by Core, Node, and CLI.
+ */
+function materializeEditorTemplate(template, context) {
+    return (0, recipe_1.materializeWatermarkRecipe)(template.recipe, context);
+}
+function createBrandTextLayer(text, brandKit, overrides = {}) {
+    return {
+        type: 'text',
+        text,
+        ...overrides,
+        style: {
+            color: brandKit.colors?.[0] ?? '#FFFFFF',
+            fontName: brandKit.fonts?.[0],
+            fontSize: 36,
+            ...overrides.style,
+        },
+    };
+}
+function createBrandLogoLayer(asset, overrides = {}) {
+    return {
+        type: 'image',
+        src: asset.source,
+        name: asset.name,
+        ...overrides,
+    };
+}

package/lib/commonjs/editor/projection.d.ts

@@ -0,0 +1,12 @@
+import type { EditorPoint, EditorRect, EditorSize, WatermarkRecipeDefinition } from './types.js';
+export interface EditorViewportProjection {
+    source: EditorSize;
+    viewport: EditorSize;
+    content: EditorRect;
+    scale: number;
+}
+export declare function fitEditorSizeWithinMax(source: EditorSize, maxSize: number): EditorSize;
+export declare function createEditorViewportProjection(source: EditorSize, viewport: EditorSize): EditorViewportProjection;
+export declare function projectEditorPoint(point: EditorPoint, projection: EditorViewportProjection): EditorPoint;
+export declare function unprojectEditorPoint(point: EditorPoint, projection: EditorViewportProjection): EditorPoint;
+export declare function projectEditorRecipe(recipe: WatermarkRecipeDefinition, source: EditorSize, target: EditorSize): WatermarkRecipeDefinition;

package/lib/commonjs/editor/projection.js

@@ -0,0 +1,195 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fitEditorSizeWithinMax = fitEditorSizeWithinMax;
+exports.createEditorViewportProjection = createEditorViewportProjection;
+exports.projectEditorPoint = projectEditorPoint;
+exports.unprojectEditorPoint = unprojectEditorPoint;
+exports.projectEditorRecipe = projectEditorRecipe;
+function assertSize(size, label) {
+    if (!Number.isFinite(size.width) ||
+        !Number.isFinite(size.height) ||
+        size.width <= 0 ||
+        size.height <= 0) {
+        throw new Error(`${label} dimensions must be finite numbers greater than 0.`);
+    }
+}
+function scaleMeasure(value, factor) {
+    if (typeof value === 'number')
+        return value * factor;
+    if (typeof value !== 'string')
+        return value;
+    const normalized = value.trim();
+    if (!normalized || normalized.endsWith('%'))
+        return value;
+    const parsed = Number(normalized);
+    return Number.isFinite(parsed) ? String(parsed * factor) : value;
+}
+function scalePadding(value, factor) {
+    if (typeof value === 'number')
+        return value * factor;
+    if (typeof value !== 'string')
+        return value;
+    return value
+        .trim()
+        .split(/\s+/)
+        .map((part) => scaleMeasure(part, factor))
+        .join(' ');
+}
+function projectPosition(layer, scaleX, scaleY, scale) {
+    const position = layer.position;
+    const defaultInset = layer.type === 'text' ? 20 : 0;
+    if (position?.position) {
+        return {
+            ...position,
+            X: scaleMeasure(position.X, scaleX),
+            Y: scaleMeasure(position.Y, scaleY),
+            edgeInset: position.edgeInset === undefined
+                ? 20 * scale
+                : scaleMeasure(position.edgeInset, scale),
+        };
+    }
+    return {
+        ...position,
+        X: position?.X === undefined
+            ? defaultInset * scaleX
+            : scaleMeasure(position.X, scaleX),
+        Y: position?.Y === undefined
+            ? defaultInset * scaleY
+            : scaleMeasure(position.Y, scaleY),
+        edgeInset: position?.edgeInset === undefined
+            ? undefined
+            : scaleMeasure(position.edgeInset, scale),
+    };
+}
+function projectLayout(layer, scaleX, scaleY) {
+    if (layer.layout?.type !== 'tile')
+        return layer.layout && { ...layer.layout };
+    return {
+        ...layer.layout,
+        gapX: scaleMeasure(layer.layout.gapX, scaleX),
+        gapY: scaleMeasure(layer.layout.gapY, scaleY),
+        offsetX: scaleMeasure(layer.layout.offsetX, scaleX),
+        offsetY: scaleMeasure(layer.layout.offsetY, scaleY),
+    };
+}
+function projectTextLayer(layer, scaleX, scaleY, scale) {
+    const style = layer.style;
+    const background = style?.textBackgroundStyle;
+    const cornerRadius = background?.cornerRadius;
+    return {
+        ...layer,
+        position: projectPosition(layer, scaleX, scaleY, scale),
+        layout: projectLayout(layer, scaleX, scaleY),
+        style: {
+            ...style,
+            fontSize: style?.fontSizeRatio === undefined
+                ? (style?.fontSize ?? 14) * scale
+                : style.fontSize,
+            shadowStyle: style?.shadowStyle
+                ? {
+                    ...style.shadowStyle,
+                    dx: style.shadowStyle.dx * scaleX,
+                    dy: style.shadowStyle.dy * scaleY,
+                    radius: style.shadowStyle.radius * scale,
+                }
+                : style?.shadowStyle,
+            strokeStyle: style?.strokeStyle
+                ? {
+                    ...style.strokeStyle,
+                    width: style.strokeStyle.width * scale,
+                }
+                : style?.strokeStyle,
+            textBackgroundStyle: background
+                ? {
+                    ...background,
+                    padding: scalePadding(background.padding, scale),
+                    paddingLeft: scaleMeasure(background.paddingLeft, scaleX),
+                    paddingRight: scaleMeasure(background.paddingRight, scaleX),
+                    paddingTop: scaleMeasure(background.paddingTop, scaleY),
+                    paddingBottom: scaleMeasure(background.paddingBottom, scaleY),
+                    paddingHorizontal: scaleMeasure(background.paddingHorizontal, scaleX),
+                    paddingVertical: scaleMeasure(background.paddingVertical, scaleY),
+                    paddingX: scaleMeasure(background.paddingX, scaleX),
+                    paddingY: scaleMeasure(background.paddingY, scaleY),
+                    cornerRadius: cornerRadius
+                        ? Object.fromEntries(Object.entries(cornerRadius).map(([key, value]) => [
+                            key,
+                            value
+                                ? {
+                                    x: scaleMeasure(value.x, scaleX),
+                                    y: scaleMeasure(value.y, scaleY),
+                                }
+                                : value,
+                        ]))
+                        : cornerRadius,
+                }
+                : background,
+        },
+    };
+}
+function projectImageLayer(layer, scaleX, scaleY, scale) {
+    return {
+        ...layer,
+        position: projectPosition(layer, scaleX, scaleY, scale),
+        layout: projectLayout(layer, scaleX, scaleY),
+        scale: (layer.scale ?? 1) * scale,
+    };
+}
+function fitEditorSizeWithinMax(source, maxSize) {
+    assertSize(source, 'sourceSize');
+    if (!Number.isFinite(maxSize) || maxSize <= 0) {
+        throw new Error('maxSize must be a finite number greater than 0.');
+    }
+    const largest = Math.max(source.width, source.height);
+    if (largest <= maxSize)
+        return { ...source };
+    const scale = maxSize / largest;
+    return {
+        width: Math.max(1, Math.round(source.width * scale)),
+        height: Math.max(1, Math.round(source.height * scale)),
+    };
+}
+function createEditorViewportProjection(source, viewport) {
+    assertSize(source, 'sourceSize');
+    assertSize(viewport, 'viewport');
+    const scale = Math.min(viewport.width / source.width, viewport.height / source.height);
+    const width = source.width * scale;
+    const height = source.height * scale;
+    return {
+        source: { ...source },
+        viewport: { ...viewport },
+        scale,
+        content: {
+            x: (viewport.width - width) / 2,
+            y: (viewport.height - height) / 2,
+            width,
+            height,
+        },
+    };
+}
+function projectEditorPoint(point, projection) {
+    return {
+        x: projection.content.x + point.x * projection.scale,
+        y: projection.content.y + point.y * projection.scale,
+    };
+}
+function unprojectEditorPoint(point, projection) {
+    return {
+        x: (point.x - projection.content.x) / projection.scale,
+        y: (point.y - projection.content.y) / projection.scale,
+    };
+}
+function projectEditorRecipe(recipe, source, target) {
+    assertSize(source, 'sourceSize');
+    assertSize(target, 'targetSize');
+    const scaleX = target.width / source.width;
+    const scaleY = target.height / source.height;
+    const scale = Math.min(scaleX, scaleY);
+    return {
+        schemaVersion: 2,
+        layers: recipe.layers.map((layer) => layer.type === 'text'
+            ? projectTextLayer(layer, scaleX, scaleY, scale)
+            : projectImageLayer(layer, scaleX, scaleY, scale)),
+        output: { ...recipe.output },
+    };
+}

package/lib/commonjs/editor/types.d.ts

@@ -0,0 +1,166 @@
+import type { ContentCredentialsAdapter, ContentCredentialsClaim, MarkerImageInfo, MarkerJobOptions, MarkerResult } from './core-contract.js';
+import type { WatermarkBlendMode, WatermarkRecipeDefinition, WatermarkRecipeDefinitionLayer, WatermarkRecipeDocument, WatermarkRecipeInput, WatermarkTextStyle } from '@image-marker/recipe';
+export interface EditorPoint {
+    x: number;
+    y: number;
+}
+export interface EditorSize {
+    width: number;
+    height: number;
+}
+export interface EditorRect extends EditorPoint, EditorSize {
+}
+export interface EditorViewportState {
+    zoom: number;
+    pan: EditorPoint;
+    fitMode: 'contain' | 'manual';
+}
+export interface EditorSafeArea {
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+}
+export type EditorSnapGuide = {
+    axis: 'x';
+    position: number;
+    kind: 'edge' | 'center' | 'safe-area';
+} | {
+    axis: 'y';
+    position: number;
+    kind: 'edge' | 'center' | 'safe-area';
+};
+export interface EditorInvisibleExport {
+    payload: string;
+    key: string;
+    strength?: 'subtle' | 'balanced' | 'robust';
+}
+export interface EditorContentCredentialsExport {
+    adapter: ContentCredentialsAdapter;
+    claim: ContentCredentialsClaim;
+}
+export interface EditorExportOptions {
+    invisible?: EditorInvisibleExport;
+    contentCredentials?: EditorContentCredentialsExport;
+}
+export interface EditorState {
+    recipe: WatermarkRecipeDefinition;
+    /** Ordered selection. The final item is the primary selection. */
+    selectedLayerIds: readonly string[];
+    /** Convenience alias for the primary selection. */
+    selectedLayerId?: string;
+    safeArea: EditorSafeArea;
+    snapGuides: readonly EditorSnapGuide[];
+    exportOptions: EditorExportOptions;
+    viewport: EditorViewportState;
+    canUndo: boolean;
+    canRedo: boolean;
+}
+export type EditorSelectionMode = 'replace' | 'add' | 'toggle';
+export type EditorAlignment = 'left' | 'center' | 'right' | 'top' | 'middle' | 'bottom';
+export type EditorDistribution = 'horizontal' | 'vertical';
+export interface EditorLayerBounds extends EditorRect {
+    id: string;
+}
+export interface EditorClipboardDocument {
+    kind: 'image-marker/editor-layers';
+    version: 1;
+    layers: WatermarkRecipeDefinitionLayer[];
+}
+export type EditorTextLayerPatch = {
+    text?: string;
+    name?: string;
+    alpha?: number;
+    blendMode?: WatermarkBlendMode;
+    style?: Partial<WatermarkTextStyle>;
+};
+export interface EditorAsset<Source = unknown> {
+    id: string;
+    name: string;
+    source: Source;
+    thumbnail?: Source;
+    tags?: readonly string[];
+}
+export interface EditorBrandKit<Source = unknown> {
+    colors?: readonly string[];
+    fonts?: readonly string[];
+    logos?: readonly EditorAsset<Source>[];
+}
+export interface EditorTemplate<Source = unknown> {
+    id: string;
+    name: string;
+    description?: string;
+    recipe: WatermarkRecipeDocument<Source>;
+    brandKit?: EditorBrandKit<Source>;
+}
+export interface EditorPersistenceAdapter {
+    load(key: string): string | null | Promise<string | null>;
+    save(key: string, value: string): void | Promise<void>;
+    remove?(key: string): void | Promise<void>;
+}
+export interface EditorAutosaveOptions {
+    key: string;
+    storage: EditorPersistenceAdapter;
+    debounceMs?: number;
+    onError?: (error: Error) => void;
+}
+export interface ImageMarkerEditorControllerOptions {
+    document: WatermarkRecipeDocument;
+    historyLimit?: number;
+    autosave?: EditorAutosaveOptions;
+    onChange?: (state: EditorState) => void;
+}
+export interface EditorSerializedState {
+    version: 1;
+    recipe: WatermarkRecipeDefinition;
+    selectedLayerIds: string[];
+    safeArea: EditorSafeArea;
+    /**
+     * Reserved for non-sensitive application metadata. Core signing adapters,
+     * invisible-watermark keys, and export credentials are never autosaved.
+     */
+    exportOptions?: EditorExportOptions;
+    viewport: EditorViewportState;
+}
+export interface EditorSnapContext {
+    canvas: EditorSize;
+    layer: EditorSize;
+    safeArea?: EditorSafeArea;
+    threshold?: number;
+}
+export interface EditorKeyCommand {
+    key: string;
+    shiftKey?: boolean;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    altKey?: boolean;
+}
+export interface EditorRenderRequest {
+    recipe: WatermarkRecipeDefinition;
+    input: WatermarkRecipeInput;
+    /**
+     * Pixel dimensions of the background before Core applies output.maxSize.
+     * Providing this keeps numeric Recipe coordinates visually stable between
+     * the interactive surface, bounded previews, and original export.
+     */
+    sourceSize?: EditorSize;
+    control?: MarkerJobOptions;
+}
+export interface EditorExportResult {
+    visible: MarkerResult;
+    final: MarkerResult;
+}
+/**
+ * Rendering remains injectable. The editor package owns interaction state,
+ * while Core or an application adapter owns image decoding and encoding.
+ */
+export interface ImageMarkerEditorRenderAdapter {
+    getSourceInfo?(source: unknown): Promise<MarkerImageInfo>;
+    renderPreview(request: EditorRenderRequest & {
+        maxSize?: number;
+    }): Promise<MarkerResult>;
+    exportOriginal(request: EditorRenderRequest & {
+        options?: EditorExportOptions;
+    }): Promise<EditorExportResult>;
+}
+export type { MarkerImageInfo, WatermarkBlendMode, WatermarkRecipeDefinition, WatermarkRecipeDefinitionLayer, WatermarkRecipeDocument, WatermarkRecipeInput, WatermarkTextStyle, };

package/lib/commonjs/editor/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/commonjs/editor-adapter.d.ts

@@ -0,0 +1,7 @@
+import type { EditorMarkerEngine } from './editor/adapter.js';
+import type { ImageMarkerEditorRenderAdapter, MarkerImageInfo } from './editor/types.js';
+export type { EditorMarkerEngine } from './editor/adapter.js';
+/** Bind the shared editor renderer to Canvas or an isolated Web Marker instance. */
+export declare function createWebEditorAdapter(previewMaxSize?: number, marker?: EditorMarkerEngine): ImageMarkerEditorRenderAdapter;
+/** Read local file bytes first; the default browser fallback remains available. */
+export declare function resolveWebEditorSourceInfo(source: unknown): Promise<MarkerImageInfo>;

package/lib/commonjs/editor-adapter.js

@@ -0,0 +1,17 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createWebEditorAdapter = createWebEditorAdapter;
+exports.resolveWebEditorSourceInfo = resolveWebEditorSourceInfo;
+const index_js_1 = __importDefault(require("./core/web/index.js"));
+const adapter_js_1 = require("./editor/adapter.js");
+/** Bind the shared editor renderer to Canvas or an isolated Web Marker instance. */
+function createWebEditorAdapter(previewMaxSize = 1024, marker = index_js_1.default) {
+    return (0, adapter_js_1.createEditorRenderAdapter)(marker, previewMaxSize);
+}
+/** Read local file bytes first; the default browser fallback remains available. */
+function resolveWebEditorSourceInfo(source) {
+    return index_js_1.default.getImageInfo(source);
+}

package/lib/commonjs/headless.d.ts

@@ -0,0 +1,2 @@
+export * from './editor/headless.js';
+export { addWatermarkRecipeLayer, duplicateWatermarkRecipeLayer, groupWatermarkRecipeLayers, removeWatermarkRecipeLayer, reorderWatermarkRecipeLayer, ungroupWatermarkRecipeLayers, updateWatermarkRecipeLayer, } from '@image-marker/recipe';