@pixerate/editor 0.183.0 → 0.186.0

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

@@ -474,7 +474,11 @@ export interface SmartObjectLayer extends LayerBase {
 export type ImageLayer = PixelLayer | AdjustmentLayerNode | GroupLayer | AnnotationLayer | SmartObjectLayer | ShapeLayer | TypeLayer;
 export type ImageLayerType = ImageLayer['type'];
 /** Which part of the active layer painting targets (`filter-mask`: a smart object's filter mask). */
-export type LayerTarget = 'pixels' | 'mask' | 'filter-mask';
+/**
+ * What a paint, fill or retouch writes: a layer's pixels, its mask, a smart object's filter mask,
+ * or (in Quick Mask mode) the selection itself (`quick-mask`, not a layer).
+ */
+export type LayerTarget = 'pixels' | 'mask' | 'filter-mask' | 'quick-mask';
 /** A fresh id with `prefix` (`layer`, `flt`, …). */
 export declare function newLayerId(prefix?: string): string;
 export type LayerLocation = RasterLayerLocation<ImageLayer>;

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

@@ -474,7 +474,11 @@ export interface SmartObjectLayer extends LayerBase {
 export type ImageLayer = PixelLayer | AdjustmentLayerNode | GroupLayer | AnnotationLayer | SmartObjectLayer | ShapeLayer | TypeLayer;
 export type ImageLayerType = ImageLayer['type'];
 /** Which part of the active layer painting targets (`filter-mask`: a smart object's filter mask). */
-export type LayerTarget = 'pixels' | 'mask' | 'filter-mask';
+/**
+ * What a paint, fill or retouch writes: a layer's pixels, its mask, a smart object's filter mask,
+ * or (in Quick Mask mode) the selection itself (`quick-mask`, not a layer).
+ */
+export type LayerTarget = 'pixels' | 'mask' | 'filter-mask' | 'quick-mask';
 /** A fresh id with `prefix` (`layer`, `flt`, …). */
 export declare function newLayerId(prefix?: string): string;
 export type LayerLocation = RasterLayerLocation<ImageLayer>;

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

@@ -139,7 +139,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.
+ * 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).
  */
 export declare function handlePaintShortcut(controller: ImageEditorController, e: ShortcutEvent): boolean;
 /** One pointer sample in document pixels. */

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

@@ -139,7 +139,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.
+ * 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).
  */
 export declare function handlePaintShortcut(controller: ImageEditorController, e: ShortcutEvent): boolean;
 /** One pointer sample in document pixels. */

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

@@ -6,6 +6,28 @@
 import type { ImageEditorController } from '../controller.cjs';
 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.
