@thatopen/components 3.3.3 → 3.4.1

package/dist/index.d.ts

@@ -33,6 +33,223 @@ declare class AmbientLightConfig {
     set intensity(value: number);
 }
 
+export declare interface AngleAnnotation {
+    /** Unique identifier. */
+    uuid: string;
+    /** Snapped point on the first line — defines the first ray direction from the vertex. */
+    pointA: THREE.Vector3;
+    /** Computed intersection of the two measured lines. */
+    vertex: THREE.Vector3;
+    /** Snapped point on the second line — defines the second ray direction from the vertex. */
+    pointB: THREE.Vector3;
+    /** Radius of the arc at commit time, in drawing local units. */
+    arcRadius: number;
+    /**
+     * When `true`, the arc measures the reflex angle (360° − interior).
+     * The arc is drawn going the long way around and the bisector flips 180°.
+     */
+    flipped?: boolean;
+    /** Name of the {@link AngleAnnotationStyle} to use when rendering. */
+    style: string;
+}
+
+/** Editable fields of {@link AngleAnnotation} — everything except the `uuid`. */
+export declare type AngleAnnotationData = Omit<AngleAnnotation, "uuid">;
+
+export declare type AngleAnnotationEvent = 
+/**
+* A point was clicked. Carries `drawing` so the machine caches it on the first
+* click — subsequent events reuse that context.
+* `line` is required in `awaitingFirstLine` and `awaitingSecondLine`;
+* free-space clicks are accepted in `positioningArc`.
+*/
+    {
+    type: "CLICK";
+    point: THREE.Vector3;
+    line?: THREE.Line3;
+    drawing?: TechnicalDrawing;
+}
+/** Cursor moved — drawing context already cached from the initial CLICK. */
+| {
+    type: "MOUSE_MOVE";
+    point: THREE.Vector3;
+    line?: THREE.Line3;
+}
+/** Cancel and return to the initial state. */
+| {
+    type: "ESCAPE";
+};
+
+/** Global drawing system that manages angle dimension annotations across all {@link TechnicalDrawing} instances. */
+export declare class AngleAnnotations extends AnnotationSystem<AngleAnnotationSystem> implements Transitionable<AngleAnnotationState, AngleAnnotationEvent>, Disposable_2 {
+    enabled: boolean;
+    readonly _item: AngleAnnotation;
+    machineState: AngleAnnotationState;
+    readonly onMachineStateChanged: Event_2<AngleAnnotationState>;
+    private _secondLinePreviewObject;
+    constructor(components: Components);
+    pickHandle(_drawing: TechnicalDrawing, _ray: THREE.Ray, _threshold?: number): {
+        uuid: string;
+        handle: "pointA" | "vertex" | "pointB";
+    } | null;
+    sendMachineEvent(event: AngleAnnotationEvent): void;
+    protected _buildGroup(dim: AngleAnnotation, style: AngleAnnotationStyle): THREE.Group;
+    protected _updatePreview(): void;
+    protected _onDispose(): void;
+    private _resetMachine;
+    private _clearSecondLinePreview;
+    private _updateSecondLinePreview;
+}
+
+export declare type AngleAnnotationState = 
+/** Waiting for the user to click the first measured line. */
+    {
+    kind: "awaitingFirstLine";
+}
+/** First line picked. Waiting for the second line. */
+| {
+    kind: "awaitingSecondLine";
+    line1: THREE.Line3;
+    pointA: THREE.Vector3;
+}
+/**
+* Both lines picked, vertex computed. User moves the cursor to set the
+* arc radius, then clicks to commit.
+*/
+| {
+    kind: "positioningArc";
+    pointA: THREE.Vector3;
+    vertex: THREE.Vector3;
+    pointB: THREE.Vector3;
+    cursor: THREE.Vector3 | null;
+    flipped: boolean;
+}
+/** Annotation just committed. */
+| {
+    kind: "committed";
+    dimension: AngleAnnotation;
+};
+
+export declare interface AngleAnnotationStyle extends BaseAnnotationStyle {
+    /** Tick mark builder at each end of the arc. */
+    lineTick: LineTickBuilder;
+    /**
+     * Optional filled tick mark builder. When provided, a `THREE.Mesh` triangle
+     * is rendered at each arc endpoint. Set `tick` to {@link NoTick} when you
+     * only want the filled shape.
+     */
+    meshTick?: MeshTickBuilder;
+    /** Tick size in drawing local units. */
+    tickSize: number;
+    /** Gap between the vertex and the start of each extension line. */
+    extensionGap: number;
+    /** Distance from the arc to the text label, along the bisector ray. */
+    textOffset: number;
+}
+
+declare interface AngleAnnotationSystem {
+    item: AngleAnnotation;
+    data: AngleAnnotationData;
+    style: AngleAnnotationStyle;
+    handle: "pointA" | "vertex" | "pointB";
+}
+
+/** Pure state transition function for the angle dimension tool. */
+export declare function angleDimensionMachine(state: AngleAnnotationState, event: AngleAnnotationEvent): AngleAnnotationState;
+
+/** A single annotation entry stored in {@link DrawingAnnotations}, bundling the owning system, the annotation data, and its Three.js group. */
+export declare interface AnnotationEntry {
+    /** The system that created and owns this annotation. */
+    system: AnnotationSystem<any>;
+    /** The persisted annotation data (e.g. {@link LinearAnnotation}). */
+    data: unknown;
+    /** The Three.js group added to {@link TechnicalDrawing.three}. */
+    three: THREE.Group;
+}
+
+/**
+ * Abstract base for all annotation sub-systems operating on a {@link TechnicalDrawing}.
+ * @typeParam TSystem - A {@link DrawingSystemDescriptor} that declares the item, data, style, and handle types for this specific system.
+ */
+declare abstract class AnnotationSystem<TSystem extends DrawingSystemDescriptor> {
+    protected readonly _components: Components;
+    /* Excluded from this release type: _item */
+    constructor(_components: Components);
+    abstract enabled: boolean;
+    readonly styles: FRAGS.DataMap<string, TSystem["style"]>;
+    activeStyle: string;
+    readonly onCommit: Event_2<{
+        drawing: TechnicalDrawing;
+        item: TSystem["item"];
+        group: THREE.Group;
+    }[]>;
+    readonly onUpdate: Event_2<{
+        item: TSystem["item"];
+        group: THREE.Group;
+    }>;
+    readonly onDelete: Event_2<string[]>;
+    readonly onDisposed: Event_2<void>;
+    protected readonly _knownDrawings: Set<TechnicalDrawing>;
+    protected readonly _previewMaterial: THREE.LineBasicMaterial;
+    protected _previewObject: THREE.LineSegments | null;
+    protected _previewDrawing: TechnicalDrawing | null;
+    protected readonly _materialCache: FRAGS.DataMap<string, THREE.LineBasicMaterial>;
+    protected readonly _meshMaterialCache: FRAGS.DataMap<string, THREE.MeshBasicMaterial>;
+    /**
+     * When `true` (default), {@link _disposeGroup} and {@link _redraw} will call
+     * `.dispose()` on each child's `BufferGeometry`. Set to `false` in systems
+     * where geometry is shared across multiple groups (e.g. {@link BlockAnnotations}).
+     */
+    protected _ownsChildGeometry: boolean;
+    /**
+     * Build and return a `THREE.Group` containing all geometry for `item`.
+     * The group's own `userData` is set by the base class after this call.
+     * Set `userData` on *children* (e.g. `ls.userData.isDimension = true`) here.
+     */
+    protected abstract _buildGroup(item: TSystem["item"], style: TSystem["style"]): THREE.Group;
+    /**
+     * Return the closest pickable handle on `drawing` for the given world-space
+     * `ray`, or `null` if nothing is within `threshold` units.
+     */
+    abstract pickHandle(drawing: TechnicalDrawing, ray: THREE.Ray, threshold?: number): {
+        uuid: string;
+        handle: TSystem["handle"];
+    } | null;
+    /** Called synchronously after a group is first persisted or redrawn. */
+    protected _onAfterPersist(_item: TSystem["item"], _group: THREE.Group): void;
+    /** Called at the start of {@link dispose} before materials and events are torn down. */
+    protected _onDispose(): void;
+    /** Override to rebuild preview geometry after a state transition. */
+    protected _updatePreview(): void;
+    get(drawings: TechnicalDrawing[]): FRAGS.DataMap<string, {
+        drawingUuid: string;
+        item: TSystem["item"];
+    }>;
+    add(drawing: TechnicalDrawing, data: TSystem["data"]): TSystem["item"];
+    update(drawing: TechnicalDrawing, uuids: string[], changes: Partial<TSystem["data"]>): void;
+    pick(ray: THREE.Ray, threshold?: number): string | null;
+    delete(drawing: TechnicalDrawing, uuids: string[]): void;
+    clear(drawings?: TechnicalDrawing[]): void;
+    dispose(): void;
+    protected _trackDrawing(drawing: TechnicalDrawing): void;
+    protected _resolveStyle(styleName: string): TSystem["style"];
+    protected _getMaterial(styleName: string): THREE.LineBasicMaterial;
+    protected _getMeshMaterial(styleName: string): THREE.MeshBasicMaterial;
+    protected _disposeGroup(group: THREE.Group): void;
+    protected _clearPreview(): void;
+    protected _persist(drawing: TechnicalDrawing, item: TSystem["item"]): {
+        drawing: TechnicalDrawing;
+        item: TSystem["item"];
+        group: THREE.Group;
+    };
+    protected _redraw(item: TSystem["item"], group: THREE.Group): void;
+}
+export { AnnotationSystem }
+export { AnnotationSystem as DrawingSystem }
+
+/** Closed arrowhead tick — two wing lines plus a base line connecting them. */
+export declare const ArrowTick: LineTickBuilder;
+
 /**
  * Simple event handler by [Jason Kleban](https://gist.github.com/JasonKleban/50cee44960c225ac1993c922563aa540). Keep in mind that if you want to remove it later, you might want to declare the callback as an object. If you want to maintain the reference to `this`, you will need to declare the callback as an arrow function.
  */
@@ -66,6 +283,17 @@ export declare class AsyncEvent<T> {
     private handlers;
 }
 
+/** Minimal interface for a translate-only gizmo that can be configured and attached to one of the helper's control handles. */
+export declare interface AxisGizmoLike {
+    attach(object: THREE.Object3D): void;
+    setSpace(space: "world" | "local"): void;
+    getHelper(): THREE.Object3D;
+    showX: boolean;
+    showY: boolean;
+    showZ: boolean;
+    addEventListener(type: string, listener: () => void): void;
+}
+
 /**
  * Base class of the library. Useful for finding out the interfaces something implements.
  */
@@ -86,6 +314,21 @@ export declare abstract class Base {
     isSerializable: () => this is Serializable<any, Record<string, any>>;
 }
 
+/** Minimum style contract shared by every annotation system. */
+export declare interface BaseAnnotationStyle {
+    /** Line and text color as a hex number (e.g. `0xff0000`). */
+    color: number;
+    /** Distance from the annotation geometry to the text label in drawing local units. */
+    textOffset: number;
+    /** Font size of the text label in drawing local units. */
+    fontSize: number;
+    /**
+     * Unit used to format measured values in text labels.
+     * Defaults to {@link Units.m} (metres) when not set.
+     */
+    unit?: DimensionUnit;
+}
+
 /**
  * Abstract class representing a camera in a 3D world. All cameras should use this class as a base.
  */
@@ -567,6 +810,100 @@ export declare interface BCFViewpoint {
     bitmaps?: ViewpointBitmap[];
 }
 
