@defra/interactive-map 0.0.31-alpha → 0.0.33-alpha

package/plugins/beta/draw-ol/dist/esm/im-draw-ol-plugin.js

@@ -1 +1 @@
-import e from"@babel/runtime/helpers/defineProperty";import{useEffect as t}from"preact/compat";import r from"@babel/runtime/helpers/asyncToGenerator";import n from"ol/layer/Vector.js";import a from"ol/source/Vector.js";import o from"ol/format/GeoJSON.js";import i from"ol/style/Style.js";import l from"ol/style/Fill.js";import d from"ol/style/Stroke.js";import s from"ol/style/Circle.js";import p from"ol/layer/VectorTile.js";import c from"ol/Feature.js";import u from"ol/geom/Point.js";import{Style as v}from"ol/style.js";import f from"ol/interaction/Interaction.js";import h from"@babel/runtime/helpers/objectWithoutProperties";function y(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function m(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?y(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):y(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}var g={SET_MODE:(e,t)=>m(m({},e),{},{mode:t}),SET_FEATURE:(e,t)=>m(m({},e),{},{feature:void 0===t.feature?e.feature:t.feature,tempFeature:void 0===t.tempFeature?e.tempFeature:t.tempFeature}),SET_SELECTED_VERTEX_INDEX:(e,t)=>m(m({},e),{},{selectedVertexIndex:t.index,numVertices:t.numVertices}),SET_UNDO_STACK_LENGTH:(e,t)=>m(m({},e),{},{undoStackLength:t}),TOGGLE_SNAP:e=>m(m({},e),{},{snap:!e.snap}),SET_HAS_SNAP_LAYERS:(e,t)=>m(m({},e),{},{hasSnapLayers:!!t})},_={APP_ADD_MARKER:"app:addmarker",APP_UPDATE_MARKER:"app:updatemarker",APP_REMOVE_MARKER:"app:removemarker",APP_SET_MODE:"app:setmode",APP_REVERT_MODE:"app:revertmode",APP_ADD_BUTTON:"app:addbutton",APP_TOGGLE_BUTTON_STATE:"app:togglebuttonstate",APP_ADD_PANEL:"app:addpanel",APP_REMOVE_PANEL:"app:removepanel",APP_SHOW_PANEL:"app:showpanel",APP_HIDE_PANEL:"app:hidepanel",APP_ADD_CONTROL:"app:addcontrol",APP_READY:"app:ready",APP_OPENED:"app:opened",APP_CLOSED:"app:closed",APP_PANEL_OPENED:"app:panelopened",APP_PANEL_CLOSED:"app:panelclosed",MAP_SET_STYLE:"map:setstyle",MAP_SET_SIZE:"map:setsize",MAP_SET_FEATURES:"map:setfeatures",MAP_SET_ACTIVE_FEATURE:"map:setactivefeature",MAP_SELECT_FEATURE:"map:selectfeature",MAP_SET_PIXEL_RATIO:"map:setpixelratio",MAP_FIT_TO_BOUNDS:"map:fittobounds",MAP_SET_VIEW:"map:setview",MAP_INIT_MAP_STYLES:"map:initmapstyles",MAP_STYLE_CHANGE:"map:stylechange",MAP_LOADED:"map:loaded",MAP_READY:"map:ready",MAP_SIZE_CHANGE:"map:sizechange",MAP_FIRST_IDLE:"map:firstidle",MAP_MOVE_START:"map:movestart",MAP_MOVE:"map:move",MAP_MOVE_END:"map:moveend",MAP_STATE_UPDATED:"map:stateupdated",MAP_DATA_CHANGE:"map:datachange",MAP_RENDER:"map:render",MAP_CLICK:"map:click",MAP_DESTROY:"map:destroy"},S="EPSG:27700",P=new o({dataProjection:S,featureProjection:S}),w=()=>{var e=new a;return{source:e,getOL(t){var r;return null!==(r=e.getFeatureById(String(t)))&&void 0!==r?r:null},add(t){var r=this.getOL(t.id);r&&e.removeFeature(r);var n=P.readFeature(t);return e.addFeature(n),n},get(e){var t=this.getOL(e);return t?P.writeFeatureObject(t):null},remove(t){var r=this.getOL(t);r&&e.removeFeature(r)},clear(){e.clear()},toGeoJSON:e=>P.writeFeatureObject(e),fromGeoJSON:e=>P.readFeature(e)}},E={outer:11,mid:8,inner:6},O={outer:9,mid:6,inner:4},b=(e,t,r,n,a)=>{e.beginPath(),e.arc(t,r,n,0,2*Math.PI),e.fillStyle=a,e.fill()},A=(e,t,r)=>{var{outer:n,mid:a,inner:o}=e;return(e,i)=>{var l=i.context,d=i.pixelRatio,[s,p]=e;l.save(),b(l,s,p,n*d,t.editActive),b(l,s,p,a*d,t.editHalo),b(l,s,p,o*d,t[r]),l.restore()}},T=e=>e.charAt(0).toUpperCase()+e.slice(1),j=e=>{var t=new i({image:new s({radius:6,fill:new l({color:e.editVertex})})}),r=new i({renderer:A(E,e,"editVertex")}),n=new i({image:new s({radius:4,fill:new l({color:e.editMidpoint})})}),a=new i({renderer:A(O,e,"editMidpoint")}),o=new i({stroke:new d({color:e.editStroke,width:2}),fill:new l({color:e.shapeFill})}),p=new i({stroke:new d({color:e.editStroke,width:2}),fill:new l({color:e.shapeFill})}),c=new i({image:new s({radius:5,fill:new l({color:e.editVertex})})});return{vertexStyle:t,selectedVertexStyle:r,midpointStyle:n,selectedMidpointStyle:a,editFeatureStyle:o,createSketchStyle:()=>e=>"Point"===e.getGeometry().getType()?[c]:[p],createFeatureStyle:()=>t=>{var r=t.getProperties(),n=e.mapStyleId,a=n&&r["stroke".concat(T(n))]||r.stroke||e.shapeStroke,o=n&&r["fill".concat(T(n))]||r.fill||e.shapeFill,s=r.strokeWidth||e.strokeWidth;return[new i({stroke:new d({color:a,width:s}),fill:new l({color:o})})]}}},M={editStroke:{light:"#1a65a6",dark:"#ffffff"},editVertex:{light:"#1a65a6",dark:"#ffffff"},editMidpoint:{light:"#1a65a6",dark:"#ffffff"},editHalo:{light:"#ffffff",dark:"rgba(11,12,12,1)"},editActive:{light:"#000000",dark:"#ffffff"},splitInvalid:{light:"rgba(29,112,184,1)",dark:"rgba(29,112,184,1)"},splitValid:{light:"rgba(29,112,184,1)",dark:"rgba(29,112,184,1)"},shapeStroke:"#1a65a6",shapeFill:"rgba(26,101,166,0.1)",strokeWidth:2,snapVertex:"rgba(212,53,28,0.5)",snapMidpoint:"rgba(40,161,151,1)",snapEdge:"rgba(29,112,184,0.5)",snapRadius:10},k=function(e){var t,r,n,a=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},o=null!==(t=null==e?void 0:e.mapColorScheme)&&void 0!==t?t:"light",i=null!==(r=null==e?void 0:e.id)&&void 0!==r?r:null,l=e=>{var t;return((e,t,r)=>"object"!=typeof e||null===e?e:r&&void 0!==e[r]?e[r]:void 0!==e[t]?e[t]:void 0!==e.light?e.light:Object.values(e)[0])(null!==(t=a[e])&&void 0!==t?t:M[e],o,i)};return{editStroke:l("editStroke"),editVertex:l("editVertex"),editMidpoint:l("editMidpoint"),editActive:l("editActive"),editHalo:l("editHalo"),shapeStroke:l("shapeStroke"),strokeWidth:null!==(n=a.strokeWidth)&&void 0!==n?n:M.strokeWidth,shapeFill:l("shapeFill"),snapVertex:l("snapVertex"),snapEdge:l("snapEdge"),mapStyleId:i}},D=(e,t)=>{var r=e[0]-t[0],n=e[1]-t[1];return r*r+n*n},x=(e,t,r)=>{var n=r[0]-t[0],a=r[1]-t[1],o=n*n+a*a;if(0===o)return[t[0],t[1]];var i=Math.max(0,Math.min(1,((e[0]-t[0])*n+(e[1]-t[1])*a)/o));return[t[0]+i*n,t[1]+i*a]},I=(e,t)=>L(e,t)?t:e,L=(e,t)=>e?!!t&&("edge"===e.type&&"vertex"===t.type||("vertex"!==e.type||"edge"!==t.type)&&t.distSq<e.distSq):!!t,C=(e,t,r,n)=>{for(var a=null,o=n&&e.length>1?e.length-1:e.length,i=n?o:o-1,l=0;l<o;l++){var d=e[l],s=D(t,d);s<=r&&(a=I(a,{type:"vertex",coord:[d[0],d[1]],distSq:s}))}for(var p=0;p<i;p++){var c=e[p],u=e[(p+1)%o],v=x(t,c,u),f=D(t,v);f<=r&&(a=I(a,{type:"edge",coord:v,distSq:f}))}return a},V=(e,t,r,n,a,o)=>{for(var i=null,l=0;l<r;l++){var d=t+2*l,s=[e[d],e[d+1]],p=D(a,s);p<=o&&(i=I(i,{type:"vertex",coord:s,distSq:p}))}return I(i,((e,t,r,n,a,o)=>{for(var i=null,l=0;l<n;l++){var d=t+2*l,s=t+(l+1)%r*2,p=[e[d],e[d+1]],c=[e[s],e[s+1]],u=x(a,p,c),v=D(a,u);v<=o&&(i=I(i,{type:"edge",coord:u,distSq:v}))}return i})(e,t,r,n,a,o))},R=(e,t,r,n,a,o)=>{var i=(r-t)/2;return V(e,t,i,o?i:i-1,n,a)},F={Point(e,t,r){var n=e.getCoordinates(),a=D(t,n);return a<=r?{type:"vertex",coord:[n[0],n[1]],distSq:a}:null},LineString:(e,t,r)=>C(e.getCoordinates(),t,r,!1),LinearRing:(e,t,r)=>C(e.getCoordinates(),t,r,!0),Polygon(e,t,r){var n=null;for(var a of e.getCoordinates())n=I(n,C(a,t,r,!0));return n},MultiLineString(e,t,r){var n=null;for(var a of e.getCoordinates())n=I(n,C(a,t,r,!1));return n},MultiPolygon(e,t,r){var n=null;for(var a of e.getCoordinates())for(var o of a)n=I(n,C(o,t,r,!0));return n}},N=(e,t,r)=>{var n=e.getGeometry();if(!n)return null;var a=F[n.getType()];return a?a(n,t,r):null},W=(e,t)=>t?e?"vertex"===e.type&&"edge"===t.type?e:"edge"===e.type&&"vertex"===t.type||t.distSq<e.distSq?t:e:t:e,H=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[],r=new Set,a=[],o=e=>{for(var t of(r=new Set,a=[],null!=e?e:[]))"string"==typeof t?r.add(t):t instanceof n&&a.push(t)};o(t);return{query:(t,n)=>{var o=e.getView().getResolution();if(!o)return null;var i=n*o,l=i*i,d=[t[0]-i,t[1]-i,t[0]+i,t[1]+i],s=null;for(var c of a){var u=c.getSource();if(u)for(var v of u.getFeaturesInExtent(d))s=W(s,N(v,t,l))}if(r.size>0){var f=(e=>{var t=[];return e.getLayers().forEach(e=>{e instanceof p&&t.push(e)}),t})(e),h=f.length>0?e.getPixelFromCoordinate(t):null;h&&e.forEachFeatureAtPixel(h,(e,n)=>{var a;r.has(null===(a=e.get("mapbox-layer"))||void 0===a?void 0:a.id)&&(s=W(s,((e,t,r)=>{var n=e.getType(),a=e.getFlatCoordinates(),o=null;if("Point"===n){var i=D(t,a);i<=r&&(o=I(o,{type:"vertex",coord:[a[0],a[1]],distSq:i}))}else if("LineString"===n)o=I(o,R(a,0,a.length,t,r,!1));else if("Polygon"===n||"MultiLineString"===n){var l=e.getEnds(),d=0,s="Polygon"===n;for(var p of l)o=I(o,R(a,d,p,t,r,s)),d=p}return o})(e,t,l)))},{hitTolerance:n,layerFilter:e=>f.includes(e)})}return s?{type:s.type,coord:s.coord}:null},setLayers:o}},G=e=>(t,r)=>{var n=r.context,[a,o]=t;n.beginPath(),n.arc(a,o,10*r.pixelRatio,0,2*Math.PI),n.fillStyle=e,n.fill()},U=e=>({vertex:new v({renderer:G(e.snapVertex)}),edge:new v({renderer:G(e.snapEdge)})}),B=new Set(["pointermove","pointerdrag","pointerdown","pointerup","singleclick","click"]),q=(e,t,r,o)=>{if(null==t||!t.length)return null;var i=H(e,t),l=((e,t)=>{var r=U(t),o=new a,i=new n({source:o,style:e=>{var t;return null!==(t=r[e.get("snapType")])&&void 0!==t?t:null},zIndex:200,updateWhileAnimating:!0,updateWhileInteracting:!0});e.addLayer(i);var l=new c,d=!1;return{show(e,t){l.setGeometry(new u(e)),l.set("snapType",t,!0),d?o.changed():(o.addFeature(l),d=!0)},hide(){d&&(o.clear(),d=!1)},updateColors(e){r=U(e),d&&o.changed()},remove(){o.clear(),e.removeLayer(i)}}})(e,r),d=((e,t,r)=>{var n=new f({handleEvent(a){if(!n.getActive())return!0;var{type:o}=a;if("pointerout"===o||"pointerleave"===o)return t.hide(),!0;if(!B.has(o))return!0;var i=e.query(a.coordinate,r);return i&&(a.coordinate=i.coord.slice()),"pointermove"===o?i?t.show(i.coord,i.type):t.hide():"pointerdrag"===o&&t.hide(),!0}});return n})(i,l,o);e.addInteraction(d),d.setActive(!1);var s=!1;return{snapRadius:o,apply(e){if(!s)return e;var t=i.query(e,o);return t?(l.show(t.coord,t.type),t.coord):(l.hide(),e)},hideIndicator(){l.hide()},setActive(e){s=e,d.setActive(e),e||l.hide()},setSnapLayers(e){i.setLayers(null==e?null!=t?t:[]:e)},reattach(){e.removeInteraction(d),e.addInteraction(d)},updateColors(e){l.updateColors(e)},destroy(){e.removeInteraction(d),l.remove()}}};function Y(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function X(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?Y(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):Y(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}class z{constructor(e){var t,r,a,o,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};this._map=e,this._pluginConfig=i,this._mode="disabled",this._modeInstance=null,this._listeners=new Map,this.store=w(),this.undoStack=(a=e=>this.emit("undochange",e),o=[],{push(e){o.push(e),a(o.length)},pop(){var e=o.pop();return a(o.length),e},clear(){o.length=0,a(o.length)},get length(){return o.length}}),this.colors=k(null,i),this.styles=j(this.colors),this.snap=q(e,null!==(t=i.snapLayers)&&void 0!==t?t:null,this.colors,null!==(r=i.snapRadius)&&void 0!==r?r:M.snapRadius),this._layer=new n({source:this.store.source,style:this.styles.createFeatureStyle(),zIndex:100}),this._layer.set("layerId","draw"),e.addLayer(this._layer)}setMapStyle(e){var t;this.colors=k(e,this._pluginConfig),this.styles=j(this.colors),this._layer.setStyle(this.styles.createFeatureStyle()),this.store.source.changed(),null===(t=this.snap)||void 0===t||t.updateColors(this.colors),this.emit("styleschanged",this.styles)}on(e,t){this._listeners.has(e)||this._listeners.set(e,new Set),this._listeners.get(e).add(t)}off(e,t){var r;null===(r=this._listeners.get(e))||void 0===r||r.delete(t)}emit(e,t){var r;null===(r=this._listeners.get(e))||void 0===r||r.forEach(e=>e(t))}changeMode(e){var t=arguments,n=this;return r(function*(){var r,a,o=t.length>1&&void 0!==t[1]?t[1]:{};null===(r=n._modeInstance)||void 0===r||r.destroy(),n._modeInstance=null,n._mode=e;var i=X(X({},o),{},{snap:n.snap});if("draw_polygon"===e||"draw_line"===e){var{createDrawMode:l}=yield import(/* webpackChunkName: "DrawMode" */ "./DrawMode.js");n._modeInstance=l({map:n._map,manager:n,options:i})}else if("edit_vertex"===e){var{createEditMode:d}=yield import(/* webpackChunkName: "EditMode" */ "./EditMode.js");n._modeInstance=d({map:n._map,manager:n,options:i})}null===(a=n.snap)||void 0===a||a.reattach()})()}getMode(){return this._mode}done(){var e;null===(e=this._modeInstance)||void 0===e||e.done()}cancel(){var e;null===(e=this._modeInstance)||void 0===e||e.cancel(),this.changeMode("disabled")}undo(){var e;null===(e=this._modeInstance)||void 0===e||e.undo()}deleteVertex(){var e;null===(e=this._modeInstance)||void 0===e||e.deleteVertex()}setInterfaceType(e){var t,r;null===(t=this._modeInstance)||void 0===t||null===(r=t.setInterfaceType)||void 0===r||r.call(t,e)}get(e){return this.store.get(e)}add(e){return this.store.add(e)}delete(e){return this.store.remove(e)}deleteAll(){return this.store.clear()}remove(){var e,t;null===(e=this._modeInstance)||void 0===e||e.destroy(),this._modeInstance=null,null===(t=this.snap)||void 0===t||t.destroy(),this.snap=null,this.store.clear(),this._map.removeLayer(this._layer),this._listeners.clear()}}var K=["stroke","fill","strokeWidth"],Z=e=>{if(!e)return{};var t={};for(var[r,n]of Object.entries(e))if(K.includes(r)&&"object"==typeof n&&null!==n){var a=Object.entries(n);for(var[o,i]of(a.length>0&&(t[r]=a[0][1]),a))t["".concat(r).concat(o.charAt(0).toUpperCase()+o.slice(1))]=i}else t[r]=n;return t},J=["stroke","fill","strokeWidth","properties"];function Q(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function $(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?Q(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):Q(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}var ee=["stroke","fill","strokeWidth","properties"];function te(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function re(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?te(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):te(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}var ne=["stroke","fill","strokeWidth","properties"];function ae(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function oe(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?ae(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):ae(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}function ie(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function le(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?ie(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):ie(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}var de=e=>({mobile:{slot:"actions",showLabel:e},tablet:{slot:"actions",showLabel:e},desktop:{slot:"actions",showLabel:e}}),se={reducer:{initialState:{mode:null,feature:null,tempFeature:null,selectedVertexIndex:-1,numVertices:null,undoStackLength:0,snap:!1,hasSnapLayers:!1},actions:g},InitComponent:e=>{var{appState:r,appConfig:n,mapState:a,pluginConfig:o,pluginState:i,services:l,mapProvider:d,buttonConfig:s}=e,{eventBus:p}=l,{crossHair:c}=a,u=["touch","keyboard"].includes(r.interfaceType);t(()=>{var e,t,n,l,s,c=null===(e=null===(t=o.includeModes)||void 0===t?void 0:t.includes(r.mode))||void 0===e||e,u=null!==(n=null===(l=o.excludeModes)||void 0===l?void 0:l.includes(r.mode))&&void 0!==n&&n;if(a.isMapReady&&c&&!u){var{remove:v}=(e=>{var{mapProvider:t,events:r,eventBus:n,pluginConfig:a={},mapStyle:o=null}=e,{map:i}=t,l=new z(i,a);o&&l.setMapStyle(o),t.draw=l;var d=e=>{var r;t.drawScale=null!==(r={small:1,medium:1.5,large:2}[e])&&void 0!==r?r:1};n.on(r.MAP_SET_SIZE,d);var s=e=>{l.setMapStyle(e)};return n.on(r.MAP_SET_STYLE,s),{remove(){n.off(r.MAP_SET_SIZE,d),n.off(r.MAP_SET_STYLE,s),l.remove(),t.draw=null}}})({mapProvider:d,events:_,eventBus:p,pluginConfig:o,mapStyle:a.mapStyle});return i.dispatch({type:"SET_MODE",payload:null}),i.dispatch({type:"SET_HAS_SNAP_LAYERS",payload:(null===(s=o.snapLayers)||void 0===s?void 0:s.length)>0}),p.emit("draw:ready"),()=>v()}},[a.isMapReady,r.mode]),t(()=>{if(["draw_polygon","draw_line"].includes(i.mode)&&u){var e=c.isVisible;return c.fixAtCenter(),()=>{e||c.hide()}}},[i.mode,r.interfaceType]),t(()=>{"edit_vertex"===i.mode&&d.draw&&d.draw.setInterfaceType(r.interfaceType)},[r.interfaceType,i.mode]),t(()=>{if(d.draw)return function(e){var{pluginState:t,mapProvider:r,buttonConfig:n,eventBus:a}=e,{drawDone:o,drawCancel:i,drawUndo:l,drawDeletePoint:d,drawSnap:s}=n,{draw:p}=r,{dispatch:c,feature:u,tempFeature:v}=t,f=()=>{p.undoStack.clear(),c({type:"SET_MODE",payload:null}),c({type:"SET_FEATURE",payload:{feature:null,tempFeature:null}})},h=e=>{f(),p.changeMode("disabled"),a.emit("draw:created",e)},y=e=>{f(),p.changeMode("disabled"),a.emit("draw:edited",e)},m=()=>{},g=e=>{c({type:"SET_SELECTED_VERTEX_INDEX",payload:e}),a.emit("draw:vertexselection",e)},_=e=>{c({type:"SET_SELECTED_VERTEX_INDEX",payload:{index:-1,numVertices:e.numVertices}})},S=e=>{c({type:"SET_UNDO_STACK_LENGTH",payload:e})},P=e=>{a.emit("draw:updated",e)};return o.onClick=()=>{p.undoStack.clear(),p.done()},i.onClick=()=>{"edit_vertex"===p.getMode()&&null!=v&&v.id&&p.add(u),p.cancel(),f(),a.emit("draw:cancelled",u)},l.onClick=()=>{p.undo()},d&&(d.onClick=()=>{p.deleteVertex()}),s&&(s.onClick=()=>{var e,r=!t.snap;c({type:"TOGGLE_SNAP"}),null===(e=p.snap)||void 0===e||e.setActive(r)}),p.on("create",h),p.on("editfinish",y),p.on("cancel",m),p.on("vertexselection",g),p.on("vertexchange",_),p.on("undochange",S),p.on("update",P),()=>{o.onClick=null,i.onClick=null,l.onClick=null,d&&(d.onClick=null),s&&(s.onClick=null),p.off("create",h),p.off("editfinish",y),p.off("cancel",m),p.off("vertexselection",g),p.off("vertexchange",_),p.off("undochange",S),p.off("update",P)}}({mapProvider:d,buttonConfig:s,pluginState:i,eventBus:p})},[d,r,i])},buttons:[le({id:"drawCancel",label:"Cancel",variant:"tertiary",hiddenWhen:e=>{var{pluginState:t}=e;return!t.mode}},de(!0)),le({id:"drawAddPoint",label:"Add point",variant:"primary",hiddenWhen:e=>{var{appState:t,pluginState:r}=e;return!["draw_polygon","draw_line"].includes(r.mode)||"touch"!==t.interfaceType}},de(!0)),le({id:"drawDone",label:"Done",variant:"primary",hiddenWhen:e=>{var{pluginState:t}=e;return!["draw_polygon","draw_line","edit_vertex"].includes(t.mode)},enableWhen:e=>{var{pluginState:t}=e;return"draw_polygon"===t.mode?t.numVertices>=3:"draw_line"===t.mode?t.numVertices>=2:"edit_vertex"===t.mode}},de(!0)),{id:"drawMenu",label:"Menu",iconId:"menu",hiddenWhen:e=>{var{pluginState:t}=e;return!["draw_polygon","draw_line","edit_vertex"].includes(t.mode)},menuItems:[{id:"drawUndo",label:"Undo",iconId:"undo",hiddenWhen:e=>{var{pluginState:t}=e;return!["draw_polygon","draw_line","edit_vertex"].includes(t.mode)},enableWhen:e=>{var{pluginState:t}=e;return["draw_polygon","draw_line"].includes(t.mode)?t.numVertices>0:t.undoStackLength>0}},{id:"drawSnap",label:"Snap to feature",iconId:"magnet",hiddenWhen:e=>{var{pluginState:t}=e;return!t.mode||!t.hasSnapLayers},pressedWhen:e=>{var{pluginState:t}=e;return!!t.snap}},{id:"drawDeletePoint",label:"Delete point",iconId:"trash",enableWhen:e=>{var{pluginState:t}=e;return t.selectedVertexIndex>=0&&t.numVertices>2},hiddenWhen:e=>{var{pluginState:t}=e;return"edit_vertex"!==t.mode}}],mobile:{slot:"bottom-right"},tablet:{slot:"top-middle"},desktop:{slot:"top-middle"}}],keyboardShortcuts:[{id:"drawStart",group:"Drawing",title:"Edit vertex",command:"<kbd>Spacebar</kbd></dd>"}],icons:[{id:"menu",svgContent:'<path d="m6 9 6 6 6-6"/>'},{id:"undo",svgContent:'<path d="M9 14 4 9l5-5"/><path d="M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11"/>'},{id:"magnet",svgContent:'<path d="m12 15 4 4"/><path d="M2.352 10.648a1.205 1.205 0 0 0 0 1.704l2.296 2.296a1.205 1.205 0 0 0 1.704 0l6.029-6.029a1 1 0 1 1 3 3l-6.029 6.029a1.205 1.205 0 0 0 0 1.704l2.296 2.296a1.205 1.205 0 0 0 1.704 0l6.365-6.367A1 1 0 0 0 8.716 4.282z"/><path d="m5 8 4 4"/>'},{id:"trash",svgContent:'<path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>'}],api:{newPolygon:function(e,t){var{appState:r,appConfig:n,mapState:a,pluginState:o,mapProvider:i,services:l}=e,d=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},{dispatch:s}=o,{draw:p}=i,{eventBus:c}=l;if(p){c.emit("draw:started",{mode:"draw_polygon"});var{stroke:u,fill:v,strokeWidth:f,properties:y}=d,m=h(d,J),g=$($({},y),Z({stroke:u,fill:v,strokeWidth:f}));p.changeMode("draw_polygon",$({container:r.layoutRefs.viewportRef.current,interfaceType:r.interfaceType,addVertexButtonId:"".concat(n.id,"-draw-add-point"),featureId:t,geometryType:"Polygon",properties:g,mapProvider:i,crossHair:a.crossHair},m)),s({type:"SET_MODE",payload:"draw_polygon"})}},newLine:function(e,t){var{appState:r,appConfig:n,mapState:a,pluginState:o,mapProvider:i,services:l}=e,d=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},{dispatch:s}=o,{draw:p}=i,{eventBus:c}=l;if(p){c.emit("draw:started",{mode:"draw_line"});var{stroke:u,fill:v,strokeWidth:f,properties:y}=d,m=h(d,ee),g=re(re({},y),Z({stroke:u,fill:v,strokeWidth:f}));p.changeMode("draw_line",re({container:r.layoutRefs.viewportRef.current,interfaceType:r.interfaceType,addVertexButtonId:"".concat(n.id,"-draw-add-point"),featureId:t,geometryType:"LineString",properties:g,mapProvider:i,crossHair:a.crossHair},m)),s({type:"SET_MODE",payload:"draw_line"})}},editFeature:function(e,t){var r,n,{appState:a,appConfig:o,pluginConfig:i,pluginState:l,mapProvider:d,services:s}=e,p=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},{dispatch:c}=l,{draw:u}=d,{eventBus:v}=s;if(!u)return!1;var f=u.get(t);if(!f)return!1;v.emit("draw:editstart",{mode:"edit_vertex"});var h=void 0===p.snapLayers?null!==(r=i.snapLayers)&&void 0!==r?r:null:p.snapLayers;return null===(n=u.snap)||void 0===n||n.setSnapLayers(h),c({type:"SET_HAS_SNAP_LAYERS",payload:(null==h?void 0:h.length)>0}),u.changeMode("edit_vertex",{container:a.layoutRefs.viewportRef.current,deleteVertexButtonId:"".concat(o.id,"-draw-delete-point"),interfaceType:a.interfaceType,featureId:t}),c({type:"SET_FEATURE",payload:{feature:f,tempFeature:f}}),c({type:"SET_MODE",payload:"edit_vertex"}),!0},addFeature:(e,t)=>{var{mapProvider:r,services:n}=e,{draw:a}=r,{eventBus:o}=n;if(a){var{stroke:i,fill:l,strokeWidth:d,properties:s}=t,p=oe(oe({},h(t,ne)),{},{properties:oe(oe({},s),Z({stroke:i,fill:l,strokeWidth:d}))});a.add(p),o.emit("draw:add",p)}},deleteFeature:(e,t)=>{var{mapProvider:r}=e,{draw:n}=r;n&&n.delete(t)}}};export{se as manifest};
+import e from"@babel/runtime/helpers/defineProperty";import{useEffect as t}from"preact/compat";import r from"@babel/runtime/helpers/asyncToGenerator";import n from"ol/layer/Vector.js";import a from"ol/source/Vector.js";import o from"ol/format/GeoJSON.js";import i from"ol/style/Style.js";import l from"ol/style/Fill.js";import d from"ol/style/Stroke.js";import s from"ol/style/Circle.js";import{transform as p}from"ol/proj.js";import c from"ol/layer/VectorTile.js";import u from"ol/Feature.js";import v from"ol/geom/Point.js";import{Style as f}from"ol/style.js";import h from"ol/interaction/Interaction.js";import g from"@babel/runtime/helpers/objectWithoutProperties";function m(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function y(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?m(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):m(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}var _={SET_MODE:(e,t)=>y(y({},e),{},{mode:t,numVertices:null}),SET_FEATURE:(e,t)=>y(y({},e),{},{feature:void 0===t.feature?e.feature:t.feature,tempFeature:void 0===t.tempFeature?e.tempFeature:t.tempFeature}),SET_SELECTED_VERTEX_INDEX:(e,t)=>y(y({},e),{},{selectedVertexIndex:t.index,numVertices:t.numVertices}),SET_UNDO_STACK_LENGTH:(e,t)=>y(y({},e),{},{undoStackLength:t}),TOGGLE_SNAP:e=>y(y({},e),{},{snap:!e.snap}),SET_HAS_SNAP_LAYERS:(e,t)=>y(y({},e),{},{hasSnapLayers:!!t})},S={APP_ADD_MARKER:"app:addmarker",APP_UPDATE_MARKER:"app:updatemarker",APP_REMOVE_MARKER:"app:removemarker",APP_SET_MODE:"app:setmode",APP_REVERT_MODE:"app:revertmode",APP_ADD_BUTTON:"app:addbutton",APP_TOGGLE_BUTTON_STATE:"app:togglebuttonstate",APP_ADD_PANEL:"app:addpanel",APP_REMOVE_PANEL:"app:removepanel",APP_SHOW_PANEL:"app:showpanel",APP_HIDE_PANEL:"app:hidepanel",APP_ADD_CONTROL:"app:addcontrol",APP_READY:"app:ready",APP_OPENED:"app:opened",APP_CLOSED:"app:closed",APP_FULLSCREEN_CHANGE:"app:fullscreenchange",APP_PANEL_OPENED:"app:panelopened",APP_PANEL_CLOSED:"app:panelclosed",MAP_SET_STYLE:"map:setstyle",MAP_SET_SIZE:"map:setsize",MAP_SET_FEATURES:"map:setfeatures",MAP_SET_ACTIVE_FEATURE:"map:setactivefeature",MAP_SELECT_FEATURE:"map:selectfeature",MAP_SET_PIXEL_RATIO:"map:setpixelratio",MAP_FIT_TO_BOUNDS:"map:fittobounds",MAP_SET_VIEW:"map:setview",MAP_INIT_MAP_STYLES:"map:initmapstyles",MAP_STYLE_CHANGE:"map:stylechange",MAP_LOADED:"map:loaded",MAP_READY:"map:ready",MAP_SIZE_CHANGE:"map:sizechange",MAP_FIRST_IDLE:"map:firstidle",MAP_MOVE_START:"map:movestart",MAP_MOVE:"map:move",MAP_MOVE_END:"map:moveend",MAP_STATE_UPDATED:"map:stateupdated",MAP_DATA_CHANGE:"map:datachange",MAP_RENDER:"map:render",MAP_CLICK:"map:click",MAP_DESTROY:"map:destroy"},P="EPSG:27700",w=new o({dataProjection:P,featureProjection:P}),E=()=>{var e=new a;return{source:e,getOL(t){var r;return null!==(r=e.getFeatureById(String(t)))&&void 0!==r?r:null},add(t){var r=this.getOL(t.id);r&&e.removeFeature(r);var n=w.readFeature(t);return e.addFeature(n),n},get(e){var t=this.getOL(e);return t?w.writeFeatureObject(t):null},remove(t){var r=this.getOL(t);r&&e.removeFeature(r)},clear(){e.clear()},toGeoJSON:e=>w.writeFeatureObject(e),fromGeoJSON:e=>w.readFeature(e)}},b={outer:11,mid:8,inner:6},O={outer:9,mid:6,inner:4},A=(e,t,r,n,a)=>{e.beginPath(),e.arc(t,r,n,0,2*Math.PI),e.fillStyle=a,e.fill()},T=(e,t,r)=>{var{outer:n,mid:a,inner:o}=e;return(e,i)=>{var l=i.context,d=i.pixelRatio,[s,p]=e;l.save(),A(l,s,p,n*d,t.editActive),A(l,s,p,a*d,t.editHalo),A(l,s,p,o*d,t[r]),l.restore()}},j=e=>e.charAt(0).toUpperCase()+e.slice(1),M=e=>{var t=new i({image:new s({radius:6,fill:new l({color:e.editVertex})})}),r=new i({renderer:T(b,e,"editVertex")}),n=new i({image:new s({radius:4,fill:new l({color:e.editMidpoint})})}),a=new i({renderer:T(O,e,"editMidpoint")}),o=new i({stroke:new d({color:e.editStroke,width:2}),fill:new l({color:e.shapeFill})}),p=new i({stroke:new d({color:e.editStroke,width:2}),fill:new l({color:e.shapeFill})}),c=new i({image:new s({radius:5,fill:new l({color:e.editVertex})})});return{vertexStyle:t,selectedVertexStyle:r,midpointStyle:n,selectedMidpointStyle:a,editFeatureStyle:o,createSketchStyle:()=>e=>"Point"===e.getGeometry().getType()?[c]:[p],createFeatureStyle:()=>t=>{var r=t.getProperties(),n=e.mapStyleId,a=n&&r["stroke".concat(j(n))]||r.stroke||e.shapeStroke,o=n&&r["fill".concat(j(n))]||r.fill||e.shapeFill,s=r.strokeWidth||e.strokeWidth;return[new i({stroke:new d({color:a,width:s}),fill:new l({color:o})})]}}},k={editStroke:{light:"#1a65a6",dark:"#ffffff"},editVertex:{light:"#1a65a6",dark:"#ffffff"},editMidpoint:{light:"#1a65a6",dark:"#ffffff"},editHalo:{light:"#ffffff",dark:"rgba(11,12,12,1)"},editActive:{light:"#000000",dark:"#ffffff"},splitInvalid:{light:"rgba(29,112,184,1)",dark:"rgba(29,112,184,1)"},splitValid:{light:"rgba(29,112,184,1)",dark:"rgba(29,112,184,1)"},shapeStroke:"#1a65a6",shapeFill:"rgba(26,101,166,0.1)",strokeWidth:2,snapVertex:"rgba(212,53,28,0.5)",snapMidpoint:"rgba(40,161,151,1)",snapEdge:"rgba(29,112,184,0.5)",snapRadius:10},D=function(e){var t,r,n,a=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},o=null!==(t=null==e?void 0:e.mapColorScheme)&&void 0!==t?t:"light",i=null!==(r=null==e?void 0:e.id)&&void 0!==r?r:null,l=e=>{var t;return((e,t,r)=>"object"!=typeof e||null===e?e:r&&void 0!==e[r]?e[r]:void 0!==e[t]?e[t]:void 0!==e.light?e.light:Object.values(e)[0])(null!==(t=a[e])&&void 0!==t?t:k[e],o,i)};return{editStroke:l("editStroke"),editVertex:l("editVertex"),editMidpoint:l("editMidpoint"),editActive:l("editActive"),editHalo:l("editHalo"),shapeStroke:l("shapeStroke"),strokeWidth:null!==(n=a.strokeWidth)&&void 0!==n?n:k.strokeWidth,shapeFill:l("shapeFill"),snapVertex:l("snapVertex"),snapEdge:l("snapEdge"),mapStyleId:i}},x=(e,t)=>{var r=e[0]-t[0],n=e[1]-t[1];return r*r+n*n},C=(e,t,r)=>{var n=r[0]-t[0],a=r[1]-t[1],o=n*n+a*a;if(0===o)return[t[0],t[1]];var i=Math.max(0,Math.min(1,((e[0]-t[0])*n+(e[1]-t[1])*a)/o));return[t[0]+i*n,t[1]+i*a]},I=(e,t)=>L(e,t)?t:e,L=(e,t)=>e?!!t&&("edge"===e.type&&"vertex"===t.type||("vertex"!==e.type||"edge"!==t.type)&&t.distSq<e.distSq):!!t,V=(e,t,r,n)=>{for(var a=null,o=n&&e.length>1?e.length-1:e.length,i=n?o:o-1,l=0;l<o;l++){var d=e[l],s=x(t,d);s<=r&&(a=I(a,{type:"vertex",coord:[d[0],d[1]],distSq:s}))}for(var p=0;p<i;p++){var c=e[p],u=e[(p+1)%o],v=C(t,c,u),f=x(t,v);f<=r&&(a=I(a,{type:"edge",coord:v,distSq:f}))}return a},F=(e,t,r,n,a,o)=>I(((e,t,r,n,a)=>{for(var o=null,i=0;i<r;i++){var l=t+2*i,d=[e[l],e[l+1]],s=x(n,d);s<=a&&(o=I(o,{type:"vertex",coord:d,distSq:s}))}return o})(e,t,r,a,o),((e,t,r,n,a,o)=>{for(var i=null,l=0;l<n;l++){var d=t+2*l,s=t+(l+1)%r*2,p=[e[d],e[d+1]],c=[e[s],e[s+1]],u=C(a,p,c),v=x(a,u);v<=o&&(i=I(i,{type:"edge",coord:u,distSq:v}))}return i})(e,t,r,n,a,o)),R=(e,t,r,n,a,o)=>{var i=(r-t)/2;return F(e,t,i,o?i:i-1,n,a)},N={point:(e,t,r)=>{var n=e.getCoordinates(),a=x(t,n);return a<=r?{type:"vertex",coord:[n[0],n[1]],distSq:a}:null},lineString:(e,t,r)=>V(e.getCoordinates(),t,r,!1),linearRing:(e,t,r)=>V(e.getCoordinates(),t,r,!0),polygon:(e,t,r)=>{var n=null;for(var a of e.getCoordinates())n=I(n,V(a,t,r,!0));return n},multiLineString:(e,t,r)=>{var n=null;for(var a of e.getCoordinates())n=I(n,V(a,t,r,!1));return n},multiPolygon:(e,t,r)=>{var n=null;for(var a of e.getCoordinates())for(var o of a)n=I(n,V(o,t,r,!0));return n}},W=(e,t,r)=>{var n=e.getGeometry();if(!n)return null;var a=n.getType(),o=N[a[0].toLowerCase()+a.slice(1)];return o?o(n,t,r):null},G=(e,t)=>t?e?"vertex"===e.type&&"edge"===t.type?e:"edge"===e.type&&"vertex"===t.type||t.distSq<e.distSq?t:e:t:e,H=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[],r=new Set,a=[],o=e=>{for(var t of(r=new Set,a=[],null!=e?e:[]))"string"==typeof t?r.add(t):t instanceof n&&a.push(t)};o(t);return{query:(t,n)=>{var o=e.getView().getResolution();if(!o)return null;var i=n*o,l=i*i,d=[t[0]-i,t[1]-i,t[0]+i,t[1]+i],s=null;for(var u of a){var v=u.getSource();if(v)for(var f of v.getFeaturesInExtent(d))s=G(s,W(f,t,l))}if(r.size>0){var h=(e=>{var t=[];return e.getLayers().forEach(e=>{e instanceof c&&t.push(e)}),t})(e),g=h.length>0?e.getPixelFromCoordinate(t):null;if(g){var m=new Map;e.forEachFeatureAtPixel(g,(n,a)=>{var i=n.get("mapbox-layer");if(r.has(null==i?void 0:i.id)){var d=((e,t,r)=>{var n=e.getType(),a=e.getFlatCoordinates(),o=null;if("Point"===n){var i=x(t,a);i<=r&&(o={type:"vertex",coord:[a[0],a[1]],distSq:i})}else if("LineString"===n)o=R(a,0,a.length,t,r,!1);else if("Polygon"===n||"MultiLineString"===n){var l=e.getEnds(),d=0,s="Polygon"===n;for(var p of l)o=I(o,R(a,d,p,t,r,s)),d=p}return o})(n,t,l);d&&(m.has(a)||m.set(a,((e,t)=>{var r,n=e.getSource(),a=null==n?void 0:n.getTileGrid();if(!a)return null;var o=t.getView().getProjection(),i=null!==(r=n.getProjection())&&void 0!==r?r:o,l=a.getZForResolution(t.getView().getResolution(),0);return{tileGrid:a,viewProj:o,sourceProj:i,zoom:l}})(a,e)),((e,t)=>{if(!e)return!1;var{tileGrid:r,viewProj:n,sourceProj:a,zoom:o}=e,i=p(t,n,a),l=r.getTileCoordForCoordAndZ(i,o),[d,s,c,u]=r.getTileCoordExtent(l),v=.03125*(c-d)+1;return Math.abs(i[0]-d)<v||Math.abs(i[0]-c)<v||Math.abs(i[1]-s)<v||Math.abs(i[1]-u)<v})(m.get(a),d.coord)||"edge"===d.type&&"fill"===(null==i?void 0:i.type)&&((e,t,r,n,a,o)=>{var i=e[0]-t[0],l=e[1]-t[1],d=i*i+l*l;if(d<1)return!1;var s=Math.sqrt(d),p=4*o,c=[e[0]+i/s*p,e[1]+l/s*p],u=n.getPixelFromCoordinate(c);return!!u&&!!n.forEachFeatureAtPixel(u,e=>{var t;return(null===(t=e.get("mapbox-layer"))||void 0===t?void 0:t.id)===r},{hitTolerance:2,layerFilter:e=>a.includes(e)})})(d.coord,t,i.id,e,h,o)||(s=G(s,d)))}},{hitTolerance:n,layerFilter:e=>h.includes(e)})}}return s?{type:s.type,coord:s.coord}:null},setLayers:o}},U=e=>(t,r)=>{var n=r.context,[a,o]=t;n.beginPath(),n.arc(a,o,10*r.pixelRatio,0,2*Math.PI),n.fillStyle=e,n.fill()},B=e=>({vertex:new f({renderer:U(e.snapVertex)}),edge:new f({renderer:U(e.snapEdge)})}),q=new Set(["pointermove","pointerdrag","pointerdown","pointerup","singleclick","click"]),Y=(e,t,r,n)=>{var a=new h({handleEvent:o=>(a.getActive()&&((e,t,r,n,a)=>{var{type:o}=e;if("pointerout"!==o&&"pointerleave"!==o){if(q.has(o)){var i=t.query(e.coordinate,n);i&&(e.coordinate=i.coord.slice()),"pointermove"===o&&a()?i?r.show(i.coord,i.type):r.hide():"pointerdrag"===o&&r.hide()}}else r.hide()})(o,e,t,r,n),!0)});return a},z=(e,t,r,o)=>{if(null==t||!t.length)return null;var i=H(e,t),l=((e,t)=>{var r=B(t),o=new a,i=new n({source:o,style:e=>{var t;return null!==(t=r[e.get("snapType")])&&void 0!==t?t:null},zIndex:200,updateWhileAnimating:!0,updateWhileInteracting:!0});e.addLayer(i);var l=new u,d=!1;return{show(e,t){l.setGeometry(new v(e)),l.set("snapType",t,!0),d?o.changed():(o.addFeature(l),d=!0)},hide(){d&&(o.clear(),d=!1)},updateColors(e){r=B(e),d&&o.changed()},remove(){o.clear(),e.removeLayer(i)}}})(e,r),d=!1,s=Y(i,l,o,()=>d);e.addInteraction(s),s.setActive(!1);var p=!1;return{snapRadius:o,apply(e){if(!p)return e;var t=i.query(e,o);return t?(l.show(t.coord,t.type),t.coord):(l.hide(),e)},hideIndicator(){l.hide()},setIndicatorActive(e){d=e,e||l.hide()},setActive(e){p=e,s.setActive(e),e||l.hide()},setSnapLayers(e){i.setLayers(null==e?null!=t?t:[]:e)},reattach(){e.removeInteraction(s),e.addInteraction(s)},updateColors(e){l.updateColors(e)},destroy(){e.removeInteraction(s),l.remove()}}};function X(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function K(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?X(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):X(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}class Z{constructor(e){var t,r,a,o,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};this._map=e,this._pluginConfig=i,this._mode="disabled",this._modeInstance=null,this._listeners=new Map,this.store=E(),this.undoStack=(a=e=>this.emit("undochange",e),o=[],{push(e){o.push(e),a(o.length)},pop(){var e=o.pop();return a(o.length),e},clear(){o.length=0,a(o.length)},get length(){return o.length}}),this.colors=D(null,i),this.styles=M(this.colors),this.snap=z(e,null!==(t=i.snapLayers)&&void 0!==t?t:null,this.colors,null!==(r=i.snapRadius)&&void 0!==r?r:k.snapRadius),this._layer=new n({source:this.store.source,style:this.styles.createFeatureStyle(),zIndex:100}),this._layer.set("layerId","draw"),e.addLayer(this._layer)}setMapStyle(e){var t;this.colors=D(e,this._pluginConfig),this.styles=M(this.colors),this._layer.setStyle(this.styles.createFeatureStyle()),this.store.source.changed(),null===(t=this.snap)||void 0===t||t.updateColors(this.colors),this.emit("styleschanged",this.styles)}on(e,t){this._listeners.has(e)||this._listeners.set(e,new Set),this._listeners.get(e).add(t)}off(e,t){var r;null===(r=this._listeners.get(e))||void 0===r||r.delete(t)}emit(e,t){var r;null===(r=this._listeners.get(e))||void 0===r||r.forEach(e=>e(t))}changeMode(e){var t=arguments,n=this;return r(function*(){var r,a,o,i=t.length>1&&void 0!==t[1]?t[1]:{};null===(r=n._modeInstance)||void 0===r||r.destroy(),n._modeInstance=null,n._mode=e;var l="draw_polygon"===e||"draw_line"===e||"edit_vertex"===e;null===(a=n.snap)||void 0===a||a.setIndicatorActive(l);var d=K(K({},i),{},{snap:n.snap});if("draw_polygon"===e||"draw_line"===e){var{createDrawMode:s}=yield import(/* webpackChunkName: "DrawMode" */ "./DrawMode.js");n._modeInstance=s({map:n._map,manager:n,options:d})}else if("edit_vertex"===e){var{createEditMode:p}=yield import(/* webpackChunkName: "EditMode" */ "./EditMode.js");n._modeInstance=p({map:n._map,manager:n,options:d})}null===(o=n.snap)||void 0===o||o.reattach()})()}getMode(){return this._mode}done(){var e;null===(e=this._modeInstance)||void 0===e||e.done()}cancel(){var e;null===(e=this._modeInstance)||void 0===e||e.cancel(),this.changeMode("disabled")}undo(){var e;null===(e=this._modeInstance)||void 0===e||e.undo()}deleteVertex(){var e;null===(e=this._modeInstance)||void 0===e||e.deleteVertex()}setInterfaceType(e){var t,r;null===(t=this._modeInstance)||void 0===t||null===(r=t.setInterfaceType)||void 0===r||r.call(t,e)}get(e){return this.store.get(e)}add(e){return this.store.add(e)}delete(e){return this.store.remove(e)}deleteAll(){return this.store.clear()}remove(){var e,t;null===(e=this._modeInstance)||void 0===e||e.destroy(),this._modeInstance=null,null===(t=this.snap)||void 0===t||t.destroy(),this.snap=null,this.store.clear(),this._map.removeLayer(this._layer),this._listeners.clear()}}var J=["stroke","fill","strokeWidth"],Q=e=>{if(!e)return{};var t={};for(var[r,n]of Object.entries(e))if(J.includes(r)&&"object"==typeof n&&null!==n){var a=Object.entries(n);for(var[o,i]of(a.length>0&&(t[r]=a[0][1]),a))t["".concat(r).concat(o.charAt(0).toUpperCase()+o.slice(1))]=i}else t[r]=n;return t},$=["stroke","fill","strokeWidth","properties"];function ee(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function te(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?ee(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):ee(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}var re=["stroke","fill","strokeWidth","properties"];function ne(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function ae(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?ne(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):ne(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}var oe=["stroke","fill","strokeWidth","properties"];function ie(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function le(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?ie(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):ie(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}function de(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function se(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?de(Object(n),!0).forEach(function(r){e(t,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):de(Object(n)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})}return t}var pe=e=>({mobile:{slot:"actions",showLabel:e},tablet:{slot:"actions",showLabel:e},desktop:{slot:"actions",showLabel:e}}),ce={reducer:{initialState:{mode:null,feature:null,tempFeature:null,selectedVertexIndex:-1,numVertices:null,undoStackLength:0,snap:!1,hasSnapLayers:!1},actions:_},InitComponent:e=>{var{appState:r,appConfig:n,mapState:a,pluginConfig:o,pluginState:i,services:l,mapProvider:d,buttonConfig:s}=e,{eventBus:p}=l,{crossHair:c}=a,u=["touch","keyboard"].includes(r.interfaceType);t(()=>{var e,t,n,l,s,c=null===(e=null===(t=o.includeModes)||void 0===t?void 0:t.includes(r.mode))||void 0===e||e,u=null!==(n=null===(l=o.excludeModes)||void 0===l?void 0:l.includes(r.mode))&&void 0!==n&&n;if(a.isMapReady&&c&&!u){var{remove:v}=(e=>{var{mapProvider:t,events:r,eventBus:n,pluginConfig:a={},mapStyle:o=null}=e,{map:i}=t,l=new Z(i,a);o&&l.setMapStyle(o),t.draw=l;var d=e=>{var r;t.drawScale=null!==(r={small:1,medium:1.5,large:2}[e])&&void 0!==r?r:1};n.on(r.MAP_SET_SIZE,d);var s=e=>{l.setMapStyle(e)};return n.on(r.MAP_SET_STYLE,s),{remove(){n.off(r.MAP_SET_SIZE,d),n.off(r.MAP_SET_STYLE,s),l.remove(),t.draw=null}}})({mapProvider:d,events:S,eventBus:p,pluginConfig:o,mapStyle:a.mapStyle});return i.dispatch({type:"SET_MODE",payload:null}),i.dispatch({type:"SET_HAS_SNAP_LAYERS",payload:(null===(s=o.snapLayers)||void 0===s?void 0:s.length)>0}),p.emit("draw:ready"),()=>v()}},[a.isMapReady,r.mode]),t(()=>{if(["draw_polygon","draw_line"].includes(i.mode)&&u){var e=c.isVisible;return c.fixAtCenter(),()=>{e||c.hide()}}},[i.mode,r.interfaceType]),t(()=>{"edit_vertex"===i.mode&&d.draw&&d.draw.setInterfaceType(r.interfaceType)},[r.interfaceType,i.mode]),t(()=>{if(d.draw)return function(e){var{pluginState:t,mapProvider:r,buttonConfig:n,eventBus:a}=e,{drawDone:o,drawCancel:i,drawUndo:l,drawDeletePoint:d,drawSnap:s}=n,{draw:p}=r,{dispatch:c,feature:u,tempFeature:v}=t,f=()=>{p.undoStack.clear(),c({type:"SET_MODE",payload:null}),c({type:"SET_FEATURE",payload:{feature:null,tempFeature:null}})},h=e=>{f(),p.changeMode("disabled"),a.emit("draw:created",e)},g=e=>{f(),p.changeMode("disabled"),a.emit("draw:edited",e)},m=()=>{},y=e=>{c({type:"SET_SELECTED_VERTEX_INDEX",payload:e}),a.emit("draw:vertexselection",e)},_=e=>{c({type:"SET_SELECTED_VERTEX_INDEX",payload:{index:-1,numVertices:e.numVertices}})},S=e=>{c({type:"SET_UNDO_STACK_LENGTH",payload:e})},P=e=>{a.emit("draw:updated",e)};return o.onClick=()=>{p.undoStack.clear(),p.done()},i.onClick=()=>{"edit_vertex"===p.getMode()&&null!=v&&v.id&&p.add(u),p.cancel(),f(),a.emit("draw:cancelled",u)},l.onClick=()=>{p.undo()},d&&(d.onClick=()=>{p.deleteVertex()}),s&&(s.onClick=()=>{var e,r=!t.snap;c({type:"TOGGLE_SNAP"}),null===(e=p.snap)||void 0===e||e.setActive(r)}),p.on("create",h),p.on("editfinish",g),p.on("cancel",m),p.on("vertexselection",y),p.on("vertexchange",_),p.on("undochange",S),p.on("update",P),()=>{o.onClick=null,i.onClick=null,l.onClick=null,d&&(d.onClick=null),s&&(s.onClick=null),p.off("create",h),p.off("editfinish",g),p.off("cancel",m),p.off("vertexselection",y),p.off("vertexchange",_),p.off("undochange",S),p.off("update",P)}}({mapProvider:d,buttonConfig:s,pluginState:i,eventBus:p})},[d,r,i])},buttons:[se({id:"drawCancel",label:"Cancel",variant:"tertiary",hiddenWhen:e=>{var{pluginState:t}=e;return!t.mode}},pe(!0)),se({id:"drawAddPoint",label:"Add point",variant:"primary",hiddenWhen:e=>{var{appState:t,pluginState:r}=e;return!["draw_polygon","draw_line"].includes(r.mode)||"touch"!==t.interfaceType}},pe(!0)),se({id:"drawDone",label:"Done",variant:"primary",hiddenWhen:e=>{var{pluginState:t}=e;return!["draw_polygon","draw_line","edit_vertex"].includes(t.mode)},enableWhen:e=>{var{pluginState:t}=e;return"draw_polygon"===t.mode?t.numVertices>=3:"draw_line"===t.mode?t.numVertices>=2:"edit_vertex"===t.mode}},pe(!0)),{id:"drawMenu",label:"Menu",iconId:"menu",hiddenWhen:e=>{var{pluginState:t}=e;return!["draw_polygon","draw_line","edit_vertex"].includes(t.mode)},menuItems:[{id:"drawUndo",label:"Undo",iconId:"undo",hiddenWhen:e=>{var{pluginState:t}=e;return!["draw_polygon","draw_line","edit_vertex"].includes(t.mode)},enableWhen:e=>{var{pluginState:t}=e;return["draw_polygon","draw_line"].includes(t.mode)?t.numVertices>0:t.undoStackLength>0}},{id:"drawSnap",label:"Snap to feature",iconId:"magnet",hiddenWhen:e=>{var{pluginState:t}=e;return!t.mode||!t.hasSnapLayers},pressedWhen:e=>{var{pluginState:t}=e;return!!t.snap}},{id:"drawDeletePoint",label:"Delete point",iconId:"trash",enableWhen:e=>{var t,{pluginState:r}=e;return!(r.selectedVertexIndex<0)&&("Polygon"===(null===(t=r.feature)||void 0===t||null===(t=t.geometry)||void 0===t?void 0:t.type)?r.numVertices>3:r.numVertices>2)},hiddenWhen:e=>{var{pluginState:t}=e;return"edit_vertex"!==t.mode}}],mobile:{slot:"bottom-right"},tablet:{slot:"top-middle"},desktop:{slot:"top-middle"}}],keyboardShortcuts:[{id:"drawStart",group:"Drawing",title:"Edit vertex",command:"<kbd>Spacebar</kbd></dd>"}],icons:[{id:"menu",svgContent:'<path d="m6 9 6 6 6-6"/>'},{id:"undo",svgContent:'<path d="M9 14 4 9l5-5"/><path d="M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11"/>'},{id:"magnet",svgContent:'<path d="m12 15 4 4"/><path d="M2.352 10.648a1.205 1.205 0 0 0 0 1.704l2.296 2.296a1.205 1.205 0 0 0 1.704 0l6.029-6.029a1 1 0 1 1 3 3l-6.029 6.029a1.205 1.205 0 0 0 0 1.704l2.296 2.296a1.205 1.205 0 0 0 1.704 0l6.365-6.367A1 1 0 0 0 8.716 4.282z"/><path d="m5 8 4 4"/>'},{id:"trash",svgContent:'<path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>'}],api:{newPolygon:function(e,t){var{appState:r,appConfig:n,mapState:a,pluginState:o,mapProvider:i,services:l}=e,d=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},{dispatch:s}=o,{draw:p}=i,{eventBus:c}=l;if(p){c.emit("draw:started",{mode:"draw_polygon"});var{stroke:u,fill:v,strokeWidth:f,properties:h}=d,m=g(d,$),y=te(te({},h),Q({stroke:u,fill:v,strokeWidth:f}));p.changeMode("draw_polygon",te({container:r.layoutRefs.viewportRef.current,interfaceType:r.interfaceType,addVertexButtonId:"".concat(n.id,"-draw-add-point"),featureId:t,geometryType:"Polygon",properties:y,mapProvider:i,crossHair:a.crossHair},m)),s({type:"SET_MODE",payload:"draw_polygon"})}},newLine:function(e,t){var{appState:r,appConfig:n,mapState:a,pluginState:o,mapProvider:i,services:l}=e,d=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},{dispatch:s}=o,{draw:p}=i,{eventBus:c}=l;if(p){c.emit("draw:started",{mode:"draw_line"});var{stroke:u,fill:v,strokeWidth:f,properties:h}=d,m=g(d,re),y=ae(ae({},h),Q({stroke:u,fill:v,strokeWidth:f}));p.changeMode("draw_line",ae({container:r.layoutRefs.viewportRef.current,interfaceType:r.interfaceType,addVertexButtonId:"".concat(n.id,"-draw-add-point"),featureId:t,geometryType:"LineString",properties:y,mapProvider:i,crossHair:a.crossHair},m)),s({type:"SET_MODE",payload:"draw_line"})}},editFeature:function(e,t){var r,n,{appState:a,appConfig:o,pluginConfig:i,pluginState:l,mapProvider:d,services:s}=e,p=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},{dispatch:c}=l,{draw:u}=d,{eventBus:v}=s;if(!u)return!1;var f=u.get(t);if(!f)return!1;v.emit("draw:editstart",{mode:"edit_vertex"});var h=void 0===p.snapLayers?null!==(r=i.snapLayers)&&void 0!==r?r:null:p.snapLayers;return null===(n=u.snap)||void 0===n||n.setSnapLayers(h),c({type:"SET_HAS_SNAP_LAYERS",payload:(null==h?void 0:h.length)>0}),u.changeMode("edit_vertex",{container:a.layoutRefs.viewportRef.current,deleteVertexButtonId:"".concat(o.id,"-draw-delete-point"),interfaceType:a.interfaceType,featureId:t}),c({type:"SET_FEATURE",payload:{feature:f,tempFeature:f}}),c({type:"SET_MODE",payload:"edit_vertex"}),!0},addFeature:(e,t)=>{var{mapProvider:r,services:n}=e,{draw:a}=r,{eventBus:o}=n;if(a){var{stroke:i,fill:l,strokeWidth:d,properties:s}=t,p=le(le({},g(t,oe)),{},{properties:le(le({},s),Q({stroke:i,fill:l,strokeWidth:d}))});a.add(p),o.emit("draw:add",p)}},deleteFeature:(e,t)=>{var{mapProvider:r}=e,{draw:n}=r;n&&n.delete(t)}}};export{ce as manifest};

package/plugins/beta/draw-ol/src/core/OLDrawManager.js

@@ -75,6 +75,9 @@ export class OLDrawManager {
     this._modeInstance = null
     this._mode = modeName
 
+    const isDrawMode = modeName === 'draw_polygon' || modeName === 'draw_line' || modeName === 'edit_vertex'
+    this.snap?.setIndicatorActive(isDrawMode)
+
     const modeOptions = { ...options, snap: this.snap }
 
     if (modeName === 'draw_polygon' || modeName === 'draw_line') {

package/plugins/beta/draw-ol/src/draw/DrawMode.js

@@ -1,18 +1,48 @@
 import Draw from 'ol/interaction/Draw.js'
+import { noModifierKeys } from 'ol/events/condition.js'
 import { createDrawInput } from './drawInput.js'
 import { getCoords } from '../utils/geometryHelpers.js'
 
-/**
- * Draw mode — handles draw_polygon and draw_line.
- *
- * OL's Draw interaction handles all pointer/mouse behaviour natively.
- * drawInput.js handles touch/keyboard/button input.
- *
- * @returns {{ done, cancel, undo, destroy }}
- */
+const SNAP_TOLERANCE_PX = 12
+const MIN_VERTICES = { Polygon: 3, LineString: 2 }
+
+const canFinish = (geometryType, sketchFeature) => {
+  if (!sketchFeature) { return false }
+  const geom = sketchFeature.getGeometry()
+  const coords = getCoords({ type: geometryType, coordinates: geom.getCoordinates() })
+  // OL keeps a trailing rubber-band coordinate; subtract 1 to get real vertex count
+  return coords.length - 1 >= MIN_VERTICES[geometryType]
+}
+
+// OL closes Polygon rings by appending v1: [...placed, rubber_band, v1_closing]; last placed is 3 from end.
+const POLY_LAST_PLACED_OFFSET = 3
+
+const getLastPlacedCoord = (geom) => {
+  if (geom.getType() === 'Polygon') {
+    const ring = geom.getCoordinates()[0] || []
+    return ring.length >= POLY_LAST_PLACED_OFFSET ? ring[ring.length - POLY_LAST_PLACED_OFFSET] : null
+  }
+  const coords = geom.getCoordinates()
+  return coords.length >= 2 ? coords[coords.length - 2] : null
+}
+
+const DUPLICATE_TOLERANCE_PX = 2
+
+const buildCondition = (map, geometryType, getSketchFeature) => (e) => {
+  if (!noModifierKeys(e)) { return false }
+  const sf = getSketchFeature()
+  if (!sf || canFinish(geometryType, sf)) { return true }
+  const prev = getLastPlacedCoord(sf.getGeometry())
+  if (!prev) { return true }
+  const pp = map.getPixelFromCoordinate(prev)
+  if (!pp) { return true }
+  const dx = e.pixel[0] - pp[0]; const dy = e.pixel[1] - pp[1]
+  return dx * dx + dy * dy > DUPLICATE_TOLERANCE_PX * DUPLICATE_TOLERANCE_PX
+}
+
 export const createDrawMode = ({ map, manager, options }) => {
   const {
-    geometryType, // 'Polygon' | 'LineString'
+    geometryType,
     featureId,
     properties = {},
     container,
@@ -22,28 +52,28 @@ export const createDrawMode = ({ map, manager, options }) => {
     snap
   } = options
 
+  let sketchFeature = null
+
   const drawInteraction = new Draw({
     type: geometryType,
     style: manager.styles.createSketchStyle(),
     stopClick: true,
-    // minPoints defaults: 3 for Polygon, 2 for LineString — OL handles this
-    // snapTolerance: how close to first point to auto-close polygon
-    snapTolerance: 12
+    snapTolerance: SNAP_TOLERANCE_PX,
+    condition: buildCondition(map, geometryType, () => sketchFeature)
   })
   map.addInteraction(drawInteraction)
-
-  // Track vertex count for the Done button enabled state
-  let sketchFeature = null
+  // OL internal: overlay_ is the private VectorLayer used for the sketch geometry.
+  // updateWhileAnimating_ forces per-frame redraws during view animations (keyboard pan).
+  // Without this, geom.setCoordinates() calls are ignored while the ANIMATING hint is set.
+  // Check ol/interaction/Draw.js and ol/layer/BaseVector.js if this breaks after an OL upgrade.
+  drawInteraction.overlay_.updateWhileAnimating_ = true
 
   const updateVertexCount = () => {
-    if (!sketchFeature) {
-      return
-    }
+    if (!sketchFeature) { return }
     const geom = sketchFeature.getGeometry()
     const coords = getCoords({ type: geometryType, coordinates: geom.getCoordinates() })
     // OL always keeps a trailing rubber-band coordinate; subtract 1
-    const numVertices = Math.max(0, coords.length - 1)
-    manager.emit('vertexchange', { numVertices })
+    manager.emit('vertexchange', { numVertices: Math.max(0, coords.length - 1) })
   }
 
   drawInteraction.on('drawstart', (e) => {
@@ -56,14 +86,11 @@ export const createDrawMode = ({ map, manager, options }) => {
     olFeature.setId(String(featureId))
     olFeature.setProperties(properties)
     manager.store.source.addFeature(olFeature)
-    const geojson = manager.store.toGeoJSON(olFeature)
-    manager.emit('create', geojson)
+    manager.emit('create', manager.store.toGeoJSON(olFeature))
     // Mode switches to disabled in events.js after receiving 'create'
   })
 
-  drawInteraction.on('drawabort', () => {
-    manager.emit('cancel')
-  })
+  drawInteraction.on('drawabort', () => { manager.emit('cancel') })
 
   const input = createDrawInput({
     drawInteraction,
@@ -74,36 +101,17 @@ export const createDrawMode = ({ map, manager, options }) => {
       addVertexButtonId,
       mapProvider,
       snap,
-      onUndo: () => {
-        drawInteraction.removeLastPoint()
-        updateVertexCount()
-      }
+      onUndo: () => { drawInteraction.removeLastPoint(); updateVertexCount() },
+      canFinish: () => canFinish(geometryType, sketchFeature)
     }
   })
 
   return {
     done () {
-      // Validate minimum points before finishing
-      if (sketchFeature) {
-        const geom = sketchFeature.getGeometry()
-        const coords = getCoords({ type: geometryType, coordinates: geom.getCoordinates() })
-        const min = geometryType === 'Polygon' ? 4 : 3 // +1 for rubber band
-        if (coords.length < min) {
-          return
-        }
-      }
-      drawInteraction.finishDrawing()
+      if (canFinish(geometryType, sketchFeature)) { drawInteraction.finishDrawing() }
     },
-
-    cancel () {
-      drawInteraction.abortDrawing()
-    },
-
-    undo () {
-      drawInteraction.removeLastPoint()
-      updateVertexCount()
-    },
-
+    cancel () { drawInteraction.abortDrawing() },
+    undo () { drawInteraction.removeLastPoint(); updateVertexCount() },
     destroy () {
       input.destroy()
       map.removeInteraction(drawInteraction)

package/plugins/beta/draw-ol/src/draw/drawInput.js

@@ -1,18 +1,15 @@
-/**
- * Input handling for draw mode: touch, keyboard, and button events.
- *
- * Mouse/pointer drawing is handled entirely by OL's Draw interaction.
- * This module handles the crosshair-based input path (touch + keyboard)
- * and the Done / Add Point / Cancel button wiring.
- */
-
 import { coordToPixel, pixelDist } from '../utils/olCoords.js'
 
 const SNAP_TOLERANCE = 12 // pixels
+// Minimum ring length to allow snap-to-close (placed vertices + rubber-band)
+const MIN_SKETCH_COORDS = { Polygon: 4, LineString: 3 }
+const DUPLICATE_TOLERANCE_PX = 2
+// OL Polygon ring layout after addToDrawing_: [...committed, rubber_band, closing_v1]
+const POLY_COMMITTED_OFFSET = 3
 const ARROW_KEYS = new Set(['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'])
 
 const isCloseToFirstVertex = (map, coord, sketchCoords, geometryType) => {
-  if (geometryType !== 'Polygon' || sketchCoords.length < 4) {
+  if (geometryType !== 'Polygon' || sketchCoords.length < MIN_SKETCH_COORDS.Polygon) {
     return false
   }
   const firstCoord = sketchCoords[0]
@@ -44,13 +41,24 @@ const applyRubberbanding = (geom, centerCoord) => {
   }
 }
 
+// Returns the last vertex committed by OL's Draw interaction (not the rubber-band or
+// the closing copy that OL appends to Polygon rings).
+const getLastCommittedVertex = (geom) => {
+  if (geom.getType() === 'Polygon') {
+    const ring = geom.getCoordinates()[0] || []
+    return ring.length >= POLY_COMMITTED_OFFSET ? ring[ring.length - POLY_COMMITTED_OFFSET] : null
+  }
+  const coords = geom.getCoordinates()
+  return coords.length >= 2 ? coords[coords.length - 2] : null
+}
+
 const wireInputEvents = ({
   container, addVertexButtonId, olView, onUndo,
   getInterfaceType, setInterfaceType, clearLastCoord,
   updateRubberbanding, placeVertex
 }) => {
   const onCenterChange = () => {
-    if (getInterfaceType() !== 'pointer') {
+    if (getInterfaceType() !== 'mouse') {
       updateRubberbanding()
     }
   }
@@ -83,7 +91,7 @@ const wireInputEvents = ({
 
   const onPointerdown = (e) => {
     if (e.pointerType !== 'touch') {
-      setInterfaceType('pointer')
+      setInterfaceType('mouse')
       clearLastCoord()
     }
   }
@@ -93,7 +101,7 @@ const wireInputEvents = ({
   }
 
   const onPointerMove = () => {
-    if (getInterfaceType() === 'pointer') {
+    if (getInterfaceType() === 'mouse') {
       return
     }
     updateRubberbanding()
@@ -117,15 +125,9 @@ const wireInputEvents = ({
   }
 }
 
-/**
- * @param {object} params
- * @param {import('ol/interaction/Draw').default} params.drawInteraction
- * @param {object} params.options - { container, interfaceType, addVertexButtonId, mapProvider, snap }
- * @returns {{ getInterfaceType: () => string, destroy: () => void }}
- */
 export const createDrawInput = ({ drawInteraction, options }) => {
-  const { container, addVertexButtonId, mapProvider, snap, onUndo } = options
-  let interfaceType = options.interfaceType
+  const { container, addVertexButtonId, mapProvider, snap, onUndo, canFinish } = options
+  let interfaceType = options.interfaceType ?? 'mouse'
   let sketchFeature = null
   let lastPlacedCoord = null
 
@@ -144,6 +146,12 @@ export const createDrawInput = ({ drawInteraction, options }) => {
 
   const updateRubberbanding = () => {
     if (!sketchFeature) {
+      // No sketch yet — update snap indicator at crosshair position so targets are
+      // visible before the first vertex is placed (touch/keyboard only; mouse uses
+      // the OL snap interaction's pointermove handler instead).
+      if (interfaceType !== 'mouse' && snap) {
+        snap.apply(mapProvider.getCenter())
+      }
       return
     }
     const geom = sketchFeature.getGeometry()
@@ -152,36 +160,63 @@ export const createDrawInput = ({ drawInteraction, options }) => {
       return
     }
     const raw = mapProvider.getCenter()
-    const centerCoord = (interfaceType !== 'pointer' && snap) ? snap.apply(raw) : raw
+    const centerCoord = (interfaceType !== 'mouse' && snap) ? snap.apply(raw) : raw
     applyRubberbanding(geom, centerCoord)
   }
 
+  // Returns true if the vertex was handled as a close/finish attempt (caller should not append).
+  const tryClose = (geom, sketchCoords, coord) => {
+    if (lastPlacedCoord && lastPlacedCoord[0] === coord[0] && lastPlacedCoord[1] === coord[1]) {
+      // Same position as last placed: don't duplicate. Close only if enough real vertices exist.
+      if (canFinish?.()) { drawInteraction.finishDrawing() }
+      lastPlacedCoord = null
+      return true
+    }
+    if (isCloseToFirstVertex(drawInteraction.getMap(), coord, sketchCoords, geom.getType())) {
+      drawInteraction.finishDrawing()
+      return true
+    }
+    // When the add-vertex button overlays the map (touch UI), OL's native pointer handler
+    // and this button click handler both fire for the same tap. Detect that OL already
+    // committed a vertex at coord's position and skip the duplicate appendCoordinates,
+    // but register coord as lastPlacedCoord so a second tap at the same position can close.
+    const map = drawInteraction.getMap()
+    const lastCommitted = getLastCommittedVertex(geom)
+    if (lastCommitted) {
+      const p1 = map.getPixelFromCoordinate(lastCommitted)
+      const p2 = map.getPixelFromCoordinate(coord)
+      if (p1 && p2) {
+        const dx = p1[0] - p2[0]; const dy = p1[1] - p2[1]
+        if (dx * dx + dy * dy < DUPLICATE_TOLERANCE_PX * DUPLICATE_TOLERANCE_PX) {
+          lastPlacedCoord = coord
+          return true
+        }
+      }
+    }
+    return false
+  }
+
   const placeVertex = () => {
     const raw = mapProvider.getCenter()
-    const coord = (interfaceType !== 'pointer' && snap) ? snap.apply(raw) : raw
+    const coord = (interfaceType !== 'mouse' && snap) ? snap.apply(raw) : raw
     snap?.hideIndicator()
     if (sketchFeature) {
       const geom = sketchFeature.getGeometry()
       const rawCoords = geom.getCoordinates()
       const sketchCoords = geom.getType() === 'Polygon' ? (rawCoords[0] || []) : rawCoords
-      if (lastPlacedCoord && lastPlacedCoord[0] === coord[0] && lastPlacedCoord[1] === coord[1]) {
-        drawInteraction.finishDrawing()
-        lastPlacedCoord = null
-        return
-      }
-      if (isCloseToFirstVertex(drawInteraction.getMap(), coord, sketchCoords, geom.getType())) {
-        drawInteraction.finishDrawing()
-        return
-      }
+      if (tryClose(geom, sketchCoords, coord)) { return }
     }
     drawInteraction.appendCoordinates([coord])
     lastPlacedCoord = coord
   }
 
+  const map = drawInteraction.getMap()
+  const olView = map?.getView()
+
   const events = wireInputEvents({
     container,
     addVertexButtonId,
-    olView: drawInteraction.getMap()?.getView(),
+    olView,
     onUndo,
     getInterfaceType: () => interfaceType,
     setInterfaceType: (t) => { interfaceType = t },
@@ -190,10 +225,19 @@ export const createDrawInput = ({ drawInteraction, options }) => {
     placeVertex
   })
 
+  // change:center fires once when a keyboard pan animation starts; postrender tracks each frame.
+  const onMapRender = () => {
+    if (interfaceType !== 'mouse' && olView?.getAnimating()) {
+      updateRubberbanding()
+    }
+  }
+  map?.on('postrender', onMapRender)
+
   return {
     getInterfaceType: () => interfaceType,
     destroy () {
       events.destroy()
+      map?.un('postrender', onMapRender)
     }
   }
 }

package/plugins/beta/draw-ol/src/edit/EditMode.js

@@ -41,7 +41,7 @@ export const createEditMode = ({ map, manager, options }) => {
     selectedVertexType: null,
     vertices: [],
     midpoints: [],
-    interfaceType: interfaceType ?? 'pointer'
+    interfaceType: interfaceType ?? 'mouse'
   }
 
   const getState = () => state
@@ -210,7 +210,7 @@ export const createEditMode = ({ map, manager, options }) => {
       touchHandler.updateTargetPosition()
       return
     }
-    state.interfaceType = 'pointer'
+    state.interfaceType = 'mouse'
 
     const olPixel = map.getEventPixel(e)
     const pixel = { x: olPixel[0], y: olPixel[1] }
@@ -242,10 +242,10 @@ export const createEditMode = ({ map, manager, options }) => {
     if (e.pointerType !== 'mouse') {
       return
     }
-    if (state.interfaceType === 'pointer') {
+    if (state.interfaceType === 'mouse') {
       return
     }
-    state.interfaceType = 'pointer'
+    state.interfaceType = 'mouse'
     touchHandler.hide()
   }
 

package/plugins/beta/draw-ol/src/edit/keyboardHandler.js

@@ -153,9 +153,11 @@ const wireKeyboardEvents = ({ map, snap, getState, setState, onVertexMoved, onIn
 
   const handleKey = (e) => {
     onKeyboardActive?.()
-    if (e.key === ' ' && getState().selectedVertexIndex < 0) {
+    if (e.key === ' ') {
       e.preventDefault()
-      selectNearest(map, getState, setState)
+      if (getState().selectedVertexIndex < 0) {
+        selectNearest(map, getState, setState)
+      }
     } else if (ARROW_KEYS.has(e.key)) {
       handleArrowKey(e)
     } else if (e.key === 'z' && (e.metaKey || e.ctrlKey)) {

package/plugins/beta/draw-ol/src/manifest.js

@@ -81,7 +81,11 @@ export const manifest = {
         id: 'drawDeletePoint',
         label: 'Delete point',
         iconId: 'trash',
-        enableWhen: ({ pluginState }) => pluginState.selectedVertexIndex >= 0 && pluginState.numVertices > 2,
+        enableWhen: ({ pluginState }) => {
+          if (pluginState.selectedVertexIndex < 0) { return false }
+          const isPolygon = pluginState.feature?.geometry?.type === 'Polygon'
+          return isPolygon ? pluginState.numVertices > 3 : pluginState.numVertices > 2 // NOSONAR
+        },
         hiddenWhen: ({ pluginState }) => pluginState.mode !== 'edit_vertex'
       }],
       mobile: { slot: 'bottom-right' },

package/plugins/beta/draw-ol/src/reducer.js

@@ -9,7 +9,7 @@ const initialState = {
   hasSnapLayers: false
 }
 
-const setMode = (state, payload) => ({ ...state, mode: payload })
+const setMode = (state, payload) => ({ ...state, mode: payload, numVertices: null })
 
 const setFeature = (state, payload) => ({
   ...state,