+ */
+export declare function maskThumbnailClick(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
+ * to the row (false).
+ */
+export declare function layerThumbnailClick(controller: ImageEditorController, layer: ImageLayer, e: {
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    shiftKey?: boolean;
+    altKey?: boolean;
+}): boolean;
 export interface LayerPanelRow {
     layer: ImageLayer;
     /** Nesting depth (0 = top level). */
@@ -34,7 +56,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' | '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-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

@@ -6,6 +6,28 @@
 import type { ImageEditorController } from '../controller.js';
 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.
+ */
+export declare function maskThumbnailClick(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
+ * to the row (false).
+ */
+export declare function layerThumbnailClick(controller: ImageEditorController, layer: ImageLayer, e: {
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    shiftKey?: boolean;
+    altKey?: boolean;
+}): boolean;
 export interface LayerPanelRow {
     layer: ImageLayer;
     /** Nesting depth (0 = top level). */
@@ -34,7 +56,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' | '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-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

@@ -8,6 +8,7 @@
  */
 import type { Annotation, CropBox, DepthMaskOptions, ImageTransform } from '../types.cjs';
 import type { SerializedSelection } from '../selection/mask.cjs';
+import type { SerializedAlphaChannel } from '../selection/channels.cjs';
 import type { SerializedColorMode, SerializedColorProfile } from '../color-management.cjs';
 import { type PsdSmartFilter, type EffectSmartFilter, type ImageEffectGenerator, type SmartContents, type ImageLayer, type LayerFilter, type LayerLocks, type ShapeComponent, type ShapePaint, type ShapeStroke, type ParagraphRun, type TextRun, type TypeLayer } from './model.cjs';
 import { type GlobalLight, type LayerEffect, type LayerEffects } from '../../raster/effects/model.cjs';
@@ -222,6 +223,8 @@ export interface SerializedLayeredImageEditorState {
     /** Blur migrated from a v1 / v2 document with adjustment layers (runs after the layers). */
     legacyOutputBlur?: number;
     selection?: SerializedSelection;
+    /** Alpha channels (saved selections), run-length encoded. */
+    channels?: SerializedAlphaChannel[];
     /** Global light for layer effects (missing = 120°, 30°). */
     globalLight?: GlobalLight;
     /** The document's patterns for pattern effects, each an RGBA PNG data URL. */

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

@@ -8,6 +8,7 @@
  */
 import type { Annotation, CropBox, DepthMaskOptions, ImageTransform } from '../types.js';
 import type { SerializedSelection } from '../selection/mask.js';
+import type { SerializedAlphaChannel } from '../selection/channels.js';
 import type { SerializedColorMode, SerializedColorProfile } from '../color-management.js';
 import { type PsdSmartFilter, type EffectSmartFilter, type ImageEffectGenerator, type SmartContents, type ImageLayer, type LayerFilter, type LayerLocks, type ShapeComponent, type ShapePaint, type ShapeStroke, type ParagraphRun, type TextRun, type TypeLayer } from './model.js';
 import { type GlobalLight, type LayerEffect, type LayerEffects } from '../../raster/effects/model.js';
@@ -222,6 +223,8 @@ export interface SerializedLayeredImageEditorState {
     /** Blur migrated from a v1 / v2 document with adjustment layers (runs after the layers). */
     legacyOutputBlur?: number;
     selection?: SerializedSelection;
+    /** Alpha channels (saved selections), run-length encoded. */
+    channels?: SerializedAlphaChannel[];
     /** Global light for layer effects (missing = 120°, 30°). */
     globalLight?: GlobalLight;
     /** The document's patterns for pattern effects, each an RGBA PNG data URL. */

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

@@ -0,0 +1,24 @@
+import type { PsdResource } from './file.cjs';
+/** An alpha channel as the PSD code reads and writes it: an 8-bit plane over the canvas. */
+export interface PsdAlphaChannel {
+    name: string;
+    /** `width × height` coverage, 255 = selected. */
+    data: Uint8Array;
+    /** `#rrggbb` overlay colour. */
+    color: string;
+    /** 0..1. */
+    opacity: number;
+    indicates: 'masked' | 'selected';
+}
+/** The image resources that name and describe `channels`. */
+export declare function alphaChannelResources(channels: readonly PsdAlphaChannel[]): PsdResource[];
+/**
+ * The alpha channels of a file: merged planes `first … channels − 1`, named from 1045 (or
+ * 1006), described by 1077. Spot colour channels (kind 2) are left out and reported.
+ */
+export declare function readAlphaChannels(planes: Uint8Array, header: {
+    width: number;
+    height: number;
+    depth: number;
+    channels: number;
+}, first: number, resource: (id: number) => Uint8Array | undefined, warn: (message: string) => void): PsdAlphaChannel[];

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

@@ -0,0 +1,24 @@
+import type { PsdResource } from './file.js';
+/** An alpha channel as the PSD code reads and writes it: an 8-bit plane over the canvas. */
+export interface PsdAlphaChannel {
+    name: string;
+    /** `width × height` coverage, 255 = selected. */
+    data: Uint8Array;
+    /** `#rrggbb` overlay colour. */
+    color: string;
+    /** 0..1. */
+    opacity: number;
+    indicates: 'masked' | 'selected';
+}
+/** The image resources that name and describe `channels`. */
+export declare function alphaChannelResources(channels: readonly PsdAlphaChannel[]): PsdResource[];
+/**
+ * The alpha channels of a file: merged planes `first … channels − 1`, named from 1045 (or
+ * 1006), described by 1077. Spot colour channels (kind 2) are left out and reported.
+ */
+export declare function readAlphaChannels(planes: Uint8Array, header: {
+    width: number;
+    height: number;
+    depth: number;
+    channels: number;
+}, first: number, resource: (id: number) => Uint8Array | undefined, warn: (message: string) => void): PsdAlphaChannel[];

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

@@ -1,4 +1,5 @@
 import { type ImageLayer, type SmartContents } from '../layers/model.cjs';
+import { type PsdAlphaChannel } from './channels.cjs';
 import { type GlobalLight } from '../../raster/effects/model.cjs';
 import { type EffectPattern } from '../../raster/effects/patterns.cjs';
 export interface PsdExportInput {
@@ -8,6 +9,8 @@ export interface PsdExportInput {
     layers: readonly ImageLayer[];
     /** The composite, `width × height` RGBA, written as the merged image. */
     merged: ArrayLike<number>;
+    /** Alpha channels, written as extra merged planes with their names and display info. */
+    alphaChannels?: readonly PsdAlphaChannel[];
     /** Pixels per inch (default 72). */
     resolution?: number;
     /** The document's patterns; those the effects use are embedded (built-in ones too). */

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

@@ -1,4 +1,5 @@
 import { type ImageLayer, type SmartContents } from '../layers/model.js';
+import { type PsdAlphaChannel } from './channels.js';
 import { type GlobalLight } from '../../raster/effects/model.js';
 import { type EffectPattern } from '../../raster/effects/patterns.js';
 export interface PsdExportInput {
@@ -8,6 +9,8 @@ export interface PsdExportInput {
     layers: readonly ImageLayer[];
     /** The composite, `width × height` RGBA, written as the merged image. */
     merged: ArrayLike<number>;
+    /** Alpha channels, written as extra merged planes with their names and display info. */
+    alphaChannels?: readonly PsdAlphaChannel[];
     /** Pixels per inch (default 72). */
     resolution?: number;
     /** The document's patterns; those the effects use are embedded (built-in ones too). */

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

@@ -1,3 +1,11 @@
+/**
+ * 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';
 import type { DocumentColorProfile } from '../color-management.cjs';
@@ -54,6 +62,8 @@ export interface PsdImportResult {
     };
     /** The bits per channel the layers keep: 16 or 32 for such files (not indexed or bitmap), else 8. */
     bitDepth: 8 | 16 | 32;
+    /** The file's alpha channels (saved selections), as 8-bit planes. */
+    alphaChannels?: PsdAlphaChannel[];
 }
 export interface PsdImportOptions {
     /** Makes layer ids (defaults to `psd-<n>`). */

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

@@ -1,3 +1,11 @@
+/**
+ * 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';
 import type { DocumentColorProfile } from '../color-management.js';
@@ -54,6 +62,8 @@ export interface PsdImportResult {
     };
     /** The bits per channel the layers keep: 16 or 32 for such files (not indexed or bitmap), else 8. */
     bitDepth: 8 | 16 | 32;
+    /** The file's alpha channels (saved selections), as 8-bit planes. */
+    alphaChannels?: PsdAlphaChannel[];
 }
 export interface PsdImportOptions {
     /** Makes layer ids (defaults to `psd-<n>`). */

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

@@ -174,6 +174,12 @@ export declare class ImageEditorRenderer {
     private publishHistogram;
     private quickMaskCache;
     private outlineCache;
+    private emptyMaskCache;
+    /** An empty selection of the image's size (Quick Mask mode with nothing selected). */
+    private emptyMask;
+    private overlayCache;
+    /** 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. */
     private drawQuickMask;
     /**

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

@@ -174,6 +174,12 @@ export declare class ImageEditorRenderer {
     private publishHistogram;
     private quickMaskCache;
     private outlineCache;
+    private emptyMaskCache;
+    /** An empty selection of the image's size (Quick Mask mode with nothing selected). */
+    private emptyMask;
+    private overlayCache;
+    /** 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. */
     private drawQuickMask;
     /**

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

@@ -0,0 +1,52 @@
+import { type SelectionMask, type SerializedSelection } from './mask.cjs';
+/**
+ * An alpha channel: a saved selection kept with the document (Select › Save Selection), shown
+ * as a tinted overlay when visible. Its mask is the selection's 8-bit coverage over the canvas
+ * (immutable, so undo steps share it).
+ */
+export interface AlphaChannel {
+    id: string;
+    name: string;
+    /** Coverage (255 = selected). An empty channel has a mask with `bounds: null`. */
+    mask: SelectionMask;
+    /** Overlay tint, `#rrggbb` (default red, the Quick Mask's). */
+    color: string;
+    /** Overlay opacity 0..1 (default 0.5). */
+    opacity: number;
+    /** Whether the tint covers the `masked` (unselected, default) or the `selected` area. */
+    indicates: 'masked' | 'selected';
+    /** Shown as an overlay on the canvas (default false). */
+    visible: boolean;
+}
+/** An alpha channel as stored in a document. */
+export interface SerializedAlphaChannel extends Omit<AlphaChannel, 'mask'> {
+    mask: SerializedSelection;
+}
+export declare const DEFAULT_CHANNEL_COLOR = "#ff0000";
+/** A summary of a channel for agents and panels (no pixels). */
+export declare function describeChannel(channel: AlphaChannel): {
+    bounds: import("../index.cjs").CropBox | null;
+    percent: number;
+    id: string;
+    name: string;
+    /** Overlay tint, `#rrggbb` (default red, the Quick Mask's). */
+    color: string;
+    /** Overlay opacity 0..1 (default 0.5). */
+    opacity: number;
+    /** Whether the tint covers the `masked` (unselected, default) or the `selected` area. */
+    indicates: "masked" | "selected";
+    /** Shown as an overlay on the canvas (default false). */
+    visible: boolean;
+};
+export declare function serializeChannels(channels: readonly AlphaChannel[]): SerializedAlphaChannel[];
+/** Restores stored channels, skipping (and reporting) damaged ones or ones of another size. */
+export declare function deserializeChannels(value: unknown, size: {
+    width: number;
+    height: number;
+}, problems?: string[]): AlphaChannel[];
+/** A channel's grey thumbnail (white = selected) as RGBA pixels, at most `maxSide` px. */
+export declare function channelThumbnail(channel: AlphaChannel, maxSide?: number): {
+    width: number;
+    height: number;
+    data: Uint8ClampedArray;
+};

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

@@ -0,0 +1,52 @@
+import { type SelectionMask, type SerializedSelection } from './mask.js';
+/**
+ * An alpha channel: a saved selection kept with the document (Select › Save Selection), shown
+ * as a tinted overlay when visible. Its mask is the selection's 8-bit coverage over the canvas
+ * (immutable, so undo steps share it).
+ */
+export interface AlphaChannel {
+    id: string;
+    name: string;
+    /** Coverage (255 = selected). An empty channel has a mask with `bounds: null`. */
+    mask: SelectionMask;
+    /** Overlay tint, `#rrggbb` (default red, the Quick Mask's). */
+    color: string;
+    /** Overlay opacity 0..1 (default 0.5). */
+    opacity: number;
+    /** Whether the tint covers the `masked` (unselected, default) or the `selected` area. */
+    indicates: 'masked' | 'selected';
+    /** Shown as an overlay on the canvas (default false). */
+    visible: boolean;
+}
+/** An alpha channel as stored in a document. */
+export interface SerializedAlphaChannel extends Omit<AlphaChannel, 'mask'> {
+    mask: SerializedSelection;
+}
+export declare const DEFAULT_CHANNEL_COLOR = "#ff0000";
+/** A summary of a channel for agents and panels (no pixels). */
+export declare function describeChannel(channel: AlphaChannel): {
+    bounds: import("../index.js").CropBox | null;
+    percent: number;
+    id: string;
+    name: string;
+    /** Overlay tint, `#rrggbb` (default red, the Quick Mask's). */
+    color: string;
+    /** Overlay opacity 0..1 (default 0.5). */
+    opacity: number;
+    /** Whether the tint covers the `masked` (unselected, default) or the `selected` area. */
+    indicates: "masked" | "selected";
+    /** Shown as an overlay on the canvas (default false). */
+    visible: boolean;
+};
+export declare function serializeChannels(channels: readonly AlphaChannel[]): SerializedAlphaChannel[];
+/** Restores stored channels, skipping (and reporting) damaged ones or ones of another size. */
+export declare function deserializeChannels(value: unknown, size: {
+    width: number;
+    height: number;
+}, problems?: string[]): AlphaChannel[];
+/** A channel's grey thumbnail (white = selected) as RGBA pixels, at most `maxSide` px. */
+export declare function channelThumbnail(channel: AlphaChannel, maxSide?: number): {
+    width: number;
+    height: number;
+    data: Uint8ClampedArray;
+};

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

@@ -4,14 +4,26 @@ import { type SelectionToolOptions } from './tool-options.cjs';
 export interface GestureModifiers {
     shiftKey?: boolean;
     altKey?: boolean;
+    /** The click count of a mouse event (2 on a double-click). */
+    detail?: number;
 }
+/** `point` moved onto the nearest 45° ray from `from` (Shift with the polygonal lasso). */
+export declare function snapTo45(from: ImagePoint, point: ImagePoint): ImagePoint;
 /**
  * Pointer gestures of the selection tools, shared by the React and Svelte image editors: feed
  * it pointer positions in natural image pixels (`canvasToImagePoint(..., false)`).
  *
  * - Magic wand: selects on `begin` (async, as it may read pixels).
+ * - Color Range: on `begin`, samples the colour under the pointer and selects every similar pixel
+ *   (with the modifiers, Shift-click adds a colour and Alt-click removes one, as the + and −
+ *   eyedroppers).
  * - Rectangle / ellipse: drag a box; a click without a drag deselects (replace mode).
  * - Lasso: drag a free-hand path, closed on `end`.
+ * - Polygonal lasso: each click adds a corner (Shift: on a 45° ray from the last one), dragging
+ *   adds a free-hand stretch; a double-click, a click on the first corner or Enter (`key`)
+ *   closes it, Backspace removes the last corner and Escape cancels. It stays `active` between
+ *   clicks, so feed it pointer moves without a button too.
+ * - Single row / column: a click selects a 1 px line across the image.
  *
  * Shift adds, Alt subtracts, both intersect (overriding the options bar mode). While dragging,
  * {@link draftPath} is the outline to show (`RenderOptions.draftSelectionPath`).
@@ -23,6 +35,12 @@ export declare class SelectionGesture {
     private points;
     private current;
     private modifiers;
+    /** Polygonal lasso corners while one is being drawn. */
+    private polygon;
+    private pressedAt;
+    private freehand;
+    /** A click this close to the first corner (natural pixels) closes a polygonal lasso. */
+    closeRadius: number;
     /** The last error (e.g. pixels unavailable for the wand), for the UI to show. */
     error: string | null;
     constructor(controller: ImageEditorController, getOptions: () => SelectionToolOptions);
@@ -32,9 +50,36 @@ export declare class SelectionGesture {
     /** Pointer down. Resolves once a wand click has been applied. */
     begin(point: ImagePoint, modifiers?: GestureModifiers): Promise<void>;
     /** Pointer move; returns true when the draft changed (re-render). */
-    move(point: ImagePoint): boolean;
+    move(point: ImagePoint, modifiers?: GestureModifiers): boolean;
     /** Pointer up: commits the shape. Returns true when the selection changed. */
     end(point?: ImagePoint, modifiers?: GestureModifiers): boolean;
-    /** Abandons a drag without changing the selection. */
+    /** Closes a polygonal lasso and selects it. Returns true when the selection changed. */
+    close(): boolean;
+    /**
+     * Keys for a polygonal lasso being drawn: Enter closes it, Escape cancels, Backspace / Delete
+     * removes the last corner. Returns true when the key was used (the host prevents its default).
+     */
+    key(key: string): boolean;
+    /** Abandons a drag (or a polygonal lasso) without changing the selection. */
     cancel(): void;
 }
+/**
+ * Edit shortcuts in select mode, as in Photoshop: Ctrl/⌘+C copies (with Shift, Copy Merged),
+ * Ctrl/⌘+X cuts, Ctrl/⌘+V pastes (with Shift, in place; with Alt+Shift, into the selection),
+ * Ctrl/⌘+D deselects, Ctrl/⌘+Shift+D reselects and Ctrl/⌘+Shift+I inverts. Returns true when
+ * the key was used (the host prevents its default); errors go to `onError`.
+ */
+export declare function handleSelectionShortcut(controller: ImageEditorController, e: {
+    key: string;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    shiftKey?: boolean;
+    altKey?: boolean;
+}, onError?: (message: string) => void): boolean;
+/** Q (no modifiers) toggles Quick Mask mode. Returns true when the key was used. */
+export declare function handleQuickMaskKey(controller: ImageEditorController, e: {
+    key: string;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    altKey?: boolean;
+}): boolean;

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

@@ -4,14 +4,26 @@ import { type SelectionToolOptions } from './tool-options.js';
 export interface GestureModifiers {
     shiftKey?: boolean;
     altKey?: boolean;
+    /** The click count of a mouse event (2 on a double-click). */
+    detail?: number;
 }
+/** `point` moved onto the nearest 45° ray from `from` (Shift with the polygonal lasso). */
+export declare function snapTo45(from: ImagePoint, point: ImagePoint): ImagePoint;
 /**
  * Pointer gestures of the selection tools, shared by the React and Svelte image editors: feed
  * it pointer positions in natural image pixels (`canvasToImagePoint(..., false)`).
  *
  * - Magic wand: selects on `begin` (async, as it may read pixels).
+ * - Color Range: on `begin`, samples the colour under the pointer and selects every similar pixel
+ *   (with the modifiers, Shift-click adds a colour and Alt-click removes one, as the + and −
+ *   eyedroppers).
  * - Rectangle / ellipse: drag a box; a click without a drag deselects (replace mode).
  * - Lasso: drag a free-hand path, closed on `end`.
+ * - Polygonal lasso: each click adds a corner (Shift: on a 45° ray from the last one), dragging
+ *   adds a free-hand stretch; a double-click, a click on the first corner or Enter (`key`)
+ *   closes it, Backspace removes the last corner and Escape cancels. It stays `active` between
+ *   clicks, so feed it pointer moves without a button too.
+ * - Single row / column: a click selects a 1 px line across the image.
  *
  * Shift adds, Alt subtracts, both intersect (overriding the options bar mode). While dragging,
  * {@link draftPath} is the outline to show (`RenderOptions.draftSelectionPath`).
@@ -23,6 +35,12 @@ export declare class SelectionGesture {
     private points;
     private current;
     private modifiers;
+    /** Polygonal lasso corners while one is being drawn. */
+    private polygon;
+    private pressedAt;
+    private freehand;
+    /** A click this close to the first corner (natural pixels) closes a polygonal lasso. */
+    closeRadius: number;
     /** The last error (e.g. pixels unavailable for the wand), for the UI to show. */
     error: string | null;
     constructor(controller: ImageEditorController, getOptions: () => SelectionToolOptions);
@@ -32,9 +50,36 @@ export declare class SelectionGesture {
     /** Pointer down. Resolves once a wand click has been applied. */
     begin(point: ImagePoint, modifiers?: GestureModifiers): Promise<void>;
     /** Pointer move; returns true when the draft changed (re-render). */
-    move(point: ImagePoint): boolean;
+    move(point: ImagePoint, modifiers?: GestureModifiers): boolean;
     /** Pointer up: commits the shape. Returns true when the selection changed. */
     end(point?: ImagePoint, modifiers?: GestureModifiers): boolean;
-    /** Abandons a drag without changing the selection. */
+    /** Closes a polygonal lasso and selects it. Returns true when the selection changed. */
+    close(): boolean;
+    /**
+     * Keys for a polygonal lasso being drawn: Enter closes it, Escape cancels, Backspace / Delete
+     * removes the last corner. Returns true when the key was used (the host prevents its default).
+     */
+    key(key: string): boolean;
+    /** Abandons a drag (or a polygonal lasso) without changing the selection. */
     cancel(): void;
 }
+/**
+ * Edit shortcuts in select mode, as in Photoshop: Ctrl/⌘+C copies (with Shift, Copy Merged),
+ * Ctrl/⌘+X cuts, Ctrl/⌘+V pastes (with Shift, in place; with Alt+Shift, into the selection),
+ * Ctrl/⌘+D deselects, Ctrl/⌘+Shift+D reselects and Ctrl/⌘+Shift+I inverts. Returns true when
+ * the key was used (the host prevents its default); errors go to `onError`.
+ */
+export declare function handleSelectionShortcut(controller: ImageEditorController, e: {
+    key: string;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    shiftKey?: boolean;
+    altKey?: boolean;
+}, onError?: (message: string) => void): boolean;
+/** Q (no modifiers) toggles Quick Mask mode. Returns true when the key was used. */
+export declare function handleQuickMaskKey(controller: ImageEditorController, e: {
+    key: string;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    altKey?: boolean;
+}): boolean;

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

@@ -8,3 +8,5 @@ export * from './overlay.cjs';
 export * from './tool-options.cjs';
 export * from './gesture.cjs';
 export * from './segmentation.cjs';
+export * from './stroke.cjs';
+export * from './channels.cjs';

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

@@ -8,3 +8,5 @@ export * from './overlay.js';
 export * from './tool-options.js';
 export * from './gesture.js';
 export * from './segmentation.js';
+export * from './stroke.js';
+export * from './channels.js';

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

@@ -31,7 +31,8 @@ export declare function greyMorphology(src: ArrayLike<number>, w: number, h: num
  * use one morphology, the remainder blends with the next pixel, so 0.3 px differs from 1 px.
  */
 export declare function shiftCoverage(src: ArrayLike<number>, w: number, h: number, amount: number): Float32Array;
-export type SelectionModifyOp = 'grow' | 'shrink' | 'feather' | 'border' | 'smooth';
+/** `expand` / `contract` are Photoshop's names; `grow` / `shrink` are the same operations, kept as aliases. */
+export type SelectionModifyOp = 'expand' | 'contract' | 'grow' | 'shrink' | 'feather' | 'border' | 'smooth';
 export declare const SELECTION_MODIFY_OPS: readonly SelectionModifyOp[];
-/** Select › Modify (grow = Expand, shrink = Contract, feather, border, smooth) by `radius` pixels. */
+/** Select › Modify (expand, contract, feather, border, smooth; grow and shrink are aliases) by `radius` pixels. */
 export declare function modifySelection(mask: SelectionMask, op: SelectionModifyOp, radius: number): SelectionMask;

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

@@ -31,7 +31,8 @@ export declare function greyMorphology(src: ArrayLike<number>, w: number, h: num
  * use one morphology, the remainder blends with the next pixel, so 0.3 px differs from 1 px.
  */
 export declare function shiftCoverage(src: ArrayLike<number>, w: number, h: number, amount: number): Float32Array;
-export type SelectionModifyOp = 'grow' | 'shrink' | 'feather' | 'border' | 'smooth';
+/** `expand` / `contract` are Photoshop's names; `grow` / `shrink` are the same operations, kept as aliases. */
+export type SelectionModifyOp = 'expand' | 'contract' | 'grow' | 'shrink' | 'feather' | 'border' | 'smooth';
 export declare const SELECTION_MODIFY_OPS: readonly SelectionModifyOp[];
-/** Select › Modify (grow = Expand, shrink = Contract, feather, border, smooth) by `radius` pixels. */
+/** Select › Modify (expand, contract, feather, border, smooth; grow and shrink are aliases) by `radius` pixels. */
 export declare function modifySelection(mask: SelectionMask, op: SelectionModifyOp, radius: number): SelectionMask;

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

@@ -10,6 +10,8 @@ export interface QuickMaskStyle {
     color?: readonly [number, number, number];
     /** 0..1 (default 0.5): opacity over fully unselected pixels. */
     opacity?: number;
+    /** Tint the unselected area (`masked`, default) or the selected area (`selected`). */
+    indicates?: 'masked' | 'selected';
 }
 /**
  * Quick Mask view: RGBA pixels (natural image size) tinting the *unselected* area, so the