+/** Global drawing system that manages block insertions across all {@link TechnicalDrawing} instances. */
+export declare class BlockAnnotations extends AnnotationSystem<BlockAnnotationsSystem> implements Disposable_2 {
+    enabled: boolean;
+    readonly _item: BlockInsertion;
+    protected _ownsChildGeometry: boolean;
+    /**
+     * Named block definitions in block-local XZ space.
+     * Register via {@link define}. Geometry is shared across all drawings and insertions.
+     */
+    readonly definitions: FRAGS.DataMap<string, BlockDefinition>;
+    /**
+     * A **block** is a named, reusable geometry definition (e.g. a furniture symbol
+     * or a detail imported from a DXF). Multiple insertions of the same block share
+     * the same `THREE.BufferGeometry`, so only the transform (position, rotation,
+     * scale) differs per instance.
+     *
+     * Register via {@link TechnicalDrawings.use}:
+     * ```ts
+     * const blocks = techDrawings.use(BlockAnnotations);
+     * ```
+     *
+     * Typical workflow:
+     * ```ts
+     * // 1. Project external geometry to drawing space
+     * const projected = TechnicalDrawing.toDrawingSpace(ifcLines, drawing);
+     *
+     * // 2. Register the block definition (global — do this once)
+     * blocks.define("CHAIR", { lines: projected.geometry });
+     *
+     * // 3. Insert on any drawing
+     * blocks.add(drawing, { blockName: "CHAIR", position, rotation: 0, scale: 1, style: "default" });
+     * ```
+     */
+    constructor(components: Components);
+    pickHandle(_drawing: TechnicalDrawing, _ray: THREE.Ray, _threshold?: number): {
+        uuid: string;
+        handle: "position" | "rotation" | "scale";
+    } | null;
+    /**
+     * Overrides the base `pick` to use the correct `LineSegments.raycast` (pair-based)
+     * rather than `THREE.Line.prototype.raycast` (continuous-line).
+     */
+    pick(ray: THREE.Ray, threshold?: number): string | null;
+    /**
+     * Registers a block definition by name (global — not tied to any drawing).
+     * All geometry must be in block-local XZ space (Y = 0).
+     * Use {@link TechnicalDrawing.toDrawingSpace} to project external geometry first.
+     *
+     * Replaces any existing definition with the same name without disposing the old geometry.
+     */
+    define(name: string, definition: BlockDefinition): void;
+    protected _buildGroup(ins: BlockInsertion, _style: BlockStyle): THREE.Group;
+    protected _onAfterPersist(ins: BlockInsertion, group: THREE.Group): void;
+    protected _onDispose(): void;
+}
+
+declare interface BlockAnnotationsSystem {
+    item: BlockInsertion;
+    data: BlockInsertionData;
+    style: BlockStyle;
+    handle: "position" | "rotation" | "scale";
+}
+
+/** The geometry content of a named block. At least one of `lines` or `mesh` must be provided. */
+export declare interface BlockDefinition {
+    /** Line geometry for `LineSegments`. */
+    lines?: THREE.BufferGeometry;
+    /** Triangle geometry for a filled `THREE.Mesh`. */
+    mesh?: THREE.BufferGeometry;
+}
+
+/** A single placed instance of a named block definition. */
+export declare interface BlockInsertion {
+    /** Unique identifier for this insertion. */
+    uuid: string;
+    /** Name of the block definition to draw. Must be registered via {@link BlockAnnotations.define}. */
+    blockName: string;
+    /** Insertion point in drawing local space (Y is ignored — always 0). */
+    position: THREE.Vector3;
+    /** Rotation around the Y axis in radians. */
+    rotation: number;
+    /** Uniform scale applied to the block geometry. */
+    scale: number;
+    /** Style name — references a {@link BlockStyle} registered on the system. */
+    style: string;
+}
+
+/** Editable fields of {@link BlockInsertion} — everything except the `uuid`. */
+export declare type BlockInsertionData = Omit<BlockInsertion, "uuid">;
+
+/** Style for a {@link BlockAnnotations} system. */
+export declare interface BlockStyle extends BaseAnnotationStyle {
+}
+
 export declare interface BooleanSettingsControl {
     type: "Boolean";
     value: boolean;
@@ -634,6 +971,188 @@ export declare class BoundingBoxer extends Component implements Disposable_2 {
     }>;
 }
 
+/**
+ * Builds the flat vertex positions for a single committed angle dimension.
+ */
+export declare function buildAnglePositions(dim: AngleAnnotation, style: AngleAnnotationStyle): number[];
+
+/** Builds vertex positions for the live preview during `positioningArc`. */
+export declare function buildAnglePreviewPositions(pointA: THREE.Vector3, vertex: THREE.Vector3, pointB: THREE.Vector3, cursor: THREE.Vector3 | null, style: AngleAnnotationStyle, flipped?: boolean): number[];
+
+/** Builds the flat vertex positions for a committed callout annotation. */
+export declare function buildCalloutPositions(ann: CalloutAnnotation, style: CalloutAnnotationStyle): number[];
+
+/** Builds vertex positions for the live preview during interactive placement. */
+export declare function buildCalloutPreviewPositions(kind: "awaitingRadius" | "awaitingElbow" | "awaitingExtension", center: THREE.Vector3, halfW: number, halfH: number, elbow: THREE.Vector3 | null, cursor: THREE.Vector3 | null, style: CalloutAnnotationStyle): number[];
+
+/** Builds the flat vertex positions (x,y,z triplets) for a single committed linear dimension. */
+export declare function buildDimensionPositions(dim: LinearAnnotation, style: LinearAnnotationStyle): number[];
+
+/** Builds an array of {@link LinearAnnotation}s from consecutive point pairs, all sharing the same perpendicular offset. */
+export declare function buildDimensions(points: THREE.Vector3[], offset: number): LinearAnnotation[];
+
+/**
+ * Builds the flat vertex positions for a committed leader annotation.
+ */
+export declare function buildLeaderPositions(ann: LeaderAnnotation, style: LeaderAnnotationStyle): number[];
+
+/**
+ * Builds vertex positions for the live preview.
+ */
+export declare function buildLeaderPreviewPositions(kind: "placingElbow" | "placingExtension", arrowTip: THREE.Vector3, elbow: THREE.Vector3 | null, cursor: THREE.Vector3 | null, style: LeaderAnnotationStyle): number[];
+
+/** Builds the flat vertex positions for a live dimension preview. */
+export declare function buildPreviewPositions(kind: "placingPoints" | "positioningOffset", points: THREE.Vector3[], cursor: THREE.Vector3 | null, style: LinearAnnotationStyle): number[];
+
+/**
+ * Builds the `LineSegments` position array for a committed slope annotation.
+ * @returns A flat `Float32Array` of XYZ triplets (vertex pairs for `LineSegments`).
+ */
+export declare function buildSlopePositions(ann: SlopeAnnotation, style: SlopeAnnotationStyle): Float32Array;
+
+/** The committed data for a single callout annotation. */
+export declare interface CalloutAnnotation {
+    /** Unique identifier. */
+    uuid: string;
+    /** Centre of the enclosure shape. */
+    center: THREE.Vector3;
+    /** Half-width of the enclosure along the X axis. */
+    halfW: number;
+    /** Half-height of the enclosure along the Z axis. */
+    halfH: number;
+    /** Elbow — the bend between the extension line and its horizontal run. */
+    elbow: THREE.Vector3;
+    /** End of the horizontal extension line — anchor for the text label. */
+    extensionEnd: THREE.Vector3;
+    /** The annotation text. */
+    text: string;
+    /** Name of the {@link CalloutAnnotationStyle} to use when rendering. */
+    style: string;
+}
+
+/** Editable fields of {@link CalloutAnnotation} — everything except `uuid`. */
+export declare type CalloutAnnotationData = Omit<CalloutAnnotation, "uuid">;
+
+export declare type CalloutAnnotationEvent = 
+/** A point in drawing local space was clicked. */
+    {
+    type: "CLICK";
+    point: THREE.Vector3;
+    drawing?: TechnicalDrawing;
+}
+/** The cursor moved to a new position in drawing local space. */
+| {
+    type: "MOUSE_MOVE";
+    point: THREE.Vector3;
+    drawing?: TechnicalDrawing;
+}
+/**
+* Consumer supplies the annotation text after the machine enters
+* `enteringText`. Ignored in all other states.
+*/
+| {
+    type: "SUBMIT_TEXT";
+    text: string;
+}
+/** Cancel the current operation and return to the initial state. */
+| {
+    type: "ESCAPE";
+};
+
+/** Pure state transition function for the callout annotation tool. */
+export declare function calloutAnnotationMachine(state: CalloutAnnotationState, event: CalloutAnnotationEvent): CalloutAnnotationState;
+
+/** Global drawing system that manages callout annotations across all {@link TechnicalDrawing} instances. */
+export declare class CalloutAnnotations extends AnnotationSystem<CalloutAnnotationSystem> implements Transitionable<CalloutAnnotationState, CalloutAnnotationEvent>, Disposable_2 {
+    enabled: boolean;
+    readonly _item: CalloutAnnotation;
+    machineState: CalloutAnnotationState;
+    readonly onMachineStateChanged: Event_2<CalloutAnnotationState>;
+    constructor(components: Components);
+    pickHandle(_drawing: TechnicalDrawing, _ray: THREE.Ray, _threshold?: number): {
+        uuid: string;
+        handle: string;
+    } | null;
+    sendMachineEvent(event: CalloutAnnotationEvent): void;
+    protected _buildGroup(ann: CalloutAnnotation, style: CalloutAnnotationStyle): THREE.Group;
+    protected _updatePreview(): void;
+    private _resetMachine;
+}
+
+export declare type CalloutAnnotationState = 
+/** Waiting for the user to click the enclosure centre. */
+    {
+    kind: "awaitingCenter";
+}
+/**
+* Centre placed. User moves the cursor to the SE corner of the enclosure
+* to define its half-width (X) and half-height (Z) simultaneously.
+*/
+| {
+    kind: "awaitingRadius";
+    center: THREE.Vector3;
+    cursor: THREE.Vector3 | null;
+}
+/** Size set. User clicks to place the line elbow. */
+| {
+    kind: "awaitingElbow";
+    center: THREE.Vector3;
+    halfW: number;
+    halfH: number;
+    cursor: THREE.Vector3 | null;
+}
+/** Elbow set. User clicks the extension endpoint. */
+| {
+    kind: "awaitingExtension";
+    center: THREE.Vector3;
+    halfW: number;
+    halfH: number;
+    elbow: THREE.Vector3;
+    cursor: THREE.Vector3 | null;
+}
+/**
+* All geometry is set. Paused waiting for the consumer to supply the text
+* via a `SUBMIT_TEXT` event.
+*/
+| {
+    kind: "enteringText";
+    center: THREE.Vector3;
+    halfW: number;
+    halfH: number;
+    elbow: THREE.Vector3;
+    extensionEnd: THREE.Vector3;
+}
+/** Annotation just committed. */
+| {
+    kind: "committed";
+    annotation: CalloutAnnotation;
+};
+
+/** Visual appearance of a callout annotation. */
+export declare interface CalloutAnnotationStyle extends BaseAnnotationStyle {
+    /** The enclosure shape builder (cloud, rectangle, circle). */
+    enclosure: EnclosureBuilder;
+    /** Size of the optional tick at the extension end in drawing local units. */
+    tickSize: number;
+    /**
+     * Line-segment tick at the extension end — included in the same `LineSegments`
+     * as the extension line. Omit to suppress.
+     */
+    lineTick?: LineTickBuilder;
+    /**
+     * Filled (mesh) tick at the extension end — rendered as a separate `THREE.Mesh`.
+     * Can be combined with `tick`.
+     */
+    meshTick?: MeshTickBuilder;
+}
+
+declare interface CalloutAnnotationSystem {
+    item: CalloutAnnotation;
+    data: CalloutAnnotationData;
+    style: CalloutAnnotationStyle;
+    handle: string;
+}
+
 /**
  * Whether a camera uses the Camera Controls library.
  */
