@pixerate/editor 0.188.0 → 0.190.0

package/dist/image-editor/layer-tools.d.cts

@@ -6,7 +6,7 @@ import type { CropBox } from './types.cjs';
 export declare function maskSummary(mask: RasterMask | undefined): Record<string, unknown> | null;
 /**
  * A plain description of a layer (and its children) for agents: ids, types, names, document
- * bounds, visibility, opacity, fill, blend, clipping, locks, mask and effects summaries and
+ * bounds, visibility, opacity, fill, blend, clipping, locks, mask, vector mask and effects summaries and
  * whether it is active. `boundsOf` gives a pixel layer's document bounds.
  */
 export declare function describeLayer(layer: ImageLayer, activeId: string | null, boundsOf: (layer: ImageLayer) => CropBox | null): Record<string, unknown>;

package/dist/image-editor/layer-tools.d.ts

@@ -6,7 +6,7 @@ import type { CropBox } from './types.js';
 export declare function maskSummary(mask: RasterMask | undefined): Record<string, unknown> | null;
 /**
  * A plain description of a layer (and its children) for agents: ids, types, names, document
- * bounds, visibility, opacity, fill, blend, clipping, locks, mask and effects summaries and
+ * bounds, visibility, opacity, fill, blend, clipping, locks, mask, vector mask and effects summaries and
  * whether it is active. `boundsOf` gives a pixel layer's document bounds.
  */
 export declare function describeLayer(layer: ImageLayer, activeId: string | null, boundsOf: (layer: ImageLayer) => CropBox | null): Record<string, unknown>;

package/dist/image-editor/layers/compositor.d.cts

