@defra/interactive-map 0.0.15-alpha → 0.0.16-alpha

package/plugins/beta/datasets/src/fetch/createDynamicSource.js

@@ -164,7 +164,7 @@ export const createDynamicSource = ({ dataset, map, sourceId, onUpdate }) => {
     /**
      * Clean up event listeners
      */
-    destroy() {
+    destroy () {
       map.off('moveend', handleMoveEnd)
       debouncedFetch.cancel()
     },
@@ -172,7 +172,7 @@ export const createDynamicSource = ({ dataset, map, sourceId, onUpdate }) => {
     /**
      * Clear all cached features and reset fetch tracking
      */
-    clear() {
+    clear () {
       features.clear()
       fetchedBbox = null
       onUpdate(sourceId, { type: 'FeatureCollection', features: [] })
@@ -181,7 +181,7 @@ export const createDynamicSource = ({ dataset, map, sourceId, onUpdate }) => {
     /**
      * Force refresh - clear cache and fetch current viewport
      */
-    refresh() {
+    refresh () {
       features.clear()
       fetchedBbox = null
       fetchData()
@@ -190,14 +190,14 @@ export const createDynamicSource = ({ dataset, map, sourceId, onUpdate }) => {
     /**
      * Get current feature count
      */
-    getFeatureCount() {
+    getFeatureCount () {
       return features.size
     },
 
     /**
      * Re-push cached features to the source (e.g., after style change)
      */
-    reapply() {
+    reapply () {
       if (features.size > 0) {
         onUpdate(sourceId, toFeatureCollection())
       }

package/plugins/beta/datasets/src/handleSetMapStyle.js

@@ -51,4 +51,4 @@ export const handleSetMapStyle = ({
 
   eventBus.on(events.MAP_SET_STYLE, onSetStyle)
   return onSetStyle
-}
+}

package/plugins/beta/datasets/src/manifest.js

@@ -40,7 +40,7 @@ export const manifest = {
       width: '320px'
     },
     render: Layers
-  },{
+  }, {
     id: 'datasetsKey',
     label: 'Key',
     mobile: {
@@ -76,7 +76,7 @@ export const manifest = {
       slot: 'top-left',
       showLabel: true
     }
-  },{
+  }, {
     id: 'datasetsKey',
     label: 'Key',
     panelId: 'datasetsKey',
@@ -99,7 +99,7 @@ export const manifest = {
   icons: [{
     id: 'layers',
     svgContent: '<path d="M13 13.74a2 2 0 0 1-2 0L2.5 8.87a1 1 0 0 1 0-1.74L11 2.26a2 2 0 0 1 2 0l8.5 4.87a1 1 0 0 1 0 1.74z"></path><path d="m20 14.285 1.5.845a1 1 0 0 1 0 1.74L13 21.74a2 2 0 0 1-2 0l-8.5-4.87a1 1 0 0 1 0-1.74l1.5-.845"></path>'
-  },{
+  }, {
     id: 'key',
     svgContent: '<path d="M3 5h.01"/><path d="M3 12h.01"/><path d="M3 19h.01"/><path d="M8 5h13"/><path d="M8 12h13"/><path d="M8 19h13"/>'
   }],

package/plugins/beta/datasets/src/mapLayers.js

@@ -81,7 +81,6 @@ const addMapLayers = (map, mapStyleId, dataset) => {
 
   // --- Add source (shared across datasets with same tiles/data URL) ---
   if (!map.getSource(sourceId)) {
-
     if (dataset.tiles) {
       // Tiles
       map.addSource(sourceId, {
@@ -111,7 +110,7 @@ const addMapLayers = (map, mapStyleId, dataset) => {
   const hasStroke = !!dataset.stroke
   const fillLayerId = hasFill ? dataset.id : null
   const strokeLayerId = hasStroke ? (hasFill ? `${dataset.id}-stroke` : dataset.id) : null
-  
+
   // --- Determie visiblity ---
   const visibility = dataset.visibility === 'hidden' ? 'none' : 'visible'
 
@@ -162,4 +161,4 @@ export {
   addMapLayers,
   isDynamicSource,
   updateSourceData
-}
+}

package/plugins/beta/datasets/src/panels/Key.jsx

@@ -1,4 +1,4 @@
-import React from "react"
+import React from 'react'
 import { getValueForStyle } from '../../../../../src/utils/getValueForStyle'
 
 export const Key = ({ mapState, pluginState }) => {
@@ -13,42 +13,44 @@ export const Key = ({ mapState, pluginState }) => {
       aria-hidden='true'
       focusable='false'
     >
-      {dataset.keySymbolShape === 'line' ? (
-        <line
-          x1={dataset.strokeWidth / 2}
-          y1="10"
-          x2={20 - dataset.strokeWidth / 2}
-          y2="10"
-          stroke={getValueForStyle(dataset.stroke, mapStyle.id)}
-          strokeWidth={dataset.strokeWidth}
-          strokeLinecap="round"
-        />
-      ) : (
-        <rect
-          x={dataset.strokeWidth / 2}
-          y={dataset.strokeWidth / 2}
-          width={20 - dataset.strokeWidth}
-          height={20 - dataset.strokeWidth}
-          rx={dataset.strokeWidth}
-          ry={dataset.strokeWidth}
-          fill={getValueForStyle(dataset.fill, mapStyle.id)}
-          stroke={getValueForStyle(dataset.stroke, mapStyle.id)}
-          strokeWidth={dataset.strokeWidth}
-          strokeLinejoin="round"
-        />
-      )}
+      {dataset.keySymbolShape === 'line'
+        ? (
+          <line
+            x1={dataset.strokeWidth / 2}
+            y1='10'
+            x2={20 - dataset.strokeWidth / 2}
+            y2='10'
+            stroke={getValueForStyle(dataset.stroke, mapStyle.id)}
+            strokeWidth={dataset.strokeWidth}
+            strokeLinecap='round'
+          />
+          )
+        : (
+          <rect
+            x={dataset.strokeWidth / 2}
+            y={dataset.strokeWidth / 2}
+            width={20 - dataset.strokeWidth}
+            height={20 - dataset.strokeWidth}
+            rx={dataset.strokeWidth}
+            ry={dataset.strokeWidth}
+            fill={getValueForStyle(dataset.fill, mapStyle.id)}
+            stroke={getValueForStyle(dataset.stroke, mapStyle.id)}
+            strokeWidth={dataset.strokeWidth}
+            strokeLinejoin='round'
+          />
+          )}
     </svg>
   )
 
   return (
-    <div className="im-c-datasets-key">
+    <div className='im-c-datasets-key'>
       {(pluginState.datasets || []).filter(dataset => dataset.showInKey && dataset.visibility !== 'hidden').map(dataset => (
-        <div key={dataset.id} className="im-c-datasets-key__item">
-          <div className="im-c-datasets-key__item-label">
+        <div key={dataset.id} className='im-c-datasets-key__item'>
+          <div className='im-c-datasets-key__item-label'>
             {itemSymbol(dataset)}
             {dataset.label}
             {dataset.symbolDescription && (
-              <span className="govuk-visually-hidden">
+              <span className='govuk-visually-hidden'>
                 ({getValueForStyle(dataset.symbolDescription, mapStyle.id)})
               </span>
             )}

package/plugins/beta/datasets/src/panels/Layers.jsx

@@ -3,7 +3,6 @@ import { showDataset } from '../api/showDataset'
 import { hideDataset } from '../api/hideDataset'
 
 export const Layers = ({ pluginState, mapProvider }) => {
-
   const handleChange = (e) => {
     const { value, checked } = e.target
     if (checked) {
@@ -14,18 +13,18 @@ export const Layers = ({ pluginState, mapProvider }) => {
   }
 
   return (
-    <div className="im-c-datasets-layers">
-      <div className="govuk-form-group">
-        <fieldset className="govuk-fieldset">
-          <legend className="govuk-visually-hidden">
+    <div className='im-c-datasets-layers'>
+      <div className='govuk-form-group'>
+        <fieldset className='govuk-fieldset'>
+          <legend className='govuk-visually-hidden'>
             Layers
           </legend>
-          <div className="govuk-checkboxes govuk-checkboxes--small" data-module="govuk-checkboxes">
+          <div className='govuk-checkboxes govuk-checkboxes--small' data-module='govuk-checkboxes'>
             {(pluginState.datasets || []).filter(dataset => dataset.showInLayers).map(dataset => (
               <div key={dataset.id} className={`im-c-datasets-layers__item${dataset.visibility !== 'hidden' ? ' im-c-datasets-layers__item--checked' : ''}`}>
-                <div className="govuk-checkboxes__item">
-                  <input className="govuk-checkboxes__input" id={dataset.id} name="layers" type="checkbox" value={dataset.id} checked={dataset.visibility !== 'hidden'} onChange={handleChange} />
-                  <label className="im-c-datasets-layers__item-label govuk-label govuk-checkboxes__label" htmlFor={dataset.id}>
+                <div className='govuk-checkboxes__item'>
+                  <input className='govuk-checkboxes__input' id={dataset.id} name='layers' type='checkbox' value={dataset.id} checked={dataset.visibility !== 'hidden'} onChange={handleChange} />
+                  <label className='im-c-datasets-layers__item-label govuk-label govuk-checkboxes__label' htmlFor={dataset.id}>
                     {dataset.label}
                   </label>
                 </div>

package/plugins/beta/datasets/src/utils/bbox.js

@@ -22,7 +22,7 @@ export const bboxContains = (outer, inner) => {
     inner[0] >= outer[0] && // west
     inner[1] >= outer[1] && // south
     inner[2] <= outer[2] && // east
-    inner[3] <= outer[3]    // north
+    inner[3] <= outer[3] // north
   )
 }
 
@@ -40,7 +40,7 @@ export const expandBbox = (existing, addition) => {
     Math.min(existing[0], addition[0]), // west
     Math.min(existing[1], addition[1]), // south
     Math.max(existing[2], addition[2]), // east
-    Math.max(existing[3], addition[3])  // north
+    Math.max(existing[3], addition[3]) // north
   ]
 }
 
@@ -58,7 +58,7 @@ export const bboxIntersects = (a, b) => {
     a[2] < b[0] || // a is left of b
     a[0] > b[2] || // a is right of b
     a[3] < b[1] || // a is below b
-    a[1] > b[3]    // a is above b
+    a[1] > b[3] // a is above b
   )
 }
 
@@ -68,7 +68,7 @@ export const bboxIntersects = (a, b) => {
  * @returns {number[]} bbox as [west, south, east, north]
  */
 export const getGeometryBbox = (geometry) => {
-  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity
+  let minX = Infinity; let minY = Infinity; let maxX = -Infinity; let maxY = -Infinity
 
   const processCoord = (coord) => {
     minX = Math.min(minX, coord[0])

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

@@ -1 +1 @@
-import e from"@babel/runtime/helpers/defineProperty";import{useEffect as t}from"preact/compat";import r from"@arcgis/core/widgets/Sketch/SketchViewModel.js";import o from"@arcgis/core/layers/GraphicsLayer.js";import a from"@babel/runtime/helpers/asyncToGenerator";import*as n from"@arcgis/core/geometry/operators/simplifyOperator.js";import i from"@arcgis/core/Graphic.js";function l(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,o)}return r}function p(t){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?l(Object(o),!0).forEach(function(r){e(t,r,o[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(o)):l(Object(o)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(o,e))})}return t}function c(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,o)}return r}function s(t){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?c(Object(o),!0).forEach(function(r){e(t,r,o[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(o)):c(Object(o)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(o,e))})}return t}function u(e){return{type:"simple-fill",color:[0,120,255,.2],outline:{color:"dark"===e?"#ffffff":"#d4351c",width:2}}}function d(e,t,r){return new i({geometry:{type:"polygon",rings:t,spatialReference:27700},attributes:{id:e},symbol:u(r)})}function y(e){if(null==e||!e.geometry)throw new Error("Invalid graphic");var{geometry:t,attributes:r={}}=e;switch(t.type){case"point":return{type:"Feature",geometry:{type:"Point",coordinates:[t.x,t.y]},properties:s({},r)};case"polyline":return{type:"Feature",geometry:{type:"LineString",coordinates:t.paths[0]},properties:s({},r)};case"polygon":return{type:"Feature",geometry:{type:"Polygon",coordinates:t.rings},properties:s({},r)};default:throw new Error("Unsupported geometry type: ".concat(t.type))}}function m(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,o)}return r}function f(t){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?m(Object(o),!0).forEach(function(r){e(t,r,o[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(o)):m(Object(o)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(o,e))})}return t}var h={mobile:{slot:"actions",showLabel:!0},tablet:{slot:"actions",showLabel:!0},desktop:{slot:"actions",showLabel:!0}},v={reducer:{initialState:{mode:null,feature:null,tempFeature:null},actions:{SET_MODE:(e,t)=>p(p({},e),{},{mode:t}),SET_FEATURE:(e,t)=>p(p({},e),{},{feature:void 0===t.feature?e.feature:t.feature,tempFeature:void 0===t.tempFeature?e.tempFeature:t.tempFeature})}},InitComponent:e=>{var i,l,p,c,{appState:s,mapState:m,pluginConfig:f,pluginState:h,services:v,mapProvider:g,buttonConfig:b}=e,{events:O,eventBus:w}=v,{mapColorScheme:S}=m.mapStyle||{},E=null===(i=null===(l=f.includeModes)||void 0===l?void 0:l.includes(s.mode))||void 0===i||i,k=null!==(p=null===(c=f.excludeModes)||void 0===c?void 0:c.includes(s.mode))&&void 0!==p&&p,P=m.isMapReady&&E&&!k;t(()=>{if(P&&!g.sketchViewModel){var{sketchViewModel:e,sketchLayer:t,emptySketchLayer:a}=(e=>{var{mapProvider:t}=e,{view:a}=t,n=new o({id:"sketchLayer"});a.map.add(n);var i=new o({id:"emptySketchLayer"});return a.map.add(i),{sketchViewModel:new r({view:a,layer:i,defaultUpdateOptions:{tool:"reshape",updateOnGraphicClick:!1,multipleSelectionEnabled:!1,toggleToolOnClick:!1,highlightOptions:{enabled:!1}}}),emptySketchLayer:i,sketchLayer:n}})({mapProvider:g});return g.sketchViewModel=e,g.sketchLayer=t,g.emptySketchLayer=a,w.emit("draw:ready"),()=>{g.sketchViewModel=null,g.sketchLayer=null,g.emptySketchLayer=null}}},[m.isMapReady,s.mode]),t(()=>{if(P&&g.sketchViewModel){var e=function(e){var{pluginState:t,mapProvider:r,events:o,eventBus:i,buttonConfig:l,mapColorScheme:p}=e,{view:c,sketchViewModel:s,sketchLayer:m,emptySketchLayer:f}=r;if(!s)return null;var{drawDone:h,drawCancel:v}=l,{dispatch:g,mode:b,feature:O}=t,w=function(){var e=a(function*(){var e,r=null===(e=t.feature)||void 0===e||null===(e=e.properties)||void 0===e?void 0:e.id,o=null,a="active"===s.state&&!r;if("active"===s.state&&r&&(s.cancel(),yield new Promise(e=>setTimeout(e,50))),s.polygonSymbol=u(p),null==m||m.graphics.items.forEach(e=>{var t=d(e.attributes.id,e.geometry.rings,p);e.symbol=t.symbol,r===e.attributes.id&&(o=e)}),o&&!a&&s.layer===m)try{yield s.update(o,{tool:"reshape",toggleToolOnClick:!1})}catch(e){"AbortError"!==e.name&&console.error("Error updating sketch:",e)}});return function(){return e.apply(this,arguments)}}(),S=()=>{var e,t,r=null!==(e=null===(t=m.graphics)||void 0===t||null===(t=t.items)||void 0===t?void 0:t[0])&&void 0!==e?e:null;r&&setTimeout(()=>s.update(r),0)},E=()=>w(),k=function(){var e=a(function*(){b&&((s.updateGraphics||[]).length||S())});return function(){return e.apply(this,arguments)}}();i.on(o.MAP_STYLE_CHANGE,E);var P=s.on("update",e=>{var t,r=null===(t=e.toolEventInfo)||void 0===t?void 0:t.type,o=e.graphics[0];if("move-start"===r&&(s.cancel(),S()),"reshape"===r&&(n.isSimple(o.geometry)||s.undo()),"reshape-stop"===r){var a=y(o);i.emit("draw:updated",a),g({type:"SET_FEATURE",payload:{tempFeature:a}})}}),j=c.on("click",k),T=h.onClick,C=v.onClick;return h.onClick=()=>{s.cancel(),s.layer=f,g({type:"SET_MODE",payload:null}),g({type:"SET_FEATURE",payload:{feature:null,tempFeature:null}}),i.emit("draw:done",{newFeature:t.tempFeature})},v.onClick=()=>{if(s.cancel(),m.removeAll(),O){var e=d(O.id||O.properties.id,O.geometry.coordinates,p);m.add(e)}s.layer=f,g({type:"SET_MODE",payload:null}),i.emit("draw:cancelled")},()=>{i.off(o.MAP_STYLE_CHANGE,E),P.remove(),j.remove(),h.onClick=T,v.onClick=C}}({pluginState:h,mapProvider:g,events:O,eventBus:w,buttonConfig:b,mapColorScheme:S});return()=>{e()}}},[P,S,h])},buttons:[f({id:"drawDone",label:"Done",variant:"primary",hiddenWhen:e=>{var{pluginState:t}=e;return!t.mode},enableWhen:e=>{var{pluginState:t}=e;return!!t.tempFeature}},h),f({id:"drawCancel",label:"Cancel",variant:"tertiary",hiddenWhen:e=>{var{pluginState:t}=e;return!t.mode}},h)],api:{newPolygon:(e,t)=>{var{mapState:r,pluginState:o,mapProvider:a,services:n}=e,{dispatch:i}=o,{sketchViewModel:l,sketchLayer:p}=a,{eventBus:c}=n;l.layer=p;var s=l.on("create",e=>{if("complete"===e.state){e.graphic.attributes={id:t},requestAnimationFrame(()=>{l.update(e.graphic,{tool:"reshape",toggleToolOnClick:!1})});var r=y(e.graphic);c.emit("draw:created",r),i({type:"SET_FEATURE",payload:{tempFeature:r}}),s.remove()}});l.polygonSymbol=u(r.mapStyle.mapColorScheme),l.create("polygon"),i({type:"SET_MODE",payload:"new-polygon"})},editFeature:(e,t)=>{var{pluginState:r,mapProvider:o}=e,{dispatch:a}=r,{sketchViewModel:n,sketchLayer:i}=o,l=i.graphics.items.find(e=>e.attributes.id===t),p=l.geometry.extent,c=[p.xmin,p.ymin,p.xmax,p.ymax];o.fitToBounds(c),n.layer=i,n.update(l,{tool:"reshape",toggleToolOnClick:!1,enableRotation:!1,enableScaling:!1}),a({type:"SET_FEATURE",payload:{feature:y(l)}}),a({type:"SET_MODE",payload:"edit-feature"})},addFeature:(e,t)=>{var{pluginState:r,mapState:o,mapProvider:a,services:n}=e,{dispatch:i}=r,{mapStyle:l}=o,{sketchViewModel:p,sketchLayer:c,emptySketchLayer:s}=a,{eventBus:u}=n,y=d(t.id,t.geometry.coordinates,l.mapColorScheme);c.add(y),p.layer=s,i({type:"SET_FEATURE",payload:{feature:t}}),u.emit("draw:add",t)},deleteFeature:(e,t)=>{var{pluginState:r,mapProvider:o,services:a}=e,{dispatch:n}=r,{sketchViewModel:i,sketchLayer:l,emptySketchLayer:p}=o,{eventBus:c}=a,s=l.graphics.items.find(e=>e.attributes.id===t);i.cancel(),l.remove(s),i.layer=p,n({type:"SET_FEATURE",payload:{feature:null,tempFeature:null}}),c.emit("draw:delete",{featureId:t}),n({type:"SET_MODE",payload:null})}}};export{v as manifest};
+import e from"@babel/runtime/helpers/defineProperty";import{useEffect as t}from"preact/compat";import r from"@arcgis/core/widgets/Sketch/SketchViewModel.js";import o from"@arcgis/core/layers/GraphicsLayer.js";import a from"@babel/runtime/helpers/asyncToGenerator";import*as n from"@arcgis/core/geometry/operators/simplifyOperator.js";import i from"@arcgis/core/Graphic.js";function l(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,o)}return r}function p(t){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?l(Object(o),!0).forEach(function(r){e(t,r,o[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(o)):l(Object(o)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(o,e))})}return t}function c(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,o)}return r}function u(t){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?c(Object(o),!0).forEach(function(r){e(t,r,o[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(o)):c(Object(o)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(o,e))})}return t}function s(e){return{type:"simple-fill",color:[0,120,255,.2],outline:{color:"dark"===e?"#ffffff":"#d4351c",width:2}}}function d(e,t,r){return new i({geometry:{type:"polygon",rings:t,spatialReference:27700},attributes:{id:e},symbol:s(r)})}function y(e){if(null==e||!e.geometry)throw new Error("Invalid graphic");var{geometry:t,attributes:r={}}=e;switch(t.type){case"point":return{type:"Feature",geometry:{type:"Point",coordinates:[t.x,t.y]},properties:u({},r)};case"polyline":return{type:"Feature",geometry:{type:"LineString",coordinates:t.paths[0]},properties:u({},r)};case"polygon":return{type:"Feature",geometry:{type:"Polygon",coordinates:t.rings},properties:u({},r)};default:throw new Error("Unsupported geometry type: ".concat(t.type))}}function m(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,o)}return r}function v(t){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?m(Object(o),!0).forEach(function(r){e(t,r,o[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(o)):m(Object(o)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(o,e))})}return t}var f={mobile:{slot:"actions",showLabel:!0},tablet:{slot:"actions",showLabel:!0},desktop:{slot:"actions",showLabel:!0}},h={reducer:{initialState:{mode:null,feature:null,tempFeature:null},actions:{SET_MODE:(e,t)=>p(p({},e),{},{mode:t}),SET_FEATURE:(e,t)=>p(p({},e),{},{feature:void 0===t.feature?e.feature:t.feature,tempFeature:void 0===t.tempFeature?e.tempFeature:t.tempFeature})}},InitComponent:e=>{var i,l,p,c,{appState:u,mapState:m,pluginConfig:v,pluginState:f,services:h,mapProvider:g,buttonConfig:b}=e,{events:O,eventBus:w}=h,{mapColorScheme:S}=m.mapStyle||{},E=null===(i=null===(l=v.includeModes)||void 0===l?void 0:l.includes(u.mode))||void 0===i||i,k=null!==(p=null===(c=v.excludeModes)||void 0===c?void 0:c.includes(u.mode))&&void 0!==p&&p,P=m.isMapReady&&E&&!k;t(()=>{if(P&&!g.sketchViewModel){var{sketchViewModel:e,sketchLayer:t,emptySketchLayer:a}=(e=>{var{mapProvider:t}=e,{view:a}=t,n=new o({id:"sketchLayer"});a.map.add(n);var i=new o({id:"emptySketchLayer"});return a.map.add(i),{sketchViewModel:new r({view:a,layer:i,defaultUpdateOptions:{tool:"reshape",updateOnGraphicClick:!1,multipleSelectionEnabled:!1,toggleToolOnClick:!1,highlightOptions:{enabled:!1}}}),emptySketchLayer:i,sketchLayer:n}})({mapProvider:g});return g.sketchViewModel=e,g.sketchLayer=t,g.emptySketchLayer=a,w.emit("draw:ready"),()=>{g.sketchViewModel=null,g.sketchLayer=null,g.emptySketchLayer=null}}},[m.isMapReady,u.mode]),t(()=>{if(P&&g.sketchViewModel){var e=function(e){var{pluginState:t,mapProvider:r,events:o,eventBus:i,buttonConfig:l,mapColorScheme:p}=e,{view:c,sketchViewModel:u,sketchLayer:m,emptySketchLayer:v}=r;if(!u)return null;var{drawDone:f,drawCancel:h}=l,{dispatch:g,mode:b,feature:O}=t,w=function(){var e=a(function*(){var e,r=null===(e=t.feature)||void 0===e||null===(e=e.properties)||void 0===e?void 0:e.id,o=null,a="active"===u.state&&!r;if("active"===u.state&&r&&(u.cancel(),yield new Promise(e=>setTimeout(e,50))),u.polygonSymbol=s(p),null==m||m.graphics.items.forEach(e=>{var t=d(e.attributes.id,e.geometry.rings,p);e.symbol=t.symbol,r===e.attributes.id&&(o=e)}),o&&!a&&u.layer===m)try{yield u.update(o,{tool:"reshape",toggleToolOnClick:!1})}catch(e){"AbortError"!==e.name&&console.error("Error updating sketch:",e)}});return function(){return e.apply(this,arguments)}}(),S=()=>{var e,t,r=null!==(e=null===(t=m.graphics)||void 0===t||null===(t=t.items)||void 0===t?void 0:t[0])&&void 0!==e?e:null;r&&setTimeout(()=>u.update(r),0)},E=()=>w(),k=e=>{if(e){var t=y(e);i.emit("draw:updated",t),g({type:"SET_FEATURE",payload:{tempFeature:t}})}},P=function(){var e=a(function*(){b&&((u.updateGraphics||[]).length||S())});return function(){return e.apply(this,arguments)}}(),j=function(){var e=a(function*(e){var{toolEventInfo:t}=e,r=null==e?void 0:e.graphic;if(r&&"vertex-add"===(null==t?void 0:t.type)){var o,a,n=null===(o=r.geometry)||void 0===o?void 0:o.rings;(null==n?void 0:n.length)>1?setTimeout(()=>u.undo(),0):(null==n||null===(a=n[0])||void 0===a?void 0:a.length)>3&&k(r)}});return function(t){return e.apply(this,arguments)}}(),T=function(){var e=a(function*(e){var t,r=null==e||null===(t=e.graphics)||void 0===t?void 0:t[0];k(r)});return function(t){return e.apply(this,arguments)}}();i.on(o.MAP_STYLE_CHANGE,E);var C=u.on("update",e=>{var t,r=null===(t=e.toolEventInfo)||void 0===t?void 0:t.type,o=e.graphics[0];"move-start"===r&&(u.cancel(),S()),"reshape"===r&&(n.isSimple(o.geometry)||u.undo()),"reshape-stop"!==r&&"vertex-remove"!==r||k(o)}),F=c.on("click",P),L=u.on("create",j),M=u.on("undo",T),D=f.onClick,_=h.onClick;return f.onClick=()=>{u.cancel(),u.layer=v,g({type:"SET_MODE",payload:null}),g({type:"SET_FEATURE",payload:{feature:null,tempFeature:null}}),i.emit("draw:done",{newFeature:t.tempFeature})},h.onClick=()=>{if(u.cancel(),m.removeAll(),O){var e=d(O.id||O.properties.id,O.geometry.coordinates,p);m.add(e)}u.layer=v,g({type:"SET_MODE",payload:null}),i.emit("draw:cancelled")},()=>{i.off(o.MAP_STYLE_CHANGE,E),C.remove(),F.remove(),L.remove(),M.remove(),f.onClick=D,h.onClick=_}}({pluginState:f,mapProvider:g,events:O,eventBus:w,buttonConfig:b,mapColorScheme:S});return()=>{e()}}},[P,S,f])},buttons:[v({id:"drawDone",label:"Done",variant:"primary",hiddenWhen:e=>{var{pluginState:t}=e;return!t.mode},enableWhen:e=>{var{pluginState:t}=e;return!!t.tempFeature}},f),v({id:"drawCancel",label:"Cancel",variant:"tertiary",hiddenWhen:e=>{var{pluginState:t}=e;return!t.mode}},f)],api:{newPolygon:(e,t)=>{var{mapState:r,pluginState:o,mapProvider:a,services:n}=e,{dispatch:i}=o,{sketchViewModel:l,sketchLayer:p}=a,{eventBus:c}=n;l.layer=p;var u=l.on("create",e=>{if("complete"===e.state){e.graphic.attributes={id:t},requestAnimationFrame(()=>{l.update(e.graphic,{tool:"reshape",toggleToolOnClick:!1})});var r=y(e.graphic);c.emit("draw:created",r),i({type:"SET_FEATURE",payload:{tempFeature:r}}),u.remove()}});l.polygonSymbol=s(r.mapStyle.mapColorScheme),l.create("polygon"),i({type:"SET_MODE",payload:"new-polygon"})},editFeature:(e,t)=>{var{pluginState:r,mapProvider:o}=e,{dispatch:a}=r,{sketchViewModel:n,sketchLayer:i}=o,l=i.graphics.items.find(e=>e.attributes.id===t),p=l.geometry.extent,c=[p.xmin,p.ymin,p.xmax,p.ymax];o.fitToBounds(c),n.layer=i,n.update(l,{tool:"reshape",toggleToolOnClick:!1,enableRotation:!1,enableScaling:!1}),a({type:"SET_FEATURE",payload:{feature:y(l)}}),a({type:"SET_MODE",payload:"edit-feature"})},addFeature:(e,t)=>{var{pluginState:r,mapState:o,mapProvider:a,services:n}=e,{dispatch:i}=r,{mapStyle:l}=o,{sketchViewModel:p,sketchLayer:c,emptySketchLayer:u}=a,{eventBus:s}=n,y=d(t.id,t.geometry.coordinates,l.mapColorScheme);c.add(y),p.layer=u,i({type:"SET_FEATURE",payload:{feature:t}}),s.emit("draw:add",t)},deleteFeature:(e,t)=>{var{pluginState:r,mapProvider:o,services:a}=e,{dispatch:n}=r,{sketchViewModel:i,sketchLayer:l,emptySketchLayer:p}=o,{eventBus:c}=a,u=l.graphics.items.find(e=>e.attributes.id===t);i.cancel(),l.remove(u),i.layer=p,n({type:"SET_FEATURE",payload:{feature:null,tempFeature:null}}),c.emit("draw:delete",{featureId:t}),n({type:"SET_MODE",payload:null})}}};export{h as manifest};

package/plugins/beta/draw-es/src/DrawInit.jsx

@@ -2,14 +2,14 @@ import { useEffect } from 'react'
 import { createSketchViewModel } from './sketchViewModel.js'
 import { attachEvents } from './events.js'
 
-export const DrawInit = ({ 
-  appState, 
-  mapState, 
-  pluginConfig, 
-  pluginState, 
-  services, 
-  mapProvider, 
-  buttonConfig 
+export const DrawInit = ({
+  appState,
+  mapState,
+  pluginConfig,
+  pluginState,
+  services,
+  mapProvider,
+  buttonConfig
 }) => {
   const { events, eventBus } = services
   const { mapColorScheme } = mapState.mapStyle || {}
@@ -22,9 +22,9 @@ export const DrawInit = ({
   // Initialize sketch components once
   useEffect(() => {
     if (!isActive || mapProvider.sketchViewModel) {
-			return
-		}
-    
+      return
+    }
+
     const { sketchViewModel, sketchLayer, emptySketchLayer } = createSketchViewModel({
       pluginState,
       mapProvider,
@@ -33,21 +33,21 @@ export const DrawInit = ({
 
     mapProvider.sketchViewModel = sketchViewModel
     mapProvider.sketchLayer = sketchLayer
-		mapProvider.emptySketchLayer = emptySketchLayer
+    mapProvider.emptySketchLayer = emptySketchLayer
     eventBus.emit('draw:ready')
 
     return () => {
       mapProvider.sketchViewModel = null
       mapProvider.sketchLayer = null
-			mapProvider.emptySketchLayer = null
+      mapProvider.emptySketchLayer = null
     }
   }, [mapState.isMapReady, appState.mode])
 
   // Attach/detach events
   useEffect(() => {
     if (!isActive || !mapProvider.sketchViewModel) {
-			return
-		}
+      return
+    }
 
     const cleanup = attachEvents({
       pluginState,
@@ -62,4 +62,4 @@ export const DrawInit = ({
       cleanup()
     }
   }, [isActive, mapColorScheme, pluginState])
-}
+}

package/plugins/beta/draw-es/src/api/addFeature.js

@@ -7,7 +7,7 @@ export const addFeature = ({ pluginState, mapState, mapProvider, services }, fea
   const { eventBus } = services
 
   const graphic = createGraphic(feature.id, feature.geometry.coordinates, mapStyle.mapColorScheme)
-  
+
   // Add the graphic to the layer
   sketchLayer.add(graphic)
 
@@ -15,7 +15,7 @@ export const addFeature = ({ pluginState, mapState, mapProvider, services }, fea
   sketchViewModel.layer = emptySketchLayer
 
   // Store initial feature in plugin state
-  dispatch({ type: 'SET_FEATURE', payload: { feature }})
+  dispatch({ type: 'SET_FEATURE', payload: { feature } })
 
   eventBus.emit('draw:add', feature)
-}
+}

package/plugins/beta/draw-es/src/api/deleteFeature.js

@@ -10,13 +10,13 @@ export const deleteFeature = ({ pluginState, mapProvider, services }, featureId)
   sketchViewModel.cancel()
   sketchLayer.remove(graphic)
   sketchViewModel.layer = emptySketchLayer
-  
+
   // Reset state
-  dispatch({ type: 'SET_FEATURE', payload: { feature: null, tempFeature: null }})
+  dispatch({ type: 'SET_FEATURE', payload: { feature: null, tempFeature: null } })
 
   // Emit event
   eventBus.emit('draw:delete', { featureId })
 
   // Clear mode
   dispatch({ type: 'SET_MODE', payload: null })
-}
+}

package/plugins/beta/draw-es/src/api/editFeature.js

@@ -18,12 +18,12 @@ export const editFeature = ({ pluginState, mapProvider }, featureId) => {
     tool: 'reshape',
     toggleToolOnClick: false,
     enableRotation: false,
-    enableScaling: false 
+    enableScaling: false
   })
 
   // Set original feature
   const feature = graphicToGeoJSON(graphic)
-  dispatch({ type: 'SET_FEATURE', payload: { feature }})
+  dispatch({ type: 'SET_FEATURE', payload: { feature } })
 
   dispatch({ type: 'SET_MODE', payload: 'edit-feature' })
-}
+}

package/plugins/beta/draw-es/src/api/newPolygon.js

@@ -12,7 +12,7 @@ export const newPolygon = ({ mapState, pluginState, mapProvider, services }, fea
   const handleCreateComplete = sketchViewModel.on('create', (e) => {
     if (e.state === 'complete') {
       e.graphic.attributes = { id: featureId }
-      
+
       // Fix: to address calling some sketchViewModel methods syncronously
       requestAnimationFrame(() => {
         sketchViewModel.update(e.graphic, {
@@ -24,7 +24,7 @@ export const newPolygon = ({ mapState, pluginState, mapProvider, services }, fea
       // Store temp feature in state and emit create
       const tempFeature = graphicToGeoJSON(e.graphic)
       eventBus.emit('draw:created', tempFeature)
-      dispatch({ type: 'SET_FEATURE', payload: { tempFeature }})
+      dispatch({ type: 'SET_FEATURE', payload: { tempFeature } })
 
       handleCreateComplete.remove()
     }
@@ -34,4 +34,4 @@ export const newPolygon = ({ mapState, pluginState, mapProvider, services }, fea
   sketchViewModel.create('polygon')
 
   dispatch({ type: 'SET_MODE', payload: 'new-polygon' })
-}
+}

package/plugins/beta/draw-es/src/events.js

@@ -1,9 +1,9 @@
-import * as simplifyOperator from "@arcgis/core/geometry/operators/simplifyOperator.js"
+import * as simplifyOperator from '@arcgis/core/geometry/operators/simplifyOperator.js'
 import { createGraphic, createSymbol, graphicToGeoJSON } from './graphic.js'
 
 const MODE_CHANGE_DELAY = 50
 
-export function attachEvents({ pluginState, mapProvider, events, eventBus, buttonConfig, mapColorScheme }) {
+export function attachEvents ({ pluginState, mapProvider, events, eventBus, buttonConfig, mapColorScheme }) {
   const { view, sketchViewModel, sketchLayer, emptySketchLayer } = mapProvider
 
   if (!sketchViewModel) {
@@ -12,36 +12,36 @@ export function attachEvents({ pluginState, mapProvider, events, eventBus, butto
 
   const { drawDone, drawCancel } = buttonConfig
   const { dispatch, mode, feature } = pluginState
-  
+
   // Re-colour graphics when map style changes
   const reColour = async () => {
     const activeGraphicId = pluginState.feature?.properties?.id
     let activeGraphic = null
     const isCreating = sketchViewModel.state === 'active' && !activeGraphicId
-    
+
     // Cancel and wait, but only if we're in update mode (not create mode)
     if (sketchViewModel.state === 'active' && activeGraphicId) {
       sketchViewModel.cancel()
       await new Promise(resolve => setTimeout(resolve, MODE_CHANGE_DELAY))
     }
-    
+
     // Update the default symbol for new polygons
     sketchViewModel.polygonSymbol = createSymbol(mapColorScheme)
-    
+
     // Update existing graphics
     sketchLayer?.graphics.items.forEach(graphic => {
       const newGraphic = createGraphic(
-        graphic.attributes.id, 
-        graphic.geometry.rings, 
+        graphic.attributes.id,
+        graphic.geometry.rings,
         mapColorScheme
       )
       graphic.symbol = newGraphic.symbol
-      
+
       if (activeGraphicId === graphic.attributes.id) {
         activeGraphic = graphic
       }
     })
-    
+
     // Re-enter update mode only if we were editing (not creating)
     if (activeGraphic && !isCreating && sketchViewModel.layer === sketchLayer) {
       try {
@@ -68,10 +68,19 @@ export function attachEvents({ pluginState, mapProvider, events, eventBus, butto
   // Event handlers
   const handleMapStyleChange = () => reColour()
 
+  const onGraphicChanged = (graphic) => {
+    if (!graphic) {
+      return
+    }
+    const tempFeature = graphicToGeoJSON(graphic)
+    eventBus.emit('draw:updated', tempFeature)
+    dispatch({ type: 'SET_FEATURE', payload: { tempFeature } })
+  }
+
   const handleSketchUpdate = (e) => {
     const toolInfoType = e.toolEventInfo?.type
     const graphic = e.graphics[0]
-    
+
     // Prevent polygon move
     if (toolInfoType === 'move-start') {
       sketchViewModel.cancel()
@@ -87,10 +96,8 @@ export function attachEvents({ pluginState, mapProvider, events, eventBus, butto
     }
 
     // Emit event on update
-    if (toolInfoType === 'reshape-stop') {
-      const tempFeature = graphicToGeoJSON(graphic)
-      eventBus.emit('draw:updated', tempFeature)
-      dispatch({ type: 'SET_FEATURE', payload: { tempFeature }})
+    if (toolInfoType === 'reshape-stop' || toolInfoType === 'vertex-remove') {
+      onGraphicChanged(graphic)
     }
   }
 
@@ -108,17 +115,38 @@ export function attachEvents({ pluginState, mapProvider, events, eventBus, butto
     updateGraphic()
   }
 
+  const handleCreate = async (event) => {
+    const { toolEventInfo } = event
+    const graphic = event?.graphic
+    if (graphic && toolEventInfo?.type === 'vertex-add') {
+      const rings = graphic.geometry?.rings
+      // rings.length is > 1 occurs when the shape becomes complex (ie self intersects)
+      // setTimeout is required to cause the undo to be called after handleCreate completes
+      // otherwise the previous change, rather than this one, is undone
+      if (rings?.length > 1) {
+        setTimeout(() => sketchViewModel.undo(), 0)
+      } else if (rings?.[0]?.length > 3) {
+        onGraphicChanged(graphic) // emit a graphic update on draw, once the graphic is 2D
+      }
+    }
+  }
+
+  const handleUndo = async (event) => {
+    const graphic = event?.graphics?.[0]
+    onGraphicChanged(graphic)
+  }
+
   const handleDone = () => {
     sketchViewModel.cancel()
     sketchViewModel.layer = emptySketchLayer
     dispatch({ type: 'SET_MODE', payload: null })
-    dispatch({ type: 'SET_FEATURE', payload: { feature: null, tempFeature: null }})
+    dispatch({ type: 'SET_FEATURE', payload: { feature: null, tempFeature: null } })
     eventBus.emit('draw:done', { newFeature: pluginState.tempFeature })
   }
 
   const handleCancel = () => {
     sketchViewModel.cancel()
-    
+
     // Clear all graphics
     sketchLayer.removeAll()
 
@@ -143,10 +171,12 @@ export function attachEvents({ pluginState, mapProvider, events, eventBus, butto
   eventBus.on(events.MAP_STYLE_CHANGE, handleMapStyleChange)
   const sketchUpdateHandler = sketchViewModel.on('update', handleSketchUpdate)
   const viewClickHandler = view.on('click', handleViewClick)
-  
+  const createHandler = sketchViewModel.on('create', handleCreate)
+  const undoHandler = sketchViewModel.on('undo', handleUndo)
+
   const prevDoneClick = drawDone.onClick
   const prevCancelClick = drawCancel.onClick
-  
+
   drawDone.onClick = handleDone
   drawCancel.onClick = handleCancel
 
@@ -155,7 +185,9 @@ export function attachEvents({ pluginState, mapProvider, events, eventBus, butto
     eventBus.off(events.MAP_STYLE_CHANGE, handleMapStyleChange)
     sketchUpdateHandler.remove()
     viewClickHandler.remove()
+    createHandler.remove()
+    undoHandler.remove()
     drawDone.onClick = prevDoneClick
     drawCancel.onClick = prevCancelClick
   }
-}
+}