@@ -650,6 +1169,9 @@ export declare interface CameraControllable {
  */
 export declare type CameraProjection = "Perspective" | "Orthographic";
 
+/** Elliptical enclosure — an ellipse approximated with line segments centred on `center`. */
+export declare const CircleEnclosure: EnclosureBuilder;
+
 /**
  * Represents the data structure for a classification group.
  */
@@ -1001,6 +1523,9 @@ declare type ClipperConfigType = {
     size: NumberSettingControl;
 };
 
+/** Revision-cloud enclosure — a bumpy rectangle centred on `center`. */
+export declare const CloudEnclosure: EnclosureBuilder;
+
 export declare interface ColorSettingsControl {
     type: "Color";
     value: THREE.Color;
@@ -1142,6 +1667,24 @@ export declare class Components implements Disposable_2 {
     private static setupBVH;
 }
 
+/**
+ * Computes a local-to-world transformation matrix that maps a technical drawing's local coordinate system onto a target plane in 3D world space.
+ * @throws If either set of points is collinear (cannot define a plane).
+ * @throws If either set contains a degenerate first pair (zero distance).
+ * @param drawingPoints - Three non-collinear points in drawing local space.
+ * @param worldPoints   - Three corresponding non-collinear points in world space.
+ */
+export declare function computeAlignmentMatrix(drawingPoints: THREE.Vector3[], worldPoints: THREE.Vector3[]): THREE.Matrix4;
+
+/** Returns the angle in radians between the two rays defined by the dimension. */
+export declare function computeAngle(dim: AngleAnnotation): number;
+
+/** Returns the angle (in radians, in the XZ plane) of the bisector ray between the two measured rays. */
+export declare function computeBisectorAngle(dim: AngleAnnotation): number;
+
+/** Computes the signed offset from a cursor position to the measurement axis defined by the first and last points. */
+export declare function computeOffset(points: THREE.Vector3[], cursor: THREE.Vector3): number;
+
 /**
  * A tool to manage all the configuration from the app centrally. 📘 [API](https://docs.thatopen.com/api/@thatopen/components/classes/ConfigManager).
  */
@@ -1421,6 +1964,17 @@ export declare class DataSet<T> extends Set<T> {
     dispose(): void;
 }
 
+/** Diagonal slash tick (architectural style). */
+export declare const DiagonalTick: LineTickBuilder;
+
+/** Defines how a measured value (in drawing-space metres) is converted to a display string. */
+export declare interface DimensionUnit {
+    /** Multiplier applied to the raw metre value before display. */
+    factor: number;
+    /** Label appended to the formatted number (e.g. `"cm"`, `"mm"`, `"ft"`). */
+    suffix: string;
+}
+
 declare class DirectionalLightConfig {
     private _list;
     private _scene;
@@ -1558,6 +2112,681 @@ export declare interface DocumentReference {
     description?: string;
 }
 
+/** Dot tick — a small circle drawn with line segments at the endpoint. */
+export declare const DotTick: LineTickBuilder;
+
+/** Flat annotation store for a {@link TechnicalDrawing}, keyed by UUID. */
+export declare class DrawingAnnotations extends FRAGS.DataMap<string, AnnotationEntry> {
+    /**
+     * Each entry bundles the owning system, the data, and the Three.js group —
+     * so a single `drawing.annotations.get(uuid)` gives full access to all three.
+     *
+     * Systems write here when they create or update annotations; consumers read
+     * from here or subscribe to system-level events (`onCommit`, `onDelete`).
+     *
+     * ```ts
+     * // Get everything for a known UUID
+     * const { system, data, three } = drawing.annotations.get(uuid)!;
+     *
+     * // Iterate all annotations owned by a specific system
+     * for (const [uuid, dim] of drawing.annotations.getBySystem(dims)) { ... }
+     * ```
+     */
+    constructor();
+    /**
+     * Returns a snapshot map of `uuid → item` for all annotations owned by
+     * `system` on this drawing. Filters the flat store by system identity.
+     *
+     * The returned `Map` is a snapshot — it does not update reactively.
+     * Subscribe to system events (`onCommit`, `onDelete`, `onUpdate`) for
+     * reactive updates.
+     */
+    /**
+     * Returns a snapshot map of `uuid → item` for all annotations owned by
+     * `system` on this drawing. TypeScript infers the item type from the
+     * system's `_item` declaration marker, avoiding DataMap event variance issues.
+     */
+    getBySystem<T>(system: {
+        readonly _item: T;
+    }): Map<string, T>;
+}
+
+/** Result of a successful raycast against a {@link TechnicalDrawing}. */
+export declare interface DrawingIntersection {
+    /** Hit position in drawing local space (X right, Z down-screen, Y = 0). */
+    point: THREE.Vector3;
+    /** The Three.js object that was intersected (e.g. a LineSegments). */
+    object: THREE.Object3D;
+    /**
+     * The viewport whose camera was used for the raycast, or `null` when the
+     * pick originated from a world-space camera (e.g. the 3D viewer).
+     */
+    viewport: DrawingViewport | null;
+    /**
+     * The specific line segment that was hit, expressed as a `THREE.Line3`
+     * in drawing local space. `null` when the hit object is not a LineSegments.
+     */
+    line: THREE.Line3 | null;
+}
+
+/** A named organizational layer on a {@link TechnicalDrawing}. */
+export declare interface DrawingLayer {
+    /** Unique name identifying this layer. */
+    name: string;
+    /** Whether objects on this layer are visible. Defaults to `true`. */
+    visible: boolean;
+    /**
+     * Material applied to all projection `LineSegments` on this layer.
+     * All objects on the same layer share this instance, so mutating it
+     * (e.g. via {@link DrawingLayers.setColor}) is reflected immediately
+     * without any traversal. Use {@link DrawingLayers.setMaterial} to
+     * swap the instance entirely.
+     *
+     * Annotation systems always use their own style material — this field
+     * does not affect them.
+     */
+    material: THREE.LineBasicMaterial;
+}
+
+/** Manages the named layers of a {@link TechnicalDrawing}. */
+export declare class DrawingLayers extends FRAGS.DataMap<string, DrawingLayer> {
+    private readonly _container;
+    /**
+     * Accessible via `drawing.layers`. Each layer owns a `THREE.LineBasicMaterial`
+     * that is shared across all projection `LineSegments` assigned to it —
+     * mutating the material (e.g. via {@link setColor}) is reflected on every line
+     * immediately without any scene traversal. Annotation systems always use their
+     * own style material and are not affected by layer materials.
+     *
+     * Extends `DataMap<string, DrawingLayer>` so consumers get reactive events
+     * (`onItemSet`, `onItemDeleted`, …) directly on `drawing.layers`.
+     *
+     * Layer `"0"` always exists and cannot be removed.
+     *
+     * ```ts
+     * drawing.layers.create("walls", { material: new THREE.LineBasicMaterial({ color: 0x333333 }) });
+     * drawing.layers.setColor("walls", 0x888888);
+     * drawing.layers.setVisibility("walls", false);
+     * ```
+     */
+    constructor(container: THREE.Group);
+    /**
+     * Creates a new layer. If a layer with the same name already exists, returns
+     * the existing one without modifying it.
+     *
+     * @param name    - Unique layer name.
+     * @param options - Optional material and visibility. If no material is given,
+     *   a default black `LineBasicMaterial` is created. Visibility defaults to `true`.
+     * @returns The (possibly pre-existing) layer object.
+     */
+    create(name: string, options?: {
+        material?: THREE.LineBasicMaterial;
+        visible?: boolean;
+    }): DrawingLayer;
+    /**
+     * Updates the color of a layer's material and fires reactive events.
+     *
+     * Because all `LineSegments` on the same layer share the same material
+     * instance, the change is reflected immediately on all of them — no scene
+     * traversal is required.
+     *
+     * Does nothing if the layer does not exist.
+     *
+     * @param name  - Layer name.
+     * @param color - Hex color (e.g. `0xff0000`).
+     */
+    setColor(name: string, color: number): void;
+    /**
+     * Replaces the material of a layer and updates all `LineSegments` currently
+     * assigned to it. The previous material is disposed.
+     *
+     * Does nothing if the layer does not exist.
+     *
+     * @param name     - Layer name.
+     * @param material - New material to assign.
+     */
+    setMaterial(name: string, material: THREE.LineBasicMaterial): void;
+    /**
+     * Shows or hides all objects assigned to the given layer.
+     *
+     * Does nothing if the layer does not exist.
+     *
+     * @param name    - Layer name.
+     * @param visible - `true` to show, `false` to hide.
+     */
+    setVisibility(name: string, visible: boolean): void;
+    /**
+     * Assigns an object to a named layer, applies the layer's material (if the
+     * object is a `LineSegments`), and immediately reflects the layer's current
+     * visibility state.
+     *
+     * Use this instead of setting `object.userData.layer` directly so that
+     * the material and visibility are always in sync at insertion time.
+     *
+     * Does nothing if the layer does not exist.
+     *
+     * @param object - The Three.js object to assign.
+     * @param name   - Layer name.
+     */
+    assign(object: THREE.Object3D, name: string): void;
+    /* Excluded from this release type: resolveColor */
+}
+
+/**
+ * Minimal interface consumed by {@link TechnicalDrawingHelper}.
+ * Satisfied by {@link TechnicalDrawing} without a direct import.
+ */
+declare interface DrawingProjectionSource {
+    far: number;
+}
+
+/** "Type bag" descriptor that fully parameterises an annotation system. */
+export declare interface DrawingSystemDescriptor {
+    item: {
+        uuid: string;
+        style: string;
+    };
+    data: object;
+    style: BaseAnnotationStyle;
+    handle: string;
+}
+
+/** Represents a framed orthographic window into a {@link TechnicalDrawing}. */
+export declare class DrawingViewport {
+    /** Unique identifier for this viewport instance. */
+    readonly uuid: string;
+    /** Human-readable label for this viewport. */
+    name: string;
+    /**
+     * The Three.js orthographic camera for this viewport.
+     * Add it to the drawing container via {@link DrawingViewports.add}.
+     */
+    readonly camera: THREE.OrthographicCamera;
+    /** {@link Disposable.onDisposed} */
+    readonly onDisposed: Event_2<void>;
+    private _left;
+    private _right;
+    private _top;
+    private _bottom;
+    private _drawingScale;
+    private _container;
+    private _helper;
+    private _helperVisible;
+    get left(): number;
+    set left(value: number);
+    get right(): number;
+    set right(value: number);
+    get top(): number;
+    set top(value: number);
+    get bottom(): number;
+    set bottom(value: number);
+    /** Drawing scale denominator (e.g. 100 = 1:100). */
+    get drawingScale(): number;
+    set drawingScale(value: number);
+    /**
+     * The {@link DrawingViewportHelper} for this viewport.
+     *
+     * The helper is created lazily on first access and cached. It is a
+     * `THREE.Group` on layer 0, so it is visible to the perspective camera but
+     * invisible to the viewport's own orthographic camera (layer 1 only).
+     *
+     * Use {@link helperVisible} to attach/detach it to the drawing container
+     * automatically, or manage it manually with `drawing.three.add/remove`.
+     */
+    get helper(): DrawingViewportHelper;
+    /**
+     * Shows or hides the {@link DrawingViewportHelper} by attaching it to or
+     * removing it from the drawing's container group.
+     *
+     * Setting this to `true` before the viewport has been registered via
+     * `DrawingViewports.add()` has no effect until registration occurs.
+     */
+    get helperVisible(): boolean;
+    set helperVisible(value: boolean);
+    /**
+     * Axis-aligned bounding box of this viewport in world drawing space (Y = 0).
+     * Used by {@link clipLine} and PDF/DXF exporters.
+     *
+     * Because screen-up = world −Z, the world Z range visible to the camera is
+     * [−top, −bottom], not [bottom, top].
+     */
+    get bbox(): THREE.Box3;
+    /** Viewport size in millimetres (based on local units × 1000). */
+    get size(): THREE.Vector2;
+    /** Local X axis direction (world +X). */
+    get localXAxis(): THREE.Vector3;
+    /** Local Y axis direction (world -Z). */
+    get localYAxis(): THREE.Vector3;
+    /** Drawing plane normal (world +Y). */
+    get normal(): THREE.Vector3;
+    /**
+     * The viewport lives in the drawing's local coordinate system (XZ plane, Y = 0).
+     * Its {@link camera} must be added as a child of the drawing's container so that
+     * any world-space transform applied to the container automatically moves the camera.
+     *
+     * The camera uses **layer 1** exclusively, so only geometry explicitly assigned
+     * to layer 1 (projection lines, dimensions) is visible in paper-space renders.
+     *
+     * Local coordinate convention:
+     * - X right → world +X
+     * - Y up (screen) → world -Z
+     * - Normal (out of plane) → world +Y
+     */
+    constructor(config: DrawingViewportConfig);
+    /* Excluded from this release type: setContainer */
+    /**
+     * Clips a line segment to this viewport's bounding box.
+     * Returns `null` when the line is entirely outside the viewport.
+     */
+    clipLine(line: THREE.Line3): THREE.Line3 | null;
+    /** Destroys this viewport. The camera must be removed from its parent separately. */
+    dispose(): void;
+    private get bboxPlanes();
+    private getPlaneIntersections;
+}
+
+/**
+ * Configuration to create a {@link DrawingViewport}.
+ */
+export declare interface DrawingViewportConfig {
+    /** Left bound of the viewport in local drawing units. */
+    left: number;
+    /** Right bound of the viewport in local drawing units. */
+    right: number;
+    /**
+     * Top bound of the viewport in local drawing units.
+     * Maps to world -Z (screen Y up = local -Z).
+     */
+    top: number;
+    /**
+     * Bottom bound of the viewport in local drawing units.
+     * Maps to world +Z (screen Y down = local +Z).
+     */
+    bottom: number;
+    /**
+     * Drawing scale denominator (e.g. 100 means 1:100).
+     * Defaults to 100.
+     */
+    scale?: number;
+    /** Human-readable label for this viewport. Defaults to an empty string. */
+    name?: string;
+}
+
+/** Visualises the bounds of a `DrawingViewport` as a rectangle in the 3D scene. */
+export declare class DrawingViewportHelper extends THREE.Group {
+    private readonly _viewport;
+    private readonly _border;
+    private readonly _handles;
+    private readonly _raycaster;
+    private _resizable;
+    private _movable;
+    private _dragHandle;
+    private _dragConstraints;
+    private _hoveredHandle;
+    private _moveDrag;
+    private _hoveringBorder;
+    private readonly _normalMat;
+    private readonly _hoverMat;
+    private readonly _borderMat;
+    private static readonly _BORDER_COLOR;
+    private static readonly _BORDER_HOVER_COLOR;
+    private static readonly _LINE_THRESHOLD;
+    private static readonly _HANDLE_DEFS;
+    /**
+     * When `true`, the eight handle spheres are shown and resize drag is enabled.
+     */
+    get resizable(): boolean;
+    set resizable(value: boolean);
+    /**
+     * When `true`, hovering and dragging the border rectangle translates the
+     * entire viewport while keeping its width and height constant.
+     */
+    get movable(): boolean;
+    set movable(value: boolean);
+    /** `true` while either a resize or a move drag is in progress. */
+    get isDragging(): boolean;
+    /**
+     * Works exactly like the built-in Three.js helpers (e.g. `THREE.CameraHelper`):
+     * the result is a plain `THREE.Group` you can add wherever you like in the scene
+     * graph.  It renders on **layer 0**, so it is visible to the perspective camera
+     * but invisible to the viewport's own orthographic camera (which only renders
+     * layer 1).
+     *
+     * Typically you do not construct this directly — use
+     * `DrawingViewport.helperVisible = true` instead, which attaches the helper to
+     * the drawing container automatically.
+     *
+     * When {@link editable} is `true`, two kinds of interaction are enabled:
+     *
+     * - **Resize** — hover one of the eight handle spheres (corners + edge midpoints)
+     *   and drag to resize the viewport in that direction.
+     * - **Move** — hover the border rectangle itself and drag to translate the
+     *   entire viewport while keeping its width and height constant.
+     *
+     * In both cases the border and the hovered element turn orange as visual
+     * feedback, and {@link isDragging} becomes `true` for the duration of the drag.
+     *
+     * The class contains no browser API references and is safe in Node.js
+     * environments; the consumer forwards events:
+     *
+     * ```ts
+     * container.addEventListener("mousemove", (e) => {
+     *   raycaster.setFromCamera(getNDC(e), camera);
+     *   viewport.helper.onPointerMove(raycaster.ray);
+     * });
+     * container.addEventListener("mousedown", (e) => {
+     *   raycaster.setFromCamera(getNDC(e), camera);
+     *   viewport.helper.onPointerDown(raycaster.ray);
+     * });
+     * container.addEventListener("mouseup", () => viewport.helper.onPointerUp());
+     * ```
+     */
+    constructor(viewport: ViewportBoundsController);
+    /**
+     * Rebuilds the border geometry and repositions all handles to match the
+     * current viewport bounds.  Called automatically by the viewport whenever
+     * any bound changes; you rarely need to call this yourself.
+     */
+    update(): void;
+    /**
+     * Forward `mousemove` events here.
+     *
+     * - **Resize drag active**: updates the bound(s) controlled by the active handle.
+     * - **Move drag active**: translates all four bounds by the cursor delta,
+     *   preserving the viewport's width and height.
+     * - **No drag**: highlights handles on hover; highlights the border when the
+     *   cursor is over it and no handle is hovered.
+     *
+     * @param ray - World-space ray, e.g. from `THREE.Raycaster.setFromCamera`.
+     */
+    onPointerMove(ray: THREE.Ray): void;
+    /**
+     * Forward `mousedown` events here.
+     *
+     * - If a handle is hovered, begins a **resize drag**.
+     * - If the border is hovered (and no handle), begins a **move drag**.
+     *
+     * @param ray - World-space ray at the moment of the press.
+     */
+    onPointerDown(ray: THREE.Ray): void;
+    /** Forward `mouseup` events here to end any active drag. */
+    onPointerUp(): void;
+    /** Releases all Three.js geometry and material resources. */
+    dispose(): void;
+    /**
+     * Projects a world-space ray onto this group's local Y = 0 plane and
+     * returns the intersection in local coordinates.
+     */
+    private _projectToLocal;
+    /** Toggles the border hover colour and keeps `_hoveringBorder` in sync. */
+    private _setBorderHover;
+}
+
+/** Manages the viewports of a {@link TechnicalDrawing}. */
+export declare class DrawingViewports extends FRAGS.DataMap<string, DrawingViewport> {
+    private readonly _container;
+    /**
+     * Accessible via `drawing.viewports`. Extends `DataMap` so consumers get
+     * reactive events (`onItemSet`, `onBeforeDelete`, …) for free.
+     *
+     * ```ts
+     * const vp = drawing.viewports.create({ left: -1, right: 5, top: 1, bottom: -4 });
+     * drawing.viewports.delete(vp.uuid); // disposes and removes
+     * ```
+     */
+    constructor(container: THREE.Group);
+    /**
+     * Creates a new {@link DrawingViewport}, adds its camera to the drawing
+     * container, and registers it.
+     *
+     * @param config - Bounds and scale for the new viewport.
+     * @returns The newly created viewport.
+     */
+    create(config: DrawingViewportConfig): DrawingViewport;
+}
+
+/** One drawing with one or more viewport placements to export. */
+export declare interface DxfDrawingEntry {
+    drawing: TechnicalDrawing;
+    viewports: DxfViewportEntry[];
+}
+
+/** Serializes {@link TechnicalDrawing} content to DXF format (AC1015 / AutoCAD R2000). */
+export declare class DxfExporter {
+    private readonly _components;
+    /** Decimal places used when formatting measurement text in DXF. */
+    precision: number;
+    /**
+     * Export configuration options.
+     * - `trueColor` — when `true`, upgrades the output to AC1018 (AutoCAD 2004+) and
+     *   emits group code 420 (RGB true color) alongside group code 62 (ACI) on every
+     *   entity. Modern viewers prioritize 420; older apps fall back to 62.
+     *   Note: the adaptive black/white behavior of ACI 7 is lost when true color is on,
+     *   since viewers treat the explicit RGB as fixed. Defaults to `false`.
+     */
+    config: {
+        trueColor: boolean;
+    };
+    private _viewport;
+    private _paperSlot;
+    private readonly _annotationLayers;
+    private readonly _systemExporters;
+    /**
+     * Used through {@link DxfManager}:
+     * ```ts
+     * const dxf = components.get(OBC.DxfManager).exporter.export([
+     *   { drawing, viewports: [{ viewport, x: 10, y: 10 }] },
+     * ], { widthMm: 420, heightMm: 297, margin: 10 });
+     * ```
+     */
+    constructor(_components: Components);
+    /**
+     * Registers a custom DXF exporter for a {@link DrawingSystem} subclass.
+     */
+    registerSystemExporter<T extends AnnotationSystem<any>>(SystemClass: new (...args: any[]) => T, handler: (sys: T, ctx: DxfWriteContext) => void): void;
+    /**
+     * Serializes one or more drawings to a DXF string.
+     *
+     * When `paper` is supplied the output uses millimetres (INSUNITS=4) and
+     * each viewport is placed at its (`x`, `y`) position on the sheet.
+     * Without `paper` the output uses world units (INSUNITS=6).
+     *
+     * @param entries - Drawings with their viewport placements.
+     * @param paper   - Optional paper sheet dimensions for paper-space export.
+     */
+    export(entries: DxfDrawingEntry[], paper?: DxfPaperOptions): string;
+    private _writeHeader;
+    private _writeTables;
+    private _writeBlocks;
+    private _writeBlock;
+    /** Writes a rectangular border for the active viewport (no-op when no viewport is set). */
+    private _writeViewportBorder;
+    /**
+     * Writes drawing-area and full-sheet border rectangles in paper-space coordinates.
+     * Origin (0, 0) is the top-left corner of the drawing area (inside margins).
+     */
+    private _writePaperBorders;
+    private _writeObjects;
+    private _writeRawLines;
+    private _writeLinearAnnotations;
+    private _writeAngleAnnotations;
+    private _writeLeaderAnnotations;
+    private _writeSlopeAnnotations;
+    private _writeCalloutAnnotations;
+    private _writeBlockInsertions;
+    private _writeGeoAsLines;
+    private _writePairsAsLines;
+    private _emitTrueColor;
+    private _writeLine;
+    /** Writes a LINE entity with coordinates already in DXF space (no transform applied). */
+    private _writeRawLine;
+    /**
+     * Writes a single triangle as a DXF SOLID entity.
+     * Coordinates are in drawing local space (XZ plane) — transform is applied internally.
+     * The 4th vertex equals the 3rd (degenerate quad = triangle).
+     */
+    private _writeSolid;
+    /**
+     * Writes a flat XYZ triangle array (9 values per triangle, XZ plane) as SOLID entities.
+     * Matches the output format of {@link MeshTickBuilder}.
+     */
+    private _writeMeshTriangles;
+    private _writeText;
+    /** Maps world X to DXF X. In paper-space, output is in mm from the drawing area origin. */
+    private _tx;
+    /**
+     * Maps world Z to DXF Y.
+     * In paper-space, output is in mm from the drawing area bottom (DXF Y-up).
+     * In world-space mode, uses Y-down convention (Y=0 at viewport top).
+     */
+    private _ty;
+    /** Returns the coordinate scale factor: mm-per-world-unit in paper mode, 1 otherwise. */
+    private _scale;
+    private _clipSegment;
+    private _inViewport;
+    private _bboxFromPositions;
+    private _fullyInViewport;
+    private _textAngle;
+    private _writeCustomSystems;
+    private _makeContext;
+}
+
+/** Manages DXF import and export for technical drawings. */
+export declare class DxfManager extends Component {
+    static readonly uuid: "e9a2c3d4-5f67-4b89-a012-1c3d5e7f9b2a";
+    enabled: boolean;
+    /** Handles DXF serialisation of {@link TechnicalDrawing} content. */
+    readonly exporter: DxfExporter;
+    /**
+     * ```ts
+     * const manager = components.get(OBC.DxfManager);
+     * const dxf = manager.exporter.export([{ drawing, viewports: [{ viewport }] }]);
+     * ```
+     */
+    constructor(components: Components);
+}
+
+/** Paper sheet dimensions for paper-space export. */
+export declare interface DxfPaperOptions {
+    /** Total paper width in mm. */
+    widthMm: number;
+    /** Total paper height in mm. */
+    heightMm: number;
+    /** Uniform margin in mm. */
+    margin: number;
+}
+
+/** Optional text formatting overrides for {@link DxfWriteContext.writeText}. */
+export declare interface DxfTextOptions {
+    layer?: string;
+    aciColor?: number;
+    rotDeg?: number;
+    hAlign?: 0 | 1 | 2;
+}
+
+/** One viewport placement within a drawing entry. */
+export declare interface DxfViewportEntry {
+    /** Viewport to clip and transform against. If omitted, exports the full drawing. */
+    viewport?: DrawingViewport;
+    /** Horizontal position in mm from the top-left of the drawing area (paper-space only). */
+    x?: number;
+    /** Vertical position in mm from the top-left of the drawing area (paper-space only). */
+    y?: number;
+}
+
+/**
+ * Write-context passed to custom system exporters registered via
+ * {@link DxfExporter.registerSystemExporter}.
+ */
+export declare interface DxfWriteContext {
+    writeLine(x1: number, y1: number, x2: number, y2: number, layer?: string, aciColor?: number): void;
+    writePairs(positions: ArrayLike<number>, layer?: string, aciColor?: number): void;
+    writeText(text: string, x: number, y: number, height: number, options?: DxfTextOptions): void;
+    /** Writes a flat XYZ triangle array (9 values per triangle) as DXF SOLID entities. */
+    writeMeshTriangles(triangles: number[], layer?: string, aciColor?: number): void;
+    hexToAci(hex: number): number;
+    textAngle(dx: number, dz: number): number;
+}
+
+/** Result of an edge projection, containing visible/hidden geometries and a mapping from group indices to model item identifiers. */
+export declare interface EdgeProjectionResult {
+    /** Line segment geometry for visible edges. Has a `group` vertex attribute with group indices. */
+    visible: THREE.BufferGeometry;
+    /** Line segment geometry for hidden edges. Has a `group` vertex attribute with group indices. */
+    hidden: THREE.BufferGeometry;
+    /** Maps group index to `{ modelId, localId }` identifying the source item. */
+    groups: Record<number, {
+        modelId: string;
+        localId: number;
+    }>;
+}
+
+/** Component that generates 2D edge projections from fragment model items. */
+export declare class EdgeProjector extends Component implements Disposable_2 {
+    static readonly uuid: "f2e76c3a-8b1d-4d5e-9a3f-7c6b2d4e8f1a";
+    enabled: boolean;
+    readonly onDisposed: Event_2<unknown>;
+    /**
+     * The underlying ProjectionGenerator from three-edge-projection.
+     * You can configure angleThreshold, iterationTime, includeIntersectionEdges, and useWebGPU.
+     */
+    readonly generator: any;
+    /**
+     * Resolution of the visibility culler in pixels per meter.
+     * Higher values = more accurate occlusion but slower culling.
+     */
+    cullerPixelsPerMeter: number;
+    /**
+     * The direction the projector looks along. Meshes are projected onto the plane
+     * perpendicular to this direction. Default is top-down (plan view).
+     *
+     * Common values:
+     * - Top/Plan: `(0, -1, 0)`
+     * - Front: `(0, 0, -1)`
+     * - Back: `(0, 0, 1)`
+     * - Left: `(-1, 0, 0)`
+     * - Right: `(1, 0, 0)`
+     */
+    readonly projectionDirection: THREE.Vector3;
+    /**
+     * Near clipping plane along the projection direction.
+     * Meshes whose AABB is fully "behind" this plane (closer to the viewer) are excluded.
+     * Set to -Infinity to disable.
+     */
+    nearPlane: number;
+    /**
+     * Far clipping plane along the projection direction.
+     * Meshes whose AABB is fully "beyond" this plane (farther from the viewer) are excluded.
+     * Set to Infinity to disable.
+     */
+    farPlane: number;
+    constructor(components: Components);
+    /**
+     * Generates 2D edge projections for the given model items.
+     *
+     * @param modelIdMap - A map of model IDs to sets of local IDs specifying items to project.
+     * @param world - The world whose renderer will be used for visibility culling.
+     * @param config - Optional configuration.
+     * @param config.onProgress - Optional progress callback receiving (message, progress?, collector?).
+     * @returns Visible/hidden geometries with a `group` vertex attribute, and a groups mapping.
+     */
+    get(modelIdMap: ModelIdMap, world: World, config?: {
+        onProgress?: (message: string, progress?: number) => void;
+    }): Promise<EdgeProjectionResult>;
+    dispose(): void;
+}
+
+/** Defines a closed shape (cloud, rectangle, circle, etc.) that forms the body of a callout annotation. */
+export declare type EnclosureBuilder = {
+    /** Returns flat XYZ line-segment pairs forming the enclosure outline. */
+    buildGeometry: (center: THREE.Vector3, halfW: number, halfH: number) => number[];
+    /**
+     * Returns the point on the enclosure boundary in the direction `dir` from
+     * `center`. `dir` is a unit vector in the XZ plane.
+     */
+    getAttachmentPoint: (center: THREE.Vector3, halfW: number, halfH: number, dir: THREE.Vector3) => THREE.Vector3;
+};
+
 /**
  * Simple event handler by [Jason Kleban](https://gist.github.com/JasonKleban/50cee44960c225ac1993c922563aa540). Keep in mind that if you want to remove it later, you might want to declare the callback as an object. If you want to maintain the reference to `this`, you will need to declare the callback as an arrow function.
  */
@@ -1800,6 +3029,15 @@ export declare class FastModelPickers extends Component implements Disposable_2
     dispose(): void;
 }
 
+/** Filled arrowhead tick (solid triangle, requires a `THREE.Mesh`). */
+export declare const FilledArrowTick: MeshTickBuilder;
+
+/** Filled circle tick (solid disc, requires a `THREE.Mesh`). */
+export declare const FilledCircleTick: MeshTickBuilder;
+
+/** Filled square tick (solid square, requires a `THREE.Mesh`). */
+export declare const FilledSquareTick: MeshTickBuilder;
+
 /**
  * Represents a finder query for retrieving items based on specified parameters. This class encapsulates the query logic, caching mechanism, and result management.
  */
@@ -1877,6 +3115,15 @@ export declare class FirstPersonMode implements NavigationMode {
     private setupFirstPersonCamera;
 }
 
+/**
+ * Converts a slope ratio to a human-readable string.
+ *
+ * @param slope  - Rise / run ratio (e.g. `0.15` for 15 %).
+ * @param format - Desired output format.
+ * @returns Formatted string, e.g. `"15.00 %"`, `"1:6.67"`, or `"8.53°"`.
+ */
+export declare function formatSlope(slope: number, format: SlopeFormat): string;
+
 /**
  * Component to load, delete and manage [fragments](https://github.com/ThatOpen/engine_fragment) efficiently. 📕 [Tutorial](https://docs.thatopen.com/Tutorials/Components/Core/FragmentsManager). 📘 [API](https://docs.thatopen.com/api/@thatopen/components/classes/FragmentsManager).
  */
@@ -1964,6 +3211,23 @@ export declare class FragmentsManager extends Component implements Disposable_2
     applyBaseCoordinateSystem(object: THREE.Object3D | THREE.Vector3, originalCoordinateSystem?: THREE.Matrix4): THREE.Matrix4;
 }
 
+/** Returns the tip position and inward tangent direction for each tick endpoint of an angle dimension arc. */
+export declare function getAngleTickEndpoints(dim: AngleAnnotation): Array<{
+    tip: THREE.Vector3;
+    dir: THREE.Vector3;
+}>;
+
+/** Returns the tip position and inward direction for each tick endpoint of a linear dimension. */
+export declare function getDimensionTickEndpoints(dim: LinearAnnotation): Array<{
+    tip: THREE.Vector3;
+    dir: THREE.Vector3;
+}>;
+
+/**
+ * Returns the tip position of a slope annotation in drawing local space.
+ */
+export declare function getSlopeTip(ann: SlopeAnnotation, length: number): THREE.Vector3;
+
 /**
  * A component that manages grid instances. Each grid is associated with a unique world. 📕 [Tutorial](https://docs.thatopen.com/Tutorials/Components/Core/Grids). 📘 [API](https://docs.thatopen.com/api/@thatopen/components/classes/Grids).
  */
@@ -2587,29 +3851,327 @@ export declare class ItemsFinder extends Component implements Serializable<Seria
      */
     create(name: string, queries: FRAGS.ItemsQueryParams[]): FinderQuery;
     /**
-     * Adds queries based on categories from items that have geometry.
-     *
-     * @param modelIds - An optional array of model IDs to filter fragments. If not provided, all fragments are processed.
-     * @returns An array with the categories used to create the queries
+     * Adds queries based on categories from items that have geometry.
+     *
+     * @param modelIds - An optional array of model IDs to filter fragments. If not provided, all fragments are processed.
+     * @returns An array with the categories used to create the queries
+     */
+    addFromCategories(modelIds?: RegExp[]): Promise<string[]>;
+    /**
+     * Imports a list of `FinderQuery` instances from a `SerializationResult` containing serialized finder query data.
+     *
+     * @param result - The `SerializationResult` containing the serialized `SerializedFinderQuery` data.
+     * @returns An array of `FinderQuery` instances created from the serialized data. Returns an empty array if the input data is null or undefined.
+     */
+    import(result: SerializationResult<SerializedFinderQuery>): FinderQuery[];
+    /**
+     * Serializes the ItemsFinder's data into a format suitable for export.
+     *
+     * @returns An object containing an array of serialized finder queries.
+     */
+    export(): {
+        data: SerializedFinderQuery[];
+    };
+}
+
+/** The committed data for a single leader annotation. */
+export declare interface LeaderAnnotation {
+    /** Unique identifier. */
+    uuid: string;
+    /** Tip of the arrow — the annotated point. */
+    arrowTip: THREE.Vector3;
+    /** Elbow — the bend between the leader line and the extension. */
+    elbow: THREE.Vector3;
+    /** End of the horizontal extension line — anchor for the text. */
+    extensionEnd: THREE.Vector3;
+    /** The annotation text. */
+    text: string;
+    /** Name of the {@link LeaderAnnotationStyle} to use when rendering. */
+    style: string;
+}
+
+/** Editable fields of {@link LeaderAnnotation} — everything except `uuid`. */
+export declare type LeaderAnnotationData = Omit<LeaderAnnotation, "uuid">;
+
+export declare type LeaderAnnotationEvent = 
+/** First event that starts the machine — carries the target drawing. */
+    {
+    type: "CLICK";
+    point: THREE.Vector3;
+    drawing?: TechnicalDrawing;
+}
+/** The cursor moved — drawing context is already set from the initial CLICK. */
+| {
+    type: "MOUSE_MOVE";
+    point: THREE.Vector3;
+}
+/**
+* Consumer supplies the annotation text after the machine enters
+* `enteringText`. Ignored in all other states.
+*/
+| {
+    type: "SUBMIT_TEXT";
+    text: string;
+}
+/** Cancel the current operation and return to the initial state. */
+| {
+    type: "ESCAPE";
+};
+
+/** Pure state transition function for the leader annotation tool. */
+export declare function leaderAnnotationMachine(state: LeaderAnnotationState, event: LeaderAnnotationEvent): LeaderAnnotationState;
+
+/** Global drawing system that manages leader (arrow + text) annotations across all {@link TechnicalDrawing} instances. */
+export declare class LeaderAnnotations extends AnnotationSystem<LeaderAnnotationSystem> implements Transitionable<LeaderAnnotationState, LeaderAnnotationEvent>, Disposable_2 {
+    enabled: boolean;
+    readonly _item: LeaderAnnotation;
+    machineState: LeaderAnnotationState;
+    readonly onMachineStateChanged: Event_2<LeaderAnnotationState>;
+    private readonly _previewMeshMaterial;
+    private _previewMeshObject;
+    constructor(components: Components);
+    pickHandle(drawing: TechnicalDrawing, ray: THREE.Ray, threshold?: number): {
+        uuid: string;
+        handle: "elbow" | "extensionEnd";
+    } | null;
+    sendMachineEvent(event: LeaderAnnotationEvent): void;
+    protected _buildGroup(ann: LeaderAnnotation, style: LeaderAnnotationStyle): THREE.Group;
+    protected _updatePreview(): void;
+    protected _clearPreview(): void;
+    protected _onDispose(): void;
+    private _resetMachine;
+    private _clearPreviewMesh;
+}
+
+export declare type LeaderAnnotationState = 
+/** Tool active, waiting for the first click (arrow tip). */
+    {
+    kind: "awaitingArrowTip";
+}
+/** Arrow tip placed. User moves toward the elbow point. */
+| {
+    kind: "placingElbow";
+    arrowTip: THREE.Vector3;
+    cursor: THREE.Vector3 | null;
+}
+/** Elbow placed. User moves toward the extension end. */
+| {
+    kind: "placingExtension";
+    arrowTip: THREE.Vector3;
+    elbow: THREE.Vector3;
+    cursor: THREE.Vector3 | null;
+}
+/**
+* All geometry is set. The machine is paused waiting for the consumer to
+* supply the annotation text via a `SUBMIT_TEXT` event.
+*/
+| {
+    kind: "enteringText";
+    arrowTip: THREE.Vector3;
+    elbow: THREE.Vector3;
+    extensionEnd: THREE.Vector3;
+}
+/** Annotation just committed. */
+| {
+    kind: "committed";
+    annotation: LeaderAnnotation;
+};
+
+/** Visual appearance of a leader annotation. */
+export declare interface LeaderAnnotationStyle extends BaseAnnotationStyle {
+    /** Size of the tick at the arrow tip in drawing local units. */
+    tickSize: number;
+    /**
+     * Distance from `extensionEnd` to the text label anchor,
+     * measured along the extension direction.
+     */
+    textOffset: number;
+    /**
+     * Leader line shape.
+     * - `"angular"` (default) — two straight segments: arrowTip → elbow → extensionEnd.
+     * - `"curved"` — quadratic Bézier with `elbow` as the control point.
+     */
+    leaderShape?: "angular" | "curved";
+    /**
+     * Line-segment tick at the arrow tip — geometry is included in the same
+     * `LineSegments` as the leader line.
+     * When both `tick` and `meshTick` are absent, nothing is drawn at the tip.
+     */
+    lineTick?: LineTickBuilder;
+    /**
+     * Filled (mesh) tick at the arrow tip — rendered as a separate `THREE.Mesh`.
+     * Can be combined with `tick` (e.g. open circle + filled disc = target).
+     */
+    meshTick?: MeshTickBuilder;
+}
+
+declare interface LeaderAnnotationSystem {
+    item: LeaderAnnotation;
+    data: LeaderAnnotationData;
+    style: LeaderAnnotationStyle;
+    handle: "elbow" | "extensionEnd";
+}
+
+/** The committed data for a single linear annotation. */
+export declare interface LinearAnnotation {
+    /** Unique identifier. */
+    uuid: string;
+    /** First measured point in drawing local space. */
+    pointA: THREE.Vector3;
+    /** Second measured point in drawing local space. */
+    pointB: THREE.Vector3;
+    /**
+     * Signed distance from the AB segment to the dimension line,
+     * measured along the direction perpendicular to the measurement axis.
      */
-    addFromCategories(modelIds?: RegExp[]): Promise<string[]>;
+    offset: number;
+    /** Name of the {@link LinearAnnotationStyle} to use when rendering this annotation. */
+    style: string;
+}
+
+/** Editable fields of {@link LinearAnnotation} — everything except the `uuid`. */
+export declare type LinearAnnotationData = Omit<LinearAnnotation, "uuid">;
+
+export declare type LinearAnnotationEvent = 
+/**
+* A point in drawing local space was clicked.
+* Carries `drawing` so the machine can lock it in as `_previewDrawing` on the
+* first click — subsequent events reuse that cached context.
+*
+* `line` MUST be provided when in `awaitingFirstPoint` or `placingPoints` —
+* the machine silently ignores the click without it (only line snaps accepted).
+* It is optional in `positioningOffset` (free-space placement).
+*/
+    {
+    type: "CLICK";
+    point: THREE.Vector3;
+    line?: THREE.Line3;
+    drawing?: TechnicalDrawing;
+}
+/** The cursor moved — drawing context is already cached from the initial CLICK or SELECT_LINE. */
+| {
+    type: "MOUSE_MOVE";
+    point: THREE.Vector3;
+}
+/**
+* Consumer signals "done placing points — move to offset positioning".
+* Relevant only in `sequential` mode; in `individual` the machine auto-advances.
+* The consumer decides the DOM mapping (Enter, double-click, etc.).
+*/
+| {
+    type: "CONFIRM";
+}
+/**
+* Alternative first event: selects an entire line as the dimension's measured
+* segment, jumping directly to `positioningOffset`.
+* Carries `drawing` to set the drawing context (same role as the first CLICK).
+*/
+| {
+    type: "SELECT_LINE";
+    line: THREE.Line3;
+    drawing?: TechnicalDrawing;
+}
+/** Cancel the current operation and return to the initial state. */
+| {
+    type: "ESCAPE";
+};
+
+/** Global drawing system that manages linear dimension annotations across all {@link TechnicalDrawing} instances. */
+export declare class LinearAnnotations extends AnnotationSystem<LinearAnnotationSystem> implements Transitionable<LinearAnnotationState, LinearAnnotationEvent>, Disposable_2 {
+    enabled: boolean;
+    readonly _item: LinearAnnotation;
+    machineState: LinearAnnotationState;
+    readonly onMachineStateChanged: Event_2<LinearAnnotationState>;
+    constructor(components: Components);
+    pickHandle(drawing: TechnicalDrawing, ray: THREE.Ray, threshold?: number): {
+        uuid: string;
+        handle: "pointA" | "pointB" | "offset";
+    } | null;
+    sendMachineEvent(event: LinearAnnotationEvent): void;
+    protected _buildGroup(dim: LinearAnnotation, style: LinearAnnotationStyle): THREE.Group;
+    protected _updatePreview(): void;
+    private _resetMachine;
+}
+
+export declare type LinearAnnotationState = 
+/** Tool is active but no interaction has started. */
+    {
+    kind: "awaitingFirstPoint";
+}
+/**
+* First point placed. Stores the direction of the measured lines so that
+* subsequent clicks can be validated (must be on parallel lines) and the
+* cursor preview constrained to the orthogonal measurement direction.
+*
+* In `individual` mode the tool auto-advances after the second CLICK.
+* In `sequential` mode the user accumulates points and sends CONFIRM when done.
+*/
+| {
+    kind: "placingPoints";
+    points: THREE.Vector3[];
+    cursor: THREE.Vector3 | null;
+    /** Normalised direction of the first (and all subsequent) measured lines. */
+    lineDir: THREE.Vector3;
+    /** The first line segment hit — used to reject clicks on the same segment. */
+    firstLine: THREE.Line3;
+}
+/**
+* All measurement points are set. The user drags to define the perpendicular
+* offset of the dimension line, then clicks to commit.
+*/
+| {
+    kind: "positioningOffset";
+    points: THREE.Vector3[];
+    cursor: THREE.Vector3 | null;
+}
+/** One or more annotations have just been committed. */
+| {
+    kind: "committed";
+    dimensions: LinearAnnotation[];
+};
+
+/** Visual appearance of a linear annotation. Registered by name on the component. */
+export declare interface LinearAnnotationStyle extends BaseAnnotationStyle {
+    /** Tick mark geometry builder. Use one of the built-in exports or provide a custom one. */
+    lineTick: LineTickBuilder;
     /**
-     * Imports a list of `FinderQuery` instances from a `SerializationResult` containing serialized finder query data.
-     *
-     * @param result - The `SerializationResult` containing the serialized `SerializedFinderQuery` data.
-     * @returns An array of `FinderQuery` instances created from the serialized data. Returns an empty array if the input data is null or undefined.
+     * Optional filled tick mark builder. When provided, a `THREE.Mesh` triangle
+     * is rendered at each dimension endpoint in addition to (or instead of) the
+     * line tick. Set `tick` to {@link NoTick} when you only want the filled shape.
      */
-    import(result: SerializationResult<SerializedFinderQuery>): FinderQuery[];
+    meshTick?: MeshTickBuilder;
+    /** Size of the tick mark in drawing local units. */
+    tickSize: number;
+    /** Gap between the measured geometry and the start of each extension line. */
+    extensionGap: number;
+    /** How far extension lines overshoot beyond the dimension line. */
+    extensionOvershoot: number;
     /**
-     * Serializes the ItemsFinder's data into a format suitable for export.
-     *
-     * @returns An object containing an array of serialized finder queries.
+     * Signed perpendicular distance from the dimension line to the text label,
+     * measured outward from the measured geometry.
+     * Positive moves the text away from the geometry; negative moves it inward.
      */
-    export(): {
-        data: SerializedFinderQuery[];
-    };
+    textOffset: number;
+}
+
+declare interface LinearAnnotationSystem {
+    item: LinearAnnotation;
+    data: LinearAnnotationData;
+    style: LinearAnnotationStyle;
+    handle: "pointA" | "pointB" | "offset";
 }
 