@@ -42,6 +42,9 @@ export declare function runLayerFiltersFloat(data: Float32Array, width: number,
 /** The per-tile compositor for image editor layer stacks (see the raster module for the caches). */
 export declare class LayerCompositor extends RasterCompositor<ImageLayer, CompositorSources> {
     constructor(options?: CompositorOptions);
+    composite(layers: readonly ImageLayer[], rect: RasterRect, sources: CompositorSources, options?: CompositeCallOptions): Uint8ClampedArray;
+    compositeTiles(layers: readonly ImageLayer[], rect: RasterRect, sources: CompositorSources, onTile: (tx: number, ty: number, data: Uint8ClampedArray, changed: boolean) => void, options?: CompositeCallOptions): void;
+    tile(layers: readonly ImageLayer[], tx: number, ty: number, sources: CompositorSources): Uint8ClampedArray;
 }
 /**
  * The composite of an image editor stack at 16 or 32 bits (see `raster/deep-compositor`): float

package/dist/image-editor/layers/compositor.d.ts

@@ -42,6 +42,9 @@ export declare function runLayerFiltersFloat(data: Float32Array, width: number,
 /** The per-tile compositor for image editor layer stacks (see the raster module for the caches). */
 export declare class LayerCompositor extends RasterCompositor<ImageLayer, CompositorSources> {
     constructor(options?: CompositorOptions);
+    composite(layers: readonly ImageLayer[], rect: RasterRect, sources: CompositorSources, options?: CompositeCallOptions): Uint8ClampedArray;
+    compositeTiles(layers: readonly ImageLayer[], rect: RasterRect, sources: CompositorSources, onTile: (tx: number, ty: number, data: Uint8ClampedArray, changed: boolean) => void, options?: CompositeCallOptions): void;
+    tile(layers: readonly ImageLayer[], tx: number, ty: number, sources: CompositorSources): Uint8ClampedArray;
 }
 /**
  * The composite of an image editor stack at 16 or 32 bits (see `raster/deep-compositor`): float

package/dist/image-editor/layers/model.d.cts

@@ -28,6 +28,29 @@ export type { LayerLocks };
 export type RasterMask = BaseRasterMask<DepthMaskOptions>;
 export interface LayerBase extends RasterLayerBase {
     mask?: RasterMask;
+    /** A vector mask (Photoshop's): a path that reveals the layer, on top of `mask`. Not on shape layers. */
+    vectorMask?: VectorMask;
+}
+/**
+ * A vector mask: shape components in document pixels (the same paths shape layers use) that
+ * reveal the layer inside them (outside with `inverted`). It stays sharp at any size; the
+ * compositor multiplies it with the layer's raster mask. No components hides everything
+ * (reveals everything when inverted).
+ */
+export interface VectorMask {
+    components: ShapeComponent[];
+    /** How overlapping subpaths fill (default nonzero). */
+    fillRule?: ShapeFillRule;
+    /** Reveal outside the path instead (default false). */
+    inverted?: boolean;
+    /** Disabled masks are kept but ignored (default true). */
+    enabled?: boolean;
+    /** `false`: the path stays put when the layer moves or transforms (default true). */
+    linked?: boolean;
+    /** 0..1 (default 1): at 0.5 the hidden area still shows half. */
+    density?: number;
+    /** Gaussian feather σ in px (default 0). */
+    feather?: number;
 }
 /** The base sliders of the old document-level adjustments, as a filter on one layer. */
 export interface DevelopSettings {

package/dist/image-editor/layers/model.d.ts

@@ -28,6 +28,29 @@ export type { LayerLocks };
 export type RasterMask = BaseRasterMask<DepthMaskOptions>;
 export interface LayerBase extends RasterLayerBase {
     mask?: RasterMask;
+    /** A vector mask (Photoshop's): a path that reveals the layer, on top of `mask`. Not on shape layers. */
+    vectorMask?: VectorMask;
+}
+/**
+ * A vector mask: shape components in document pixels (the same paths shape layers use) that
+ * reveal the layer inside them (outside with `inverted`). It stays sharp at any size; the
+ * compositor multiplies it with the layer's raster mask. No components hides everything
+ * (reveals everything when inverted).
+ */
+export interface VectorMask {
+    components: ShapeComponent[];
+    /** How overlapping subpaths fill (default nonzero). */
+    fillRule?: ShapeFillRule;
+    /** Reveal outside the path instead (default false). */
+    inverted?: boolean;
+    /** Disabled masks are kept but ignored (default true). */
+    enabled?: boolean;
+    /** `false`: the path stays put when the layer moves or transforms (default true). */
+    linked?: boolean;
+    /** 0..1 (default 1): at 0.5 the hidden area still shows half. */
+    density?: number;
+    /** Gaussian feather σ in px (default 0). */
+    feather?: number;
 }
 /** The base sliders of the old document-level adjustments, as a filter on one layer. */
 export interface DevelopSettings {

package/dist/image-editor/layers/paint-ui.d.cts

@@ -140,7 +140,8 @@ export interface ShortcutEvent {
  * Applies a paint shortcut. Returns true when it was one (the caller then prevents the default).
  * B / Shift+B (Mixer Brush) / E / V choose the tool; [ and ] change the size, with Shift the hardness by 25 %; 1..9 set the
  * opacity to 10..90 % and 0 to 100 %; D resets the colours to black and white; X swaps them; Q
- * toggles Quick Mask mode (painting then edits the selection).
+ * toggles Quick Mask mode (painting then edits the selection); the backslash key shows the active
+ * layer's mask as a red overlay.
  */
 export declare function handlePaintShortcut(controller: ImageEditorController, e: ShortcutEvent): boolean;
 /** One pointer sample in document pixels. */

package/dist/image-editor/layers/paint-ui.d.ts

@@ -140,7 +140,8 @@ export interface ShortcutEvent {
  * Applies a paint shortcut. Returns true when it was one (the caller then prevents the default).
  * B / Shift+B (Mixer Brush) / E / V choose the tool; [ and ] change the size, with Shift the hardness by 25 %; 1..9 set the
  * opacity to 10..90 % and 0 to 100 %; D resets the colours to black and white; X swaps them; Q
- * toggles Quick Mask mode (painting then edits the selection).
+ * toggles Quick Mask mode (painting then edits the selection); the backslash key shows the active
+ * layer's mask as a red overlay.
  */
 export declare function handlePaintShortcut(controller: ImageEditorController, e: ShortcutEvent): boolean;
 /** One pointer sample in document pixels. */

package/dist/image-editor/layers/panel.d.cts

@@ -8,8 +8,9 @@ import { type ImageLayer, type SmartFilter } from './model.cjs';
 import type { LayerPlacement } from './ops.cjs';
 /**
  * A click on a layer's mask thumbnail, as in Photoshop: Ctrl/⌘-click loads the mask as the
- * selection (with Shift adding, Alt subtracting, both intersecting), Shift-click turns the mask
- * on or off, and a plain click makes the mask the paint target.
+ * selection (with Shift adding, Alt subtracting, both intersecting), Alt-click shows the mask
+ * alone in grey (Alt+Shift-click as a red overlay; again to go back to the image), Shift-click
+ * turns the mask on or off, and a plain click makes the mask the paint target.
  */
 export declare function maskThumbnailClick(controller: ImageEditorController, layer: ImageLayer, e: {
     ctrlKey?: boolean;
@@ -17,6 +18,16 @@ export declare function maskThumbnailClick(controller: ImageEditorController, la
     shiftKey?: boolean;
     altKey?: boolean;
 }): void;
+/**
+ * A click on a layer's vector mask thumbnail: Ctrl/⌘-click loads the path as the selection (Shift
+ * adds, Alt subtracts, both intersect) and Shift-click turns the vector mask on or off.
+ */
+export declare function vectorMaskThumbnailClick(controller: ImageEditorController, layer: ImageLayer, e: {
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    shiftKey?: boolean;
+    altKey?: boolean;
+}): void;
 /**
  * A click on a layer's pixel thumbnail: Ctrl/⌘-click loads the layer's transparency as the
  * selection (Shift adds, Alt subtracts, both intersect) and returns true; other clicks are left
@@ -56,7 +67,7 @@ export type DropZone = 'above' | 'below' | 'inside';
 export declare function dropZone(fraction: number, isGroup: boolean): DropZone;
 /** The placement for `move_layer` when `dragId` is dropped on row `targetId` in `zone`, or `null` for a no-op. */
 export declare function dropPlacement(layers: readonly ImageLayer[], dragId: string, targetId: string, zone: DropZone): LayerPlacement | null;
-export type LayerMenuAction = 'new-layer' | 'new-group' | 'duplicate' | 'delete' | 'group-selected' | 'ungroup' | 'merge-down' | 'merge-visible' | 'flatten' | 'via-copy' | 'via-cut' | 'add-mask' | 'add-mask-selection' | 'add-mask-hide-selection' | 'add-mask-transparency' | 'select-transparency' | 'apply-mask' | 'delete-mask' | 'toggle-mask' | 'toggle-mask-link' | 'toggle-clip' | 'rasterize' | 'convert-smart' | 'edit-contents' | 'smart-via-copy' | 'add-filter-mask';
+export type LayerMenuAction = 'new-layer' | 'new-group' | 'duplicate' | 'delete' | 'group-selected' | 'ungroup' | 'merge-down' | 'merge-visible' | 'flatten' | 'via-copy' | 'via-cut' | 'add-mask' | 'add-vector-mask' | 'add-vector-mask-hide' | 'delete-vector-mask' | 'toggle-vector-mask' | 'rasterize-vector-mask' | 'add-mask-selection' | 'add-mask-hide-selection' | 'add-mask-transparency' | 'select-transparency' | 'apply-mask' | 'delete-mask' | 'toggle-mask' | 'toggle-mask-link' | 'toggle-clip' | 'rasterize' | 'convert-smart' | 'edit-contents' | 'smart-via-copy' | 'add-filter-mask';
 export interface LayerMenuItem {
     action: LayerMenuAction;
     label: string;

package/dist/image-editor/layers/panel.d.ts

@@ -8,8 +8,9 @@ import { type ImageLayer, type SmartFilter } from './model.js';
 import type { LayerPlacement } from './ops.js';
 /**
  * A click on a layer's mask thumbnail, as in Photoshop: Ctrl/⌘-click loads the mask as the
- * selection (with Shift adding, Alt subtracting, both intersecting), Shift-click turns the mask
- * on or off, and a plain click makes the mask the paint target.
+ * selection (with Shift adding, Alt subtracting, both intersecting), Alt-click shows the mask
+ * alone in grey (Alt+Shift-click as a red overlay; again to go back to the image), Shift-click
+ * turns the mask on or off, and a plain click makes the mask the paint target.
  */
 export declare function maskThumbnailClick(controller: ImageEditorController, layer: ImageLayer, e: {
     ctrlKey?: boolean;
@@ -17,6 +18,16 @@ export declare function maskThumbnailClick(controller: ImageEditorController, la
     shiftKey?: boolean;
     altKey?: boolean;
 }): void;
+/**
+ * A click on a layer's vector mask thumbnail: Ctrl/⌘-click loads the path as the selection (Shift
+ * adds, Alt subtracts, both intersect) and Shift-click turns the vector mask on or off.
+ */
+export declare function vectorMaskThumbnailClick(controller: ImageEditorController, layer: ImageLayer, e: {
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    shiftKey?: boolean;
+    altKey?: boolean;
+}): void;
 /**
  * A click on a layer's pixel thumbnail: Ctrl/⌘-click loads the layer's transparency as the
  * selection (Shift adds, Alt subtracts, both intersect) and returns true; other clicks are left
@@ -56,7 +67,7 @@ export type DropZone = 'above' | 'below' | 'inside';
 export declare function dropZone(fraction: number, isGroup: boolean): DropZone;
 /** The placement for `move_layer` when `dragId` is dropped on row `targetId` in `zone`, or `null` for a no-op. */
 export declare function dropPlacement(layers: readonly ImageLayer[], dragId: string, targetId: string, zone: DropZone): LayerPlacement | null;
-export type LayerMenuAction = 'new-layer' | 'new-group' | 'duplicate' | 'delete' | 'group-selected' | 'ungroup' | 'merge-down' | 'merge-visible' | 'flatten' | 'via-copy' | 'via-cut' | 'add-mask' | 'add-mask-selection' | 'add-mask-hide-selection' | 'add-mask-transparency' | 'select-transparency' | 'apply-mask' | 'delete-mask' | 'toggle-mask' | 'toggle-mask-link' | 'toggle-clip' | 'rasterize' | 'convert-smart' | 'edit-contents' | 'smart-via-copy' | 'add-filter-mask';
+export type LayerMenuAction = 'new-layer' | 'new-group' | 'duplicate' | 'delete' | 'group-selected' | 'ungroup' | 'merge-down' | 'merge-visible' | 'flatten' | 'via-copy' | 'via-cut' | 'add-mask' | 'add-vector-mask' | 'add-vector-mask-hide' | 'delete-vector-mask' | 'toggle-vector-mask' | 'rasterize-vector-mask' | 'add-mask-selection' | 'add-mask-hide-selection' | 'add-mask-transparency' | 'select-transparency' | 'apply-mask' | 'delete-mask' | 'toggle-mask' | 'toggle-mask-link' | 'toggle-clip' | 'rasterize' | 'convert-smart' | 'edit-contents' | 'smart-via-copy' | 'add-filter-mask';
 export interface LayerMenuItem {
     action: LayerMenuAction;
     label: string;

package/dist/image-editor/layers/serialize.d.cts

@@ -40,9 +40,20 @@ interface SerializedLayerBase {
     blend: string;
     clipped?: boolean;
     mask?: SerializedRasterMask;
+    vectorMask?: SerializedVectorMask;
     locks?: LayerLocks;
     effects?: SerializedLayerEffects;
 }
+/** A stored vector mask: its components as JSON (document pixels) and its properties. */
+export interface SerializedVectorMask {
+    components: unknown[];
+    fillRule?: 'evenodd';
+    inverted?: true;
+    enabled?: false;
+    linked?: false;
+    density?: number;
+    feather?: number;
+}
 /** A layer's effects: the effect list as JSON plus the PSD block they came from (base64). */
 export interface SerializedLayerEffects {
     enabled: boolean;

package/dist/image-editor/layers/serialize.d.ts

@@ -40,9 +40,20 @@ interface SerializedLayerBase {
     blend: string;
     clipped?: boolean;
     mask?: SerializedRasterMask;
+    vectorMask?: SerializedVectorMask;
     locks?: LayerLocks;
     effects?: SerializedLayerEffects;
 }
+/** A stored vector mask: its components as JSON (document pixels) and its properties. */
+export interface SerializedVectorMask {
+    components: unknown[];
+    fillRule?: 'evenodd';
+    inverted?: true;
+    enabled?: false;
+    linked?: false;
+    density?: number;
+    feather?: number;
+}
 /** A layer's effects: the effect list as JSON plus the PSD block they came from (base64). */
 export interface SerializedLayerEffects {
     enabled: boolean;

package/dist/image-editor/layers/shape.d.cts

@@ -50,6 +50,11 @@ export declare function shapeGeometryBounds(layer: Pick<ShapeLayer, 'components'
     width: number;
     height: number;
 } | null;
+/**
+ * Coverage (0..1) of `components` over `rect`, filled with `rule` and combined by their ops;
+ * `inverted` covers the outside instead. Used for vector masks.
+ */
+export declare function componentsCoverage(components: readonly ShapeComponent[], rect: CropBox, rule?: ShapeFillRule, inverted?: boolean): Float32Array;
 /** Where a shape renders: the canvas grown by the margin. */
 export declare function shapeRenderClip(env: Pick<ShapeEnv, 'width' | 'height'>): CropBox;
 /**

package/dist/image-editor/layers/shape.d.ts

@@ -50,6 +50,11 @@ export declare function shapeGeometryBounds(layer: Pick<ShapeLayer, 'components'
     width: number;
     height: number;
 } | null;
+/**
+ * Coverage (0..1) of `components` over `rect`, filled with `rule` and combined by their ops;
+ * `inverted` covers the outside instead. Used for vector masks.
+ */
+export declare function componentsCoverage(components: readonly ShapeComponent[], rect: CropBox, rule?: ShapeFillRule, inverted?: boolean): Float32Array;
 /** Where a shape renders: the canvas grown by the margin. */
 export declare function shapeRenderClip(env: Pick<ShapeEnv, 'width' | 'height'>): CropBox;
 /**

package/dist/image-editor/layers/vector-mask.d.cts

@@ -0,0 +1,51 @@
+/**
+ * Vector masks: a path on a layer that reveals it (Photoshop's Layer › Vector Mask). The paths are
+ * shape components in document pixels; the compositor sees them through `resolveVectorMasks`, which
+ * gives each layer with a vector mask a raster mask that is its raster mask times the path's
+ * coverage, so the tile engine and its caches need nothing new.
+ */
+import type { CropBox } from '../types.cjs';
+import type { AffineMatrix } from '../../geom/types.cjs';
+import type { ImageLayer, RasterMask, VectorMask } from './model.cjs';
+/** Whether a vector mask takes part in compositing. */
+export declare function isActiveVectorMask(vm: VectorMask | undefined): vm is VectorMask;
+/**
+ * The vector mask's coverage (0..1) over the `width × height` canvas, with its feather and
+ * density applied.
+ */
+export declare function vectorMaskCoverage(vm: VectorMask, width: number, height: number): Float32Array;
+/**
+ * The raster mask a layer composites with: its raster mask times its vector mask (layer space,
+ * feather and density baked in), or the raster mask alone when there is no active vector mask.
+ * A depth (parametric) mask cannot be combined, so it wins.
+ */
+export declare function effectiveLayerMask(layer: ImageLayer, width: number, height: number): RasterMask | undefined;
+/**
+ * The stack as the compositor should see it: each layer with an active vector mask replaced by a
+ * copy whose `mask` is `effectiveLayerMask` (cached per layer object and canvas size, so the
+ * engine's tile caches keep working). Returns `layers` itself when there are none.
+ */
+export declare function resolveVectorMasks(layers: readonly ImageLayer[], width: number, height: number): readonly ImageLayer[];
+/** A vector mask moved by (dx, dy) document pixels. */
+export declare function offsetVectorMask(vm: VectorMask, dx: number, dy: number): VectorMask;
+/** A vector mask with its paths mapped by `f` (document space); `affine` keeps live shapes live. */
+export declare function transformVectorMask(vm: VectorMask, f: (p: {
+    x: number;
+    y: number;
+}) => {
+    x: number;
+    y: number;
+}, affine?: AffineMatrix): VectorMask;
+/** A linked vector mask moved with its layer by (dx, dy); unlinked ones stay. */
+export declare function followLayerMove<T extends ImageLayer>(layer: T, dx: number, dy: number): T;
+/** Bounds of a vector mask's paths (document pixels), or `null` when it has none. */
+export declare function vectorMaskBounds(vm: VectorMask): CropBox | null;
+/**
+ * A vector mask's thumbnail over the `width × height` canvas, at most `maxSide` px: grey RGBA,
+ * white where the path reveals (cached per mask object).
+ */
+export declare function vectorMaskThumbnail(vm: VectorMask, width: number, height: number, maxSide?: number): {
+    width: number;
+    height: number;
+    data: Uint8ClampedArray;
+};

package/dist/image-editor/layers/vector-mask.d.ts

@@ -0,0 +1,51 @@
+/**
+ * Vector masks: a path on a layer that reveals it (Photoshop's Layer › Vector Mask). The paths are
+ * shape components in document pixels; the compositor sees them through `resolveVectorMasks`, which
+ * gives each layer with a vector mask a raster mask that is its raster mask times the path's
+ * coverage, so the tile engine and its caches need nothing new.
+ */
+import type { CropBox } from '../types.js';
+import type { AffineMatrix } from '../../geom/types.js';
+import type { ImageLayer, RasterMask, VectorMask } from './model.js';
+/** Whether a vector mask takes part in compositing. */
+export declare function isActiveVectorMask(vm: VectorMask | undefined): vm is VectorMask;
+/**
+ * The vector mask's coverage (0..1) over the `width × height` canvas, with its feather and
+ * density applied.
+ */
+export declare function vectorMaskCoverage(vm: VectorMask, width: number, height: number): Float32Array;
+/**
+ * The raster mask a layer composites with: its raster mask times its vector mask (layer space,
+ * feather and density baked in), or the raster mask alone when there is no active vector mask.
+ * A depth (parametric) mask cannot be combined, so it wins.
+ */
+export declare function effectiveLayerMask(layer: ImageLayer, width: number, height: number): RasterMask | undefined;
+/**
+ * The stack as the compositor should see it: each layer with an active vector mask replaced by a
+ * copy whose `mask` is `effectiveLayerMask` (cached per layer object and canvas size, so the
+ * engine's tile caches keep working). Returns `layers` itself when there are none.
+ */
+export declare function resolveVectorMasks(layers: readonly ImageLayer[], width: number, height: number): readonly ImageLayer[];
+/** A vector mask moved by (dx, dy) document pixels. */
+export declare function offsetVectorMask(vm: VectorMask, dx: number, dy: number): VectorMask;
+/** A vector mask with its paths mapped by `f` (document space); `affine` keeps live shapes live. */
+export declare function transformVectorMask(vm: VectorMask, f: (p: {
+    x: number;
+    y: number;
+}) => {
+    x: number;
+    y: number;
+}, affine?: AffineMatrix): VectorMask;
+/** A linked vector mask moved with its layer by (dx, dy); unlinked ones stay. */
+export declare function followLayerMove<T extends ImageLayer>(layer: T, dx: number, dy: number): T;
+/** Bounds of a vector mask's paths (document pixels), or `null` when it has none. */
+export declare function vectorMaskBounds(vm: VectorMask): CropBox | null;
+/**
+ * A vector mask's thumbnail over the `width × height` canvas, at most `maxSide` px: grey RGBA,
+ * white where the path reveals (cached per mask object).
+ */
+export declare function vectorMaskThumbnail(vm: VectorMask, width: number, height: number, maxSide?: number): {
+    width: number;
+    height: number;
+    data: Uint8ClampedArray;
+};

package/dist/image-editor/psd/import.d.cts

@@ -1,10 +1,3 @@
-/**
- * PSD / PSB → our layer tree. Everything the model holds maps directly (smart objects with their
- * embedded contents, placement, warp, smart filters and filter mask; shape layers with their
- * paths, fill, stroke and live shapes; type layers with their text, styles and Photoshop's pixels
- * until edited); everything else comes in as close as it can (fill layers as their stored pixels)
- * with a warning naming the layers.
- */
 import { type PsdAlphaChannel } from './channels.cjs';
 import type { ImageLayer, LayerBlendMode } from '../layers/model.cjs';
 import { type PsdFile } from './file.cjs';

package/dist/image-editor/psd/import.d.ts

@@ -1,10 +1,3 @@
-/**
- * PSD / PSB → our layer tree. Everything the model holds maps directly (smart objects with their
- * embedded contents, placement, warp, smart filters and filter mask; shape layers with their
- * paths, fill, stroke and live shapes; type layers with their text, styles and Photoshop's pixels
- * until edited); everything else comes in as close as it can (fill layers as their stored pixels)
- * with a warning naming the layers.
- */
 import { type PsdAlphaChannel } from './channels.js';
 import type { ImageLayer, LayerBlendMode } from '../layers/model.js';
 import { type PsdFile } from './file.js';

package/dist/image-editor/renderer.d.cts

@@ -178,6 +178,12 @@ export declare class ImageEditorRenderer {
     /** An empty selection of the image's size (Quick Mask mode with nothing selected). */
     private emptyMask;
     private overlayCache;
+    private maskViewCache;
+    private grayCache;
+    /** A layer's mask as canvas-sized coverage for its mask view, kept while the mask is unchanged. */
+    private maskViewSelection;
+    /** A mask alone in grey (white = revealed), opaque, drawn in natural image space. */
+    private drawMaskGray;
     /** A channel's tint (colour, opacity, masked or selected area), drawn in natural image space. */
     private drawMaskOverlay;
     /** Rubylith over the unselected area, drawn in natural image space. */

package/dist/image-editor/renderer.d.ts

@@ -178,6 +178,12 @@ export declare class ImageEditorRenderer {
     /** An empty selection of the image's size (Quick Mask mode with nothing selected). */
     private emptyMask;
     private overlayCache;
+    private maskViewCache;
+    private grayCache;
+    /** A layer's mask as canvas-sized coverage for its mask view, kept while the mask is unchanged. */
+    private maskViewSelection;
+    /** A mask alone in grey (white = revealed), opaque, drawn in natural image space. */
+    private drawMaskGray;
     /** A channel's tint (colour, opacity, masked or selected area), drawn in natural image space. */
     private drawMaskOverlay;
     /** Rubylith over the unselected area, drawn in natural image space. */

package/dist/image-editor/selection/gesture.d.cts

@@ -76,6 +76,16 @@ export declare function handleSelectionShortcut(controller: ImageEditorControlle
     shiftKey?: boolean;
     altKey?: boolean;
 }, onError?: (message: string) => void): boolean;
+/**
+ * The backslash key (no modifiers) shows or hides the active layer's mask as a red overlay; it
+ * does nothing when the layer has no painted mask. Returns true when the key was used.
+ */
+export declare function handleMaskViewKey(controller: ImageEditorController, e: {
+    key: string;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    altKey?: boolean;
+}): boolean;
 /** Q (no modifiers) toggles Quick Mask mode. Returns true when the key was used. */
 export declare function handleQuickMaskKey(controller: ImageEditorController, e: {
     key: string;

package/dist/image-editor/selection/gesture.d.ts

@@ -76,6 +76,16 @@ export declare function handleSelectionShortcut(controller: ImageEditorControlle
     shiftKey?: boolean;
     altKey?: boolean;
 }, onError?: (message: string) => void): boolean;
+/**
+ * The backslash key (no modifiers) shows or hides the active layer's mask as a red overlay; it
+ * does nothing when the layer has no painted mask. Returns true when the key was used.
+ */
+export declare function handleMaskViewKey(controller: ImageEditorController, e: {
+    key: string;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    altKey?: boolean;
+}): boolean;
 /** Q (no modifiers) toggles Quick Mask mode. Returns true when the key was used. */
 export declare function handleQuickMaskKey(controller: ImageEditorController, e: {
     key: string;

package/dist/image-editor/selection/layer-mask.d.cts

@@ -1,6 +1,12 @@
 import type { AdjustmentLayer, AdjustmentLayerMask } from '../types.cjs';
 import { type ImageProjection } from '../geometry.cjs';
 import { type SelectionMask } from './mask.cjs';
+import type { ImageLayer } from '../layers/model.cjs';
+/**
+ * A layer's painted mask over the `width × height` canvas as coverage (white = revealed), its
+ * pixels before density and feather; `null` without one (a depth mask is computed, not painted).
+ */
+export declare function layerMaskSelection(layer: ImageLayer, width: number, height: number): SelectionMask | null;
 /** Properties of a layer mask that leave its pixels intact (Photoshop's Properties › Masks). */
 export interface LayerMaskProps {
     /** 0..1 (default 1): at 0.5 the masked-out areas still get half of the adjustment. */

package/dist/image-editor/selection/layer-mask.d.ts

@@ -1,6 +1,12 @@
 import type { AdjustmentLayer, AdjustmentLayerMask } from '../types.js';
 import { type ImageProjection } from '../geometry.js';
 import { type SelectionMask } from './mask.js';
+import type { ImageLayer } from '../layers/model.js';
+/**
+ * A layer's painted mask over the `width × height` canvas as coverage (white = revealed), its
+ * pixels before density and feather; `null` without one (a depth mask is computed, not painted).
+ */
+export declare function layerMaskSelection(layer: ImageLayer, width: number, height: number): SelectionMask | null;
 /** Properties of a layer mask that leave its pixels intact (Photoshop's Properties › Masks). */
 export interface LayerMaskProps {
     /** 0..1 (default 1): at 0.5 the masked-out areas still get half of the adjustment. */

package/dist/image-editor/types.d.cts

@@ -314,6 +314,14 @@ export interface ImageEditorState {
     quickMask?: boolean;
     /** How the canvas shows the selection (view state; `quickMask` mirrors `'quickMask'`). */
     selectionDisplay?: 'ants' | 'quickMask' | 'none';
+    /**
+     * A layer mask shown on the canvas (view state, not saved): `gray` shows the mask alone in
+     * grey (Alt-click its thumbnail), `overlay` tints what it hides in red over the image (the \ key).
+     */
+    maskView?: {
+        layerId: string;
+        mode: 'gray' | 'overlay';
+    } | null;
     /**
      * Quick Mask mode: painting and fills without a layer edit the selection itself (white
      * selects, black deselects), shown as a tint. View state; the edits are undo steps.

package/dist/image-editor/types.d.ts

@@ -314,6 +314,14 @@ export interface ImageEditorState {
     quickMask?: boolean;
     /** How the canvas shows the selection (view state; `quickMask` mirrors `'quickMask'`). */
     selectionDisplay?: 'ants' | 'quickMask' | 'none';
+    /**
+     * A layer mask shown on the canvas (view state, not saved): `gray` shows the mask alone in
+     * grey (Alt-click its thumbnail), `overlay` tints what it hides in red over the image (the \ key).
+     */
+    maskView?: {
+        layerId: string;
+        mode: 'gray' | 'overlay';
+    } | null;
     /**
      * Quick Mask mode: painting and fills without a layer edit the selection itself (white
      * selects, black deselects), shown as a tint. View state; the edits are undo steps.

package/dist/paint-editor/index.cjs

@@ -7,7 +7,7 @@ var _chunkZ64NRDEHcjs = require('../chunk-Z64NRDEH.cjs');
 
 
 
-var _chunkJYV4R62Mcjs = require('../chunk-JYV4R62M.cjs');
+var _chunkT4U4O6DScjs = require('../chunk-T4U4O6DS.cjs');
 require('../chunk-A2IS7EHE.cjs');
 
 
@@ -1653,11 +1653,11 @@ function header(state, options) {
   return out;
 }
 function serializePaintDocument(state, options = {}) {
-  const { layers, assets } = _chunkJYV4R62Mcjs.serializeLayers.call(void 0, state.layers);
+  const { layers, assets } = _chunkT4U4O6DScjs.serializeLayers.call(void 0, state.layers);
   return { ...header(state, options), layers, assets };
 }
 async function serializePaintDocumentExternal(state, store, options = {}) {
-  const { layers, assets } = await _chunkJYV4R62Mcjs.serializeLayersExternal.call(void 0, state.layers, store);
+  const { layers, assets } = await _chunkT4U4O6DScjs.serializeLayersExternal.call(void 0, state.layers, store);
   return { ...header(state, options), layers, assets };
 }
 function paintLayersOnly(layers, problems) {
@@ -1694,7 +1694,7 @@ function deserializePaintDocument(raw) {
   const canvas = normalizeCanvas({ width: r.width, height: r.height, dpi: _nullishCoalesce(r.dpi, () => ( void 0)) });
   const paper = _chunkYQ5C5BVKcjs.normalizePaper.call(void 0, _nullishCoalesce(r.paper, () => ( {})));
   const assets = r.assets && typeof r.assets === "object" ? r.assets : {};
-  const layers = paintLayersOnly(_chunkJYV4R62Mcjs.deserializeLayers.call(void 0, r.layers, { assets, problems }), problems);
+  const layers = paintLayersOnly(_chunkT4U4O6DScjs.deserializeLayers.call(void 0, r.layers, { assets, problems }), problems);
   const wanted = typeof r.activeLayerId === "string" ? r.activeLayerId : null;
   const activeLayerId = wanted && _chunkHGTDMKNEcjs.findLayer.call(void 0, layers, wanted) ? wanted : _nullishCoalesce(_optionalChain([_chunkHGTDMKNEcjs.flattenLayers.call(void 0, layers), 'access', _70 => _70.filter, 'call', _71 => _71((l) => l.type === "pixel"), 'access', _72 => _72.pop, 'call', _73 => _73(), 'optionalAccess', _74 => _74.id]), () => ( null));
   const wetEvents = Array.isArray(r.wetEvents) ? r.wetEvents.filter((e) => e && typeof e === "object" && Number.isInteger(e.clock) && typeof e.kind === "string") : [];
@@ -1710,7 +1710,7 @@ async function deserializePaintDocumentAsync(raw, store) {
   if (!raw || typeof raw !== "object") throw new Error("Not a paint document: expected a JSON object.");
   const r = raw;
   const problems = [];
-  const assets = await _chunkJYV4R62Mcjs.resolveExternalAssets.call(void 0, _nullishCoalesce(r.assets, () => ( {})), store, problems);
+  const assets = await _chunkT4U4O6DScjs.resolveExternalAssets.call(void 0, _nullishCoalesce(r.assets, () => ( {})), store, problems);
   const loaded = deserializePaintDocument({ ...r, assets });
   return { ...loaded, problems: [...problems, ...loaded.problems] };
 }
@@ -5409,7 +5409,7 @@ var PaintEditorController = (_class10 = class _PaintEditorController {
       return next.type === "group" ? { ...next, children: toStandard(next.children) } : next;
     });
     const layers = toStandard(dried);
-    const result = _chunkJYV4R62Mcjs.exportPsd.call(void 0, { width, height, layers: [paperLayer, ...layers], merged, resolution: dpi });
+    const result = _chunkT4U4O6DScjs.exportPsd.call(void 0, { width, height, layers: [paperLayer, ...layers], merged, resolution: dpi });
     for (const [mode, names] of changed) {
       const label = _nullishCoalesce(_optionalChain([_chunkCWM3CUUXcjs.BLEND_MODES, 'access', _271 => _271.find, 'call', _272 => _272((m) => m.id === mode), 'optionalAccess', _273 => _273.label]), () => ( mode));
       const std = _nullishCoalesce(_optionalChain([_chunkCWM3CUUXcjs.BLEND_MODES, 'access', _274 => _274.find, 'call', _275 => _275((m) => m.id === _chunkCWM3CUUXcjs.standardBlendMode.call(void 0, mode)), 'optionalAccess', _276 => _276.label]), () => ( _chunkCWM3CUUXcjs.standardBlendMode.call(void 0, mode)));

package/dist/paint-editor/index.js

@@ -7,7 +7,7 @@ import {
   resolveExternalAssets,
   serializeLayers,
   serializeLayersExternal
-} from "../chunk-IGMNJM2H.js";
+} from "../chunk-7ZWLDVFH.js";
 import "../chunk-3CI7FRMK.js";
 import {
   EffectRendererPool

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pixerate/editor",
-  "version": "0.188.0",
+  "version": "0.190.0",
   "description": "UI-agnostic rich text and media editing core library",
   "author": "Pixerate",
   "license": "MIT",

package/skills/pixerate-image-editor/SKILL.md

@@ -297,6 +297,7 @@ in the source frame at the document's bit depth, colour mode and profile. Read
 | `add_layer_mask` | Mask any layer `from` `reveal-all`, `hide-all`, `selection`, `hide-selection` (its inverse) or `transparency` (the layer's own alpha), with optional `density` / `feather`. Replaces an existing mask. Returns the mask summary. |
 | `set_layer_mask_properties` | Change any layer mask's `density`, `feather`, `enabled` or `linked` (false: the mask stays put when the layer moves or transforms) without touching its pixels. |
 | `apply_layer_mask` | Bake a pixel layer's mask into its alpha and remove it. Destructive. |
+| `set_mask_view` | Show a layer's mask to check it (`view` `gray` alone, `overlay` red tint over what it hides, `off`; `layerId`, default active). View state only; look with `capture_view` `includeOverlays: true`, then `off`. Returns `{view, layerId}`. |
 | `remove_layer_mask` | Delete a mask without applying it; disable it instead to keep it. |
 | `layer_via_copy` | Copy the selected pixels of a pixel layer (default the active one) to a new layer above it; `cut: true` removes them from the source. Needs a selection. Returns the new layer. |
 | `rasterize_layer` | Turn a shape layer into a pixel layer showing the same pixels (same id, mask, effects, opacity, blend; the paths are gone), an annotation layer into pixels (browser only), a smart object into a pixel layer (as `rasterize_smart_object`), or bake a pixel layer's develop / blur filters into its pixels. Do it before painting over a shape or annotation, or when the user wants the filters fixed. Destructive. |
@@ -312,6 +313,12 @@ in the source frame at the document's bit depth, colour mode and profile. Read
 | `add_shape_component` | Add a live shape or path to a shape layer with `op` (`combine`, `subtract`, `intersect`, `exclude`), on top unless `index`. Use it for cut-outs, rings, badges. Returns the shape. |
 | `remove_shape_component` | Delete one component (not the last: delete the layer instead). Returns the shape. |
 | `merge_shape_components` | Merge Shape Components: the combined area becomes one plain component (live shapes become paths); the look does not change. Returns the shape. |
+| `get_vector_mask` | Read-only. A layer's vector mask: enabled, linked, inverted, fill rule, density, feather, bounds and components (subpaths in document px), or null. Read it before editing the path. |
+| `add_vector_mask` | Layer › Vector Mask on any layer but a shape: `from` `path` (a `shape`, `subpaths` or `components`, like `add_shape_layer`), `reveal-all` or `hide-all` (empty path). Reveals inside the path, sharp at any size; it combines with the raster mask. Returns the vector mask. |
+| `set_vector_mask_path` | Replace the vector mask's path (properties kept). Returns the vector mask. |
+| `set_vector_mask_properties` | `enabled`, `linked` (false: stays put when the layer moves), `inverted`, `density`, `feather` px; the path is kept. Returns the vector mask. |
+| `rasterize_vector_mask` | Multiply the path into the raster mask (adding one) and drop the vector mask, so it can be painted. Returns the mask summary. |
+| `remove_vector_mask` | Delete the vector mask (the raster mask stays). |
 | `convert_to_smart_object` | Convert sibling `layerIds` (default the active layer) to one smart object at the top one's position, optional `name`. One pixel layer keeps its id, look and properties (filters become smart filters); several layers, groups or adjustments nest as a layer document. Returns the `layer` and the `smartObject` summary. |
 | `rasterize_smart_object` | Turn a smart object into a pixel layer holding what it shows now (smart filters baked; same id, mask, effects, opacity, blend). Destructive: the contents and filters are gone. Returns the layer. |
 | `set_smart_object_transform` | Set a smart object's transform absolutely: `corners`, `matrix` (contents → document), or `scaleX` / `scaleY` (percent of the contents), `rotate`, `skewX`, `skewY`, `x`, `y` (where the contents' centre goes; unset numbers keep their values); `warp` preset or mesh in contents px, `null` removes it; `interpolation`. Re-renders from the contents. Returns `placement`, `masksMoved` and `bounds`. |