@biodiv-platform/naksha-maplibre-draw 5.0.0 → 5.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/esm/index.js +1 -219
  2. package/dist/index.js +1 -244
  3. package/package.json +2 -2
package/dist/esm/index.js CHANGED
@@ -1,219 +1 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3
- var __hasOwnProp = Object.prototype.hasOwnProperty;
4
- var __propIsEnum = Object.prototype.propertyIsEnumerable;
5
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
6
- var __spreadValues = (a, b) => {
7
- for (var prop in b || (b = {}))
8
- if (__hasOwnProp.call(b, prop))
9
- __defNormalProp(a, prop, b[prop]);
10
- if (__getOwnPropSymbols)
11
- for (var prop of __getOwnPropSymbols(b)) {
12
- if (__propIsEnum.call(b, prop))
13
- __defNormalProp(a, prop, b[prop]);
14
- }
15
- return a;
16
- };
17
-
18
- // src/index.tsx
19
- import { MapProvider } from "react-map-gl/maplibre";
20
-
21
- // src/components/map.tsx
22
- import {
23
- defaultMapStyles,
24
- defaultViewState
25
- } from "@biodiv-platform/naksha-commons";
26
- import bbox from "@turf/bbox";
27
- import { useEffect, useState } from "react";
28
- import MapGL, { NavigationControl, useMap } from "react-map-gl/maplibre";
29
-
30
- // src/components/draw-control.tsx
31
- import { MaplibreTerradrawControl } from "@watergis/maplibre-gl-terradraw";
32
- import { emit, useListener } from "react-gbus";
33
- import { useControl } from "react-map-gl/maplibre";
34
-
35
- // src/components/delete-panel.tsx
36
- import { jsx } from "react/jsx-runtime";
37
- function DeletePanel({ onDelete }) {
38
- return /* @__PURE__ */ jsx("div", {
39
- className: "maplibregl-ctrl-top-left",
40
- style: { marginTop: "100px" },
41
- children: /* @__PURE__ */ jsx("div", {
42
- className: "maplibregl-ctrl-group maplibregl-ctrl",
43
- children: /* @__PURE__ */ jsx("button", {
44
- className: "maplibre-gl-draw_ctrl-draw-btn maplibre-gl-draw_trash",
45
- title: "Delete",
46
- onClick: onDelete,
47
- style: {
48
- display: "flex",
49
- justifyContent: "center",
50
- alignItems: "center",
51
- width: "30px",
52
- height: "30px"
53
- },
54
- children: /* @__PURE__ */ jsx("svg", {
55
- width: "16",
56
- height: "16",
57
- viewBox: "0 0 24 24",
58
- fill: "none",
59
- stroke: "currentColor",
60
- strokeWidth: "2",
61
- children: /* @__PURE__ */ jsx("path", {
62
- d: "M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
63
- })
64
- })
65
- })
66
- })
67
- });
68
- }
69
-
70
- // src/components/draw-control.tsx
71
- import { jsx as jsx2 } from "react/jsx-runtime";
72
- var UPDATE_EVENT = "rmsc-draw-updated";
73
- function DrawControl(props) {
74
- useListener(onUpdate, [UPDATE_EVENT]);
75
- function onUpdate(e) {
76
- var _a;
77
- if (!terradrawControl)
78
- return;
79
- const allFeatures = terradrawControl.getFeatures().features;
80
- const _features = props.isMultiple ? allFeatures : [allFeatures[allFeatures.length - 1]];
81
- (_a = props.setFeatures) == null ? void 0 : _a.call(props, _features);
82
- }
83
- const terradrawControl = useControl(
84
- ({ map }) => {
85
- const ctrl = new MaplibreTerradrawControl({
86
- modes: ["point", "linestring", "polygon"],
87
- open: true
88
- });
89
- map.on("terradraw.create", (e) => {
90
- if (!props.isMultiple) {
91
- ctrl.terradraw.clear();
92
- }
93
- ctrl.getTerraDrawInstance().setMode("select");
94
- emit(UPDATE_EVENT, e);
95
- });
96
- map.on("terradraw.update", (e) => emit(UPDATE_EVENT, e));
97
- map.on("terradraw.delete", (e) => emit(UPDATE_EVENT, e));
98
- return ctrl;
99
- },
100
- () => {
101
- },
102
- { position: "top-left" }
103
- );
104
- const onDelete = () => {
105
- var _a;
106
- terradrawControl.terradraw.clear();
107
- (_a = props.setFeatures) == null ? void 0 : _a.call(props, []);
108
- };
109
- return /* @__PURE__ */ jsx2(DeletePanel, {
110
- onDelete
111
- });
112
- }
113
-
114
- // src/components/geojson-layer.tsx
115
- import { Layer, Source } from "react-map-gl/maplibre";
116
-
117
- // src/static/constants.tsx
118
- var featureStyle = {
119
- id: "data",
120
- type: "fill",
121
- paint: {
122
- "fill-color": "#f03b20",
123
- "fill-opacity": 0.2
124
- },
125
- filter: ["==", ["geometry-type"], "Polygon"]
126
- };
127
- var pointStyle = {
128
- type: "circle",
129
- paint: {
130
- "circle-radius": 8,
131
- "circle-color": "#f03b20",
132
- "circle-opacity": 0.8
133
- },
134
- filter: ["==", ["geometry-type"], "Point"]
135
- };
136
- var lineStyle = {
137
- type: "line",
138
- paint: {
139
- "line-color": "#f03b20",
140
- "line-width": 1.6,
141
- "line-dasharray": [6, 3],
142
- "line-opacity": 0.8
143
- },
144
- filter: ["==", ["geometry-type"], "LineString"]
145
- };
146
-
147
- // src/components/geojson-layer.tsx
148
- import { jsx as jsx3, jsxs } from "react/jsx-runtime";
149
- function GeojsonLayer({ features }) {
150
- if (!(features == null ? void 0 : features.length))
151
- return null;
152
- return /* @__PURE__ */ jsxs(Source, {
153
- type: "geojson",
154
- data: { type: "FeatureCollection", features },
155
- children: [
156
- /* @__PURE__ */ jsx3(Layer, __spreadValues({}, pointStyle)),
157
- /* @__PURE__ */ jsx3(Layer, __spreadValues({}, lineStyle)),
158
- /* @__PURE__ */ jsx3(Layer, __spreadValues({}, featureStyle))
159
- ]
160
- });
161
- }
162
-
163
- // src/components/map.tsx
164
- import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
165
- var NavControl = NavigationControl;
166
- function Map(props) {
167
- const { mapv } = useMap();
168
- const [mapStyle] = useState(defaultMapStyles[(props == null ? void 0 : props.mapStyle) || 0].style);
169
- const [viewState] = useState(props.defaultViewState || defaultViewState);
170
- const [features, setFeatures] = useState(props.features || []);
171
- const autoFocus = () => {
172
- if (!(features == null ? void 0 : features.length) || !mapv)
173
- return;
174
- const _bbox = bbox({ type: "FeatureCollection", features });
175
- mapv.fitBounds(_bbox, { padding: 40, duration: 1e3 });
176
- };
177
- useEffect(() => {
178
- props.onFeaturesChange && props.onFeaturesChange(features);
179
- autoFocus();
180
- }, [features]);
181
- useEffect(() => {
182
- if (props.isControlled && JSON.stringify(features) !== JSON.stringify(props.features)) {
183
- setFeatures(props.features || []);
184
- }
185
- }, [props.features]);
186
- return /* @__PURE__ */ jsxs2(MapGL, {
187
- id: "mapv",
188
- cursor: "default",
189
- initialViewState: viewState,
190
- style: { width: "100%", height: "100%" },
191
- mapStyle,
192
- onLoad: autoFocus,
193
- children: [
194
- /* @__PURE__ */ jsx4(NavControl, {
195
- position: "bottom-right",
196
- showZoom: true,
197
- showCompass: true
198
- }),
199
- /* @__PURE__ */ jsx4(DrawControl, {
200
- features,
201
- setFeatures,
202
- isControlled: props.isControlled,
203
- isMultiple: props.isMultiple
204
- }),
205
- /* @__PURE__ */ jsx4(GeojsonLayer, {
206
- features
207
- })
208
- ]
209
- });
210
- }
211
-
212
- // src/index.tsx
213
- import { jsx as jsx5 } from "react/jsx-runtime";
214
- var NakshaMaplibreDraw = (props) => /* @__PURE__ */ jsx5(MapProvider, {
215
- children: /* @__PURE__ */ jsx5(Map, __spreadValues({}, props))
216
- });
217
- export {
218
- NakshaMaplibreDraw
219
- };
1
+ var F=Object.defineProperty;var M=Object.getOwnPropertySymbols;var x=Object.prototype.hasOwnProperty,V=Object.prototype.propertyIsEnumerable;var C=(e,o,r)=>o in e?F(e,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[o]=r,l=(e,o)=>{for(var r in o||(o={}))x.call(o,r)&&C(e,r,o[r]);if(M)for(var r of M(o))V.call(o,r)&&C(e,r,o[r]);return e};import{MapProvider as W}from"react-map-gl/maplibre";import{defaultMapStyles as G,defaultViewState as B}from"@biodiv-platform/naksha-commons";import I from"@turf/bbox";import{useEffect as N,useState as g}from"react";import J,{NavigationControl as O,useMap as U}from"react-map-gl/maplibre";import{emit as u,useListener as k}from"react-gbus";import{useControl as L}from"react-map-gl/maplibre";import{jsx as n}from"react/jsx-runtime";function c({onDelete:e}){return n("div",{className:"maplibregl-ctrl-top-left",style:{marginTop:"100px"},children:n("div",{className:"maplibregl-ctrl-group maplibregl-ctrl",children:n("button",{className:"maplibre-gl-draw_ctrl-draw-btn maplibre-gl-draw_trash",title:"Delete",onClick:e,style:{display:"flex",justifyContent:"center",alignItems:"center",width:"30px",height:"30px"},children:n("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:n("path",{d:"M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"})})})})})}import{MaplibreTerradrawControl as R}from"@watergis/maplibre-gl-terradraw";import{jsx as T}from"react/jsx-runtime";var f="rmsc-draw-updated";function m(e){k(o,[f]);function o(t){var s;if(!r)return;let a=r.getFeatures().features,i=e.isMultiple?a:[a[a.length-1]];(s=e.setFeatures)==null||s.call(e,i)}let r=L(({map:t})=>{let a=new R({modes:["point","linestring","polygon"],open:!0});return t.on("terradraw.create",i=>{e.isMultiple||a.terradraw.clear(),a.getTerraDrawInstance().setMode("select"),u(f,i)}),t.on("terradraw.update",i=>u(f,i)),t.on("terradraw.delete",i=>u(f,i)),a},()=>{},{position:"top-left"});return T(c,{onDelete:()=>{var t;r.terradraw.clear(),(t=e.setFeatures)==null||t.call(e,[])}})}import{Layer as d,Source as _}from"react-map-gl/maplibre";var S={id:"data",type:"fill",paint:{"fill-color":"#f03b20","fill-opacity":.2},filter:["==",["geometry-type"],"Polygon"]},v={type:"circle",paint:{"circle-radius":8,"circle-color":"#f03b20","circle-opacity":.8},filter:["==",["geometry-type"],"Point"]},D={type:"line",paint:{"line-color":"#f03b20","line-width":1.6,"line-dasharray":[6,3],"line-opacity":.8},filter:["==",["geometry-type"],"LineString"]};import{jsx as y,jsxs as E}from"react/jsx-runtime";function p({features:e}){return e!=null&&e.length?E(_,{type:"geojson",data:{type:"FeatureCollection",features:e},children:[y(d,l({},v)),y(d,l({},D)),y(d,l({},S))]}):null}import{jsx as w,jsxs as H}from"react/jsx-runtime";var A=O;function h(e){let{mapv:o}=U(),[r]=g(G[(e==null?void 0:e.mapStyle)||0].style),[b]=g(e.defaultViewState||B),[t,a]=g(e.features||[]),i=()=>{if(!(t!=null&&t.length)||!o)return;let s=I({type:"FeatureCollection",features:t});o.fitBounds(s,{padding:40,duration:1e3})};return N(()=>{e.onFeaturesChange&&e.onFeaturesChange(t),i()},[t]),N(()=>{e.isControlled&&JSON.stringify(t)!==JSON.stringify(e.features)&&a(e.features||[])},[e.features]),H(J,{id:"mapv",cursor:"default",initialViewState:b,style:{width:"100%",height:"100%"},mapStyle:r,onLoad:i,children:[w(A,{position:"bottom-right",showZoom:!0,showCompass:!0}),w(m,{features:t,setFeatures:a,isControlled:e.isControlled,isMultiple:e.isMultiple}),w(p,{features:t})]})}import{jsx as P}from"react/jsx-runtime";var we=e=>P(W,{children:P(h,l({},e))});export{we as NakshaMaplibreDraw};
package/dist/index.js CHANGED
@@ -1,244 +1 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getOwnPropSymbols = Object.getOwnPropertySymbols;
7
- var __getProtoOf = Object.getPrototypeOf;
8
- var __hasOwnProp = Object.prototype.hasOwnProperty;
9
- var __propIsEnum = Object.prototype.propertyIsEnumerable;
10
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
11
- var __spreadValues = (a, b) => {
12
- for (var prop in b || (b = {}))
13
- if (__hasOwnProp.call(b, prop))
14
- __defNormalProp(a, prop, b[prop]);
15
- if (__getOwnPropSymbols)
16
- for (var prop of __getOwnPropSymbols(b)) {
17
- if (__propIsEnum.call(b, prop))
18
- __defNormalProp(a, prop, b[prop]);
19
- }
20
- return a;
21
- };
22
- var __export = (target, all) => {
23
- for (var name in all)
24
- __defProp(target, name, { get: all[name], enumerable: true });
25
- };
26
- var __copyProps = (to, from, except, desc) => {
27
- if (from && typeof from === "object" || typeof from === "function") {
28
- for (let key of __getOwnPropNames(from))
29
- if (!__hasOwnProp.call(to, key) && key !== except)
30
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
31
- }
32
- return to;
33
- };
34
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
35
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
36
- mod
37
- ));
38
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
39
-
40
- // src/index.tsx
41
- var src_exports = {};
42
- __export(src_exports, {
43
- NakshaMaplibreDraw: () => NakshaMaplibreDraw
44
- });
45
- module.exports = __toCommonJS(src_exports);
46
- var import_maplibre4 = require("react-map-gl/maplibre");
47
-
48
- // src/components/map.tsx
49
- var import_naksha_commons = require("@biodiv-platform/naksha-commons");
50
- var import_bbox = __toESM(require("@turf/bbox"));
51
- var import_react = require("react");
52
- var import_maplibre3 = __toESM(require("react-map-gl/maplibre"));
53
-
54
- // src/components/draw-control.tsx
55
- var import_maplibre_gl_terradraw = require("@watergis/maplibre-gl-terradraw");
56
- var import_react_gbus = require("react-gbus");
57
- var import_maplibre = require("react-map-gl/maplibre");
58
-
59
- // src/components/delete-panel.tsx
60
- var import_jsx_runtime = require("react/jsx-runtime");
61
- function DeletePanel({ onDelete }) {
62
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
63
- className: "maplibregl-ctrl-top-left",
64
- style: { marginTop: "100px" },
65
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
66
- className: "maplibregl-ctrl-group maplibregl-ctrl",
67
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
68
- className: "maplibre-gl-draw_ctrl-draw-btn maplibre-gl-draw_trash",
69
- title: "Delete",
70
- onClick: onDelete,
71
- style: {
72
- display: "flex",
73
- justifyContent: "center",
74
- alignItems: "center",
75
- width: "30px",
76
- height: "30px"
77
- },
78
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", {
79
- width: "16",
80
- height: "16",
81
- viewBox: "0 0 24 24",
82
- fill: "none",
83
- stroke: "currentColor",
84
- strokeWidth: "2",
85
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", {
86
- d: "M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
87
- })
88
- })
89
- })
90
- })
91
- });
92
- }
93
-
94
- // src/components/draw-control.tsx
95
- var import_jsx_runtime2 = require("react/jsx-runtime");
96
- var UPDATE_EVENT = "rmsc-draw-updated";
97
- function DrawControl(props) {
98
- (0, import_react_gbus.useListener)(onUpdate, [UPDATE_EVENT]);
99
- function onUpdate(e) {
100
- var _a;
101
- if (!terradrawControl)
102
- return;
103
- const allFeatures = terradrawControl.getFeatures().features;
104
- const _features = props.isMultiple ? allFeatures : [allFeatures[allFeatures.length - 1]];
105
- (_a = props.setFeatures) == null ? void 0 : _a.call(props, _features);
106
- }
107
- const terradrawControl = (0, import_maplibre.useControl)(
108
- ({ map }) => {
109
- const ctrl = new import_maplibre_gl_terradraw.MaplibreTerradrawControl({
110
- modes: ["point", "linestring", "polygon"],
111
- open: true
112
- });
113
- map.on("terradraw.create", (e) => {
114
- if (!props.isMultiple) {
115
- ctrl.terradraw.clear();
116
- }
117
- ctrl.getTerraDrawInstance().setMode("select");
118
- (0, import_react_gbus.emit)(UPDATE_EVENT, e);
119
- });
120
- map.on("terradraw.update", (e) => (0, import_react_gbus.emit)(UPDATE_EVENT, e));
121
- map.on("terradraw.delete", (e) => (0, import_react_gbus.emit)(UPDATE_EVENT, e));
122
- return ctrl;
123
- },
124
- () => {
125
- },
126
- { position: "top-left" }
127
- );
128
- const onDelete = () => {
129
- var _a;
130
- terradrawControl.terradraw.clear();
131
- (_a = props.setFeatures) == null ? void 0 : _a.call(props, []);
132
- };
133
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(DeletePanel, {
134
- onDelete
135
- });
136
- }
137
-
138
- // src/components/geojson-layer.tsx
139
- var import_maplibre2 = require("react-map-gl/maplibre");
140
-
141
- // src/static/constants.tsx
142
- var featureStyle = {
143
- id: "data",
144
- type: "fill",
145
- paint: {
146
- "fill-color": "#f03b20",
147
- "fill-opacity": 0.2
148
- },
149
- filter: ["==", ["geometry-type"], "Polygon"]
150
- };
151
- var pointStyle = {
152
- type: "circle",
153
- paint: {
154
- "circle-radius": 8,
155
- "circle-color": "#f03b20",
156
- "circle-opacity": 0.8
157
- },
158
- filter: ["==", ["geometry-type"], "Point"]
159
- };
160
- var lineStyle = {
161
- type: "line",
162
- paint: {
163
- "line-color": "#f03b20",
164
- "line-width": 1.6,
165
- "line-dasharray": [6, 3],
166
- "line-opacity": 0.8
167
- },
168
- filter: ["==", ["geometry-type"], "LineString"]
169
- };
170
-
171
- // src/components/geojson-layer.tsx
172
- var import_jsx_runtime3 = require("react/jsx-runtime");
173
- function GeojsonLayer({ features }) {
174
- if (!(features == null ? void 0 : features.length))
175
- return null;
176
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_maplibre2.Source, {
177
- type: "geojson",
178
- data: { type: "FeatureCollection", features },
179
- children: [
180
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_maplibre2.Layer, __spreadValues({}, pointStyle)),
181
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_maplibre2.Layer, __spreadValues({}, lineStyle)),
182
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_maplibre2.Layer, __spreadValues({}, featureStyle))
183
- ]
184
- });
185
- }
186
-
187
- // src/components/map.tsx
188
- var import_jsx_runtime4 = require("react/jsx-runtime");
189
- var NavControl = import_maplibre3.NavigationControl;
190
- function Map(props) {
191
- const { mapv } = (0, import_maplibre3.useMap)();
192
- const [mapStyle] = (0, import_react.useState)(import_naksha_commons.defaultMapStyles[(props == null ? void 0 : props.mapStyle) || 0].style);
193
- const [viewState] = (0, import_react.useState)(props.defaultViewState || import_naksha_commons.defaultViewState);
194
- const [features, setFeatures] = (0, import_react.useState)(props.features || []);
195
- const autoFocus = () => {
196
- if (!(features == null ? void 0 : features.length) || !mapv)
197
- return;
198
- const _bbox = (0, import_bbox.default)({ type: "FeatureCollection", features });
199
- mapv.fitBounds(_bbox, { padding: 40, duration: 1e3 });
200
- };
201
- (0, import_react.useEffect)(() => {
202
- props.onFeaturesChange && props.onFeaturesChange(features);
203
- autoFocus();
204
- }, [features]);
205
- (0, import_react.useEffect)(() => {
206
- if (props.isControlled && JSON.stringify(features) !== JSON.stringify(props.features)) {
207
- setFeatures(props.features || []);
208
- }
209
- }, [props.features]);
210
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_maplibre3.default, {
211
- id: "mapv",
212
- cursor: "default",
213
- initialViewState: viewState,
214
- style: { width: "100%", height: "100%" },
215
- mapStyle,
216
- onLoad: autoFocus,
217
- children: [
218
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(NavControl, {
219
- position: "bottom-right",
220
- showZoom: true,
221
- showCompass: true
222
- }),
223
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DrawControl, {
224
- features,
225
- setFeatures,
226
- isControlled: props.isControlled,
227
- isMultiple: props.isMultiple
228
- }),
229
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(GeojsonLayer, {
230
- features
231
- })
232
- ]
233
- });
234
- }
235
-
236
- // src/index.tsx
237
- var import_jsx_runtime5 = require("react/jsx-runtime");
238
- var NakshaMaplibreDraw = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_maplibre4.MapProvider, {
239
- children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Map, __spreadValues({}, props))
240
- });
241
- // Annotate the CommonJS export names for ESM import in node:
242
- 0 && (module.exports = {
243
- NakshaMaplibreDraw
244
- });
1
+ "use strict";var B=Object.create;var p=Object.defineProperty;var I=Object.getOwnPropertyDescriptor;var J=Object.getOwnPropertyNames,D=Object.getOwnPropertySymbols,O=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty,U=Object.prototype.propertyIsEnumerable;var N=(e,t,r)=>t in e?p(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,n=(e,t)=>{for(var r in t||(t={}))P.call(t,r)&&N(e,r,t[r]);if(D)for(var r of D(t))U.call(t,r)&&N(e,r,t[r]);return e};var A=(e,t)=>{for(var r in t)p(e,r,{get:t[r],enumerable:!0})},F=(e,t,r,y)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of J(t))!P.call(e,o)&&o!==r&&p(e,o,{get:()=>t[o],enumerable:!(y=I(t,o))||y.enumerable});return e};var x=(e,t,r)=>(r=e!=null?B(O(e)):{},F(t||!e||!e.__esModule?p(r,"default",{value:e,enumerable:!0}):r,e)),H=e=>F(p({},"__esModule",{value:!0}),e);var q={};A(q,{NakshaMaplibreDraw:()=>Z});module.exports=H(q);var G=require("react-map-gl/maplibre");var h=require("@biodiv-platform/naksha-commons"),E=x(require("@turf/bbox")),l=require("react"),d=x(require("react-map-gl/maplibre"));var f=require("react-gbus"),V=require("react-map-gl/maplibre");var s=require("react/jsx-runtime");function b({onDelete:e}){return(0,s.jsx)("div",{className:"maplibregl-ctrl-top-left",style:{marginTop:"100px"},children:(0,s.jsx)("div",{className:"maplibregl-ctrl-group maplibregl-ctrl",children:(0,s.jsx)("button",{className:"maplibre-gl-draw_ctrl-draw-btn maplibre-gl-draw_trash",title:"Delete",onClick:e,style:{display:"flex",justifyContent:"center",alignItems:"center",width:"30px",height:"30px"},children:(0,s.jsx)("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:(0,s.jsx)("path",{d:"M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"})})})})})}var k=require("@watergis/maplibre-gl-terradraw"),L=require("react/jsx-runtime"),w="rmsc-draw-updated";function M(e){(0,f.useListener)(t,[w]);function t(o){var g;if(!r)return;let a=r.getFeatures().features,i=e.isMultiple?a:[a[a.length-1]];(g=e.setFeatures)==null||g.call(e,i)}let r=(0,V.useControl)(({map:o})=>{let a=new k.MaplibreTerradrawControl({modes:["point","linestring","polygon"],open:!0});return o.on("terradraw.create",i=>{e.isMultiple||a.terradraw.clear(),a.getTerraDrawInstance().setMode("select"),(0,f.emit)(w,i)}),o.on("terradraw.update",i=>(0,f.emit)(w,i)),o.on("terradraw.delete",i=>(0,f.emit)(w,i)),a},()=>{},{position:"top-left"});return(0,L.jsx)(b,{onDelete:()=>{var o;r.terradraw.clear(),(o=e.setFeatures)==null||o.call(e,[])}})}var c=require("react-map-gl/maplibre");var R={id:"data",type:"fill",paint:{"fill-color":"#f03b20","fill-opacity":.2},filter:["==",["geometry-type"],"Polygon"]},T={type:"circle",paint:{"circle-radius":8,"circle-color":"#f03b20","circle-opacity":.8},filter:["==",["geometry-type"],"Point"]},_={type:"line",paint:{"line-color":"#f03b20","line-width":1.6,"line-dasharray":[6,3],"line-opacity":.8},filter:["==",["geometry-type"],"LineString"]};var u=require("react/jsx-runtime");function C({features:e}){return e!=null&&e.length?(0,u.jsxs)(c.Source,{type:"geojson",data:{type:"FeatureCollection",features:e},children:[(0,u.jsx)(c.Layer,n({},T)),(0,u.jsx)(c.Layer,n({},_)),(0,u.jsx)(c.Layer,n({},R))]}):null}var m=require("react/jsx-runtime"),W=d.NavigationControl;function S(e){let{mapv:t}=(0,d.useMap)(),[r]=(0,l.useState)(h.defaultMapStyles[(e==null?void 0:e.mapStyle)||0].style),[y]=(0,l.useState)(e.defaultViewState||h.defaultViewState),[o,a]=(0,l.useState)(e.features||[]),i=()=>{if(!(o!=null&&o.length)||!t)return;let g=(0,E.default)({type:"FeatureCollection",features:o});t.fitBounds(g,{padding:40,duration:1e3})};return(0,l.useEffect)(()=>{e.onFeaturesChange&&e.onFeaturesChange(o),i()},[o]),(0,l.useEffect)(()=>{e.isControlled&&JSON.stringify(o)!==JSON.stringify(e.features)&&a(e.features||[])},[e.features]),(0,m.jsxs)(d.default,{id:"mapv",cursor:"default",initialViewState:y,style:{width:"100%",height:"100%"},mapStyle:r,onLoad:i,children:[(0,m.jsx)(W,{position:"bottom-right",showZoom:!0,showCompass:!0}),(0,m.jsx)(M,{features:o,setFeatures:a,isControlled:e.isControlled,isMultiple:e.isMultiple}),(0,m.jsx)(C,{features:o})]})}var v=require("react/jsx-runtime"),Z=e=>(0,v.jsx)(G.MapProvider,{children:(0,v.jsx)(S,n({},e))});0&&(module.exports={NakshaMaplibreDraw});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@biodiv-platform/naksha-maplibre-draw",
3
- "version": "5.0.0",
3
+ "version": "5.0.1",
4
4
  "author": "harshzalavadiya",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/esm/index.js",
@@ -34,7 +34,7 @@
34
34
  "typescript": "^4.7.3"
35
35
  },
36
36
  "dependencies": {
37
- "@biodiv-platform/naksha-commons": "*",
37
+ "@biodiv-platform/naksha-commons": "5.0.0-beta.1",
38
38
  "@turf/bbox": "^6.5.0",
39
39
  "@watergis/maplibre-gl-terradraw": "^1.7.2",
40
40
  "boundingbox": "^1.4.0",