+/** Pure state transition function for the linear dimension tool. */
+export declare function linearDimensionMachine(state: LinearAnnotationState, event: LinearAnnotationEvent): LinearAnnotationState;
+
+/**
+ * A function that produces tick mark geometry at one endpoint of a dimension or leader line.
+ * @param tip     - The endpoint of the line (drawing local space).
+ * @param lineDir - Normalised direction FROM `tip` TOWARD the other endpoint.
+ * @param size    - Tick size in drawing local units.
+ */
+export declare type LineTickBuilder = (tip: THREE.Vector3, lineDir: THREE.Vector3, size: number) => number[];
+
 /**
  * Represents an edge measurement result.
  */
@@ -2679,6 +4241,14 @@ export declare class MeasurementUtils extends Component {
     static convertUnits(value: number, fromUnit: string, toUnit: string, precision?: number): number;
 }
 
+/**
+ * A function that produces filled tick mark geometry (triangles) at one endpoint.
+ * @param tip     - The endpoint of the dimension or leader line.
+ * @param lineDir - Normalised direction FROM `tip` TOWARD the other endpoint.
+ * @param size    - Tick/arrow size in drawing local units.
+ */
+export declare type MeshTickBuilder = (tip: THREE.Vector3, lineDir: THREE.Vector3, size: number) => number[];
+
 export declare type ModelIdDataMap<T> = FRAGS.DataMap<string, FRAGS.DataMap<number, T>>;
 
 /**
@@ -2809,6 +4379,9 @@ export declare interface NoControl {
     value: any;
 }
 
+/** No tick — dimension line ends cleanly at the extension lines. */
+export declare const NoTick: LineTickBuilder;
+
 export declare interface NumberSettingControl {
     type: "Number";
     interpolable: boolean;
@@ -2817,6 +4390,11 @@ export declare interface NumberSettingControl {
     value: number;
 }
 
+/**
+ * Open-V arrowhead tick — two lines from the tip to the wing points, no base.
+ */
+export declare const OpenArrowTick: LineTickBuilder;
+
 /**
  * A {@link NavigationMode} that allows 3D navigation and panning like in many 3D and CAD softwares.
  */
@@ -3027,6 +4605,9 @@ export declare class Raycasters extends Component implements Disposable_2 {
     dispose(): void;
 }
 
+/** Rectangular enclosure — a plain axis-aligned rectangle centred on `center`. */
+export declare const RectEnclosure: EnclosureBuilder;
+
 /**
  * Configuration options for removing items from a classifier.
  */
@@ -3591,7 +5172,7 @@ export declare class SimpleRaycaster implements Disposable_2 {
      * @param items - The meshes to query. If not provided, it will query all the meshes stored in {@link World.meshes}.
      * @returns The first intersection found or `null` if no intersection was found.
      */
-    castRayFromVector(origin: THREE.Vector3, direction: THREE.Vector3, items?: THREE.Mesh<THREE.BufferGeometry<THREE.NormalBufferAttributes>, THREE.Material | THREE.Material[], THREE.Object3DEventMap>[]): THREE.Intersection<THREE.Object3D<THREE.Object3DEventMap>> | null;
+    castRayFromVector(origin: THREE.Vector3, direction: THREE.Vector3, items?: THREE.Mesh<THREE.BufferGeometry<THREE.NormalBufferAttributes, THREE.BufferGeometryEventMap>, THREE.Material | THREE.Material[], THREE.Object3DEventMap>[]): THREE.Intersection<THREE.Object3D<THREE.Object3DEventMap>> | null;
     private intersect;
     private filterClippingPlanes;
 }
@@ -3727,7 +5308,7 @@ export declare class SimpleWorld<T extends BaseScene = BaseScene, U extends Base
     /**
      * All the loaded [meshes](https://threejs.org/docs/#api/en/objects/Mesh). These meshes will be taken into account in operations like raycasting.
      */
-    readonly meshes: Set<THREE.Mesh<THREE.BufferGeometry<THREE.NormalBufferAttributes>, THREE.Material | THREE.Material[], THREE.Object3DEventMap>>;
+    readonly meshes: Set<THREE.Mesh<THREE.BufferGeometry<THREE.NormalBufferAttributes, THREE.BufferGeometryEventMap>, THREE.Material | THREE.Material[], THREE.Object3DEventMap>>;
     /** {@link Updateable.onAfterUpdate} */
     readonly onAfterUpdate: Event_2<unknown>;
     /** {@link Updateable.onBeforeUpdate} */
@@ -3802,6 +5383,531 @@ export declare class SimpleWorld<T extends BaseScene = BaseScene, U extends Base
     dispose(disposeResources?: boolean): void;
 }
 
