@biodiv-platform/naksha-gmaps-draw - npm Package Compare versions

Comparing version 4.5.3-beta.1 to 4.5.3-beta.2

dist/esm/index.js

@@ -1,1 +0,1 @@
-var Oe=Object.defineProperty,Fe=Object.defineProperties;var Ne=Object.getOwnPropertyDescriptors;var re=Object.getOwnPropertySymbols;var Ce=Object.prototype.hasOwnProperty,be=Object.prototype.propertyIsEnumerable;var ae=(t,o,e)=>o in t?Oe(t,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[o]=e,M=(t,o)=>{for(var e in o||(o={}))Ce.call(o,e)&&ae(t,e,o[e]);if(re)for(var e of re(o))be.call(o,e)&&ae(t,e,o[e]);return t},j=(t,o)=>Fe(t,Ne(o));import{GMAPS_LIBRARIES as Ee,mapboxToGmapsViewState as Qe}from"@biodiv-platform/naksha-commons";import{Data as Xe,GoogleMap as $e,LoadScriptNext as et}from"@react-google-maps/api";import Ie,{useEffect as Se,useMemo as tt,useReducer as ot,useRef as nt,useState as rt}from"react";import{GMAPS_AUTOCOMPLETE_FIELDS as we}from"@biodiv-platform/naksha-commons";import{Autocomplete as De}from"@react-google-maps/api";import{useState as Me}from"react";import Ge from"@turf/bbox";var l={POINT:"Point",POLYGON:"Polygon",LINESTRING:"LineString",RECTANGLE:"Rectangle",RAW:"Raw",NONE:null},ie={mapTypeControlOptions:{position:10}};var se=t=>({type:l.POINT,properties:{id:new Date().getTime(),name:t.name,formatted_address:t.formatted_address},coordinates:Object.values(t.geometry.location.toJSON()).reverse()}),le=t=>{let o=new Date().getTime();switch(t.getType()){case l.POINT:return{type:l.POINT,properties:{id:o},coordinates:Object.values(t.get().toJSON()).reverse()};case l.POLYGON:{let e=[],n=r=>e.push([r.lng(),r.lat()]);return t.forEachLatLng(n),e.push(e[0]),{type:l.POLYGON,properties:{id:o},coordinates:[e]}}case l.RAW:{let e=t.data;return e.push(e[0]),{type:l.POLYGON,properties:{id:o},coordinates:[e]}}case l.LINESTRING:{let e=[],n=r=>e.push([r.lng(),r.lat()]);return t.forEachLatLng(n),{type:l.LINESTRING,properties:{id:o},coordinates:e}}default:return null}},pe=t=>{let o=(t||[]).filter(n=>n);return o.length===0?!1:{type:"FeatureCollection",features:o.map(n=>{if(Array.isArray(n)&&n.length>0&&n[0].isGeojson){let r=n[0];return{type:"Feature",properties:r.properties||{},geometry:r.geometry||null}}else return{type:"Feature",properties:{},geometry:n}})}},ce=t=>{let o=Ge(t);return{east:o[2],north:o[3],south:o[1],west:o[0]}};import{jsx as ke}from"react/jsx-runtime";function H({InputComponent:t,addFeature:o,gmapRegion:e}){let[n,r]=Me();return ke(De,{onLoad:i=>{r(i)},fields:we,onPlaceChanged:()=>{let i=se(n==null?void 0:n.getPlace());o(i)},options:e?{componentRestrictions:{country:e}}:{},children:t})}import{jsx as Y}from"react/jsx-runtime";var ze={background:"white",position:"absolute",top:"5px",left:"106px",padding:"0.4rem",borderRadius:"0.15rem",outline:0,boxShadow:"rgba(0, 0, 0, 0.3) 0px 1px 4px -1px"};function Z({onClick:t}){return Y("button",{type:"button",title:"Clear",onClick:t,style:ze,children:Y("svg",{viewBox:"0 0 24 24",width:"12",height:"12",children:Y("g",{fill:"#E53E3E",children:Y("path",{d:"M19.452 7.5H4.547a.5.5 0 00-.5.545l1.287 14.136A2 2 0 007.326 24h9.347a2 2 0 001.992-1.819L19.95 8.045a.5.5 0 00-.129-.382.5.5 0 00-.369-.163zm-9.2 13a.75.75 0 01-1.5 0v-9a.75.75 0 011.5 0zm5 0a.75.75 0 01-1.5 0v-9a.75.75 0 011.5 0zM22 4h-4.75a.25.25 0 01-.25-.25V2.5A2.5 2.5 0 0014.5 0h-5A2.5 2.5 0 007 2.5v1.25a.25.25 0 01-.25.25H2a1 1 0 000 2h20a1 1 0 000-2zM9 3.75V2.5a.5.5 0 01.5-.5h5a.5.5 0 01.5.5v1.25a.25.25 0 01-.25.25h-5.5A.25.25 0 019 3.75z"})})})})}var T={ADD:"add",CLEAR:"clear",REPLACE:"replace"};function de(t,{action:o,data:e,isMultiple:n}){switch(o){case T.ADD:return n?[...t||[],e]:[e];case T.CLEAR:return[];case T.REPLACE:return e;default:return t}}import Be,{useEffect as Ue,useState as fe}from"react";import{useState as ue,useEffect as Je}from"react";var _e={enableHighAccuracy:!1,timeout:1/0,maximumAge:0},me=(t,o=_e)=>{let[e,n]=ue(),[r,d]=ue(),p=({coords:a})=>{n([a.longitude,a.latitude])},i=a=>{d(a.message)};return Je(()=>{if(!navigator||!navigator.geolocation){d("Geolocation is not supported");return}let a=null;return t?a=navigator.geolocation.watchPosition(p,i,o):a&&navigator.geolocation.clearWatch(a),()=>a&&navigator.geolocation.clearWatch(a)},[o,t]),{position:e,error:r}};import{jsx as Ye}from"react/jsx-runtime";function K({TraceButtonComponent:t,onFeatureAdded:o}){let[e,n]=fe([]),[r,d]=fe(!1),{position:p}=me(r);Ue(()=>{r&&p&&n([...e,p])},[r,p]);let i=()=>{r?(d(!1),o({getType:()=>l.RAW,data:[...e]}),n([])):d(!0)};return Ye("div",{children:Be.cloneElement(t,{onClick:i,isTracking:r})})}import he,{useState as Ke}from"react";import k,{useRef as We,useState as q}from"react";import{jsx as w,jsxs as z}from"react/jsx-runtime";var Ve=({addFeature:t,InputComponent:o,ButtonComponent:e,LocationIcon:n,SuccessIcon:r,FailureIcon:d})=>{let p=We(null),[i,a]=q(!0),[g,m]=q(""),[u,S]=q([]),A=()=>{var c,F,N;try{let E=(F=(c=p.current)==null?void 0:c.value)!=null?F:"";if(!E.trim()){a(!1),m("Invalid Format. Enter Latitude, Longitude.");return}let C=(N=E.split(",").map(Number))==null?void 0:N.reverse();if(!P(C)){a(!1),m("Invalid Format. Enter Latitude, Longitude.");return}let h={type:l.POINT,properties:{id:new Date().getTime(),name:E,formatted_address:E},coordinates:C};t(h),S(D=>[...D,h]),p.current&&(p.current.value=""),a(!0),m("Point added successfully")}catch(E){a(!1)}finally{setTimeout(()=>{m(""),a(!0)},3e3)}},P=c=>Array.isArray(c)&&c.length===2&&!isNaN(c[0])&&!isNaN(c[1])&&typeof c[0]=="number"&&typeof c[1]=="number";return z("div",{style:{display:"flex",flexDirection:"column",alignItems:"flex-start"},children:[w("h1",{style:{marginBottom:"10px",fontWeight:"bold",fontSize:"1.25rem"},children:"Point"}),z("div",{style:{display:"flex",alignItems:"center"},children:[k.cloneElement(o,{ref:p,width:"300px"}),k.cloneElement(e,{onClick:A,type:"button",marginLeft:"10px"})]}),g&&z("div",{style:{fontWeight:"bold",color:i?"green":"red",marginTop:"10px",display:"flex",alignItems:"center"},children:[i?w("span",{style:{marginRight:"5px",fontSize:"1.25rem"},children:k.cloneElement(r,{boxSize:6})}):w("span",{style:{marginRight:"5px",fontSize:"1.25rem",color:"red"},children:k.cloneElement(d,{boxSize:4})}),g]}),u.length>0&&z("div",{style:{marginTop:"10px",paddingLeft:"15px"},children:[w("div",{style:{fontSize:"sm"},children:"Added Points:"}),w("ul",{style:{listStyleType:"none",padding:"0"},children:u.map(c=>z("li",{style:{display:"flex",alignItems:"center",marginBottom:"5px"},children:[k.cloneElement(n,{boxSize:6,marginRight:2,color:"teal"}),w("span",{style:{overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"300px"},children:c.properties.name})]},c.properties.id))})]})]})},ge=Ve;import J,{useState as W,useRef as je}from"react";import{Fragment as Ze,jsx as y,jsxs as O}from"react/jsx-runtime";var He=({addFeature:t,ButtonComponent:o,FileIcon:e,SuccessIcon:n,FailureIcon:r,DeleteIcon:d})=>{let[p,i]=W(!0),[a,g]=W(""),[m,u]=W([]),[S,A]=W([]),P=je(null),c=s=>{s.preventDefault()},F=s=>{s.preventDefault()},N=s=>{s.preventDefault();let x=Array.from(s.dataTransfer.files);u(x)},E=()=>{let s=Array.from(P.current.files);u(s)},C=()=>{try{m.forEach(s=>{let x=new FileReader;x.onabort=()=>h("File reading was aborted. Please try again."),x.onerror=()=>h("File reading has failed. Please try again."),x.onload=()=>{let b=x.result;if(b){let V=typeof b=="string"?b:new TextDecoder().decode(b);try{let L=JSON.parse(V);(Array.isArray(L.features)?L.features.map(R=>j(M({},R),{isGeojson:!0})):[j(M({},L),{isGeojson:!0})]).forEach(R=>{t([R])}),g("Geojson added successfully"),i(!0),A(R=>[...R,{name:s.name}]),u([])}catch(L){console.error(L),h("Upload failed. Invalid GeoJSON format.")}}else h("File reading result is null.")},x.readAsText(s)})}catch(s){console.error(s),h("File upload failed. Please try again.")}finally{setTimeout(()=>{g(""),i(!0)},2e3)}},h=s=>{g(s),i(!1)},D=()=>{u([])};return O("div",{style:{display:"flex",flexDirection:"column",alignItems:"flex-start",marginTop:"10px"},onDragEnter:c,onDragOver:F,onDrop:N,children:[y("h1",{style:{marginBottom:"10px",fontWeight:"bold",fontSize:"1.25rem"},children:"GeoJSON"}),O("div",{style:{display:"flex",flexDirection:"row",alignItems:"center"},children:[O("div",{style:{border:"2px solid #519895",borderRadius:"4px",display:"flex",flexDirection:"column",alignItems:"center",padding:"10px",cursor:"pointer",marginLeft:"15px",width:"300px",height:"100px"},onClick:()=>P.current.click(),children:[y("input",{type:"file",ref:P,onChange:E,style:{display:"none"}}),y("div",{style:{display:"flex",alignItems:"center"},children:m.length>0?O("div",{style:{marginLeft:"10px",display:"flex",alignItems:"center"},children:[y("div",{style:{marginTop:"10px",overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"200px"},children:m[0].name}),y("div",{style:{color:"red",marginLeft:"10px",marginTop:"10px",cursor:"pointer"},onClick:D,children:J.cloneElement(d,{boxSize:6})})]}):y(Ze,{children:y("div",{children:"Drag 'n' drop GeoJSON file here, or click to select a file"})})})]}),J.cloneElement(o,{type:"button",marginLeft:"30px",style:{paddingLeft:"15px"},onClick:C})]}),a&&O("div",{style:{fontWeight:"bold",color:p?"green":"red",marginTop:"10px",display:"flex",alignItems:"center"},children:[p?y("span",{style:{marginRight:"5px",fontSize:"1.25rem"},children:J.cloneElement(n,{boxSize:6})}):y("span",{style:{marginRight:"5px",fontSize:"1.25rem",color:"red"},children:J.cloneElement(r,{boxSize:4})}),a]}),S.length>0&&O("div",{style:{marginTop:"10px",paddingLeft:"15px"},children:[y("div",{style:{fontSize:"sm"},children:"Added GeoJSONs:"}),y("ul",{style:{listStyleType:"none",padding:"0"},children:S.map((s,x)=>O("li",{style:{display:"flex",alignItems:"center"},children:[J.cloneElement(e,{boxSize:6,marginRight:2}),y("div",{style:{marginTop:"10px",overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"300px"},children:s.name})]},x))})]})]})},ye=He;import{jsx as xe,jsxs as qe}from"react/jsx-runtime";function Q({ButtonComponent:t,ModalComponent:o,addFeature:e,InputComponent:n,ButtonComponentModal:r,DeleteIcon:d,LocationIcon:p,FileIcon:i,SuccessIcon:a,FailureIcon:g}){let[m,u]=Ke(!1),S=()=>{u(!1)},A=()=>{u(!0)};return qe("div",{style:{display:"flex"},children:[he.cloneElement(o,{isOpen:m,onClose:S,nakshaImport:xe(ge,{addFeature:e,InputComponent:n,ButtonComponent:t,LocationIcon:p,SuccessIcon:a,FailureIcon:g}),geoJSONImport:xe(ye,{addFeature:e,ButtonComponent:t,DeleteIcon:d,FileIcon:i,SuccessIcon:a,FailureIcon:g})}),he.cloneElement(r,{onClick:A,type:"button"})]})}import{Fragment as at,jsx as f,jsxs as X}from"react/jsx-runtime";var $t=Ie.forwardRef(({defaultViewState:t,defaultDrawingMode:o,data:e,onDataChange:n,gmapAccessToken:r,isControlled:d,isReadOnly:p,isMultiple:i,isImport:a,isAutocomplete:g,gmapRegion:m,autoCompleteRegion:u,mapStyle:S,importInputComponent:A,importButtonComponent:P,autocompleteComponent:c,showTrace:F,traceButtonComponent:N,maxZoom:E,options:C,importModalComponent:h,isOpen:D,onClose:s,importButtonComponentModal:x,importDeleteIcon:b,importLocationIcon:V,importFileIcon:L,importSuccessIcon:$,importFailureIcon:R},ee)=>{let v=nt(null),[_,B]=ot(de,e),[te,ve]=rt(),oe=tt(()=>Qe(t),[t]),Te=()=>{v.current.state.map.data.forEach(function(G){v.current.state.map.data.remove(G)});let I=pe(_);if(I){I&&v.current.state.map.data.addGeoJson(I);let G=ce(I);G&&v.current.state.map.fitBounds(G),E&&google.maps.event.addListenerOnce(v.current.state.map,"idle",function(){let Re=v.current.state.map.getZoom();v.current.state.map.setZoom(Math.min(E,Re))})}};Se(()=>{te&&(n&&n(_),ee&&(ee.current={addFeature:U,replaceFeature:Ae}),Te())},[te,_]),Se(()=>{d&&JSON.stringify(_)!==JSON.stringify(e)&&B({action:T.REPLACE,data:e})},[e]);let U=I=>{B({action:T.ADD,data:I,isMultiple:i})},Ae=I=>{B({action:T.REPLACE,data:[I]})},ne=I=>{let G=le(I);U(G)},Pe=()=>{B({action:T.CLEAR})},Le=()=>ve(!0);return f(et,{googleMapsApiKey:r,region:m,libraries:g?Ee.AUTOCOMPLETE:Ee.DEFAULT,children:X(at,{children:[X("div",{style:{display:"flex"},children:[g&&f("div",{style:{width:"500px"},children:f(H,{InputComponent:c||f("input",{}),addFeature:U,gmapRegion:u!=null?u:m})}),f("div",{style:{flex:"1"}})," ",f(Q,{ButtonComponent:P||f("button",{children:"add"}),ModalComponent:h&&Ie.cloneElement(h,{isOpen:D,onClose:s}),InputComponent:A||f("input",{}),addFeature:U,ButtonComponentModal:x||f("button",{children:"add"}),DeleteIcon:b,LocationIcon:V,FileIcon:L,SuccessIcon:$,FailureIcon:R})]}),F&&f(K,{TraceButtonComponent:N||f("button",{children:"trace"}),onFeatureAdded:ne}),X($e,{id:"naksha-gmaps-draw",mapContainerStyle:S||{height:"100%",width:"100%"},zoom:oe.zoom,center:oe.center,options:ie,ref:v,onLoad:Le,children:[i&&f(Z,{onClick:Pe}),!p&&f(Xe,{options:M({controls:[l.POINT,l.POLYGON,l.LINESTRING],drawingMode:o||l.POLYGON,featureFactory:ne},C||{})})]})]})})});export{l as GMAP_FEATURE_TYPES,$t as NakshaGmapsDraw};
+import{GMAPS_LIBRARIES as he,mapboxToGmapsViewState as We}from"@biodiv-platform/naksha-commons";import{Data as Ve,GoogleMap as je,LoadScriptNext as He}from"@react-google-maps/api";import xe,{useEffect as Ee,useMemo as Ze,useReducer as Ke,useRef as qe,useState as Qe}from"react";import{GMAPS_AUTOCOMPLETE_FIELDS as Re}from"@biodiv-platform/naksha-commons";import{Autocomplete as Oe}from"@react-google-maps/api";import{useState as Fe}from"react";import Le from"@turf/bbox";var l={POINT:"Point",POLYGON:"Polygon",LINESTRING:"LineString",RECTANGLE:"Rectangle",RAW:"Raw",NONE:null},re={mapTypeControlOptions:{position:10}};var ae=t=>({type:l.POINT,properties:{id:new Date().getTime(),name:t.name,formatted_address:t.formatted_address},coordinates:Object.values(t.geometry.location.toJSON()).reverse()}),ie=t=>{let n=new Date().getTime();switch(t.getType()){case l.POINT:return{type:l.POINT,properties:{id:n},coordinates:Object.values(t.get().toJSON()).reverse()};case l.POLYGON:{let e=[],o=r=>e.push([r.lng(),r.lat()]);return t.forEachLatLng(o),e.push(e[0]),{type:l.POLYGON,properties:{id:n},coordinates:[e]}}case l.RAW:{let e=t.data;return e.push(e[0]),{type:l.POLYGON,properties:{id:n},coordinates:[e]}}case l.LINESTRING:{let e=[],o=r=>e.push([r.lng(),r.lat()]);return t.forEachLatLng(o),{type:l.LINESTRING,properties:{id:n},coordinates:e}}default:return null}},se=t=>{let n=(t||[]).filter(o=>o);return n.length===0?!1:{type:"FeatureCollection",features:n.map(o=>{if(Array.isArray(o)&&o.length>0&&o[0].isGeojson){let r=o[0];return{type:"Feature",properties:r.properties||{},geometry:r.geometry||null}}else return{type:"Feature",properties:{},geometry:o}})}},le=t=>{let n=Le(t);return{east:n[2],north:n[3],south:n[1],west:n[0]}};import{jsx as Ne}from"react/jsx-runtime";function H({InputComponent:t,addFeature:n,gmapRegion:e}){let[o,r]=Fe();return Ne(Oe,{onLoad:i=>{r(i)},fields:Re,onPlaceChanged:()=>{let i=ae(o==null?void 0:o.getPlace());n(i)},options:e?{componentRestrictions:{country:e}}:{},children:t})}import{jsx as W}from"react/jsx-runtime";var Ce={background:"white",position:"absolute",top:"5px",left:"106px",padding:"0.4rem",borderRadius:"0.15rem",outline:0,boxShadow:"rgba(0, 0, 0, 0.3) 0px 1px 4px -1px"};function Z({onClick:t}){return W("button",{type:"button",title:"Clear",onClick:t,style:Ce,children:W("svg",{viewBox:"0 0 24 24",width:"12",height:"12",children:W("g",{fill:"#E53E3E",children:W("path",{d:"M19.452 7.5H4.547a.5.5 0 00-.5.545l1.287 14.136A2 2 0 007.326 24h9.347a2 2 0 001.992-1.819L19.95 8.045a.5.5 0 00-.129-.382.5.5 0 00-.369-.163zm-9.2 13a.75.75 0 01-1.5 0v-9a.75.75 0 011.5 0zm5 0a.75.75 0 01-1.5 0v-9a.75.75 0 011.5 0zM22 4h-4.75a.25.25 0 01-.25-.25V2.5A2.5 2.5 0 0014.5 0h-5A2.5 2.5 0 007 2.5v1.25a.25.25 0 01-.25.25H2a1 1 0 000 2h20a1 1 0 000-2zM9 3.75V2.5a.5.5 0 01.5-.5h5a.5.5 0 01.5.5v1.25a.25.25 0 01-.25.25h-5.5A.25.25 0 019 3.75z"})})})})}var P={ADD:"add",CLEAR:"clear",REPLACE:"replace"};function pe(t,{action:n,data:e,isMultiple:o}){switch(n){case P.ADD:return o?[...t||[],e]:[e];case P.CLEAR:return[];case P.REPLACE:return e;default:return t}}import we,{useEffect as De,useState as ue}from"react";import{useState as ce,useEffect as be}from"react";var Ge={enableHighAccuracy:!1,timeout:1/0,maximumAge:0},de=(t,n=Ge)=>{let[e,o]=ce(),[r,d]=ce(),p=({coords:a})=>{o([a.longitude,a.latitude])},i=a=>{d(a.message)};return be(()=>{if(!navigator||!navigator.geolocation){d("Geolocation is not supported");return}let a=null;return t?a=navigator.geolocation.watchPosition(p,i,n):a&&navigator.geolocation.clearWatch(a),()=>a&&navigator.geolocation.clearWatch(a)},[n,t]),{position:e,error:r}};import{jsx as Me}from"react/jsx-runtime";function K({TraceButtonComponent:t,onFeatureAdded:n}){let[e,o]=ue([]),[r,d]=ue(!1),{position:p}=de(r);De(()=>{r&&p&&o([...e,p])},[r,p]);let i=()=>{r?(d(!1),n({getType:()=>l.RAW,data:[...e]}),o([])):d(!0)};return Me("div",{children:we.cloneElement(t,{onClick:i,isTracking:r})})}import ge,{useState as Ue}from"react";import z,{useRef as ke,useState as q}from"react";import{jsx as M,jsxs as J}from"react/jsx-runtime";var ze=({addFeature:t,InputComponent:n,ButtonComponent:e,LocationIcon:o,SuccessIcon:r,FailureIcon:d})=>{let p=ke(null),[i,a]=q(!0),[g,m]=q(""),[u,T]=q([]),L=()=>{var c,C,b;try{let E=(C=(c=p.current)==null?void 0:c.value)!=null?C:"";if(!E.trim()){a(!1),m("Invalid Format. Enter Latitude, Longitude.");return}let G=(b=E.split(",").map(Number))==null?void 0:b.reverse();if(!R(G)){a(!1),m("Invalid Format. Enter Latitude, Longitude.");return}let h={type:l.POINT,properties:{id:new Date().getTime(),name:E,formatted_address:E},coordinates:G};t(h),T(k=>[...k,h]),p.current&&(p.current.value=""),a(!0),m("Point added successfully")}catch{a(!1)}finally{setTimeout(()=>{m(""),a(!0)},3e3)}},R=c=>Array.isArray(c)&&c.length===2&&!isNaN(c[0])&&!isNaN(c[1])&&typeof c[0]=="number"&&typeof c[1]=="number";return J("div",{style:{display:"flex",flexDirection:"column",alignItems:"flex-start"},children:[M("h1",{style:{marginBottom:"10px",fontWeight:"bold",fontSize:"1.25rem"},children:"Point"}),J("div",{style:{display:"flex",alignItems:"center"},children:[z.cloneElement(n,{ref:p,width:"300px"}),z.cloneElement(e,{onClick:L,type:"button",marginLeft:"10px"})]}),g&&J("div",{style:{fontWeight:"bold",color:i?"green":"red",marginTop:"10px",display:"flex",alignItems:"center"},children:[i?M("span",{style:{marginRight:"5px",fontSize:"1.25rem"},children:z.cloneElement(r,{boxSize:6})}):M("span",{style:{marginRight:"5px",fontSize:"1.25rem",color:"red"},children:z.cloneElement(d,{boxSize:4})}),g]}),u.length>0&&J("div",{style:{marginTop:"10px",paddingLeft:"15px"},children:[M("div",{style:{fontSize:"sm"},children:"Added Points:"}),M("ul",{style:{listStyleType:"none",padding:"0"},children:u.map(c=>J("li",{style:{display:"flex",alignItems:"center",marginBottom:"5px"},children:[z.cloneElement(o,{boxSize:6,marginRight:2,color:"teal"}),M("span",{style:{overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"300px"},children:c.properties.name})]},c.properties.id))})]})]})},me=ze;import _,{useState as V,useRef as Je}from"react";import{Fragment as Be,jsx as y,jsxs as N}from"react/jsx-runtime";var _e=({addFeature:t,ButtonComponent:n,FileIcon:e,SuccessIcon:o,FailureIcon:r,DeleteIcon:d})=>{let[p,i]=V(!0),[a,g]=V(""),[m,u]=V([]),[T,L]=V([]),R=Je(null),c=s=>{s.preventDefault()},C=s=>{s.preventDefault()},b=s=>{s.preventDefault();let x=Array.from(s.dataTransfer.files);u(x)},E=()=>{let s=Array.from(R.current.files);u(s)},G=()=>{try{m.forEach(s=>{let x=new FileReader;x.onabort=()=>h("File reading was aborted. Please try again."),x.onerror=()=>h("File reading has failed. Please try again."),x.onload=()=>{let w=x.result;if(w){let j=typeof w=="string"?w:new TextDecoder().decode(w);try{let O=JSON.parse(j);(Array.isArray(O.features)?O.features.map(F=>({...F,isGeojson:!0})):[{...O,isGeojson:!0}]).forEach(F=>{t([F])}),g("Geojson added successfully"),i(!0),L(F=>[...F,{name:s.name}]),u([])}catch(O){console.error(O),h("Upload failed. Invalid GeoJSON format.")}}else h("File reading result is null.")},x.readAsText(s)})}catch(s){console.error(s),h("File upload failed. Please try again.")}finally{setTimeout(()=>{g(""),i(!0)},2e3)}},h=s=>{g(s),i(!1)},k=()=>{u([])};return N("div",{style:{display:"flex",flexDirection:"column",alignItems:"flex-start",marginTop:"10px"},onDragEnter:c,onDragOver:C,onDrop:b,children:[y("h1",{style:{marginBottom:"10px",fontWeight:"bold",fontSize:"1.25rem"},children:"GeoJSON"}),N("div",{style:{display:"flex",flexDirection:"row",alignItems:"center"},children:[N("div",{style:{border:"2px solid #519895",borderRadius:"4px",display:"flex",flexDirection:"column",alignItems:"center",padding:"10px",cursor:"pointer",marginLeft:"15px",width:"300px",height:"100px"},onClick:()=>R.current.click(),children:[y("input",{type:"file",ref:R,onChange:E,style:{display:"none"}}),y("div",{style:{display:"flex",alignItems:"center"},children:m.length>0?N("div",{style:{marginLeft:"10px",display:"flex",alignItems:"center"},children:[y("div",{style:{marginTop:"10px",overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"200px"},children:m[0].name}),y("div",{style:{color:"red",marginLeft:"10px",marginTop:"10px",cursor:"pointer"},onClick:k,children:_.cloneElement(d,{boxSize:6})})]}):y(Be,{children:y("div",{children:"Drag 'n' drop GeoJSON file here, or click to select a file"})})})]}),_.cloneElement(n,{type:"button",marginLeft:"30px",style:{paddingLeft:"15px"},onClick:G})]}),a&&N("div",{style:{fontWeight:"bold",color:p?"green":"red",marginTop:"10px",display:"flex",alignItems:"center"},children:[p?y("span",{style:{marginRight:"5px",fontSize:"1.25rem"},children:_.cloneElement(o,{boxSize:6})}):y("span",{style:{marginRight:"5px",fontSize:"1.25rem",color:"red"},children:_.cloneElement(r,{boxSize:4})}),a]}),T.length>0&&N("div",{style:{marginTop:"10px",paddingLeft:"15px"},children:[y("div",{style:{fontSize:"sm"},children:"Added GeoJSONs:"}),y("ul",{style:{listStyleType:"none",padding:"0"},children:T.map((s,x)=>N("li",{style:{display:"flex",alignItems:"center"},children:[_.cloneElement(e,{boxSize:6,marginRight:2}),y("div",{style:{marginTop:"10px",overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"300px"},children:s.name})]},x))})]})]})},fe=_e;import{jsx as ye,jsxs as Ye}from"react/jsx-runtime";function Q({ButtonComponent:t,ModalComponent:n,addFeature:e,InputComponent:o,ButtonComponentModal:r,DeleteIcon:d,LocationIcon:p,FileIcon:i,SuccessIcon:a,FailureIcon:g}){let[m,u]=Ue(!1),T=()=>{u(!1)},L=()=>{u(!0)};return Ye("div",{style:{display:"flex"},children:[ge.cloneElement(n,{isOpen:m,onClose:T,nakshaImport:ye(me,{addFeature:e,InputComponent:o,ButtonComponent:t,LocationIcon:p,SuccessIcon:a,FailureIcon:g}),geoJSONImport:ye(fe,{addFeature:e,ButtonComponent:t,DeleteIcon:d,FileIcon:i,SuccessIcon:a,FailureIcon:g})}),ge.cloneElement(r,{onClick:L,type:"button"})]})}import{Fragment as Xe,jsx as f,jsxs as X}from"react/jsx-runtime";var zt=xe.forwardRef(({defaultViewState:t,defaultDrawingMode:n,data:e,onDataChange:o,gmapAccessToken:r,isControlled:d,isReadOnly:p,isMultiple:i,isImport:a,isAutocomplete:g,gmapRegion:m,autoCompleteRegion:u,mapStyle:T,importInputComponent:L,importButtonComponent:R,autocompleteComponent:c,showTrace:C,traceButtonComponent:b,maxZoom:E,options:G,importModalComponent:h,isOpen:k,onClose:s,importButtonComponentModal:x,importDeleteIcon:w,importLocationIcon:j,importFileIcon:O,importSuccessIcon:$,importFailureIcon:F},ee)=>{let A=qe(null),[B,U]=Ke(pe,e),[te,Ie]=Qe(),oe=Ze(()=>We(t),[t]),Se=()=>{A.current.state.map.data.forEach(function(D){A.current.state.map.data.remove(D)});let I=se(B);if(I){I&&A.current.state.map.data.addGeoJson(I);let D=le(I);D&&A.current.state.map.fitBounds(D),E&&google.maps.event.addListenerOnce(A.current.state.map,"idle",function(){let Pe=A.current.state.map.getZoom();A.current.state.map.setZoom(Math.min(E,Pe))})}};Ee(()=>{te&&(o&&o(B),ee&&(ee.current={addFeature:Y,replaceFeature:ve}),Se())},[te,B]),Ee(()=>{d&&JSON.stringify(B)!==JSON.stringify(e)&&U({action:P.REPLACE,data:e})},[e]);let Y=I=>{U({action:P.ADD,data:I,isMultiple:i})},ve=I=>{U({action:P.REPLACE,data:[I]})},ne=I=>{let D=ie(I);Y(D)},Te=()=>{U({action:P.CLEAR})},Ae=()=>Ie(!0);return f(He,{googleMapsApiKey:r,region:m,libraries:g?he.AUTOCOMPLETE:he.DEFAULT,children:X(Xe,{children:[X("div",{style:{display:"flex"},children:[g&&f("div",{style:{width:"500px"},children:f(H,{InputComponent:c||f("input",{}),addFeature:Y,gmapRegion:u!=null?u:m})}),f("div",{style:{flex:"1"}})," ",f(Q,{ButtonComponent:R||f("button",{children:"add"}),ModalComponent:h&&xe.cloneElement(h,{isOpen:k,onClose:s}),InputComponent:L||f("input",{}),addFeature:Y,ButtonComponentModal:x||f("button",{children:"add"}),DeleteIcon:w,LocationIcon:j,FileIcon:O,SuccessIcon:$,FailureIcon:F})]}),C&&f(K,{TraceButtonComponent:b||f("button",{children:"trace"}),onFeatureAdded:ne}),X(je,{id:"naksha-gmaps-draw",mapContainerStyle:T||{height:"100%",width:"100%"},zoom:oe.zoom,center:oe.center,options:re,ref:A,onLoad:Ae,children:[i&&f(Z,{onClick:Te}),!p&&f(Ve,{options:{controls:[l.POINT,l.POLYGON,l.LINESTRING],drawingMode:n||l.POLYGON,featureFactory:ne,...G||{}}})]})]})})});export{l as GMAP_FEATURE_TYPES,zt as NakshaGmapsDraw};

dist/index.js

@@ -1,1 +0,1 @@
-"use strict";var Ge=Object.create;var B=Object.defineProperty,we=Object.defineProperties,De=Object.getOwnPropertyDescriptor,Me=Object.getOwnPropertyDescriptors,ke=Object.getOwnPropertyNames,le=Object.getOwnPropertySymbols,ze=Object.getPrototypeOf,ce=Object.prototype.hasOwnProperty,Je=Object.prototype.propertyIsEnumerable;var pe=(e,o,t)=>o in e?B(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,U=(e,o)=>{for(var t in o||(o={}))ce.call(o,t)&&pe(e,t,o[t]);if(le)for(var t of le(o))Je.call(o,t)&&pe(e,t,o[t]);return e},X=(e,o)=>we(e,Me(o));var _e=(e,o)=>{for(var t in o)B(e,t,{get:o[t],enumerable:!0})},de=(e,o,t,n)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of ke(o))!ce.call(e,r)&&r!==t&&B(e,r,{get:()=>o[r],enumerable:!(n=De(o,r))||n.enumerable});return e};var z=(e,o,t)=>(t=e!=null?Ge(ze(e)):{},de(o||!e||!e.__esModule?B(t,"default",{value:e,enumerable:!0}):t,e)),Be=e=>de(B({},"__esModule",{value:!0}),e);var He={};_e(He,{GMAP_FEATURE_TYPES:()=>s,NakshaGmapsDraw:()=>je});module.exports=Be(He);var H=require("@biodiv-platform/naksha-commons"),J=require("@react-google-maps/api"),g=z(require("react"));var xe=require("@biodiv-platform/naksha-commons"),Ee=require("@react-google-maps/api"),Ie=require("react");var me=z(require("@turf/bbox"));var s={POINT:"Point",POLYGON:"Polygon",LINESTRING:"LineString",RECTANGLE:"Rectangle",RAW:"Raw",NONE:null},ue={mapTypeControlOptions:{position:10}};var fe=e=>({type:s.POINT,properties:{id:new Date().getTime(),name:e.name,formatted_address:e.formatted_address},coordinates:Object.values(e.geometry.location.toJSON()).reverse()}),ge=e=>{let o=new Date().getTime();switch(e.getType()){case s.POINT:return{type:s.POINT,properties:{id:o},coordinates:Object.values(e.get().toJSON()).reverse()};case s.POLYGON:{let t=[],n=r=>t.push([r.lng(),r.lat()]);return e.forEachLatLng(n),t.push(t[0]),{type:s.POLYGON,properties:{id:o},coordinates:[t]}}case s.RAW:{let t=e.data;return t.push(t[0]),{type:s.POLYGON,properties:{id:o},coordinates:[t]}}case s.LINESTRING:{let t=[],n=r=>t.push([r.lng(),r.lat()]);return e.forEachLatLng(n),{type:s.LINESTRING,properties:{id:o},coordinates:t}}default:return null}},ye=e=>{let o=(e||[]).filter(n=>n);return o.length===0?!1:{type:"FeatureCollection",features:o.map(n=>{if(Array.isArray(n)&&n.length>0&&n[0].isGeojson){let r=n[0];return{type:"Feature",properties:r.properties||{},geometry:r.geometry||null}}else return{type:"Feature",properties:{},geometry:n}})}},he=e=>{let o=(0,me.default)(e);return{east:o[2],north:o[3],south:o[1],west:o[0]}};var Se=require("react/jsx-runtime");function $({InputComponent:e,addFeature:o,gmapRegion:t}){let[n,r]=(0,Ie.useState)();return(0,Se.jsx)(Ee.Autocomplete,{onLoad:p=>{r(p)},fields:xe.GMAPS_AUTOCOMPLETE_FIELDS,onPlaceChanged:()=>{let p=fe(n==null?void 0:n.getPlace());o(p)},options:t?{componentRestrictions:{country:t}}:{},children:e})}var Y=require("react/jsx-runtime"),Ue={background:"white",position:"absolute",top:"5px",left:"106px",padding:"0.4rem",borderRadius:"0.15rem",outline:0,boxShadow:"rgba(0, 0, 0, 0.3) 0px 1px 4px -1px"};function ee({onClick:e}){return(0,Y.jsx)("button",{type:"button",title:"Clear",onClick:e,style:Ue,children:(0,Y.jsx)("svg",{viewBox:"0 0 24 24",width:"12",height:"12",children:(0,Y.jsx)("g",{fill:"#E53E3E",children:(0,Y.jsx)("path",{d:"M19.452 7.5H4.547a.5.5 0 00-.5.545l1.287 14.136A2 2 0 007.326 24h9.347a2 2 0 001.992-1.819L19.95 8.045a.5.5 0 00-.129-.382.5.5 0 00-.369-.163zm-9.2 13a.75.75 0 01-1.5 0v-9a.75.75 0 011.5 0zm5 0a.75.75 0 01-1.5 0v-9a.75.75 0 011.5 0zM22 4h-4.75a.25.25 0 01-.25-.25V2.5A2.5 2.5 0 0014.5 0h-5A2.5 2.5 0 007 2.5v1.25a.25.25 0 01-.25.25H2a1 1 0 000 2h20a1 1 0 000-2zM9 3.75V2.5a.5.5 0 01.5-.5h5a.5.5 0 01.5.5v1.25a.25.25 0 01-.25.25h-5.5A.25.25 0 019 3.75z"})})})})}var R={ADD:"add",CLEAR:"clear",REPLACE:"replace"};function ve(e,{action:o,data:t,isMultiple:n}){switch(o){case R.ADD:return n?[...e||[],t]:[t];case R.CLEAR:return[];case R.REPLACE:return t;default:return e}}var b=z(require("react"));var W=require("react"),Ye={enableHighAccuracy:!1,timeout:1/0,maximumAge:0},Te=(e,o=Ye)=>{let[t,n]=(0,W.useState)(),[r,m]=(0,W.useState)(),d=({coords:a})=>{n([a.longitude,a.latitude])},p=a=>{m(a.message)};return(0,W.useEffect)(()=>{if(!navigator||!navigator.geolocation){m("Geolocation is not supported");return}let a=null;return e?a=navigator.geolocation.watchPosition(d,p,o):a&&navigator.geolocation.clearWatch(a),()=>a&&navigator.geolocation.clearWatch(a)},[o,e]),{position:t,error:r}};var Ae=require("react/jsx-runtime");function te({TraceButtonComponent:e,onFeatureAdded:o}){let[t,n]=(0,b.useState)([]),[r,m]=(0,b.useState)(!1),{position:d}=Te(r);(0,b.useEffect)(()=>{r&&d&&n([...t,d])},[r,d]);let p=()=>{r?(m(!1),o({getType:()=>s.RAW,data:[...t]}),n([])):m(!0)};return(0,Ae.jsx)("div",{children:b.default.cloneElement(e,{onClick:p,isTracking:r})})}var V=z(require("react"));var I=z(require("react"));var h=require("react/jsx-runtime"),We=({addFeature:e,InputComponent:o,ButtonComponent:t,LocationIcon:n,SuccessIcon:r,FailureIcon:m})=>{let d=(0,I.useRef)(null),[p,a]=(0,I.useState)(!0),[E,y]=(0,I.useState)(""),[f,P]=(0,I.useState)([]),O=()=>{var u,G,w;try{let T=(G=(u=d.current)==null?void 0:u.value)!=null?G:"";if(!T.trim()){a(!1),y("Invalid Format. Enter Latitude, Longitude.");return}let D=(w=T.split(",").map(Number))==null?void 0:w.reverse();if(!F(D)){a(!1),y("Invalid Format. Enter Latitude, Longitude.");return}let S={type:s.POINT,properties:{id:new Date().getTime(),name:T,formatted_address:T},coordinates:D};e(S),P(_=>[..._,S]),d.current&&(d.current.value=""),a(!0),y("Point added successfully")}catch(T){a(!1)}finally{setTimeout(()=>{y(""),a(!0)},3e3)}},F=u=>Array.isArray(u)&&u.length===2&&!isNaN(u[0])&&!isNaN(u[1])&&typeof u[0]=="number"&&typeof u[1]=="number";return(0,h.jsxs)("div",{style:{display:"flex",flexDirection:"column",alignItems:"flex-start"},children:[(0,h.jsx)("h1",{style:{marginBottom:"10px",fontWeight:"bold",fontSize:"1.25rem"},children:"Point"}),(0,h.jsxs)("div",{style:{display:"flex",alignItems:"center"},children:[I.default.cloneElement(o,{ref:d,width:"300px"}),I.default.cloneElement(t,{onClick:O,type:"button",marginLeft:"10px"})]}),E&&(0,h.jsxs)("div",{style:{fontWeight:"bold",color:p?"green":"red",marginTop:"10px",display:"flex",alignItems:"center"},children:[p?(0,h.jsx)("span",{style:{marginRight:"5px",fontSize:"1.25rem"},children:I.default.cloneElement(r,{boxSize:6})}):(0,h.jsx)("span",{style:{marginRight:"5px",fontSize:"1.25rem",color:"red"},children:I.default.cloneElement(m,{boxSize:4})}),E]}),f.length>0&&(0,h.jsxs)("div",{style:{marginTop:"10px",paddingLeft:"15px"},children:[(0,h.jsx)("div",{style:{fontSize:"sm"},children:"Added Points:"}),(0,h.jsx)("ul",{style:{listStyleType:"none",padding:"0"},children:f.map(u=>(0,h.jsxs)("li",{style:{display:"flex",alignItems:"center",marginBottom:"5px"},children:[I.default.cloneElement(n,{boxSize:6,marginRight:2,color:"teal"}),(0,h.jsx)("span",{style:{overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"300px"},children:u.properties.name})]},u.properties.id))})]})]})},Pe=We;var x=z(require("react"));var i=require("react/jsx-runtime"),Ve=({addFeature:e,ButtonComponent:o,FileIcon:t,SuccessIcon:n,FailureIcon:r,DeleteIcon:m})=>{let[d,p]=(0,x.useState)(!0),[a,E]=(0,x.useState)(""),[y,f]=(0,x.useState)([]),[P,O]=(0,x.useState)([]),F=(0,x.useRef)(null),u=c=>{c.preventDefault()},G=c=>{c.preventDefault()},w=c=>{c.preventDefault();let v=Array.from(c.dataTransfer.files);f(v)},T=()=>{let c=Array.from(F.current.files);f(c)},D=()=>{try{y.forEach(c=>{let v=new FileReader;v.onabort=()=>S("File reading was aborted. Please try again."),v.onerror=()=>S("File reading has failed. Please try again."),v.onload=()=>{let M=v.result;if(M){let Q=typeof M=="string"?M:new TextDecoder().decode(M);try{let N=JSON.parse(Q);(Array.isArray(N.features)?N.features.map(C=>X(U({},C),{isGeojson:!0})):[X(U({},N),{isGeojson:!0})]).forEach(C=>{e([C])}),E("Geojson added successfully"),p(!0),O(C=>[...C,{name:c.name}]),f([])}catch(N){console.error(N),S("Upload failed. Invalid GeoJSON format.")}}else S("File reading result is null.")},v.readAsText(c)})}catch(c){console.error(c),S("File upload failed. Please try again.")}finally{setTimeout(()=>{E(""),p(!0)},2e3)}},S=c=>{E(c),p(!1)},_=()=>{f([])};return(0,i.jsxs)("div",{style:{display:"flex",flexDirection:"column",alignItems:"flex-start",marginTop:"10px"},onDragEnter:u,onDragOver:G,onDrop:w,children:[(0,i.jsx)("h1",{style:{marginBottom:"10px",fontWeight:"bold",fontSize:"1.25rem"},children:"GeoJSON"}),(0,i.jsxs)("div",{style:{display:"flex",flexDirection:"row",alignItems:"center"},children:[(0,i.jsxs)("div",{style:{border:"2px solid #519895",borderRadius:"4px",display:"flex",flexDirection:"column",alignItems:"center",padding:"10px",cursor:"pointer",marginLeft:"15px",width:"300px",height:"100px"},onClick:()=>F.current.click(),children:[(0,i.jsx)("input",{type:"file",ref:F,onChange:T,style:{display:"none"}}),(0,i.jsx)("div",{style:{display:"flex",alignItems:"center"},children:y.length>0?(0,i.jsxs)("div",{style:{marginLeft:"10px",display:"flex",alignItems:"center"},children:[(0,i.jsx)("div",{style:{marginTop:"10px",overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"200px"},children:y[0].name}),(0,i.jsx)("div",{style:{color:"red",marginLeft:"10px",marginTop:"10px",cursor:"pointer"},onClick:_,children:x.default.cloneElement(m,{boxSize:6})})]}):(0,i.jsx)(i.Fragment,{children:(0,i.jsx)("div",{children:"Drag 'n' drop GeoJSON file here, or click to select a file"})})})]}),x.default.cloneElement(o,{type:"button",marginLeft:"30px",style:{paddingLeft:"15px"},onClick:D})]}),a&&(0,i.jsxs)("div",{style:{fontWeight:"bold",color:d?"green":"red",marginTop:"10px",display:"flex",alignItems:"center"},children:[d?(0,i.jsx)("span",{style:{marginRight:"5px",fontSize:"1.25rem"},children:x.default.cloneElement(n,{boxSize:6})}):(0,i.jsx)("span",{style:{marginRight:"5px",fontSize:"1.25rem",color:"red"},children:x.default.cloneElement(r,{boxSize:4})}),a]}),P.length>0&&(0,i.jsxs)("div",{style:{marginTop:"10px",paddingLeft:"15px"},children:[(0,i.jsx)("div",{style:{fontSize:"sm"},children:"Added GeoJSONs:"}),(0,i.jsx)("ul",{style:{listStyleType:"none",padding:"0"},children:P.map((c,v)=>(0,i.jsxs)("li",{style:{display:"flex",alignItems:"center"},children:[x.default.cloneElement(t,{boxSize:6,marginRight:2}),(0,i.jsx)("div",{style:{marginTop:"10px",overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"300px"},children:c.name})]},v))})]})]})},Le=Ve;var j=require("react/jsx-runtime");function oe({ButtonComponent:e,ModalComponent:o,addFeature:t,InputComponent:n,ButtonComponentModal:r,DeleteIcon:m,LocationIcon:d,FileIcon:p,SuccessIcon:a,FailureIcon:E}){let[y,f]=(0,V.useState)(!1),P=()=>{f(!1)},O=()=>{f(!0)};return(0,j.jsxs)("div",{style:{display:"flex"},children:[V.default.cloneElement(o,{isOpen:y,onClose:P,nakshaImport:(0,j.jsx)(Pe,{addFeature:t,InputComponent:n,ButtonComponent:e,LocationIcon:d,SuccessIcon:a,FailureIcon:E}),geoJSONImport:(0,j.jsx)(Le,{addFeature:t,ButtonComponent:e,DeleteIcon:m,FileIcon:p,SuccessIcon:a,FailureIcon:E})}),V.default.cloneElement(r,{onClick:O,type:"button"})]})}var l=require("react/jsx-runtime"),je=g.default.forwardRef(({defaultViewState:e,defaultDrawingMode:o,data:t,onDataChange:n,gmapAccessToken:r,isControlled:m,isReadOnly:d,isMultiple:p,isImport:a,isAutocomplete:E,gmapRegion:y,autoCompleteRegion:f,mapStyle:P,importInputComponent:O,importButtonComponent:F,autocompleteComponent:u,showTrace:G,traceButtonComponent:w,maxZoom:T,options:D,importModalComponent:S,isOpen:_,onClose:c,importButtonComponentModal:v,importDeleteIcon:M,importLocationIcon:Q,importFileIcon:N,importSuccessIcon:ne,importFailureIcon:C},re)=>{let L=(0,g.useRef)(null),[Z,K]=(0,g.useReducer)(ve,t),[ae,Re]=(0,g.useState)(),ie=(0,g.useMemo)(()=>(0,H.mapboxToGmapsViewState)(e),[e]),Oe=()=>{L.current.state.map.data.forEach(function(k){L.current.state.map.data.remove(k)});let A=ye(Z);if(A){A&&L.current.state.map.data.addGeoJson(A);let k=he(A);k&&L.current.state.map.fitBounds(k),T&&google.maps.event.addListenerOnce(L.current.state.map,"idle",function(){let be=L.current.state.map.getZoom();L.current.state.map.setZoom(Math.min(T,be))})}};(0,g.useEffect)(()=>{ae&&(n&&n(Z),re&&(re.current={addFeature:q,replaceFeature:Fe}),Oe())},[ae,Z]),(0,g.useEffect)(()=>{m&&JSON.stringify(Z)!==JSON.stringify(t)&&K({action:R.REPLACE,data:t})},[t]);let q=A=>{K({action:R.ADD,data:A,isMultiple:p})},Fe=A=>{K({action:R.REPLACE,data:[A]})},se=A=>{let k=ge(A);q(k)},Ne=()=>{K({action:R.CLEAR})},Ce=()=>Re(!0);return(0,l.jsx)(J.LoadScriptNext,{googleMapsApiKey:r,region:y,libraries:E?H.GMAPS_LIBRARIES.AUTOCOMPLETE:H.GMAPS_LIBRARIES.DEFAULT,children:(0,l.jsxs)(l.Fragment,{children:[(0,l.jsxs)("div",{style:{display:"flex"},children:[E&&(0,l.jsx)("div",{style:{width:"500px"},children:(0,l.jsx)($,{InputComponent:u||(0,l.jsx)("input",{}),addFeature:q,gmapRegion:f!=null?f:y})}),(0,l.jsx)("div",{style:{flex:"1"}})," ",(0,l.jsx)(oe,{ButtonComponent:F||(0,l.jsx)("button",{children:"add"}),ModalComponent:S&&g.default.cloneElement(S,{isOpen:_,onClose:c}),InputComponent:O||(0,l.jsx)("input",{}),addFeature:q,ButtonComponentModal:v||(0,l.jsx)("button",{children:"add"}),DeleteIcon:M,LocationIcon:Q,FileIcon:N,SuccessIcon:ne,FailureIcon:C})]}),G&&(0,l.jsx)(te,{TraceButtonComponent:w||(0,l.jsx)("button",{children:"trace"}),onFeatureAdded:se}),(0,l.jsxs)(J.GoogleMap,{id:"naksha-gmaps-draw",mapContainerStyle:P||{height:"100%",width:"100%"},zoom:ie.zoom,center:ie.center,options:ue,ref:L,onLoad:Ce,children:[p&&(0,l.jsx)(ee,{onClick:Ne}),!d&&(0,l.jsx)(J.Data,{options:U({controls:[s.POINT,s.POLYGON,s.LINESTRING],drawingMode:o||s.POLYGON,featureFactory:se},D||{})})]})]})})});0&&(module.exports={GMAP_FEATURE_TYPES,NakshaGmapsDraw});
+"use strict";var Re=Object.create;var Z=Object.defineProperty;var Oe=Object.getOwnPropertyDescriptor;var Fe=Object.getOwnPropertyNames;var Ne=Object.getPrototypeOf,Ce=Object.prototype.hasOwnProperty;var be=(e,o)=>{for(var t in o)Z(e,t,{get:o[t],enumerable:!0})},se=(e,o,t,n)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of Fe(o))!Ce.call(e,r)&&r!==t&&Z(e,r,{get:()=>o[r],enumerable:!(n=Oe(o,r))||n.enumerable});return e};var J=(e,o,t)=>(t=e!=null?Re(Ne(e)):{},se(o||!e||!e.__esModule?Z(t,"default",{value:e,enumerable:!0}):t,e)),Ge=e=>se(Z({},"__esModule",{value:!0}),e);var Be={};be(Be,{GMAP_FEATURE_TYPES:()=>s,NakshaGmapsDraw:()=>_e});module.exports=Ge(Be);var W=require("@biodiv-platform/naksha-commons"),_=require("@react-google-maps/api"),g=J(require("react"));var fe=require("@biodiv-platform/naksha-commons"),ge=require("@react-google-maps/api"),ye=require("react");var pe=J(require("@turf/bbox"));var s={POINT:"Point",POLYGON:"Polygon",LINESTRING:"LineString",RECTANGLE:"Rectangle",RAW:"Raw",NONE:null},le={mapTypeControlOptions:{position:10}};var ce=e=>({type:s.POINT,properties:{id:new Date().getTime(),name:e.name,formatted_address:e.formatted_address},coordinates:Object.values(e.geometry.location.toJSON()).reverse()}),de=e=>{let o=new Date().getTime();switch(e.getType()){case s.POINT:return{type:s.POINT,properties:{id:o},coordinates:Object.values(e.get().toJSON()).reverse()};case s.POLYGON:{let t=[],n=r=>t.push([r.lng(),r.lat()]);return e.forEachLatLng(n),t.push(t[0]),{type:s.POLYGON,properties:{id:o},coordinates:[t]}}case s.RAW:{let t=e.data;return t.push(t[0]),{type:s.POLYGON,properties:{id:o},coordinates:[t]}}case s.LINESTRING:{let t=[],n=r=>t.push([r.lng(),r.lat()]);return e.forEachLatLng(n),{type:s.LINESTRING,properties:{id:o},coordinates:t}}default:return null}},ue=e=>{let o=(e||[]).filter(n=>n);return o.length===0?!1:{type:"FeatureCollection",features:o.map(n=>{if(Array.isArray(n)&&n.length>0&&n[0].isGeojson){let r=n[0];return{type:"Feature",properties:r.properties||{},geometry:r.geometry||null}}else return{type:"Feature",properties:{},geometry:n}})}},me=e=>{let o=(0,pe.default)(e);return{east:o[2],north:o[3],south:o[1],west:o[0]}};var we=require("react/jsx-runtime");function X({InputComponent:e,addFeature:o,gmapRegion:t}){let[n,r]=(0,ye.useState)();return(0,we.jsx)(ge.Autocomplete,{onLoad:l=>{r(l)},fields:fe.GMAPS_AUTOCOMPLETE_FIELDS,onPlaceChanged:()=>{let l=ce(n==null?void 0:n.getPlace());o(l)},options:t?{componentRestrictions:{country:t}}:{},children:e})}var K=require("react/jsx-runtime"),De={background:"white",position:"absolute",top:"5px",left:"106px",padding:"0.4rem",borderRadius:"0.15rem",outline:0,boxShadow:"rgba(0, 0, 0, 0.3) 0px 1px 4px -1px"};function $({onClick:e}){return(0,K.jsx)("button",{type:"button",title:"Clear",onClick:e,style:De,children:(0,K.jsx)("svg",{viewBox:"0 0 24 24",width:"12",height:"12",children:(0,K.jsx)("g",{fill:"#E53E3E",children:(0,K.jsx)("path",{d:"M19.452 7.5H4.547a.5.5 0 00-.5.545l1.287 14.136A2 2 0 007.326 24h9.347a2 2 0 001.992-1.819L19.95 8.045a.5.5 0 00-.129-.382.5.5 0 00-.369-.163zm-9.2 13a.75.75 0 01-1.5 0v-9a.75.75 0 011.5 0zm5 0a.75.75 0 01-1.5 0v-9a.75.75 0 011.5 0zM22 4h-4.75a.25.25 0 01-.25-.25V2.5A2.5 2.5 0 0014.5 0h-5A2.5 2.5 0 007 2.5v1.25a.25.25 0 01-.25.25H2a1 1 0 000 2h20a1 1 0 000-2zM9 3.75V2.5a.5.5 0 01.5-.5h5a.5.5 0 01.5.5v1.25a.25.25 0 01-.25.25h-5.5A.25.25 0 019 3.75z"})})})})}var O={ADD:"add",CLEAR:"clear",REPLACE:"replace"};function he(e,{action:o,data:t,isMultiple:n}){switch(o){case O.ADD:return n?[...e||[],t]:[t];case O.CLEAR:return[];case O.REPLACE:return t;default:return e}}var G=J(require("react"));var U=require("react"),Me={enableHighAccuracy:!1,timeout:1/0,maximumAge:0},xe=(e,o=Me)=>{let[t,n]=(0,U.useState)(),[r,m]=(0,U.useState)(),d=({coords:a})=>{n([a.longitude,a.latitude])},l=a=>{m(a.message)};return(0,U.useEffect)(()=>{if(!navigator||!navigator.geolocation){m("Geolocation is not supported");return}let a=null;return e?a=navigator.geolocation.watchPosition(d,l,o):a&&navigator.geolocation.clearWatch(a),()=>a&&navigator.geolocation.clearWatch(a)},[o,e]),{position:t,error:r}};var ke=require("react/jsx-runtime");function ee({TraceButtonComponent:e,onFeatureAdded:o}){let[t,n]=(0,G.useState)([]),[r,m]=(0,G.useState)(!1),{position:d}=xe(r);(0,G.useEffect)(()=>{r&&d&&n([...t,d])},[r,d]);let l=()=>{r?(m(!1),o({getType:()=>s.RAW,data:[...t]}),n([])):m(!0)};return(0,ke.jsx)("div",{children:G.default.cloneElement(e,{onClick:l,isTracking:r})})}var Y=J(require("react"));var I=J(require("react"));var E=require("react/jsx-runtime"),ze=({addFeature:e,InputComponent:o,ButtonComponent:t,LocationIcon:n,SuccessIcon:r,FailureIcon:m})=>{let d=(0,I.useRef)(null),[l,a]=(0,I.useState)(!0),[x,y]=(0,I.useState)(""),[f,L]=(0,I.useState)([]),F=()=>{var u,w,D;try{let T=(w=(u=d.current)==null?void 0:u.value)!=null?w:"";if(!T.trim()){a(!1),y("Invalid Format. Enter Latitude, Longitude.");return}let M=(D=T.split(",").map(Number))==null?void 0:D.reverse();if(!N(M)){a(!1),y("Invalid Format. Enter Latitude, Longitude.");return}let S={type:s.POINT,properties:{id:new Date().getTime(),name:T,formatted_address:T},coordinates:M};e(S),L(B=>[...B,S]),d.current&&(d.current.value=""),a(!0),y("Point added successfully")}catch{a(!1)}finally{setTimeout(()=>{y(""),a(!0)},3e3)}},N=u=>Array.isArray(u)&&u.length===2&&!isNaN(u[0])&&!isNaN(u[1])&&typeof u[0]=="number"&&typeof u[1]=="number";return(0,E.jsxs)("div",{style:{display:"flex",flexDirection:"column",alignItems:"flex-start"},children:[(0,E.jsx)("h1",{style:{marginBottom:"10px",fontWeight:"bold",fontSize:"1.25rem"},children:"Point"}),(0,E.jsxs)("div",{style:{display:"flex",alignItems:"center"},children:[I.default.cloneElement(o,{ref:d,width:"300px"}),I.default.cloneElement(t,{onClick:F,type:"button",marginLeft:"10px"})]}),x&&(0,E.jsxs)("div",{style:{fontWeight:"bold",color:l?"green":"red",marginTop:"10px",display:"flex",alignItems:"center"},children:[l?(0,E.jsx)("span",{style:{marginRight:"5px",fontSize:"1.25rem"},children:I.default.cloneElement(r,{boxSize:6})}):(0,E.jsx)("span",{style:{marginRight:"5px",fontSize:"1.25rem",color:"red"},children:I.default.cloneElement(m,{boxSize:4})}),x]}),f.length>0&&(0,E.jsxs)("div",{style:{marginTop:"10px",paddingLeft:"15px"},children:[(0,E.jsx)("div",{style:{fontSize:"sm"},children:"Added Points:"}),(0,E.jsx)("ul",{style:{listStyleType:"none",padding:"0"},children:f.map(u=>(0,E.jsxs)("li",{style:{display:"flex",alignItems:"center",marginBottom:"5px"},children:[I.default.cloneElement(n,{boxSize:6,marginRight:2,color:"teal"}),(0,E.jsx)("span",{style:{overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"300px"},children:u.properties.name})]},u.properties.id))})]})]})},Ee=ze;var h=J(require("react")),i=require("react/jsx-runtime"),Je=({addFeature:e,ButtonComponent:o,FileIcon:t,SuccessIcon:n,FailureIcon:r,DeleteIcon:m})=>{let[d,l]=(0,h.useState)(!0),[a,x]=(0,h.useState)(""),[y,f]=(0,h.useState)([]),[L,F]=(0,h.useState)([]),N=(0,h.useRef)(null),u=p=>{p.preventDefault()},w=p=>{p.preventDefault()},D=p=>{p.preventDefault();let v=Array.from(p.dataTransfer.files);f(v)},T=()=>{let p=Array.from(N.current.files);f(p)},M=()=>{try{y.forEach(p=>{let v=new FileReader;v.onabort=()=>S("File reading was aborted. Please try again."),v.onerror=()=>S("File reading has failed. Please try again."),v.onload=()=>{let k=v.result;if(k){let Q=typeof k=="string"?k:new TextDecoder().decode(k);try{let C=JSON.parse(Q);(Array.isArray(C.features)?C.features.map(b=>({...b,isGeojson:!0})):[{...C,isGeojson:!0}]).forEach(b=>{e([b])}),x("Geojson added successfully"),l(!0),F(b=>[...b,{name:p.name}]),f([])}catch(C){console.error(C),S("Upload failed. Invalid GeoJSON format.")}}else S("File reading result is null.")},v.readAsText(p)})}catch(p){console.error(p),S("File upload failed. Please try again.")}finally{setTimeout(()=>{x(""),l(!0)},2e3)}},S=p=>{x(p),l(!1)},B=()=>{f([])};return(0,i.jsxs)("div",{style:{display:"flex",flexDirection:"column",alignItems:"flex-start",marginTop:"10px"},onDragEnter:u,onDragOver:w,onDrop:D,children:[(0,i.jsx)("h1",{style:{marginBottom:"10px",fontWeight:"bold",fontSize:"1.25rem"},children:"GeoJSON"}),(0,i.jsxs)("div",{style:{display:"flex",flexDirection:"row",alignItems:"center"},children:[(0,i.jsxs)("div",{style:{border:"2px solid #519895",borderRadius:"4px",display:"flex",flexDirection:"column",alignItems:"center",padding:"10px",cursor:"pointer",marginLeft:"15px",width:"300px",height:"100px"},onClick:()=>N.current.click(),children:[(0,i.jsx)("input",{type:"file",ref:N,onChange:T,style:{display:"none"}}),(0,i.jsx)("div",{style:{display:"flex",alignItems:"center"},children:y.length>0?(0,i.jsxs)("div",{style:{marginLeft:"10px",display:"flex",alignItems:"center"},children:[(0,i.jsx)("div",{style:{marginTop:"10px",overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"200px"},children:y[0].name}),(0,i.jsx)("div",{style:{color:"red",marginLeft:"10px",marginTop:"10px",cursor:"pointer"},onClick:B,children:h.default.cloneElement(m,{boxSize:6})})]}):(0,i.jsx)(i.Fragment,{children:(0,i.jsx)("div",{children:"Drag 'n' drop GeoJSON file here, or click to select a file"})})})]}),h.default.cloneElement(o,{type:"button",marginLeft:"30px",style:{paddingLeft:"15px"},onClick:M})]}),a&&(0,i.jsxs)("div",{style:{fontWeight:"bold",color:d?"green":"red",marginTop:"10px",display:"flex",alignItems:"center"},children:[d?(0,i.jsx)("span",{style:{marginRight:"5px",fontSize:"1.25rem"},children:h.default.cloneElement(n,{boxSize:6})}):(0,i.jsx)("span",{style:{marginRight:"5px",fontSize:"1.25rem",color:"red"},children:h.default.cloneElement(r,{boxSize:4})}),a]}),L.length>0&&(0,i.jsxs)("div",{style:{marginTop:"10px",paddingLeft:"15px"},children:[(0,i.jsx)("div",{style:{fontSize:"sm"},children:"Added GeoJSONs:"}),(0,i.jsx)("ul",{style:{listStyleType:"none",padding:"0"},children:L.map((p,v)=>(0,i.jsxs)("li",{style:{display:"flex",alignItems:"center"},children:[h.default.cloneElement(t,{boxSize:6,marginRight:2}),(0,i.jsx)("div",{style:{marginTop:"10px",overflow:"hidden",whiteSpace:"pre-wrap",textOverflow:"ellipsis",maxWidth:"300px"},children:p.name})]},v))})]})]})},Ie=Je;var q=require("react/jsx-runtime");function te({ButtonComponent:e,ModalComponent:o,addFeature:t,InputComponent:n,ButtonComponentModal:r,DeleteIcon:m,LocationIcon:d,FileIcon:l,SuccessIcon:a,FailureIcon:x}){let[y,f]=(0,Y.useState)(!1),L=()=>{f(!1)},F=()=>{f(!0)};return(0,q.jsxs)("div",{style:{display:"flex"},children:[Y.default.cloneElement(o,{isOpen:y,onClose:L,nakshaImport:(0,q.jsx)(Ee,{addFeature:t,InputComponent:n,ButtonComponent:e,LocationIcon:d,SuccessIcon:a,FailureIcon:x}),geoJSONImport:(0,q.jsx)(Ie,{addFeature:t,ButtonComponent:e,DeleteIcon:m,FileIcon:l,SuccessIcon:a,FailureIcon:x})}),Y.default.cloneElement(r,{onClick:F,type:"button"})]})}var c=require("react/jsx-runtime"),_e=g.default.forwardRef(({defaultViewState:e,defaultDrawingMode:o,data:t,onDataChange:n,gmapAccessToken:r,isControlled:m,isReadOnly:d,isMultiple:l,isImport:a,isAutocomplete:x,gmapRegion:y,autoCompleteRegion:f,mapStyle:L,importInputComponent:F,importButtonComponent:N,autocompleteComponent:u,showTrace:w,traceButtonComponent:D,maxZoom:T,options:M,importModalComponent:S,isOpen:B,onClose:p,importButtonComponentModal:v,importDeleteIcon:k,importLocationIcon:Q,importFileIcon:C,importSuccessIcon:oe,importFailureIcon:b},ne)=>{let R=(0,g.useRef)(null),[V,j]=(0,g.useReducer)(he,t),[re,Se]=(0,g.useState)(),ae=(0,g.useMemo)(()=>(0,W.mapboxToGmapsViewState)(e),[e]),ve=()=>{R.current.state.map.data.forEach(function(z){R.current.state.map.data.remove(z)});let A=ue(V);if(A){A&&R.current.state.map.data.addGeoJson(A);let z=me(A);z&&R.current.state.map.fitBounds(z),T&&google.maps.event.addListenerOnce(R.current.state.map,"idle",function(){let Le=R.current.state.map.getZoom();R.current.state.map.setZoom(Math.min(T,Le))})}};(0,g.useEffect)(()=>{re&&(n&&n(V),ne&&(ne.current={addFeature:H,replaceFeature:Te}),ve())},[re,V]),(0,g.useEffect)(()=>{m&&JSON.stringify(V)!==JSON.stringify(t)&&j({action:O.REPLACE,data:t})},[t]);let H=A=>{j({action:O.ADD,data:A,isMultiple:l})},Te=A=>{j({action:O.REPLACE,data:[A]})},ie=A=>{let z=de(A);H(z)},Ae=()=>{j({action:O.CLEAR})},Pe=()=>Se(!0);return(0,c.jsx)(_.LoadScriptNext,{googleMapsApiKey:r,region:y,libraries:x?W.GMAPS_LIBRARIES.AUTOCOMPLETE:W.GMAPS_LIBRARIES.DEFAULT,children:(0,c.jsxs)(c.Fragment,{children:[(0,c.jsxs)("div",{style:{display:"flex"},children:[x&&(0,c.jsx)("div",{style:{width:"500px"},children:(0,c.jsx)(X,{InputComponent:u||(0,c.jsx)("input",{}),addFeature:H,gmapRegion:f!=null?f:y})}),(0,c.jsx)("div",{style:{flex:"1"}})," ",(0,c.jsx)(te,{ButtonComponent:N||(0,c.jsx)("button",{children:"add"}),ModalComponent:S&&g.default.cloneElement(S,{isOpen:B,onClose:p}),InputComponent:F||(0,c.jsx)("input",{}),addFeature:H,ButtonComponentModal:v||(0,c.jsx)("button",{children:"add"}),DeleteIcon:k,LocationIcon:Q,FileIcon:C,SuccessIcon:oe,FailureIcon:b})]}),w&&(0,c.jsx)(ee,{TraceButtonComponent:D||(0,c.jsx)("button",{children:"trace"}),onFeatureAdded:ie}),(0,c.jsxs)(_.GoogleMap,{id:"naksha-gmaps-draw",mapContainerStyle:L||{height:"100%",width:"100%"},zoom:ae.zoom,center:ae.center,options:le,ref:R,onLoad:Pe,children:[l&&(0,c.jsx)($,{onClick:Ae}),!d&&(0,c.jsx)(_.Data,{options:{controls:[s.POINT,s.POLYGON,s.LINESTRING],drawingMode:o||s.POLYGON,featureFactory:ie,...M||{}}})]})]})})});0&&(module.exports={GMAP_FEATURE_TYPES,NakshaGmapsDraw});

package.json

 {
   "name": "@biodiv-platform/naksha-gmaps-draw",
-  "version": "4.5.3-beta.1",
+  "version": "4.5.3-beta.2",
   "author": "harshzalavadiya",
@@ -39,2 +39,2 @@ "main": "./dist/index.js",
   }
-}
+}

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

28210

decreased by-2.87%

Lines of code

141

decreased by-2.76%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes