@sakuzu/maplibre-gl-draw 1.0.0

package/dist/modes/select/drag-handler.js

@@ -0,0 +1,254 @@
+// SPDX-FileCopyrightText: 2026 SAKAIDA Atsushi
+// SPDX-License-Identifier: AGPL-3.0-only
+import { isInteractionBlocked } from '../../store/lock.js';
+import { getSelectedFeatureIds } from '../../view/ui/helper.js';
+import { resolveAuxiliaryDrag } from './drag/auxiliary.js';
+import { IntermediateWrites } from './drag/intermediate-writes.js';
+import { startMoveDrag } from './drag/move.js';
+import { startRadiusDrag } from './drag/radius.js';
+import { startResizeDrag, startRotateDrag } from './drag/transform.js';
+import { startMidpointDrag, startVertexDrag } from './drag/vertex.js';
+/**
+ * SelectModeDragHandler
+ *
+ * Responsible for starting, forwarding and ending the drag operations of select mode
+ *
+ * @internal
+ */
+export class SelectModeDragHandler {
+    constructor() {
+        /** The running drag operation */
+        Object.defineProperty(this, "operation", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        /** The intermediate writes of the running drag, committed or aborted when it ends */
+        Object.defineProperty(this, "writes", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new IntermediateWrites()
+        });
+        /**
+         * The features announced by drag:start, while drag:end has not been sent for them
+         *
+         * drag:end always follows, with the same IDs, whether the drag is committed or aborted, so a
+         * plugin that opens a scope on drag:start always closes it.
+         */
+        Object.defineProperty(this, "hookedFeatureIds", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "hookPluginManager", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        /**
+         * The selection scope of the draw instance the current drag belongs to (the resize and
+         * rotate strategies of custom types, and the auxiliary handle providers). Set by startDrag
+         */
+        Object.defineProperty(this, "scope", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+    }
+    /**
+     * Start a drag operation
+     */
+    startDrag(hitResult, event, context, bbox) {
+        const { store, pluginManager } = context;
+        this.scope = context.selectionScope;
+        // Selection-independent auxiliary handles (getGlobalHandles) have no feature they sit on,
+        // so they cannot pass the selection-bound gates (existence of a selection / bbox / feature
+        // lock). Instead, the decision is made only from the map-wide suppressions (readOnly /
+        // interaction lock). As with auxiliary handles on a selection, if delegation is refused
+        // nothing is started (dragPan is not stopped either).
+        if (hitResult.type === 'auxiliary' && hitResult.auxiliary?.global) {
+            if (store.isReadOnly() || store.isInteractionLocked())
+                return;
+            const globalDrag = resolveAuxiliaryDrag(hitResult, event, this.scope);
+            if (!globalDrag)
+                return;
+            context.map.dragPan.disable();
+            this.writes.discard(store);
+            this.operation = globalDrag;
+            store.setDragState({ operation: 'auxiliary' });
+            return;
+        }
+        // Group / layer selections are also resolved to their member features (so that a group is
+        // moved / resized / rotated as one).
+        const selectedIds = getSelectedFeatureIds(store);
+        const selectedFeatures = selectedIds
+            .map((id) => store.getFeature(id))
+            .filter((f) => f !== undefined);
+        if (selectedFeatures.length === 0 || !bbox) {
+            return;
+        }
+        // Do not start a drag operation while editing interaction is suppressed
+        // (selection is allowed, only operations are forbidden). There are 3 suppression conditions:
+        //   - readOnly: writes are no-ops, so move/resize/rotate/vertex are not started
+        //   - interaction lock: the all-feature operation suppression the application applies, for
+        //     example in a read-only state
+        //   - feature locked: the individual lock on that feature (itself / its group / its layer)
+        if (selectedFeatures.some((f) => isInteractionBlocked(f, store))) {
+            return;
+        }
+        // Core attaches no meaning to auxiliary handles, so first ask the provider whether it
+        // accepts the delegation. If it refuses, core starts nothing (dragPan is not stopped either
+        // = the same as not having grabbed anything). Because the gates above have been passed,
+        // this point is not reached while readOnly / interaction lock / feature lock is in effect.
+        let auxiliaryDrag = null;
+        if (hitResult.type === 'auxiliary') {
+            auxiliaryDrag = resolveAuxiliaryDrag(hitResult, event, this.scope);
+            if (!auxiliaryDrag)
+                return;
+        }
+        // Notify plugins that the drag has started. Auxiliary handles are excluded: core writes no
+        // intermediate updates to the Store and the provider commits through its own transaction, so
+        // putting them on the editing scope of drag:start / drag:end would
+        // have the record of the commit transaction swallowed by that scope.
+        if (hitResult.type !== 'auxiliary') {
+            pluginManager?.runHook('drag:start', { featureIds: [...selectedIds] }, { source: 'local' });
+            this.hookedFeatureIds = [...selectedIds];
+            this.hookPluginManager = pluginManager ?? null;
+        }
+        // Disable MapLibre's map dragging
+        context.map.dragPan.disable();
+        // Make sure no record from the previous drag remains (normally emptied by the reset in
+        // endDrag)
+        this.writes.discard(store);
+        switch (hitResult.type) {
+            case 'move':
+                this.begin(startMoveDrag(event, [...selectedIds], store));
+                // Record the features being moved. Snapping excludes them from its candidates (snapping
+                // to itself pulls the cursor back, shifting by the grab offset and making it look like
+                // it vibrates)
+                store.setDragState({ operation: 'move', movingFeatureIds: [...selectedIds] });
+                break;
+            case 'resize':
+                this.begin(startResizeDrag(event, hitResult.handle, bbox, selectedFeatures, context.map, this.scope));
+                store.setDragState({ operation: 'resize' });
+                break;
+            case 'rotate':
+                this.begin(startRotateDrag(event, bbox, selectedFeatures, store, this.scope));
+                break;
+            case 'vertex':
+                this.begin(startVertexDrag(event, hitResult.featureId, hitResult.vertexRef, context));
+                break;
+            case 'midpoint':
+                this.begin(startMidpointDrag(event, hitResult.featureId, hitResult.vertexRef, store));
+                // For midpoint, the newly added vertex is afterIndex + 1 in the same part and same ring
+                store.setDragState({
+                    operation: 'midpoint',
+                    activeVertex: {
+                        ...hitResult.vertexRef,
+                        index: hitResult.vertexRef.index + 1,
+                    },
+                    activeFeatureId: hitResult.featureId,
+                });
+                break;
+            case 'radius':
+                this.begin(startRadiusDrag(hitResult.featureId, store));
+                store.setDragState({ operation: 'radius' });
+                break;
+            case 'auxiliary':
+                // Delegation is already done above (we only get here when it was accepted)
+                this.begin(auxiliaryDrag);
+                store.setDragState({ operation: 'auxiliary' });
+                break;
+        }
+    }
+    /**
+     * Make a started operation the running one. An operation that could not start (its feature
+     * or vertex is gone) leaves the handler as it was
+     */
+    begin(operation) {
+        if (operation)
+            this.operation = operation;
+    }
+    /**
+     * Update during a drag
+     * Note: re-rendering is triggered automatically by RenderCoordinator subscribing to Store
+     * changes
+     */
+    updateDrag(event, context) {
+        const { store } = context;
+        // One frame of a drag is one change: the updates of every feature it moves reach the
+        // subscribers in a single notification
+        store.transact(() => this.operation?.update(event, store, this.writes));
+    }
+    /**
+     * End the drag operation
+     *
+     * @param event The drag end event (passed to the auxiliary handle's delegate. When omitted,
+     *   the last move / start event that was forwarded is used)
+     */
+    endDrag(context, event) {
+        const { store, pluginManager } = context;
+        const wasAuxiliary = this.operation?.type === 'auxiliary';
+        // The drag always ends: whatever the delegate, the commit or a plugin throws, map dragging
+        // is re-enabled and the drag state is cleared, so that the UI never stays stuck in a drag.
+        try {
+            // Tell a delegate that the drag has ended (for an auxiliary handle core has written
+            // nothing to the Store)
+            this.operation?.finish?.(event);
+            // Commit the intermediate updates made during the drag in a single transaction before
+            // notifying drag:end (plugins see the state after the commit). If no feature was touched,
+            // do nothing.
+            this.writes.commit(store);
+            // Notify plugins that the drag has ended (paired with drag:start, with the same IDs even
+            // when the selection changed during the drag; auxiliary handles are excluded)
+            if (!wasAuxiliary)
+                this.endDragHook(pluginManager);
+        }
+        finally {
+            // Re-enable MapLibre's map dragging
+            context.map.dragPan.enable();
+            // Clear the drag state
+            store.setDragState(null);
+            this.reset(store);
+        }
+    }
+    /**
+     * Reset the state
+     *
+     * @param store When passed, the highlight of the following vertices (UI state) is cleared as
+     *   well. The cleanup is the same whether the drag was committed or aborted.
+     */
+    reset(store) {
+        // Even on an abort (mode switch / a change from outside), end is delivered to the delegate
+        // exactly once. When coming through endDrag it has already been delivered, so nothing
+        // happens here.
+        this.operation?.finish?.();
+        this.operation = null;
+        this.writes.discard(store);
+        store?.setFollowedVertices?.(null);
+        // An aborted drag still closes what drag:start opened (after the features are restored)
+        this.endDragHook(this.hookPluginManager ?? undefined);
+    }
+    /**
+     * Sends the drag:end that pairs with the drag:start of the current drag, once
+     */
+    endDragHook(pluginManager) {
+        const featureIds = this.hookedFeatureIds;
+        this.hookedFeatureIds = null;
+        this.hookPluginManager = null;
+        if (!featureIds)
+            return;
+        pluginManager?.runHook('drag:end', { featureIds }, { source: 'local' });
+    }
+    /**
+     * Whether a drag operation is active
+     */
+    isActive() {
+        return this.operation !== null;
+    }
+}

package/dist/modes/select/hit-helpers.d.ts

@@ -0,0 +1,40 @@
+/**
+ * Shared hit test helpers for SelectMode
+ *
+ * Provides "building the callback that obtains the additional resize handles for a custom
+ * feature" and "building the callback that enumerates the auxiliary handles provided by an
+ * extension implementation", both used in common by onMouseDown / onMouseMove / onDragStart.
+ * There are 2 kinds of auxiliary handles: those bound to the selected feature (getHandles) and
+ * those independent of the selection (getGlobalHandles).
+ */
+import type { Feature } from '../../store/types.js';
+import type { AuxiliaryHandlesCallback } from '../../view/ui/handle-test.js';
+import type { HandleInfo } from '../../view/ui/handles.js';
+import type { SelectionScope } from '../../view/ui/selection-scope.js';
+import type { BoundingBoxCoords } from '../../view/ui/selection-ui/index.js';
+/**
+ * Obtain the callback that computes the additional resize handles of a custom feature.
+ *
+ * The additional handles are obtained from the custom feature handler only for a single
+ * selection. The callback is uniformly shaped to receive the bbox after the margin is applied.
+ */
+export declare function getAdditionalResizeHandlesCallback(features: Feature[], scope: SelectionScope): ((marginedBbox: BoundingBoxCoords) => HandleInfo[]) | undefined;
+/**
+ * Obtain the callback that enumerates the auxiliary handles provided by extension
+ * implementations.
+ *
+ * Every provider registered in this draw instance is gathered, only for a single selection (the same restriction as
+ * for the additional resize handles). When not a single provider is registered, undefined is
+ * returned and the caller does not perform the auxiliary handle test at all (it takes the
+ * conventional path).
+ */
+export declare function getAuxiliaryHandlesCallback(features: Feature[], scope: SelectionScope): AuxiliaryHandlesCallback | undefined;
+/**
+ * Obtain the callback that enumerates the "selection-independent auxiliary handles" provided by
+ * extension implementations.
+ *
+ * It takes no argument because it does not care whether there is a selection. When not a single
+ * provider implements getGlobalHandles, undefined is returned and the caller does not perform
+ * the test at all (it takes the conventional path).
+ */
+export declare function getGlobalAuxiliaryHandlesCallback(scope: SelectionScope): AuxiliaryHandlesCallback | undefined;

package/dist/modes/select/hit-helpers.js

@@ -0,0 +1,51 @@
+// SPDX-FileCopyrightText: 2026 SAKAIDA Atsushi
+// SPDX-License-Identifier: AGPL-3.0-only
+/**
+ * Obtain the callback that computes the additional resize handles of a custom feature.
+ *
+ * The additional handles are obtained from the custom feature handler only for a single
+ * selection. The callback is uniformly shaped to receive the bbox after the margin is applied.
+ */
+export function getAdditionalResizeHandlesCallback(features, scope) {
+    if (features.length !== 1)
+        return undefined;
+    const feature = features[0];
+    const calculator = scope.extensions.getAdditionalResizeHandlesCalculator(feature.type);
+    if (!calculator)
+        return undefined;
+    return (marginedBbox) => calculator(feature, marginedBbox);
+}
+/**
+ * Obtain the callback that enumerates the auxiliary handles provided by extension
+ * implementations.
+ *
+ * Every provider registered in this draw instance is gathered, only for a single selection (the same restriction as
+ * for the additional resize handles). When not a single provider is registered, undefined is
+ * returned and the caller does not perform the auxiliary handle test at all (it takes the
+ * conventional path).
+ */
+export function getAuxiliaryHandlesCallback(features, scope) {
+    if (features.length !== 1)
+        return undefined;
+    const providers = scope.auxiliaryHandles.list();
+    if (providers.length === 0)
+        return undefined;
+    const feature = features[0];
+    return (context) => providers.flatMap((provider) => provider.getHandles(feature, context).map((handle) => ({ providerId: provider.id, handle })));
+}
+/**
+ * Obtain the callback that enumerates the "selection-independent auxiliary handles" provided by
+ * extension implementations.
+ *
+ * It takes no argument because it does not care whether there is a selection. When not a single
+ * provider implements getGlobalHandles, undefined is returned and the caller does not perform
+ * the test at all (it takes the conventional path).
+ */
+export function getGlobalAuxiliaryHandlesCallback(scope) {
+    const providers = scope.auxiliaryHandles.list().filter((p) => p.getGlobalHandles !== undefined);
+    if (providers.length === 0)
+        return undefined;
+    return (context) => providers.flatMap((provider) => provider
+        .getGlobalHandles?.(context)
+        .map((handle) => ({ providerId: provider.id, handle })) ?? []);
+}

package/dist/modes/select/mode.d.ts

@@ -0,0 +1 @@
+export {};