+/** A single committed slope annotation. */
+export declare interface SlopeAnnotation {
+    /** Unique identifier. */
+    uuid: string;
+    /** Anchor point of the arrow tail in drawing local space. */
+    position: THREE.Vector3;
+    /** Normalised downhill direction in the XZ plane. */
+    direction: THREE.Vector3;
+    /**
+     * Slope ratio: rise / run (e.g. `0.15` for a 15 % slope).
+     * Use {@link formatSlope} to convert to the desired display string.
+     */
+    slope: number;
+    /** Name of the {@link SlopeAnnotationStyle} to use. */
+    style: string;
+}
+
+/** Editable fields of {@link SlopeAnnotation} — everything except the `uuid`. */
+export declare type SlopeAnnotationData = Omit<SlopeAnnotation, "uuid">;
+
+/** Global drawing system that manages slope annotations across all {@link TechnicalDrawing} instances. */
+export declare class SlopeAnnotations extends AnnotationSystem<SlopeAnnotationSystem> implements Disposable_2 {
+    enabled: boolean;
+    readonly _item: SlopeAnnotation;
+    /**
+     * Because slope data comes from the 3D model, there is no state machine.
+     * Call {@link add} directly with the computed slope values:
+     * ```ts
+     * slopes.add(drawing, { position, direction, slope, style: "default" });
+     * ```
+     */
+    constructor(components: Components);
+    pickHandle(_drawing: TechnicalDrawing, _ray: THREE.Ray, _threshold?: number): {
+        uuid: string;
+        handle: string;
+    } | null;
+    protected _buildGroup(ann: SlopeAnnotation, style: SlopeAnnotationStyle): THREE.Group;
+}
+
+/** Visual appearance of a slope annotation. */
+export declare interface SlopeAnnotationStyle extends BaseAnnotationStyle {
+    /** Tick mark builder at the downhill tip of the arrow. */
+    lineTick: LineTickBuilder;
+    /** Optional filled tick mark builder at the downhill tip. */
+    meshTick?: MeshTickBuilder;
+    /** Tick size in drawing local units. */
+    tickSize: number;
+    /** Length of the arrow shaft in drawing local units. */
+    length: number;
+    /**
+     * Distance from the arrow midpoint to the near edge of the text label,
+     * measured perpendicularly to the slope direction.
+     */
+    textOffset: number;
+    /** How the slope ratio is formatted in the text label. */
+    format: SlopeFormat;
+}
+
+declare interface SlopeAnnotationSystem {
+    item: SlopeAnnotation;
+    data: SlopeAnnotationData;
+    style: SlopeAnnotationStyle;
+    handle: string;
+}
+
+/** How the slope value is displayed in the text label. */
+export declare type SlopeFormat = "percentage" | "ratio" | "degrees";
+
+/** A single technical drawing — the core spatial aggregate. */
+export declare class TechnicalDrawing {
+    /** Unique identifier for this drawing instance. */
+    readonly uuid: string;
+    private readonly _raycaster;
+    private readonly _components;
+    /**
+     * Brings together:
+     * - A {@link three} (`THREE.Group`) that anchors the drawing in world space.
+     *   All 2D geometry (projection lines, dimensions) must be added as children of
+     *   this group so they inherit its world transform.
+     * - A collection of {@link viewports}, each defining an orthographic framing
+     *   window and owning a camera that is itself a child of the container.
+     *
+     * Moving or rotating the container repositions the entire drawing — including
+     * all its viewport cameras — in the 3D world without affecting any local
+     * coordinates.
+     *
+     * ---
+     *
+     * ### Rotation convention
+     *
+     * The drawing projects geometry along its **local −Y axis**. The drawing
+     * plane is the local **XZ plane** (Y = 0).
+     *
+     * When rotating `drawing.three`, two constraints must hold at the same time:
+     *
+     * 1. **Projection direction** — local −Y must point toward the surface you
+     *    want to capture.
+     * 2. **Text orientation** — local +X must point toward the right side of the
+     *    screen when the drawing is viewed from the projection direction.
+     *    Violating this causes annotations and dimension text to appear mirrored.
+     *
+     * For the six standard orthographic views, use {@link orientTo} — it enforces
+     * both constraints with a single call:
+     *
+     * ```ts
+     * drawing.orientTo(new THREE.Vector3(0, -1, 0)); // top / plan
+     * drawing.orientTo(new THREE.Vector3(0,  0, -1)); // front elevation
+     * ```
+     *
+     * ---
+     *
+     * Typically created via {@link TechnicalDrawings.create}.
+     */
+    constructor(components: Components);
+    /**
+     * The world that hosts this drawing. Set automatically by
+     * {@link TechnicalDrawings.create} — do not assign manually unless you are
+     * managing the drawing's scene integration yourself.
+     */
+    world: World | null;
+    /**
+     * Root Three.js group for all 2D content belonging to this drawing.
+     * All geometry (projection lines, dimensions) must be added as children so
+     * they inherit its world transform.
+     */
+    readonly three: THREE.Group<THREE.Object3DEventMap>;
+    /**
+     * Typed access to all annotation data stored on this drawing.
+     *
+     * ```ts
+     * const dims = techDrawings.use(OBC.LinearAnnotations);
+     * const data = drawing.annotations.getBySystem(dims);
+     * // DataMap<annotationUuid, LinearAnnotation>
+     * ```
+     */
+    readonly annotations: DrawingAnnotations;
+    /**
+     * Layer manager for this drawing.
+     * Use it to create layers, set colors, control visibility, and subscribe to
+     * lifecycle events for reactive UI.
+     *
+     * ```ts
+     * drawing.layers.create("walls", { color: 0x333333 });
+     * drawing.layers.setColor("walls", 0x888888);
+     * drawing.layers.setVisibility("walls", false);
+     * ```
+     */
+    readonly layers: DrawingLayers;
+    /**
+     * Name of the layer new annotations will be assigned to when added via any
+     * drawing system. Must be a layer registered via {@link DrawingLayers.create}.
+     * Defaults to `"0"`.
+     */
+    activeLayer: string;
+    /**
+     * Depth of the projection capture volume, in world units, measured from the
+     * drawing plane along the local -Y axis (the projection direction).
+     *
+     * Used by {@link TechnicalDrawingHelper} to visualise the volume, and by
+     * `addProjectionFromItems` to set the far clipping plane of the
+     * {@link EdgeProjector} automatically.
+     *
+     * Defaults to `10`.
+     */
+    far: number;
+    /** All viewports registered on this drawing, keyed by their UUID. */
+    readonly viewports: DrawingViewports;
+    /** {@link Disposable.onDisposed} */
+    readonly onDisposed: Event_2<void>;
+    /**
+     * Intersects a pre-built ray against all layer-1 `LineSegments` in this drawing.
+     *
+     * The caller is responsible for building the ray (via `THREE.Raycaster.setFromCamera`
+     * or any other method) so this method stays agnostic to which camera or canvas
+     * the pick originated from.
+     *
+     * The returned {@link DrawingIntersection.point} is in drawing **local space**
+     * (XZ plane, Y = 0), ready to use for dimension creation or snapping.
+     *
+     * @param ray - World-space ray to cast.
+     * @param viewport - The viewport the ray was built from, if any. Pass `null`
+     *   when picking from the 3D world camera.
+     * @returns The closest intersection, or `null` if nothing was hit.
+     */
+    raycast(ray: THREE.Ray, viewport?: DrawingViewport | null): DrawingIntersection | null;
+    /**
+     * Aligns this drawing to a target plane in 3D world space using three
+     * point correspondences.
+     *
+     * Pass three points picked on the drawing (in drawing local space) and
+     * three corresponding points picked on the 3D model (in world space).
+     * The drawing's container will be repositioned, rotated, and uniformly
+     * scaled so that the drawing points map to their world counterparts.
+     *
+     * @throws If either set of points is collinear or degenerate — see
+     *   {@link computeAlignmentMatrix} for details.
+     *
+     * @param drawingPoints - Three non-collinear points in drawing local space.
+     * @param worldPoints   - Three corresponding points in world space.
+     */
+    alignTo(drawingPoints: THREE.Vector3[], worldPoints: THREE.Vector3[]): void;
+    /**
+     * Projects a `THREE.LineSegments` from any world-space position onto the
+     * given drawing's local XZ plane (Y = 0), returning a new `THREE.LineSegments`
+     * ready to be added to {@link container}.
+     *
+     * Vertex coordinates are transformed from the input object's local space →
+     * world space → drawing local space, then Y is zeroed.  The input object is
+     * not modified.
+     *
+     * ```ts
+     * const projected = TechnicalDrawing.toDrawingSpace(myIFCLines, drawing);
+     * drawing.three.add(projected);
+     * ```
+     *
+     * @param ls      - Source `LineSegments` to project. Its world matrix must be
+     *   up-to-date (call `updateWorldMatrix(true, false)` if unsure).
+     * @param drawing - Target drawing whose local XZ plane is used as destination.
+     * @returns A new `LineSegments` with the projected geometry in drawing local
+     *   space. No material is assigned — set one before rendering.
+     */
+    static toDrawingSpace(ls: THREE.LineSegments, drawing: TechnicalDrawing): THREE.LineSegments;
+    /**
+     * Adds a `THREE.LineSegments` to this drawing's {@link container} and
+     * automatically computes a BVH on its geometry so that {@link raycast} can
+     * pick individual line segments efficiently.
+     *
+     * Use this instead of `drawing.three.add()` whenever the geometry will
+     * participate in picking. Plain `container.add()` still works for rendering,
+     * but without BVH the raycast falls back to a brute-force O(n) test on every
+     * segment — noticeably slow for dense projections.
+     *
+     * The layer assignment and Three.js rendering-layer setup (layer 1) are handled
+     * internally — the caller does not need to touch `userData` or `ls.layers`.
+     * If the named layer has a color defined, it is applied to the material immediately.
+     *
+     * ```ts
+     * drawing.layers.create("walls", { color: 0x333333 });
+     * drawing.addProjectionLines(wallLines, "walls");
+     * ```
+     *
+     * @param ls    - The `LineSegments` to add.
+     * @param layer - Layer name to assign. Defaults to `"0"`. If the layer does not
+     *   exist, a warning is logged and the lines fall back to `"0"`.
+     * @returns The same `LineSegments` instance, for chaining.
+     */
+    addProjectionLines(ls: THREE.LineSegments, layer?: string): THREE.LineSegments;
+    /**
+     * Projects the visible and hidden edges of the given BIM model items onto
+     * this drawing using {@link EdgeProjector}.
+     *
+     * The projection direction is inferred from the drawing's current world
+     * orientation (local `-Y` axis). The capture volume extends from the drawing
+     * plane by {@link far} world units along that direction. Items outside the
+     * volume are excluded automatically.
+     *
+     * Both layer names must already exist on this drawing before calling this
+     * method — create them with {@link DrawingLayers.create} beforehand.
+     *
+     * ```ts
+     * drawing.layers.create("visible", { material: new THREE.LineBasicMaterial({ color: 0x000000 }) });
+     * drawing.layers.create("hidden",  { material: new THREE.LineDashedMaterial({ color: 0x888888, dashSize: 0.2, gapSize: 0.1 }) });
+     *
+     * await drawing.addProjectionFromItems(modelIdMap, {
+     *   layers: { visible: "visible", hidden: "hidden" },
+     *   onProgress: (msg, pct) => console.log(msg, pct),
+     * });
+     * ```
+     *
+     * @param modelIdMap - Items to project, keyed by model ID.
+     * @param config     - Required layer names and optional progress callback.
+     */
+    addProjectionFromItems(modelIdMap: ModelIdMap, config: {
+        layers: {
+            visible: string;
+            hidden: string;
+        };
+        onProgress?: (message: string, progress?: number) => void;
+    }): Promise<void>;
+    /**
+     * Orients the drawing to one of the six standard orthographic projection
+     * directions.
+     *
+     * Pass any of the six axis-aligned unit vectors. The method sets
+     * `drawing.three.quaternion` to the correct rotation so that:
+     * - The drawing's local **−Y** axis aligns with `direction`.
+     * - The drawing's local **+X** axis points toward the right side of the
+     *   screen when the drawing is viewed from that direction, ensuring
+     *   annotations and text render without mirroring.
+     *
+     * ```ts
+     * drawing.orientTo(new THREE.Vector3(0, -1,  0)); // top / plan
+     * drawing.orientTo(new THREE.Vector3(0,  1,  0)); // bottom / RCP
+     * drawing.orientTo(new THREE.Vector3(0,  0, -1)); // front elevation
+     * drawing.orientTo(new THREE.Vector3(0,  0,  1)); // back elevation
+     * drawing.orientTo(new THREE.Vector3(-1, 0,  0)); // right elevation
+     * drawing.orientTo(new THREE.Vector3(1,  0,  0)); // left elevation
+     * ```
+     *
+     * A console warning is emitted if `direction` does not match any of the six
+     * standard axes.
+     *
+     * @param direction - Desired projection direction (need not be pre-normalized).
+     */
+    orientTo(direction: THREE.Vector3): void;
+    /** Disposes all viewports, layers, annotations and removes the container (and all its Three.js geometry) from memory. */
+    dispose(): void;
+}
+
+/** Visualises a {@link TechnicalDrawing}'s projection volume in the 3D scene and exposes three gizmo anchors for interactive control. */
+export declare class TechnicalDrawingHelper extends THREE.Group {
+    private readonly _drawing;
+    private readonly _topFrame;
+    private readonly _pillars;
+    private readonly _bottomFrame;
+    private readonly _topPlane;
+    private readonly _bottomPlane;
+    private readonly _frameMat;
+    private readonly _depthMat;
+    private readonly _planeMat;
+    private static readonly _FRAME_COLOR;
+    private static readonly _DEPTH_COLOR;
+    /**
+     * Width of the drawing frame indicator along the local X axis, in world
+     * units. Call {@link update} after changing this value programmatically.
+     */
+    width: number;
+    /**
+     * Height of the drawing frame indicator along the local Z axis, in world
+     * units. Call {@link update} after changing this value programmatically.
+     */
+    height: number;
+    /**
+     * Gizmo anchor positioned at the centre of the bottom frame.
+     * Pass a `TransformControls` instance to {@link attachFarGizmo} — do not
+     * manipulate this object's position directly.
+     */
+    readonly farHandle: THREE.Object3D<THREE.Object3DEventMap>;
+    /**
+     * Gizmo anchor positioned at the right-edge midpoint of the top frame.
+     * Pass a `TransformControls` instance to {@link attachWidthGizmo} — do not
+     * manipulate this object's position directly.
+     */
+    readonly widthHandle: THREE.Object3D<THREE.Object3DEventMap>;
+    /**
+     * Gizmo anchor positioned at the bottom-edge midpoint of the top frame.
+     * Pass a `TransformControls` instance to {@link attachHeightGizmo} — do not
+     * manipulate this object's position directly.
+     */
+    readonly heightHandle: THREE.Object3D<THREE.Object3DEventMap>;
+    /**
+     * Works exactly like the built-in Three.js helpers (e.g. `THREE.CameraHelper`):
+     * add it as a child of `drawing.three` so it inherits the drawing's world
+     * transform automatically.
+     *
+     * It renders on **layer 0** — visible to the perspective camera, invisible to
+     * the drawing's orthographic cameras (which only render layer 1).
+     *
+     * The helper draws three things:
+     * - A rectangular frame on the drawing plane (Y = 0 in drawing local space).
+     * - Four pillar lines dropping from each corner along the projection direction
+     *   (local −Y) to the far boundary.
+     * - A matching rectangle at the far boundary.
+     *
+     * ### Interactive control via gizmos
+     *
+     * Three `THREE.Object3D` anchors are exposed for `TransformControls`:
+     *
+     * | Anchor | Controls | Constrained axis |
+     * |---|---|---|
+     * | {@link farHandle} | `drawing.far` | local Y |
+     * | {@link widthHandle} | {@link width} (symmetric) | local X |
+     * | {@link heightHandle} | {@link height} (symmetric) | local Z |
+     *
+     * Use the corresponding `attach*Gizmo` methods instead of configuring the
+     * gizmos manually — they enforce the correct axis constraints, local space,
+     * and change listeners automatically:
+     *
+     * ```ts
+     * const helper = new TechnicalDrawingHelper(drawing);
+     * helper.width = 20;
+     * helper.height = 15;
+     * drawing.three.add(helper);
+     *
+     * // Main gizmo — full translate + rotate on drawing.three
+     * const mainGizmo = new TransformControls(camera, domElement);
+     * mainGizmo.attach(drawing.three);
+     * scene.add(mainGizmo);
+     *
+     * // Depth gizmo — controls drawing.far
+     * const farGizmo = new TransformControls(camera, domElement);
+     * scene.add(farGizmo);
+     * helper.attachFarGizmo(farGizmo);
+     *
+     * // Width gizmo
+     * const widthGizmo = new TransformControls(camera, domElement);
+     * scene.add(widthGizmo);
+     * helper.attachWidthGizmo(widthGizmo);
+     *
+     * // Height gizmo
+     * const heightGizmo = new TransformControls(camera, domElement);
+     * scene.add(heightGizmo);
+     * helper.attachHeightGizmo(heightGizmo);
+     * ```
+     *
+     * Call {@link update} after changing {@link width}, {@link height}, or
+     * `drawing.far` programmatically to rebuild the geometry.
+     */
+    constructor(drawing: DrawingProjectionSource);
+    /**
+     * Rebuilds the helper geometry and repositions all gizmo anchors to match
+     * the current {@link width}, {@link height}, and `drawing.far`. Call this
+     * whenever any of those values change programmatically.
+     */
+    update(): void;
+    /**
+     * Configures a `TransformControls` instance to control `drawing.far` and
+     * attaches it to the {@link farHandle}.
+     *
+     * The gizmo is constrained to the drawing's local Y axis (the projection
+     * direction) and wired to update `drawing.far` on every change. Call this
+     * once — calling it again on the same gizmo accumulates listeners.
+     *
+     * @param gizmo - A `TransformControls` instance (or any {@link AxisGizmoLike}).
+     */
+    attachFarGizmo(gizmo: AxisGizmoLike): void;
+    /**
+     * Configures a `TransformControls` instance to control {@link width} and
+     * attaches it to the {@link widthHandle}.
+     *
+     * The gizmo is constrained to the drawing's local X axis. Width grows
+     * symmetrically — dragging the right-edge handle outward expands both sides.
+     *
+     * @param gizmo - A `TransformControls` instance (or any {@link AxisGizmoLike}).
+     */
+    attachWidthGizmo(gizmo: AxisGizmoLike): void;
+    /**
+     * Configures a `TransformControls` instance to control {@link height} and
+     * attaches it to the {@link heightHandle}.
+     *
+     * The gizmo is constrained to the drawing's local Z axis. Height grows
+     * symmetrically — dragging the bottom-edge handle outward expands both sides.
+     *
+     * @param gizmo - A `TransformControls` instance (or any {@link AxisGizmoLike}).
+     */
+    attachHeightGizmo(gizmo: AxisGizmoLike): void;
+    /** Releases all Three.js geometry and material resources. */
+    dispose(): void;
+}
+
+/** OBC Component that creates and manages {@link TechnicalDrawing} instances. */
+export declare class TechnicalDrawings extends Component implements Disposable_2 {
+    /**
+     * A unique identifier for the component.
+     * This UUID is used to register the component within the Components system.
+     */
+    static readonly uuid: "5c7d3b9a-4e8f-4a2b-9c1d-0e3f2a5b7c8d";
+    /** {@link Component.enabled} */
+    enabled: boolean;
+    /** All active drawings, keyed by their UUID. */
+    readonly list: FRAGS.DataMap<string, TechnicalDrawing>;
+    /**
+     * Global system instances keyed by their constructor.
+     * Register a system with {@link use}; inspect or iterate here for UI purposes.
+     */
+    readonly systems: FRAGS.DataMap<Function, AnnotationSystem<any>>;
+    /** {@link Disposable.onDisposed} */
+    readonly onDisposed: Event_2<unknown>;
+    /**
+     * A TechnicalDrawing is a 2D drawing plane that lives in 3D world space.
+     * It contains projection lines and dimension annotations (layer 1 geometry)
+     * framed by one or more orthographic {@link DrawingViewport}s.
+     *
+     * The drawing's `container` (a `THREE.Group`) can be freely transformed in the
+     * 3D world — all viewports and geometry move together as a single unit.
+     *
+     * @example
+     * ```ts
+     * const techDrawings = components.get(TechnicalDrawings);
+     * const drawing = techDrawings.create(world);
+     *
+     * // Add layer-1 geometry to the drawing
+     * const lines = new THREE.LineSegments(geometry, material);
+     * lines.layers.set(1);
+     * drawing.three.add(lines);
+     *
+     * // Add viewports
+     * const vp = drawing.viewports.create({ left: -1, right: 5, top: 1, bottom: -4 });
+     * ```
+     */
+    constructor(components: Components);
+    /**
+     * Returns the global singleton instance of the given system, creating it if it
+     * does not yet exist. The system constructor must accept `Components` as its
+     * only argument (new-style global systems). Safe to call multiple times — always
+     * returns the same instance.
+     *
+     * ```ts
+     * const dims = techDrawings.use(OBC.LinearAnnotations);
+     * dims.styles.set("default", { ... });
+     * ```
+     */
+    use<T extends AnnotationSystem<any>>(SystemClass: new (components: Components) => T): T;
+    /**
+     * Creates a new {@link TechnicalDrawing} hosted in the given world.
+     *
+     * The drawing's Three.js group is added to the world's scene and its
+     * lifecycle is tied to the world — it is automatically removed when the
+     * world is disposed. Three.js rendering layer 1 is enabled on the world
+     * camera so that annotation geometry is visible in the 3D view. Both
+     * perspective and orthographic cameras are configured when using
+     * {@link OrthoPerspectiveCamera}.
+     *
+     * To hide the drawing from the 3D view without removing it from the world,
+     * either set `drawing.three.visible = false` or disable layer 1 on the
+     * world camera: `world.camera.three.layers.disable(1)`.
+     *
+     * @param world - The world that will host this drawing.
+     * @returns The newly created drawing.
+     */
+    create(world: World): TechnicalDrawing;
+    /** {@link Disposable.dispose} */
+    dispose(): void;
+}
+
 export declare interface TextSetSettingControl {
     type: "TextSet";
     value: Set<string>;
@@ -3938,6 +6044,51 @@ export declare class Topic implements BCFTopic {
     serialize(): string;
 }
 
+/**
+ * Whether this component manages its interaction through an explicit state machine.
+ * @template TState - Discriminated union of all valid states (each with a `kind` string).
+ * @template TEvent - Discriminated union of all accepted events (each with a `type` string).
+ */
+export declare interface Transitionable<TState extends {
+    kind: string;
+}, TEvent extends {
+    type: string;
+}> {
+    /** The current state. TypeScript guarantees it is always a valid, well-typed state. */
+    readonly machineState: TState;
+    /**
+     * Dispatches an event to the machine, producing a deterministic state transition.
+     * Events that do not apply to the current state are silently ignored.
+     */
+    sendMachineEvent(event: TEvent): void;
+    /** Fired synchronously after every state transition with the new state as payload. */
+    readonly onMachineStateChanged: Event_2<TState>;
+}
+
+/** Built-in {@link DimensionUnit} presets. */
+export declare const Units: {
+    readonly m: {
+        readonly factor: 1;
+        readonly suffix: "m";
+    };
+    readonly cm: {
+        readonly factor: 100;
+        readonly suffix: "cm";
+    };
+    readonly mm: {
+        readonly factor: 1000;
+        readonly suffix: "mm";
+    };
+    readonly ft: {
+        readonly factor: 3.28084;
+        readonly suffix: "ft";
+    };
+    readonly in: {
+        readonly factor: 39.3701;
+        readonly suffix: "in";
+    };
+};
+
 /** Whether this component should be updated each frame. */
 export declare interface Updateable {
     /** Actions that should be executed after updating the component. */
@@ -4609,6 +6760,18 @@ export declare interface ViewpointVisibility {
     };
 }
 
+/**
+ * Minimal interface consumed by {@link DrawingViewportHelper}.
+ * Satisfied by {@link DrawingViewport} without a direct import, which keeps
+ * the two classes free of circular dependencies.
+ */
+declare interface ViewportBoundsController {
+    left: number;
+    right: number;
+    top: number;
+    bottom: number;
+}
+
 /**
  * The `Views` class is responsible for managing and interacting with a collection of 2D sections. It provides methods for creating, opening, closing, and managing views, as well as generating views from specific configurations such as IFC storeys or bounding boxes. 📕 [Tutorial](https://docs.thatopen.com/Tutorials/Components/Core/Views). 📘 [API](https://docs.thatopen.com/api/@thatopen/components/classes/Views).
  */