@evergis/react 3.1.3 → 3.1.4
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.
- package/dist/components/{Map/components/Layer → Layer}/index.d.ts +1 -0
- package/dist/components/{Map/components/Layer → Layer}/types.d.ts +1 -1
- package/dist/components/{Map/components/Layer → Layer}/utils/getClientStyleItemPrefixSuffix.d.ts +1 -1
- package/dist/components/Map/index.d.ts +0 -1
- package/dist/components/index.d.ts +1 -3
- package/dist/contexts/MapContext/types.d.ts +31 -0
- package/dist/contexts/index.d.ts +2 -0
- package/dist/core/classification/parseClientStyle.d.ts +1 -1
- package/dist/core/feature/convertSpToTurfFeature.d.ts +2 -2
- package/dist/core/index.d.ts +0 -3
- package/dist/hooks/index.d.ts +2 -1
- package/dist/hooks/map/index.d.ts +1 -18
- package/dist/hooks/map/useMapContext.d.ts +1 -1
- package/dist/hooks/map/useMapDraw/customModes.d.ts +6 -1
- package/dist/hooks/map/useZoomToFeatures.d.ts +2 -2
- package/dist/hooks/serverNotifications/index.d.ts +0 -1
- package/dist/hooks/serverNotifications/useServerNotificationsContext.d.ts +1 -1
- package/dist/hooks/useDebouncedCallback.d.ts +1 -0
- package/dist/hooks/useWindowResize.d.ts +1 -0
- package/dist/index.d.ts +2 -0
- package/dist/react.cjs.development.js +517 -1253
- package/dist/react.cjs.development.js.map +1 -1
- package/dist/react.cjs.production.min.js +1 -1
- package/dist/react.cjs.production.min.js.map +1 -1
- package/dist/react.esm.js +514 -1246
- package/dist/react.esm.js.map +1 -1
- package/dist/types/index.d.ts +2 -0
- package/dist/utils/debounce.d.ts +1 -0
- package/dist/utils/index.d.ts +1 -1
- package/package.json +3 -3
- package/dist/components/Map/components/BuildingsLayer/BuildingsLayer.d.ts +0 -3
- package/dist/components/Map/components/BuildingsLayer/index.d.ts +0 -2
- package/dist/components/Map/components/BuildingsLayer/types.d.ts +0 -4
- package/dist/components/Map/components/index.d.ts +0 -2
- package/dist/components/MapContext/types.d.ts +0 -138
- package/dist/components/ResizablePanel/ResizablePanel.d.ts +0 -3
- package/dist/components/ResizablePanel/index.d.ts +0 -2
- package/dist/components/ResizablePanel/styled.d.ts +0 -11
- package/dist/components/ResizablePanel/types.d.ts +0 -14
- package/dist/core/attributes/index.d.ts +0 -1
- package/dist/core/geometrySelection/drawModeToGeometrySelectionType.d.ts +0 -3
- package/dist/core/geometrySelection/getGeometrySelectionTurfFeature.d.ts +0 -3
- package/dist/core/geometrySelection/index.d.ts +0 -2
- package/dist/core/types/index.d.ts +0 -2
- package/dist/core/types/map.d.ts +0 -5
- package/dist/hooks/map/useCurrentSelectedFeature.d.ts +0 -2
- package/dist/hooks/map/useEditingFeature.d.ts +0 -1
- package/dist/hooks/map/useEwktGeometry.d.ts +0 -1
- package/dist/hooks/map/useGeometryEditor.d.ts +0 -2
- package/dist/hooks/map/useGeometrySelection.d.ts +0 -2
- package/dist/hooks/map/useGeometrySelectionBuffer.d.ts +0 -1
- package/dist/hooks/map/useSelectFeaturesCount.d.ts +0 -1
- package/dist/hooks/map/useSelectFeaturesCurrentIndex.d.ts +0 -1
- package/dist/hooks/map/useSelectFeaturesGeometryMasking.d.ts +0 -1
- package/dist/hooks/map/useSelectFeaturesInitialized.d.ts +0 -1
- package/dist/hooks/map/useSelectFeaturesLayerName.d.ts +0 -1
- package/dist/hooks/map/useSelectFeaturesPagination.d.ts +0 -4
- package/dist/hooks/map/useSelectFeaturesStatisticsActive.d.ts +0 -1
- package/dist/hooks/map/useSelectFeaturesTotalCounts.d.ts +0 -1
- package/dist/hooks/map/useSelectedFeatures.d.ts +0 -2
- package/dist/hooks/map/useUpdateCurrentFeature.d.ts +0 -2
- package/dist/hooks/map/useZoomToLayer.d.ts +0 -7
- package/dist/hooks/useResizer.d.ts +0 -28
- package/dist/utils/geometryToWkt.d.ts +0 -2
- /package/dist/components/{Map/components/Layer → Layer}/Layer.d.ts +0 -0
- /package/dist/components/{Map/components/Layer → Layer}/RasterLayer.d.ts +0 -0
- /package/dist/components/{Map/components/Layer → Layer}/VectorLayer.d.ts +0 -0
- /package/dist/components/{Map/components/Layer → Layer}/constants.d.ts +0 -0
- /package/dist/{components → contexts}/MapContext/MapContext.d.ts +0 -0
- /package/dist/{components → contexts}/MapContext/MapProvider.d.ts +0 -0
- /package/dist/{components → contexts}/MapContext/index.d.ts +0 -0
- /package/dist/{components → contexts}/ServerNotificationsContext/ServerNotificationsContext.d.ts +0 -0
- /package/dist/{components → contexts}/ServerNotificationsContext/ServerNotificationsProvider.d.ts +0 -0
- /package/dist/{hooks/serverNotifications → contexts/ServerNotificationsContext/hooks}/useServerNotifications.d.ts +0 -0
- /package/dist/{components → contexts}/ServerNotificationsContext/index.d.ts +0 -0
- /package/dist/{components → contexts}/ServerNotificationsContext/types.d.ts +0 -0
- /package/dist/{core/attributes/types.d.ts → types/attribute.d.ts} +0 -0
- /package/dist/{core/types → types}/styling.d.ts +0 -0
package/dist/react.esm.js
CHANGED
|
@@ -1,15 +1,13 @@
|
|
|
1
|
-
import React, { Component,
|
|
2
|
-
import styled
|
|
3
|
-
import MapGL, { Layer as Layer$1
|
|
1
|
+
import React, { Component, useCallback, useEffect, createContext, useRef, useState, useContext, useMemo } from 'react';
|
|
2
|
+
import styled from 'styled-components';
|
|
3
|
+
import MapGL, { Source, Layer as Layer$1 } from 'react-map-gl/mapbox';
|
|
4
|
+
import { GeometryType } from '@evergis/api';
|
|
5
|
+
import { isEmpty } from 'lodash-es';
|
|
6
|
+
import { polygon, multiLineString, multiPoint, point, bbox } from '@turf/turf';
|
|
4
7
|
import '@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw.css';
|
|
5
|
-
import { changeProps } from 'find-and';
|
|
6
|
-
import { isEmpty, isNil } from 'lodash-es';
|
|
7
|
-
import { isValid, toDate, format, parseJSON, parseISO } from 'date-fns';
|
|
8
|
-
import { stringify } from 'wkt';
|
|
9
8
|
import MapboxDraw from '@mapbox/mapbox-gl-draw';
|
|
10
|
-
import { polygon, multiLineString, multiPoint, point, toWgs84, lineString, toMercator, bbox } from '@turf/turf';
|
|
11
|
-
import { GeometryType } from '@evergis/api';
|
|
12
9
|
import { HubConnectionBuilder, LogLevel } from '@microsoft/signalr';
|
|
10
|
+
import { isValid, toDate, format, parseJSON, parseISO } from 'date-fns';
|
|
13
11
|
import 'mapbox-gl/dist/mapbox-gl.css';
|
|
14
12
|
|
|
15
13
|
function _classCallCheck(instance, Constructor) {
|
|
@@ -185,439 +183,352 @@ let ErrorBoundary = /*#__PURE__*/function (_Component) {
|
|
|
185
183
|
}]);
|
|
186
184
|
}(Component);
|
|
187
185
|
|
|
188
|
-
|
|
189
|
-
const
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
const useCurrentSelectedFeature = () => {
|
|
201
|
-
const {
|
|
202
|
-
selectFeatures
|
|
203
|
-
} = useMapContext();
|
|
204
|
-
return useMemo(() => {
|
|
205
|
-
var _selectFeatures$featu;
|
|
206
|
-
|
|
207
|
-
return (_selectFeatures$featu = selectFeatures.features) == null || (_selectFeatures$featu = _selectFeatures$featu[selectFeatures.layerName]) == null ? void 0 : _selectFeatures$featu.find(item => item.id === selectFeatures.currentId);
|
|
208
|
-
}, [selectFeatures]);
|
|
186
|
+
const DEFAULT_COLOR = "#00ffff";
|
|
187
|
+
const DEFAULT_OPACITY = 0.5;
|
|
188
|
+
const DEFAULT_SIZE = 4;
|
|
189
|
+
const DEFAULT_LINE_WIDTH = 1;
|
|
190
|
+
const DEFAULT_CIRCLE_PAINT = {
|
|
191
|
+
"circle-radius": DEFAULT_SIZE,
|
|
192
|
+
"circle-color": DEFAULT_COLOR,
|
|
193
|
+
"circle-opacity": DEFAULT_OPACITY,
|
|
194
|
+
"circle-stroke-width": 0,
|
|
195
|
+
"circle-stroke-color": DEFAULT_COLOR,
|
|
196
|
+
"circle-stroke-opacity": DEFAULT_OPACITY
|
|
209
197
|
};
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
var BaseMapTheme;
|
|
214
|
-
|
|
215
|
-
(function (BaseMapTheme) {
|
|
216
|
-
BaseMapTheme["Light"] = "light";
|
|
217
|
-
BaseMapTheme["Dark"] = "dark";
|
|
218
|
-
})(BaseMapTheme || (BaseMapTheme = {}));
|
|
219
|
-
|
|
220
|
-
var GeometrySelectionTypes;
|
|
221
|
-
|
|
222
|
-
(function (GeometrySelectionTypes) {
|
|
223
|
-
GeometrySelectionTypes["Point"] = "select_point";
|
|
224
|
-
GeometrySelectionTypes["Line"] = "select_line";
|
|
225
|
-
GeometrySelectionTypes["Circle"] = "select_circle";
|
|
226
|
-
GeometrySelectionTypes["Rect"] = "select_rect";
|
|
227
|
-
GeometrySelectionTypes["Polygon"] = "select_polygon";
|
|
228
|
-
GeometrySelectionTypes["Zones"] = "zones_selection";
|
|
229
|
-
GeometrySelectionTypes["Coordinates"] = "xy";
|
|
230
|
-
GeometrySelectionTypes["Route"] = "selection_route";
|
|
231
|
-
})(GeometrySelectionTypes || (GeometrySelectionTypes = {}));
|
|
232
|
-
|
|
233
|
-
var GeometrySelectionToolTypes;
|
|
234
|
-
|
|
235
|
-
(function (GeometrySelectionToolTypes) {
|
|
236
|
-
GeometrySelectionToolTypes["Replace"] = "Replace";
|
|
237
|
-
GeometrySelectionToolTypes["Unite"] = "Unite";
|
|
238
|
-
GeometrySelectionToolTypes["Crop"] = "Crop";
|
|
239
|
-
GeometrySelectionToolTypes["Edit"] = "Edit";
|
|
240
|
-
})(GeometrySelectionToolTypes || (GeometrySelectionToolTypes = {}));
|
|
241
|
-
|
|
242
|
-
var GeometrySelectionZoneTypes;
|
|
243
|
-
|
|
244
|
-
(function (GeometrySelectionZoneTypes) {
|
|
245
|
-
GeometrySelectionZoneTypes["Walking"] = "Walking";
|
|
246
|
-
GeometrySelectionZoneTypes["Car"] = "Car";
|
|
247
|
-
})(GeometrySelectionZoneTypes || (GeometrySelectionZoneTypes = {}));
|
|
248
|
-
|
|
249
|
-
var GeometrySelectionRouteTypes;
|
|
250
|
-
|
|
251
|
-
(function (GeometrySelectionRouteTypes) {
|
|
252
|
-
GeometrySelectionRouteTypes["Walking"] = "Walking";
|
|
253
|
-
GeometrySelectionRouteTypes["Car"] = "Car";
|
|
254
|
-
})(GeometrySelectionRouteTypes || (GeometrySelectionRouteTypes = {}));
|
|
255
|
-
|
|
256
|
-
var GeometryEditorMode;
|
|
257
|
-
|
|
258
|
-
(function (GeometryEditorMode) {
|
|
259
|
-
GeometryEditorMode[GeometryEditorMode["Create"] = 0] = "Create";
|
|
260
|
-
GeometryEditorMode[GeometryEditorMode["Edit"] = 1] = "Edit";
|
|
261
|
-
GeometryEditorMode[GeometryEditorMode["Transform"] = 2] = "Transform";
|
|
262
|
-
GeometryEditorMode[GeometryEditorMode["Expand"] = 3] = "Expand";
|
|
263
|
-
GeometryEditorMode[GeometryEditorMode["Unite"] = 4] = "Unite";
|
|
264
|
-
GeometryEditorMode[GeometryEditorMode["Subtract"] = 5] = "Subtract";
|
|
265
|
-
})(GeometryEditorMode || (GeometryEditorMode = {}));
|
|
266
|
-
|
|
267
|
-
const initialGeometrySelection = {
|
|
268
|
-
active: true,
|
|
269
|
-
loading: false,
|
|
270
|
-
type: GeometrySelectionTypes.Point,
|
|
271
|
-
currentTool: GeometrySelectionToolTypes.Replace,
|
|
272
|
-
history: {
|
|
273
|
-
features: [],
|
|
274
|
-
zones: [],
|
|
275
|
-
step: -1
|
|
276
|
-
},
|
|
277
|
-
editHistory: {
|
|
278
|
-
features: [],
|
|
279
|
-
step: -1
|
|
280
|
-
},
|
|
281
|
-
isBuffer: false,
|
|
282
|
-
settings: {
|
|
283
|
-
zoneDuration: 60,
|
|
284
|
-
zoneType: GeometrySelectionZoneTypes.Walking,
|
|
285
|
-
routeType: GeometrySelectionRouteTypes.Walking,
|
|
286
|
-
bufferRadius: "",
|
|
287
|
-
bufferMultiplier: "1",
|
|
288
|
-
bufferInclude: true,
|
|
289
|
-
selectOutside: false
|
|
290
|
-
}
|
|
198
|
+
const DEFAULT_FILL_PAINT = {
|
|
199
|
+
"fill-color": DEFAULT_COLOR,
|
|
200
|
+
"fill-opacity": DEFAULT_OPACITY
|
|
291
201
|
};
|
|
292
|
-
const
|
|
293
|
-
|
|
202
|
+
const DEFAULT_FILL_EXTRUSION_PAINT = {
|
|
203
|
+
"fill-extrusion-base": 0,
|
|
204
|
+
"fill-extrusion-vertical-gradient": true,
|
|
205
|
+
"fill-extrusion-color": DEFAULT_COLOR,
|
|
206
|
+
"fill-extrusion-opacity": DEFAULT_OPACITY,
|
|
207
|
+
"fill-extrusion-height": 0
|
|
294
208
|
};
|
|
295
|
-
const
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
selectionOffset: 0,
|
|
300
|
-
features: {},
|
|
301
|
-
totalCounts: {},
|
|
302
|
-
statisticsActive: false,
|
|
303
|
-
geometryMasking: false
|
|
209
|
+
const DEFAULT_LINE_PAINT = {
|
|
210
|
+
"line-color": DEFAULT_COLOR,
|
|
211
|
+
"line-width": DEFAULT_LINE_WIDTH,
|
|
212
|
+
"line-opacity": DEFAULT_OPACITY
|
|
304
213
|
};
|
|
305
|
-
|
|
214
|
+
|
|
215
|
+
const RasterLayer = (_ref) => {
|
|
306
216
|
let {
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
217
|
+
layer,
|
|
218
|
+
tileUrl,
|
|
219
|
+
visible,
|
|
220
|
+
beforeId
|
|
310
221
|
} = _ref;
|
|
311
|
-
const map = useRef();
|
|
312
|
-
const draw = useRef();
|
|
313
|
-
const [loaded, setLoaded] = useState(false);
|
|
314
|
-
const [basemapName, setBasemapName] = useState(defaultBasemap);
|
|
315
|
-
const [globeProjection, setGlobeProjection] = useState(false);
|
|
316
|
-
const [geometrySelection, setGeometrySelection] = useState(initialGeometrySelection);
|
|
317
|
-
const [geometryEditor, setGeometryEditor] = useState(initialGeometryEditor);
|
|
318
|
-
const [selectFeatures, setSelectFeatures] = useState(initialSelectFeatures);
|
|
319
|
-
const resetGeometrySelection = useCallback(() => {
|
|
320
|
-
setGeometrySelection(initialGeometrySelection);
|
|
321
|
-
}, []);
|
|
322
|
-
const resetGeometryEditor = useCallback(() => {
|
|
323
|
-
setGeometryEditor(initialGeometryEditor);
|
|
324
|
-
}, []);
|
|
325
|
-
const setNextFeature = useCallback(() => {
|
|
326
|
-
setSelectFeatures(state => {
|
|
327
|
-
var _features$layerName, _features$layerName2, _features$layerName3;
|
|
328
222
|
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
currentId
|
|
333
|
-
} = state;
|
|
334
|
-
const currentIndex = features == null || (_features$layerName = features[layerName]) == null ? void 0 : _features$layerName.findIndex(item => item.id === currentId);
|
|
335
|
-
|
|
336
|
-
if (currentIndex === (features == null || (_features$layerName2 = features[layerName]) == null ? void 0 : _features$layerName2.length) - 1) {
|
|
337
|
-
return state;
|
|
338
|
-
}
|
|
339
|
-
|
|
340
|
-
const nextId = features == null || (_features$layerName3 = features[layerName]) == null || (_features$layerName3 = _features$layerName3[currentIndex + 1]) == null ? void 0 : _features$layerName3.id;
|
|
341
|
-
return _extends({}, state, {
|
|
342
|
-
currentId: nextId
|
|
343
|
-
});
|
|
344
|
-
});
|
|
345
|
-
}, []);
|
|
346
|
-
const setPrevFeature = useCallback(() => {
|
|
347
|
-
setSelectFeatures(state => {
|
|
348
|
-
var _features$layerName4, _features$layerName5;
|
|
349
|
-
|
|
350
|
-
const {
|
|
351
|
-
layerName,
|
|
352
|
-
features,
|
|
353
|
-
currentId
|
|
354
|
-
} = state;
|
|
355
|
-
const currentIndex = features == null || (_features$layerName4 = features[layerName]) == null ? void 0 : _features$layerName4.findIndex(item => item.id === currentId);
|
|
356
|
-
|
|
357
|
-
if (currentIndex === 0) {
|
|
358
|
-
return state;
|
|
359
|
-
}
|
|
223
|
+
if (!layer) {
|
|
224
|
+
return null;
|
|
225
|
+
}
|
|
360
226
|
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
const firstNotNullLayerName = Object.keys(features).find(key => features[key].length > 0);
|
|
373
|
-
const featureIdsToSelect = (_features$firstNotNul = features[firstNotNullLayerName]) == null ? void 0 : _features$firstNotNul.map((_ref2) => {
|
|
374
|
-
let {
|
|
375
|
-
id
|
|
376
|
-
} = _ref2;
|
|
377
|
-
return id;
|
|
378
|
-
});
|
|
379
|
-
return _extends({}, state, {
|
|
380
|
-
features,
|
|
381
|
-
layerName: firstNotNullLayerName,
|
|
382
|
-
currentId: currentId != null ? currentId : featureIdsToSelect == null ? void 0 : featureIdsToSelect[0],
|
|
383
|
-
selectionOffset: offset
|
|
384
|
-
});
|
|
385
|
-
});
|
|
386
|
-
}, []);
|
|
387
|
-
const setSelectedFeaturesTotalCounts = useCallback(payload => {
|
|
388
|
-
setSelectFeatures(state => _extends({}, state, {
|
|
389
|
-
totalCounts: payload
|
|
390
|
-
}));
|
|
391
|
-
}, []);
|
|
392
|
-
const setSelectFeaturesInitialized = useCallback(payload => {
|
|
393
|
-
setSelectFeatures(state => _extends({}, state, {
|
|
394
|
-
initialized: payload
|
|
395
|
-
}));
|
|
396
|
-
}, []);
|
|
397
|
-
const setSelectFeaturesLayerName = useCallback(payload => {
|
|
398
|
-
setSelectFeatures(state => {
|
|
399
|
-
var _state$features;
|
|
400
|
-
|
|
401
|
-
return _extends({}, state, {
|
|
402
|
-
layerName: payload,
|
|
403
|
-
currentId: (_state$features = state.features) == null || (_state$features = _state$features[payload]) == null || (_state$features = _state$features[0]) == null ? void 0 : _state$features.id,
|
|
404
|
-
selectionOffset: 0
|
|
405
|
-
});
|
|
406
|
-
});
|
|
407
|
-
}, []);
|
|
408
|
-
const setSelectFeaturesStatisticsActive = useCallback(payload => {
|
|
409
|
-
setSelectFeatures(state => _extends({}, state, {
|
|
410
|
-
statisticsActive: payload
|
|
411
|
-
}));
|
|
412
|
-
}, []);
|
|
413
|
-
const setSelectFeaturesGeometryMasking = useCallback(payload => {
|
|
414
|
-
setSelectFeatures(state => _extends({}, state, {
|
|
415
|
-
geometryMasking: payload
|
|
416
|
-
}));
|
|
417
|
-
}, []);
|
|
418
|
-
const updateCurrentFeature = useCallback(payload => {
|
|
419
|
-
setSelectFeatures(state => {
|
|
420
|
-
var _state$features$state, _state$features2;
|
|
421
|
-
|
|
422
|
-
return _extends({}, state, {
|
|
423
|
-
features: _extends({}, state.features, {
|
|
424
|
-
[state.layerName]: changeProps((_state$features$state = (_state$features2 = state.features) == null ? void 0 : _state$features2[state.layerName]) != null ? _state$features$state : [], {
|
|
425
|
-
id: state.currentId
|
|
426
|
-
}, payload)
|
|
427
|
-
})
|
|
428
|
-
});
|
|
429
|
-
});
|
|
430
|
-
}, []);
|
|
431
|
-
const resetSelectedFeatures = useCallback(() => {
|
|
432
|
-
setSelectFeatures(initialSelectFeatures);
|
|
433
|
-
}, []);
|
|
434
|
-
return React.createElement(MapContext.Provider, {
|
|
435
|
-
value: {
|
|
436
|
-
map,
|
|
437
|
-
draw,
|
|
438
|
-
loaded,
|
|
439
|
-
setLoaded,
|
|
440
|
-
basemapItems,
|
|
441
|
-
basemapName,
|
|
442
|
-
setBasemapName,
|
|
443
|
-
defaultBasemap,
|
|
444
|
-
globeProjection,
|
|
445
|
-
setGlobeProjection,
|
|
446
|
-
geometrySelection,
|
|
447
|
-
setGeometrySelection,
|
|
448
|
-
resetGeometrySelection,
|
|
449
|
-
geometryEditor,
|
|
450
|
-
setGeometryEditor,
|
|
451
|
-
resetGeometryEditor,
|
|
452
|
-
selectFeatures,
|
|
453
|
-
setNextFeature,
|
|
454
|
-
setPrevFeature,
|
|
455
|
-
setSelectedFeatures,
|
|
456
|
-
setSelectedFeaturesTotalCounts,
|
|
457
|
-
setSelectFeaturesInitialized,
|
|
458
|
-
setSelectFeaturesLayerName,
|
|
459
|
-
setSelectFeaturesStatisticsActive,
|
|
460
|
-
setSelectFeaturesGeometryMasking,
|
|
461
|
-
updateCurrentFeature,
|
|
462
|
-
resetSelectedFeatures
|
|
227
|
+
return React.createElement(Source, {
|
|
228
|
+
id: layer.name,
|
|
229
|
+
type: "raster",
|
|
230
|
+
tiles: [tileUrl]
|
|
231
|
+
}, React.createElement(Layer$1, {
|
|
232
|
+
id: layer.name,
|
|
233
|
+
type: "raster",
|
|
234
|
+
"source-layer": "default",
|
|
235
|
+
beforeId: beforeId,
|
|
236
|
+
layout: {
|
|
237
|
+
visibility: visible ? "visible" : "none"
|
|
463
238
|
}
|
|
464
|
-
}
|
|
465
|
-
};
|
|
466
|
-
|
|
467
|
-
const useGeometryEditor = () => {
|
|
468
|
-
const {
|
|
469
|
-
geometryEditor,
|
|
470
|
-
setGeometryEditor
|
|
471
|
-
} = useMapContext();
|
|
472
|
-
const update = useCallback(newState => {
|
|
473
|
-
setGeometryEditor(prevState => _extends({}, prevState, newState));
|
|
474
|
-
}, [setGeometryEditor]);
|
|
475
|
-
return [geometryEditor, update];
|
|
476
|
-
};
|
|
477
|
-
|
|
478
|
-
const useEditingFeature = () => {
|
|
479
|
-
const [{
|
|
480
|
-
layerName,
|
|
481
|
-
active,
|
|
482
|
-
mode
|
|
483
|
-
}] = useGeometryEditor();
|
|
484
|
-
const currentSelectedFeature = useCurrentSelectedFeature();
|
|
485
|
-
return useMemo(() => {
|
|
486
|
-
return active && (mode === GeometryEditorMode.Edit && layerName === (currentSelectedFeature == null ? void 0 : currentSelectedFeature.layer) || mode === GeometryEditorMode.Create);
|
|
487
|
-
}, [active, currentSelectedFeature, layerName, mode]);
|
|
488
|
-
};
|
|
489
|
-
|
|
490
|
-
const useGeometrySelection = () => {
|
|
491
|
-
const {
|
|
492
|
-
geometrySelection,
|
|
493
|
-
setGeometrySelection
|
|
494
|
-
} = useMapContext();
|
|
495
|
-
const updateGeometrySelection = useCallback(newState => {
|
|
496
|
-
setGeometrySelection(prevState => _extends({}, prevState, newState));
|
|
497
|
-
}, [setGeometrySelection]);
|
|
498
|
-
return [geometrySelection, updateGeometrySelection];
|
|
239
|
+
}));
|
|
499
240
|
};
|
|
500
241
|
|
|
501
|
-
const
|
|
502
|
-
|
|
242
|
+
const getClientStyleItemPrefixSuffix = (geometryType, type) => {
|
|
243
|
+
switch (geometryType) {
|
|
244
|
+
case GeometryType.Point:
|
|
245
|
+
return ["point-layer-", ""];
|
|
503
246
|
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
DateFormat["DateTime"] = "dd.MM.yyyy HH:mm:ss";
|
|
507
|
-
DateFormat["UTC"] = "yyyy-MM-dd'T'HH:mm:ss.sssxxx";
|
|
508
|
-
DateFormat["AxisTooltip"] = "d MMMM yyyy";
|
|
509
|
-
})(DateFormat || (DateFormat = {}));
|
|
247
|
+
case GeometryType.Polyline:
|
|
248
|
+
return ["polyline-layer-", ""];
|
|
510
249
|
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
250
|
+
case GeometryType.Polygon:
|
|
251
|
+
switch (type) {
|
|
252
|
+
case "line":
|
|
253
|
+
return ["polygon-stroke-layer-", "-stroke"];
|
|
514
254
|
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
const date = parser(rawDate);
|
|
255
|
+
case "fill-extrusion":
|
|
256
|
+
return ["polygon-extrusion-layer-", "-extrusion"];
|
|
518
257
|
|
|
519
|
-
|
|
520
|
-
|
|
258
|
+
default:
|
|
259
|
+
return ["polygon-layer-", ""];
|
|
521
260
|
}
|
|
522
|
-
}
|
|
523
261
|
|
|
524
|
-
|
|
262
|
+
default:
|
|
263
|
+
return ["", ""];
|
|
525
264
|
}
|
|
526
|
-
|
|
527
|
-
const parsedDate = toDate(rawDate);
|
|
528
|
-
return isValid(parsedDate) ? parsedDate : null;
|
|
529
265
|
};
|
|
530
|
-
const formatDate = function formatDate(date, _temp) {
|
|
531
|
-
let {
|
|
532
|
-
dateFormat = DateFormat.ClientDefaultFormat,
|
|
533
|
-
defaultValue = NO_CONTENT_VALUE
|
|
534
|
-
} = _temp === void 0 ? {} : _temp;
|
|
535
|
-
const dateValue = date ? getDate(date) : null;
|
|
536
266
|
|
|
537
|
-
|
|
538
|
-
|
|
267
|
+
const findAttributeInExpression = expression => {
|
|
268
|
+
if (Array.isArray(expression) && expression.length === 2 && expression[0] === "get") {
|
|
269
|
+
return [expression[1]];
|
|
539
270
|
}
|
|
540
271
|
|
|
541
|
-
return
|
|
542
|
-
|
|
272
|
+
return expression.reduce((acc, curr) => {
|
|
273
|
+
if (!Array.isArray(curr)) {
|
|
274
|
+
return acc;
|
|
275
|
+
}
|
|
543
276
|
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
}
|
|
277
|
+
if (curr[0] === "get") {
|
|
278
|
+
return [...new Set([...acc, curr[1]])];
|
|
279
|
+
}
|
|
548
280
|
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
281
|
+
return [...new Set([...acc, ...findAttributeInExpression(curr)])];
|
|
282
|
+
}, []);
|
|
283
|
+
};
|
|
552
284
|
|
|
553
|
-
|
|
285
|
+
const getActualExtrusionHeight = paint => {
|
|
286
|
+
return Array.isArray(paint == null ? void 0 : paint["fill-extrusion-height"]) && (paint == null ? void 0 : paint["fill-extrusion-height"][0]) === "+" ? paint == null ? void 0 : paint["fill-extrusion-height"][1] : paint == null ? void 0 : paint["fill-extrusion-height"];
|
|
554
287
|
};
|
|
555
288
|
|
|
556
|
-
const
|
|
289
|
+
const parseClientStyle = style => {
|
|
290
|
+
var _style$items;
|
|
557
291
|
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
}
|
|
292
|
+
if (!style) {
|
|
293
|
+
return [];
|
|
294
|
+
}
|
|
561
295
|
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
history,
|
|
565
|
-
type
|
|
566
|
-
}] = useGeometrySelection();
|
|
567
|
-
return useMemo(() => {
|
|
568
|
-
var _history$zones$histor, _history$zones$histor2;
|
|
296
|
+
return style == null || (_style$items = style.items) == null ? void 0 : _style$items.reduce((acc, curr) => {
|
|
297
|
+
var _Object$entries;
|
|
569
298
|
|
|
570
|
-
if (
|
|
571
|
-
return
|
|
299
|
+
if (!curr.paint || isEmpty(curr.paint)) {
|
|
300
|
+
return acc;
|
|
572
301
|
}
|
|
573
302
|
|
|
574
|
-
return
|
|
575
|
-
|
|
576
|
-
};
|
|
303
|
+
return (_Object$entries = Object.entries(curr.paint)) == null ? void 0 : _Object$entries.reduce((paintAcc, _ref) => {
|
|
304
|
+
let [, value] = _ref;
|
|
577
305
|
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
bufferRadius,
|
|
582
|
-
bufferMultiplier
|
|
583
|
-
},
|
|
584
|
-
isBuffer
|
|
585
|
-
}] = useGeometrySelection();
|
|
586
|
-
return useMemo(() => {
|
|
587
|
-
if (!isBuffer || !bufferRadius) {
|
|
588
|
-
return undefined;
|
|
589
|
-
}
|
|
306
|
+
if (!Array.isArray(value)) {
|
|
307
|
+
return paintAcc;
|
|
308
|
+
}
|
|
590
309
|
|
|
591
|
-
|
|
592
|
-
|
|
310
|
+
return [...new Set([...paintAcc, ...findAttributeInExpression(value)])];
|
|
311
|
+
}, []);
|
|
312
|
+
}, []);
|
|
593
313
|
};
|
|
594
314
|
|
|
595
|
-
const
|
|
596
|
-
|
|
315
|
+
const convertSpToTurfFeature = geometry => {
|
|
316
|
+
if (!geometry) {
|
|
317
|
+
return;
|
|
318
|
+
}
|
|
597
319
|
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
};
|
|
320
|
+
switch (geometry.type) {
|
|
321
|
+
case GeometryType.Point:
|
|
322
|
+
return point(geometry.coordinates);
|
|
602
323
|
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
};
|
|
324
|
+
case GeometryType.Multipoint:
|
|
325
|
+
return multiPoint(geometry.coordinates);
|
|
606
326
|
|
|
607
|
-
|
|
327
|
+
case GeometryType.Polyline:
|
|
328
|
+
return multiLineString(geometry.coordinates);
|
|
608
329
|
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
filter: ["all", ["==", "$type", "Point"]],
|
|
613
|
-
paint: {
|
|
614
|
-
"circle-radius": 5,
|
|
615
|
-
"circle-color": "#D20C0C",
|
|
616
|
-
"circle-stroke-color": "#FFFFFF",
|
|
617
|
-
"circle-stroke-width": 3,
|
|
618
|
-
"circle-stroke-opacity": 0.3
|
|
330
|
+
case GeometryType.Polygon:
|
|
331
|
+
case GeometryType.Envelope:
|
|
332
|
+
return polygon(geometry.coordinates);
|
|
619
333
|
}
|
|
620
|
-
}
|
|
334
|
+
};
|
|
335
|
+
|
|
336
|
+
const VectorLayer = (_ref) => {
|
|
337
|
+
var _layer$configuration;
|
|
338
|
+
|
|
339
|
+
let {
|
|
340
|
+
layer,
|
|
341
|
+
tileUrl,
|
|
342
|
+
visible,
|
|
343
|
+
beforeId,
|
|
344
|
+
getLayerTempStyle,
|
|
345
|
+
onMount = () => null
|
|
346
|
+
} = _ref;
|
|
347
|
+
const clientStyle = layer == null || (_layer$configuration = layer.configuration) == null ? void 0 : _layer$configuration.clientStyle;
|
|
348
|
+
const {
|
|
349
|
+
idAttribute,
|
|
350
|
+
geometryType
|
|
351
|
+
} = layer.layerDefinition || {};
|
|
352
|
+
const renderLayerByGeometryType = useCallback(() => {
|
|
353
|
+
var _getLayerTempStyle, _getLayerTempStyle2, _getLayerTempStyle3, _getLayerTempStyle4, _getLayerTempStyle5, _getLayerTempStyle6, _getLayerTempStyle7, _getLayerTempStyle8, _getLayerTempStyle9, _getLayerTempStyle10, _getLayerTempStyle11, _getLayerTempStyle12, _getLayerTempStyle13, _getLayerTempStyle14;
|
|
354
|
+
|
|
355
|
+
const visibility = visible ? "visible" : "none";
|
|
356
|
+
|
|
357
|
+
switch (geometryType) {
|
|
358
|
+
case GeometryType.Point:
|
|
359
|
+
return React.createElement(Layer$1, {
|
|
360
|
+
id: layer.name,
|
|
361
|
+
type: "circle",
|
|
362
|
+
"source-layer": "default",
|
|
363
|
+
beforeId: beforeId,
|
|
364
|
+
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle = getLayerTempStyle(layer.name, "circle")) == null ? void 0 : _getLayerTempStyle.layout, {
|
|
365
|
+
visibility
|
|
366
|
+
}),
|
|
367
|
+
paint: _extends({}, DEFAULT_CIRCLE_PAINT, getLayerTempStyle == null || (_getLayerTempStyle2 = getLayerTempStyle(layer.name, "circle")) == null ? void 0 : _getLayerTempStyle2.paint)
|
|
368
|
+
});
|
|
369
|
+
|
|
370
|
+
case GeometryType.Polygon:
|
|
371
|
+
return [React.createElement(Layer$1, {
|
|
372
|
+
key: "polygon-layer-" + layer.name,
|
|
373
|
+
id: layer.name,
|
|
374
|
+
type: "fill",
|
|
375
|
+
"source-layer": "default",
|
|
376
|
+
beforeId: beforeId,
|
|
377
|
+
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle3 = getLayerTempStyle(layer.name, "fill")) == null ? void 0 : _getLayerTempStyle3.layout, {
|
|
378
|
+
visibility: visible && (getLayerTempStyle == null || (_getLayerTempStyle4 = getLayerTempStyle(layer.name, "fill-extrusion")) == null || (_getLayerTempStyle4 = _getLayerTempStyle4.settings) == null || (_getLayerTempStyle4 = _getLayerTempStyle4.fill) == null ? void 0 : _getLayerTempStyle4.showBottomSurface) !== false && Boolean(getActualExtrusionHeight(_extends({}, DEFAULT_FILL_EXTRUSION_PAINT, getLayerTempStyle == null || (_getLayerTempStyle5 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle5.paint))) ? "visible" : "none"
|
|
379
|
+
}),
|
|
380
|
+
paint: _extends({}, DEFAULT_FILL_PAINT, getLayerTempStyle == null || (_getLayerTempStyle6 = getLayerTempStyle(layer.name, "fill")) == null ? void 0 : _getLayerTempStyle6.paint)
|
|
381
|
+
}), React.createElement(Layer$1, {
|
|
382
|
+
key: "polygon-stroke-layer-" + layer.name,
|
|
383
|
+
id: layer.name + "-stroke",
|
|
384
|
+
type: "line",
|
|
385
|
+
"source-layer": "default",
|
|
386
|
+
beforeId: beforeId,
|
|
387
|
+
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle7 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle7.layout, {
|
|
388
|
+
visibility: visible && (getLayerTempStyle == null || (_getLayerTempStyle8 = getLayerTempStyle(layer.name, "fill-extrusion")) == null || (_getLayerTempStyle8 = _getLayerTempStyle8.settings) == null || (_getLayerTempStyle8 = _getLayerTempStyle8.fill) == null ? void 0 : _getLayerTempStyle8.showBottomSurface) !== false && Boolean(getActualExtrusionHeight(_extends({}, DEFAULT_FILL_EXTRUSION_PAINT, getLayerTempStyle == null || (_getLayerTempStyle9 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle9.paint))) ? "visible" : "none"
|
|
389
|
+
}),
|
|
390
|
+
paint: _extends({}, DEFAULT_LINE_PAINT, getLayerTempStyle == null || (_getLayerTempStyle10 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle10.paint)
|
|
391
|
+
}), React.createElement(Layer$1, {
|
|
392
|
+
key: "polygon-extrusion-layer-" + layer.name,
|
|
393
|
+
id: layer.name + "-extrusion",
|
|
394
|
+
type: "fill-extrusion",
|
|
395
|
+
"source-layer": "default",
|
|
396
|
+
beforeId: beforeId,
|
|
397
|
+
minzoom: 0,
|
|
398
|
+
maxzoom: 23,
|
|
399
|
+
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle11 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle11.layout, {
|
|
400
|
+
visibility
|
|
401
|
+
}),
|
|
402
|
+
paint: _extends({}, DEFAULT_FILL_EXTRUSION_PAINT, getLayerTempStyle == null || (_getLayerTempStyle12 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle12.paint)
|
|
403
|
+
})];
|
|
404
|
+
|
|
405
|
+
case GeometryType.Polyline:
|
|
406
|
+
return React.createElement(Layer$1, {
|
|
407
|
+
id: layer.name,
|
|
408
|
+
type: "line",
|
|
409
|
+
"source-layer": "default",
|
|
410
|
+
beforeId: beforeId,
|
|
411
|
+
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle13 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle13.layout, {
|
|
412
|
+
visibility
|
|
413
|
+
}),
|
|
414
|
+
paint: _extends({}, DEFAULT_LINE_PAINT, getLayerTempStyle == null || (_getLayerTempStyle14 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle14.paint)
|
|
415
|
+
});
|
|
416
|
+
|
|
417
|
+
default:
|
|
418
|
+
return null;
|
|
419
|
+
}
|
|
420
|
+
}, [geometryType, layer, beforeId, getLayerTempStyle, visible]);
|
|
421
|
+
const renderClientStyle = useCallback(() => {
|
|
422
|
+
return clientStyle.items.map(mockItem => {
|
|
423
|
+
var _clientStyle$items, _getLayerTempStyle15, _getLayerTempStyle16, _currentSettings$fill, _currentSettings$fill2, _clientStyle$minzoom, _clientStyle$maxzoom, _getLayerTempStyle17, _getLayerTempStyle18;
|
|
424
|
+
|
|
425
|
+
const prefixSuffix = getClientStyleItemPrefixSuffix(geometryType, mockItem.type);
|
|
426
|
+
const isExtrusionItem = mockItem.type === "fill-extrusion";
|
|
427
|
+
const isPolygonPart = clientStyle.items.some(item => item.type === "fill-extrusion") && (mockItem.type === "fill" || mockItem.type === "line");
|
|
428
|
+
const fillExtrusionPaint = isPolygonPart || isExtrusionItem ? _extends({}, (_clientStyle$items = clientStyle.items) == null || (_clientStyle$items = _clientStyle$items.find(item => item.type === "fill-extrusion")) == null ? void 0 : _clientStyle$items.paint, getLayerTempStyle == null || (_getLayerTempStyle15 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle15.paint) : undefined;
|
|
429
|
+
|
|
430
|
+
const currentSettings = _extends({}, clientStyle == null ? void 0 : clientStyle.settings, getLayerTempStyle == null || (_getLayerTempStyle16 = getLayerTempStyle(layer.name, mockItem.type)) == null ? void 0 : _getLayerTempStyle16.settings);
|
|
431
|
+
|
|
432
|
+
const processedExtrusionHeight = getActualExtrusionHeight(fillExtrusionPaint);
|
|
433
|
+
const hasExtrusion = Boolean(processedExtrusionHeight);
|
|
434
|
+
const visibility = visible && (isExtrusionItem && hasExtrusion || !isPolygonPart && !isExtrusionItem || isPolygonPart && (!hasExtrusion || ((_currentSettings$fill = currentSettings == null || (_currentSettings$fill2 = currentSettings.fill) == null ? void 0 : _currentSettings$fill2.showBottomSurface) != null ? _currentSettings$fill : true))) ? "visible" : "none";
|
|
435
|
+
return React.createElement(Layer$1, {
|
|
436
|
+
key: "" + prefixSuffix[0] + layer.name,
|
|
437
|
+
id: "" + layer.name + prefixSuffix[1],
|
|
438
|
+
type: mockItem.type,
|
|
439
|
+
"source-layer": "default",
|
|
440
|
+
beforeId: beforeId,
|
|
441
|
+
minzoom: (_clientStyle$minzoom = clientStyle == null ? void 0 : clientStyle.minzoom) != null ? _clientStyle$minzoom : 0,
|
|
442
|
+
maxzoom: (_clientStyle$maxzoom = clientStyle == null ? void 0 : clientStyle.maxzoom) != null ? _clientStyle$maxzoom : 23,
|
|
443
|
+
layout: _extends({}, mockItem.layout, getLayerTempStyle == null || (_getLayerTempStyle17 = getLayerTempStyle(layer.name, mockItem.type)) == null ? void 0 : _getLayerTempStyle17.layout, {
|
|
444
|
+
visibility
|
|
445
|
+
}),
|
|
446
|
+
paint: _extends({}, mockItem.paint, getLayerTempStyle == null || (_getLayerTempStyle18 = getLayerTempStyle(layer.name, mockItem.type)) == null ? void 0 : _getLayerTempStyle18.paint)
|
|
447
|
+
});
|
|
448
|
+
});
|
|
449
|
+
}, [beforeId, clientStyle, geometryType, layer.name, visible, getLayerTempStyle]);
|
|
450
|
+
useEffect(onMount, [layer.name]); // eslint-disable-line
|
|
451
|
+
|
|
452
|
+
if (!layer) {
|
|
453
|
+
return null;
|
|
454
|
+
}
|
|
455
|
+
|
|
456
|
+
return React.createElement(Source, {
|
|
457
|
+
promoteId: idAttribute,
|
|
458
|
+
id: layer.name,
|
|
459
|
+
type: "vector",
|
|
460
|
+
tiles: [tileUrl]
|
|
461
|
+
}, clientStyle != null && clientStyle.items ? renderClientStyle() : renderLayerByGeometryType());
|
|
462
|
+
};
|
|
463
|
+
|
|
464
|
+
const Layer = (_ref) => {
|
|
465
|
+
let {
|
|
466
|
+
layer,
|
|
467
|
+
layerType,
|
|
468
|
+
visible,
|
|
469
|
+
beforeId,
|
|
470
|
+
tileUrl,
|
|
471
|
+
onMount = () => null
|
|
472
|
+
} = _ref;
|
|
473
|
+
useEffect(onMount, [layer.name]); // eslint-disable-line
|
|
474
|
+
|
|
475
|
+
if (!layer) {
|
|
476
|
+
return null;
|
|
477
|
+
}
|
|
478
|
+
|
|
479
|
+
if (layerType === "RasterTileLayer") {
|
|
480
|
+
return React.createElement(RasterLayer, {
|
|
481
|
+
layer: layer,
|
|
482
|
+
tileUrl: tileUrl,
|
|
483
|
+
visible: visible,
|
|
484
|
+
beforeId: beforeId,
|
|
485
|
+
onMount: onMount
|
|
486
|
+
});
|
|
487
|
+
}
|
|
488
|
+
|
|
489
|
+
return React.createElement(VectorLayer, {
|
|
490
|
+
layer: layer,
|
|
491
|
+
tileUrl: tileUrl,
|
|
492
|
+
visible: visible,
|
|
493
|
+
beforeId: beforeId,
|
|
494
|
+
onMount: onMount
|
|
495
|
+
});
|
|
496
|
+
};
|
|
497
|
+
|
|
498
|
+
var _templateObject$1;
|
|
499
|
+
const MapWrapper = /*#__PURE__*/styled.div(_templateObject$1 || (_templateObject$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n z-index: ", ";\n\n .mapbox-gl-draw_trash {\n display: none;\n }\n\n .mapboxgl-ctrl-logo {\n display: none;\n }\n\n .mapboxgl-ctrl.mapboxgl-ctrl-attrib {\n display: none;\n }\n\n .mapboxgl-ctrl-geocoder.mapboxgl-ctrl {\n width: 350px;\n }\n"])), (_ref) => {
|
|
500
|
+
let {
|
|
501
|
+
$zIndex
|
|
502
|
+
} = _ref;
|
|
503
|
+
return $zIndex != null ? $zIndex : 1;
|
|
504
|
+
});
|
|
505
|
+
|
|
506
|
+
const customModes = MapboxDraw.modes;
|
|
507
|
+
const StaticMode = {};
|
|
508
|
+
|
|
509
|
+
StaticMode.onSetup = function () {
|
|
510
|
+
this.setActionableState(undefined);
|
|
511
|
+
return {};
|
|
512
|
+
};
|
|
513
|
+
|
|
514
|
+
StaticMode.toDisplayFeatures = function (state, geojson, display) {
|
|
515
|
+
display(geojson);
|
|
516
|
+
};
|
|
517
|
+
|
|
518
|
+
customModes.static = StaticMode;
|
|
519
|
+
|
|
520
|
+
const customStyles = [{
|
|
521
|
+
id: "gl-draw-point",
|
|
522
|
+
type: "circle",
|
|
523
|
+
filter: ["all", ["==", "$type", "Point"]],
|
|
524
|
+
paint: {
|
|
525
|
+
"circle-radius": 5,
|
|
526
|
+
"circle-color": "#D20C0C",
|
|
527
|
+
"circle-stroke-color": "#FFFFFF",
|
|
528
|
+
"circle-stroke-width": 3,
|
|
529
|
+
"circle-stroke-opacity": 0.3
|
|
530
|
+
}
|
|
531
|
+
}, {
|
|
621
532
|
id: "highlight-inactive-points",
|
|
622
533
|
type: "circle",
|
|
623
534
|
filter: ["all", ["==", "$type", "Point"], ["==", "meta", "feature"], ["==", "active", "false"]],
|
|
@@ -707,280 +618,167 @@ const customStyles = [{
|
|
|
707
618
|
}
|
|
708
619
|
}];
|
|
709
620
|
|
|
710
|
-
const
|
|
711
|
-
displayControlsDefault: false,
|
|
712
|
-
styles: customStyles,
|
|
713
|
-
modes: customModes,
|
|
714
|
-
defaultMode: "draw_point",
|
|
715
|
-
controls: {
|
|
716
|
-
trash: true
|
|
717
|
-
}
|
|
718
|
-
});
|
|
719
|
-
const useMapDraw = function useMapDraw(triggerDeps) {
|
|
720
|
-
if (triggerDeps === void 0) {
|
|
721
|
-
triggerDeps = [];
|
|
722
|
-
}
|
|
621
|
+
const MapContext = /*#__PURE__*/createContext({});
|
|
723
622
|
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
} =
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
|
|
623
|
+
const MapProvider = (_ref) => {
|
|
624
|
+
let {
|
|
625
|
+
basemapItems,
|
|
626
|
+
defaultBasemap,
|
|
627
|
+
children
|
|
628
|
+
} = _ref;
|
|
629
|
+
const map = useRef();
|
|
630
|
+
const draw = useRef();
|
|
631
|
+
const [loaded, setLoaded] = useState(false);
|
|
632
|
+
const [basemapName, setBasemapName] = useState(defaultBasemap);
|
|
633
|
+
return React.createElement(MapContext.Provider, {
|
|
634
|
+
value: {
|
|
635
|
+
map,
|
|
636
|
+
draw,
|
|
637
|
+
loaded,
|
|
638
|
+
setLoaded,
|
|
639
|
+
basemapItems,
|
|
640
|
+
basemapName,
|
|
641
|
+
setBasemapName,
|
|
642
|
+
defaultBasemap
|
|
733
643
|
}
|
|
644
|
+
}, children);
|
|
645
|
+
};
|
|
734
646
|
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
647
|
+
var BaseMapTheme;
|
|
648
|
+
|
|
649
|
+
(function (BaseMapTheme) {
|
|
650
|
+
BaseMapTheme["Light"] = "light";
|
|
651
|
+
BaseMapTheme["Dark"] = "dark";
|
|
652
|
+
})(BaseMapTheme || (BaseMapTheme = {}));
|
|
653
|
+
|
|
654
|
+
const ServerNotificationsContext = /*#__PURE__*/createContext({});
|
|
738
655
|
|
|
656
|
+
const useServerNotifications = (url, initialized) => {
|
|
657
|
+
const hubConnection = useRef(null);
|
|
658
|
+
const [connection, setConnection] = useState(null);
|
|
739
659
|
useEffect(() => {
|
|
740
|
-
if (
|
|
741
|
-
|
|
742
|
-
map.current.addControl(drawContext.current);
|
|
660
|
+
if (!initialized) {
|
|
661
|
+
return;
|
|
743
662
|
}
|
|
744
|
-
}, [basemapName, ...triggerDeps]); // eslint-disable-line
|
|
745
|
-
};
|
|
746
|
-
|
|
747
|
-
const useRedrawLayer = () => {
|
|
748
|
-
const {
|
|
749
|
-
map
|
|
750
|
-
} = useMapContext();
|
|
751
|
-
return useCallback(layerName => {
|
|
752
|
-
const layerTileSource = map.current.getSource(layerName);
|
|
753
|
-
layerTileSource.setTiles(layerTileSource.tiles);
|
|
754
|
-
}, [map]);
|
|
755
|
-
};
|
|
756
|
-
|
|
757
|
-
const useSelectedFeatures = () => {
|
|
758
|
-
var _selectFeatures$featu;
|
|
759
|
-
|
|
760
|
-
const {
|
|
761
|
-
selectFeatures,
|
|
762
|
-
setSelectedFeatures
|
|
763
|
-
} = useMapContext();
|
|
764
|
-
const updatSelectedFeatures = useCallback(features => {
|
|
765
|
-
setSelectedFeatures(features);
|
|
766
|
-
}, [setSelectedFeatures]);
|
|
767
|
-
return [(_selectFeatures$featu = selectFeatures.features) != null ? _selectFeatures$featu : {}, updatSelectedFeatures];
|
|
768
|
-
};
|
|
769
|
-
|
|
770
|
-
const useSelectFeaturesCount = () => {
|
|
771
|
-
const {
|
|
772
|
-
selectFeatures
|
|
773
|
-
} = useMapContext();
|
|
774
|
-
return useMemo(() => {
|
|
775
|
-
var _selectFeatures$featu, _selectFeatures$featu2;
|
|
776
|
-
|
|
777
|
-
return (_selectFeatures$featu = (_selectFeatures$featu2 = selectFeatures.features) == null || (_selectFeatures$featu2 = _selectFeatures$featu2[selectFeatures.layerName]) == null ? void 0 : _selectFeatures$featu2.length) != null ? _selectFeatures$featu : 0;
|
|
778
|
-
}, [selectFeatures]);
|
|
779
|
-
};
|
|
780
|
-
|
|
781
|
-
const useSelectFeaturesCurrentIndex = () => {
|
|
782
|
-
const {
|
|
783
|
-
selectFeatures
|
|
784
|
-
} = useMapContext();
|
|
785
|
-
return useMemo(() => {
|
|
786
|
-
var _selectFeatures$featu, _selectFeatures$featu2;
|
|
787
|
-
|
|
788
|
-
return (_selectFeatures$featu = selectFeatures.features) != null && (_selectFeatures$featu = _selectFeatures$featu[selectFeatures.layerName]) != null && _selectFeatures$featu.length ? (_selectFeatures$featu2 = selectFeatures.features) == null || (_selectFeatures$featu2 = _selectFeatures$featu2[selectFeatures.layerName]) == null ? void 0 : _selectFeatures$featu2.findIndex(feature => feature.id === selectFeatures.currentId) : -1;
|
|
789
|
-
}, [selectFeatures]);
|
|
790
|
-
};
|
|
791
663
|
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
}
|
|
797
|
-
const update = useCallback(state => {
|
|
798
|
-
setSelectFeaturesGeometryMasking(state);
|
|
799
|
-
}, [setSelectFeaturesGeometryMasking]);
|
|
800
|
-
return [selectFeatures.geometryMasking, update];
|
|
801
|
-
};
|
|
802
|
-
|
|
803
|
-
const useSelectFeaturesInitialized = () => {
|
|
804
|
-
const {
|
|
805
|
-
selectFeatures,
|
|
806
|
-
setSelectFeaturesInitialized
|
|
807
|
-
} = useMapContext();
|
|
808
|
-
const update = useCallback(state => {
|
|
809
|
-
setSelectFeaturesInitialized(state);
|
|
810
|
-
}, [setSelectFeaturesInitialized]);
|
|
811
|
-
return [selectFeatures.initialized, update];
|
|
812
|
-
};
|
|
813
|
-
|
|
814
|
-
const useSelectFeaturesLayerName = () => {
|
|
815
|
-
const {
|
|
816
|
-
selectFeatures,
|
|
817
|
-
setSelectFeaturesLayerName
|
|
818
|
-
} = useMapContext();
|
|
819
|
-
const update = useCallback(name => {
|
|
820
|
-
setSelectFeaturesLayerName(name);
|
|
821
|
-
}, [setSelectFeaturesLayerName]);
|
|
822
|
-
return [selectFeatures.layerName, update];
|
|
823
|
-
};
|
|
824
|
-
|
|
825
|
-
const useSelectFeaturesPagination = () => {
|
|
826
|
-
const {
|
|
827
|
-
setNextFeature,
|
|
828
|
-
setPrevFeature
|
|
829
|
-
} = useMapContext();
|
|
830
|
-
const onNext = useCallback(() => {
|
|
831
|
-
setNextFeature();
|
|
832
|
-
}, [setNextFeature]);
|
|
833
|
-
const onPrev = useCallback(() => {
|
|
834
|
-
setPrevFeature();
|
|
835
|
-
}, [setPrevFeature]);
|
|
836
|
-
return {
|
|
837
|
-
onNext,
|
|
838
|
-
onPrev
|
|
839
|
-
};
|
|
840
|
-
};
|
|
841
|
-
|
|
842
|
-
const useSelectFeaturesStatisticsActive = () => {
|
|
843
|
-
const {
|
|
844
|
-
selectFeatures,
|
|
845
|
-
setSelectFeaturesStatisticsActive
|
|
846
|
-
} = useMapContext();
|
|
847
|
-
const update = useCallback(state => {
|
|
848
|
-
setSelectFeaturesStatisticsActive(state);
|
|
849
|
-
}, [setSelectFeaturesStatisticsActive]);
|
|
850
|
-
return [selectFeatures.statisticsActive, update];
|
|
851
|
-
};
|
|
852
|
-
|
|
853
|
-
const useSelectFeaturesTotalCounts = () => {
|
|
854
|
-
var _selectFeatures$total;
|
|
664
|
+
hubConnection.current = new HubConnectionBuilder().withUrl(url, {
|
|
665
|
+
withCredentials: true
|
|
666
|
+
}).configureLogging(LogLevel.Information).build();
|
|
667
|
+
hubConnection.current.start().then(() => console.info("Серверные нотификации подключены")).catch(err => console.info("Ошибка:", err)).finally(() => setConnection(hubConnection.current));
|
|
668
|
+
}, [initialized]); // eslint-disable-line
|
|
855
669
|
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
const update = useCallback(totalCounts => {
|
|
861
|
-
setSelectedFeaturesTotalCounts(totalCounts);
|
|
862
|
-
}, [setSelectedFeaturesTotalCounts]);
|
|
863
|
-
return [(_selectFeatures$total = selectFeatures.totalCounts) != null ? _selectFeatures$total : {}, update];
|
|
864
|
-
};
|
|
670
|
+
useEffect(() => {
|
|
671
|
+
if (!connection || connection.state !== "Connected") {
|
|
672
|
+
return;
|
|
673
|
+
}
|
|
865
674
|
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
} = useMapContext();
|
|
870
|
-
return useCallback(values => {
|
|
871
|
-
updateCurrentFeature(values);
|
|
872
|
-
}, [updateCurrentFeature]);
|
|
675
|
+
connection.invoke("SubscribeNotifications", []).then(() => console.info("Подписка `SubscribeNotifications` оформлена")).catch(err => console.info("Ошибка подписки `SubscribeNotifications`:", err));
|
|
676
|
+
}, [connection]);
|
|
677
|
+
return connection;
|
|
873
678
|
};
|
|
874
679
|
|
|
875
|
-
const
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
|
|
881
|
-
|
|
882
|
-
|
|
680
|
+
const ServerNotificationsProvider = (_ref) => {
|
|
681
|
+
let {
|
|
682
|
+
url,
|
|
683
|
+
initialized,
|
|
684
|
+
children
|
|
685
|
+
} = _ref;
|
|
686
|
+
const connection = useServerNotifications(url, initialized);
|
|
687
|
+
const addSubscription = useCallback(async payload => {
|
|
688
|
+
if (!connection || connection.state !== "Connected" || !payload) {
|
|
689
|
+
return;
|
|
883
690
|
}
|
|
884
691
|
|
|
885
|
-
|
|
886
|
-
|
|
692
|
+
try {
|
|
693
|
+
const id = await connection.invoke("AddSubscription", payload);
|
|
694
|
+
console.info("Подписка добавлена, id:", id);
|
|
695
|
+
return id;
|
|
696
|
+
} catch (err) {
|
|
697
|
+
console.info("Ошибка добавления подписки:", err);
|
|
698
|
+
return Promise.resolve(null);
|
|
887
699
|
}
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
const getActualExtrusionHeight = paint => {
|
|
894
|
-
return Array.isArray(paint == null ? void 0 : paint["fill-extrusion-height"]) && (paint == null ? void 0 : paint["fill-extrusion-height"][0]) === "+" ? paint == null ? void 0 : paint["fill-extrusion-height"][1] : paint == null ? void 0 : paint["fill-extrusion-height"];
|
|
895
|
-
};
|
|
896
|
-
|
|
897
|
-
const parseClientStyle = style => {
|
|
898
|
-
var _style$items;
|
|
899
|
-
|
|
900
|
-
if (!style) {
|
|
901
|
-
return [];
|
|
902
|
-
}
|
|
903
|
-
|
|
904
|
-
return style == null || (_style$items = style.items) == null ? void 0 : _style$items.reduce((acc, curr) => {
|
|
905
|
-
var _Object$entries;
|
|
906
|
-
|
|
907
|
-
if (!curr.paint || isEmpty(curr.paint)) {
|
|
908
|
-
return acc;
|
|
700
|
+
}, [connection]);
|
|
701
|
+
const updateSubscription = useCallback(async (id, payload) => {
|
|
702
|
+
if (!connection || connection.state !== "Connected" || !id || !payload) {
|
|
703
|
+
return;
|
|
909
704
|
}
|
|
910
705
|
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
706
|
+
try {
|
|
707
|
+
await connection.invoke("UpdateSubscription", id, payload);
|
|
708
|
+
} catch (err) {
|
|
709
|
+
console.info("\u041E\u0448\u0438\u0431\u043A\u0430 \u043E\u0431\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F \u043F\u043E\u0434\u043F\u0438\u0441\u043A\u0438 " + id + ":", err);
|
|
710
|
+
}
|
|
711
|
+
}, [connection]);
|
|
712
|
+
const unsubscribeById = useCallback(async id => {
|
|
713
|
+
if (!connection || connection.state !== "Connected" || !id) {
|
|
714
|
+
return;
|
|
715
|
+
}
|
|
917
716
|
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
|
|
717
|
+
try {
|
|
718
|
+
await connection.invoke("Unsubscribe", [id]);
|
|
719
|
+
} catch (err) {
|
|
720
|
+
console.info("\u041E\u0448\u0438\u0431\u043A\u0430 \u043E\u0442\u043F\u0438\u0441\u043A\u0438 \u043F\u043E " + id + ":", err);
|
|
721
|
+
}
|
|
722
|
+
}, [connection]);
|
|
723
|
+
return React.createElement(ServerNotificationsContext.Provider, {
|
|
724
|
+
value: {
|
|
725
|
+
connection,
|
|
726
|
+
addSubscription,
|
|
727
|
+
updateSubscription,
|
|
728
|
+
unsubscribeById
|
|
729
|
+
}
|
|
730
|
+
}, children);
|
|
921
731
|
};
|
|
922
732
|
|
|
923
|
-
const
|
|
924
|
-
|
|
925
|
-
return;
|
|
926
|
-
}
|
|
927
|
-
|
|
928
|
-
switch (geometry.type) {
|
|
929
|
-
case GeometryType.Point:
|
|
930
|
-
return point(geometry.coordinates);
|
|
931
|
-
|
|
932
|
-
case GeometryType.Multipoint:
|
|
933
|
-
return multiPoint(geometry.coordinates);
|
|
934
|
-
|
|
935
|
-
case GeometryType.Polyline:
|
|
936
|
-
return multiLineString(geometry.coordinates);
|
|
937
|
-
|
|
938
|
-
case GeometryType.Polygon:
|
|
939
|
-
case GeometryType.Envelope:
|
|
940
|
-
return polygon(geometry.coordinates);
|
|
941
|
-
}
|
|
733
|
+
const useMapContext = () => {
|
|
734
|
+
return useContext(MapContext);
|
|
942
735
|
};
|
|
943
736
|
|
|
944
|
-
const
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
return GeometrySelectionTypes.Point;
|
|
737
|
+
const draw = /*#__PURE__*/new MapboxDraw({
|
|
738
|
+
displayControlsDefault: false,
|
|
739
|
+
styles: customStyles,
|
|
740
|
+
modes: customModes,
|
|
741
|
+
defaultMode: "draw_point",
|
|
742
|
+
controls: {
|
|
743
|
+
trash: true
|
|
744
|
+
}
|
|
745
|
+
});
|
|
746
|
+
const useMapDraw = function useMapDraw(triggerDeps) {
|
|
747
|
+
if (triggerDeps === void 0) {
|
|
748
|
+
triggerDeps = [];
|
|
957
749
|
}
|
|
958
|
-
};
|
|
959
|
-
|
|
960
|
-
const getGeometrySelectionTurfFeature = (coordinates, selectionType, toWgs) => {
|
|
961
|
-
if (toWgs) {
|
|
962
|
-
switch (selectionType) {
|
|
963
|
-
case GeometrySelectionTypes.Point:
|
|
964
|
-
return toWgs84(point(coordinates));
|
|
965
|
-
|
|
966
|
-
case GeometrySelectionTypes.Polygon:
|
|
967
|
-
return toWgs84(polygon(coordinates));
|
|
968
750
|
|
|
969
|
-
|
|
970
|
-
|
|
751
|
+
const {
|
|
752
|
+
map,
|
|
753
|
+
draw: drawContext,
|
|
754
|
+
loaded,
|
|
755
|
+
basemapName
|
|
756
|
+
} = useMapContext();
|
|
757
|
+
useEffect(() => {
|
|
758
|
+
if (!loaded || !map.current) {
|
|
759
|
+
return;
|
|
971
760
|
}
|
|
972
|
-
}
|
|
973
761
|
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
762
|
+
drawContext.current = draw;
|
|
763
|
+
map.current.addControl(drawContext.current);
|
|
764
|
+
}, [loaded]); // eslint-disable-line
|
|
977
765
|
|
|
978
|
-
|
|
979
|
-
|
|
766
|
+
useEffect(() => {
|
|
767
|
+
if (map.current && map.current.hasControl(drawContext.current)) {
|
|
768
|
+
map.current.removeControl(drawContext.current);
|
|
769
|
+
map.current.addControl(drawContext.current);
|
|
770
|
+
}
|
|
771
|
+
}, [basemapName, ...triggerDeps]); // eslint-disable-line
|
|
772
|
+
};
|
|
980
773
|
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
774
|
+
const useRedrawLayer = () => {
|
|
775
|
+
const {
|
|
776
|
+
map
|
|
777
|
+
} = useMapContext();
|
|
778
|
+
return useCallback(layerName => {
|
|
779
|
+
const layerTileSource = map.current.getSource(layerName);
|
|
780
|
+
layerTileSource.setTiles(layerTileSource.tiles);
|
|
781
|
+
}, [map]);
|
|
984
782
|
};
|
|
985
783
|
|
|
986
784
|
const useZoomToFeatures = () => {
|
|
@@ -1002,24 +800,6 @@ const useZoomToFeatures = () => {
|
|
|
1002
800
|
}, [map]);
|
|
1003
801
|
};
|
|
1004
802
|
|
|
1005
|
-
const DEFAULT_PADDING = 50;
|
|
1006
|
-
const useZoomToLayer = () => {
|
|
1007
|
-
const {
|
|
1008
|
-
map
|
|
1009
|
-
} = useMapContext();
|
|
1010
|
-
return useCallback(async (bulkExtent, options) => {
|
|
1011
|
-
var _options$padding;
|
|
1012
|
-
|
|
1013
|
-
if (!bulkExtent || !bulkExtent.overall) {
|
|
1014
|
-
return;
|
|
1015
|
-
}
|
|
1016
|
-
|
|
1017
|
-
map.current.fitBounds([...bulkExtent.overall.coordinates[0], ...bulkExtent.overall.coordinates[1]], {
|
|
1018
|
-
padding: (_options$padding = options == null ? void 0 : options.padding) != null ? _options$padding : DEFAULT_PADDING
|
|
1019
|
-
});
|
|
1020
|
-
}, [map]);
|
|
1021
|
-
};
|
|
1022
|
-
|
|
1023
803
|
const useZoomToPoint = () => {
|
|
1024
804
|
const {
|
|
1025
805
|
map
|
|
@@ -1039,153 +819,80 @@ const useZoomToPoint = () => {
|
|
|
1039
819
|
}, [map]);
|
|
1040
820
|
};
|
|
1041
821
|
|
|
1042
|
-
const
|
|
1043
|
-
|
|
1044
|
-
|
|
1045
|
-
useEffect(() => {
|
|
1046
|
-
if (!initialized) {
|
|
1047
|
-
return;
|
|
1048
|
-
}
|
|
822
|
+
const useServerNotificationsContext = () => {
|
|
823
|
+
return useContext(ServerNotificationsContext);
|
|
824
|
+
};
|
|
1049
825
|
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
}).configureLogging(LogLevel.Information).build();
|
|
1053
|
-
hubConnection.current.start().then(() => console.info("Серверные нотификации подключены")).catch(err => console.info("Ошибка:", err)).finally(() => setConnection(hubConnection.current));
|
|
1054
|
-
}, [initialized]); // eslint-disable-line
|
|
826
|
+
const NO_CONTENT_VALUE = "—";
|
|
827
|
+
var DateFormat;
|
|
1055
828
|
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
|
|
1062
|
-
}, [connection]);
|
|
1063
|
-
return connection;
|
|
1064
|
-
};
|
|
1065
|
-
|
|
1066
|
-
const ServerNotificationsContext = /*#__PURE__*/createContext({});
|
|
1067
|
-
|
|
1068
|
-
const useServerNotificationsContext = () => {
|
|
1069
|
-
return useContext(ServerNotificationsContext);
|
|
1070
|
-
};
|
|
829
|
+
(function (DateFormat) {
|
|
830
|
+
DateFormat["ClientDefaultFormat"] = "dd.MM.yyyy HH:mm";
|
|
831
|
+
DateFormat["DateTime"] = "dd.MM.yyyy HH:mm:ss";
|
|
832
|
+
DateFormat["UTC"] = "yyyy-MM-dd'T'HH:mm:ss.sssxxx";
|
|
833
|
+
DateFormat["AxisTooltip"] = "d MMMM yyyy";
|
|
834
|
+
})(DateFormat || (DateFormat = {}));
|
|
1071
835
|
|
|
1072
|
-
|
|
836
|
+
const stringDateParsers = [parseJSON, parseISO, rawDate => new Date(rawDate)];
|
|
837
|
+
const getDate = rawDate => {
|
|
838
|
+
if (!rawDate) return null;
|
|
1073
839
|
|
|
1074
|
-
(
|
|
1075
|
-
|
|
1076
|
-
|
|
1077
|
-
})(VerticalPosition || (VerticalPosition = {}));
|
|
840
|
+
if (typeof rawDate === "string") {
|
|
841
|
+
for (const parser of stringDateParsers) {
|
|
842
|
+
const date = parser(rawDate);
|
|
1078
843
|
|
|
1079
|
-
|
|
844
|
+
if (isValid(date)) {
|
|
845
|
+
return toDate(date);
|
|
846
|
+
}
|
|
847
|
+
}
|
|
1080
848
|
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
HorizontalPosition["Right"] = "right";
|
|
1084
|
-
})(HorizontalPosition || (HorizontalPosition = {}));
|
|
849
|
+
return null;
|
|
850
|
+
}
|
|
1085
851
|
|
|
1086
|
-
const
|
|
852
|
+
const parsedDate = toDate(rawDate);
|
|
853
|
+
return isValid(parsedDate) ? parsedDate : null;
|
|
854
|
+
};
|
|
855
|
+
const formatDate = function formatDate(date, _temp) {
|
|
1087
856
|
let {
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
|
|
1091
|
-
|
|
1092
|
-
horizontal = true,
|
|
1093
|
-
minHeight = Number.MIN_SAFE_INTEGER,
|
|
1094
|
-
maxHeight = Number.MAX_SAFE_INTEGER,
|
|
1095
|
-
vertical = true,
|
|
1096
|
-
useResize = false,
|
|
1097
|
-
onResize,
|
|
1098
|
-
onResizeEnd,
|
|
1099
|
-
onResizeStart
|
|
1100
|
-
} = _ref;
|
|
1101
|
-
const containerRef = useRef();
|
|
1102
|
-
const verticalHandleRef = useRef();
|
|
1103
|
-
const horizontalHandleRef = useRef();
|
|
1104
|
-
const updateSizes = useCallback((width, height) => {
|
|
1105
|
-
var _horizontalHandleRef$, _verticalHandleRef$cu;
|
|
1106
|
-
|
|
1107
|
-
let newWidth = width;
|
|
1108
|
-
let newHeight = height;
|
|
1109
|
-
|
|
1110
|
-
if (horizontal && newWidth < minWidth) {
|
|
1111
|
-
newWidth = minWidth;
|
|
1112
|
-
}
|
|
857
|
+
dateFormat = DateFormat.ClientDefaultFormat,
|
|
858
|
+
defaultValue = NO_CONTENT_VALUE
|
|
859
|
+
} = _temp === void 0 ? {} : _temp;
|
|
860
|
+
const dateValue = date ? getDate(date) : null;
|
|
1113
861
|
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
|
|
862
|
+
if (isValid(dateValue)) {
|
|
863
|
+
return format(dateValue, dateFormat);
|
|
864
|
+
}
|
|
1117
865
|
|
|
1118
|
-
|
|
1119
|
-
|
|
1120
|
-
}
|
|
866
|
+
return defaultValue.toString();
|
|
867
|
+
};
|
|
1121
868
|
|
|
1122
|
-
|
|
1123
|
-
|
|
869
|
+
const debounce = (callback, delay) => {
|
|
870
|
+
let timeId;
|
|
871
|
+
return function () {
|
|
872
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
873
|
+
args[_key] = arguments[_key];
|
|
1124
874
|
}
|
|
1125
875
|
|
|
1126
|
-
if (
|
|
1127
|
-
|
|
1128
|
-
if (!isNil(containerRef.current)) {
|
|
1129
|
-
containerRef.current.style.width = newWidth + "px";
|
|
1130
|
-
}
|
|
1131
|
-
});
|
|
876
|
+
if (timeId) {
|
|
877
|
+
window.clearTimeout(timeId);
|
|
1132
878
|
}
|
|
1133
879
|
|
|
1134
|
-
|
|
1135
|
-
|
|
1136
|
-
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
});
|
|
1140
|
-
}
|
|
1141
|
-
|
|
1142
|
-
onResize == null || onResize(newWidth, newHeight);
|
|
1143
|
-
}, [minWidth, maxWidth, minHeight, maxHeight, horizontal, vertical]);
|
|
1144
|
-
const onPointerMove = useCallback(pointerMoveEvent => {
|
|
1145
|
-
var _containerRef$current, _containerRef$current2, _containerRef$current3;
|
|
1146
|
-
|
|
1147
|
-
const {
|
|
1148
|
-
x,
|
|
1149
|
-
y
|
|
1150
|
-
} = (_containerRef$current = containerRef.current) == null ? void 0 : _containerRef$current.getBoundingClientRect();
|
|
1151
|
-
const reverseHorizontal = handleHorizontalPosition === HorizontalPosition.Right;
|
|
1152
|
-
const reverseVertical = handleVerticalPosition === VerticalPosition.Bottom;
|
|
1153
|
-
const newWidth = reverseHorizontal ? pointerMoveEvent.pageX - x : ((_containerRef$current2 = containerRef.current) == null ? void 0 : _containerRef$current2.offsetWidth) + x - pointerMoveEvent.pageX;
|
|
1154
|
-
const newHeight = reverseVertical ? pointerMoveEvent.pageY - y : ((_containerRef$current3 = containerRef.current) == null ? void 0 : _containerRef$current3.offsetHeight) + y - pointerMoveEvent.pageY;
|
|
1155
|
-
document.body.style.userSelect = "none";
|
|
1156
|
-
updateSizes(newWidth, newHeight);
|
|
1157
|
-
}, [updateSizes]);
|
|
1158
|
-
const onPointerDown = useCallback(() => {
|
|
1159
|
-
const onPointerUp = () => {
|
|
1160
|
-
document.body.style.userSelect = "initial";
|
|
1161
|
-
document.body.removeEventListener("pointermove", onPointerMove);
|
|
1162
|
-
|
|
1163
|
-
if (!isNil(containerRef.current)) {
|
|
1164
|
-
onResizeEnd == null || onResizeEnd(containerRef.current.offsetWidth, containerRef.current.offsetHeight);
|
|
1165
|
-
}
|
|
1166
|
-
};
|
|
880
|
+
timeId = window.setTimeout(() => {
|
|
881
|
+
callback(...args);
|
|
882
|
+
}, delay);
|
|
883
|
+
};
|
|
884
|
+
};
|
|
1167
885
|
|
|
1168
|
-
|
|
1169
|
-
onResizeStart == null || onResizeStart(containerRef.current.offsetWidth, containerRef.current.offsetHeight);
|
|
1170
|
-
}
|
|
886
|
+
const isNumeric = number => !isNaN(parseFloat(number)) && isFinite(number);
|
|
1171
887
|
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
});
|
|
1176
|
-
}, [onPointerMove]); // eslint-disable-line
|
|
888
|
+
function isObject(value) {
|
|
889
|
+
return typeof value === "object" && value !== null && !Array.isArray(value);
|
|
890
|
+
}
|
|
1177
891
|
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
|
-
|
|
1181
|
-
|
|
1182
|
-
}, [updateSizes, useResize]);
|
|
1183
|
-
return {
|
|
1184
|
-
containerRef,
|
|
1185
|
-
verticalHandleRef,
|
|
1186
|
-
horizontalHandleRef,
|
|
1187
|
-
onPointerDown
|
|
1188
|
-
};
|
|
892
|
+
const useDebouncedCallback = interval => {
|
|
893
|
+
return useMemo(() => debounce(cb => {
|
|
894
|
+
cb();
|
|
895
|
+
}, interval), [interval]);
|
|
1189
896
|
};
|
|
1190
897
|
|
|
1191
898
|
const useToggle = initial => {
|
|
@@ -1194,13 +901,23 @@ const useToggle = initial => {
|
|
|
1194
901
|
return [state, toggle, setState];
|
|
1195
902
|
};
|
|
1196
903
|
|
|
904
|
+
const DEBOUNCE_DELAY = 144;
|
|
905
|
+
const useWindowResize = (callback, delay) => {
|
|
906
|
+
const debounceCallback = useMemo(() => {
|
|
907
|
+
return callback ? debounce(callback, delay || DEBOUNCE_DELAY) : undefined;
|
|
908
|
+
}, [callback, delay]);
|
|
909
|
+
useEffect(() => {
|
|
910
|
+
debounceCallback && window.addEventListener("resize", debounceCallback);
|
|
911
|
+
return () => debounceCallback && window.removeEventListener("resize", debounceCallback);
|
|
912
|
+
}, [debounceCallback]);
|
|
913
|
+
};
|
|
914
|
+
|
|
1197
915
|
const _excluded = ["zIndex", "lowerSiblings", "upperSiblings", "drawTriggerDeps", "onError", "children"];
|
|
1198
916
|
const Map = (_ref) => {
|
|
1199
917
|
let {
|
|
1200
918
|
zIndex,
|
|
1201
919
|
lowerSiblings,
|
|
1202
920
|
upperSiblings,
|
|
1203
|
-
drawTriggerDeps,
|
|
1204
921
|
onError,
|
|
1205
922
|
children
|
|
1206
923
|
} = _ref,
|
|
@@ -1210,7 +927,6 @@ const Map = (_ref) => {
|
|
|
1210
927
|
map,
|
|
1211
928
|
setLoaded
|
|
1212
929
|
} = useMapContext();
|
|
1213
|
-
useMapDraw(drawTriggerDeps);
|
|
1214
930
|
return React.createElement(MapWrapper, {
|
|
1215
931
|
"$zIndex": zIndex
|
|
1216
932
|
}, lowerSiblings, React.createElement(MapGL, Object.assign({}, rest, {
|
|
@@ -1226,453 +942,5 @@ const Map = (_ref) => {
|
|
|
1226
942
|
}), children), upperSiblings);
|
|
1227
943
|
};
|
|
1228
944
|
|
|
1229
|
-
|
|
1230
|
-
let {
|
|
1231
|
-
beforeId,
|
|
1232
|
-
transparent
|
|
1233
|
-
} = _ref;
|
|
1234
|
-
return React.createElement(Layer$1, {
|
|
1235
|
-
id: "mapbox-3d-buildings",
|
|
1236
|
-
source: "composite",
|
|
1237
|
-
"source-layer": "building",
|
|
1238
|
-
filter: ["==", "extrude", "true"],
|
|
1239
|
-
type: "fill-extrusion",
|
|
1240
|
-
minzoom: 15,
|
|
1241
|
-
beforeId: beforeId,
|
|
1242
|
-
paint: {
|
|
1243
|
-
"fill-extrusion-color": "#aaaaaa",
|
|
1244
|
-
"fill-extrusion-height": ["interpolate", ["linear"], ["zoom"], 15, 0, 15.05, ["get", "height"]],
|
|
1245
|
-
"fill-extrusion-base": ["interpolate", ["linear"], ["zoom"], 15, 0, 15.05, ["get", "min_height"]],
|
|
1246
|
-
"fill-extrusion-opacity": transparent ? 0 : 0.5
|
|
1247
|
-
}
|
|
1248
|
-
});
|
|
1249
|
-
};
|
|
1250
|
-
|
|
1251
|
-
const RasterLayer = (_ref) => {
|
|
1252
|
-
let {
|
|
1253
|
-
layer,
|
|
1254
|
-
tileUrl,
|
|
1255
|
-
visible,
|
|
1256
|
-
beforeId
|
|
1257
|
-
} = _ref;
|
|
1258
|
-
|
|
1259
|
-
if (!layer) {
|
|
1260
|
-
return null;
|
|
1261
|
-
}
|
|
1262
|
-
|
|
1263
|
-
return React.createElement(Source, {
|
|
1264
|
-
id: layer.name,
|
|
1265
|
-
type: "raster",
|
|
1266
|
-
tiles: [tileUrl]
|
|
1267
|
-
}, React.createElement(Layer$1, {
|
|
1268
|
-
id: layer.name,
|
|
1269
|
-
type: "raster",
|
|
1270
|
-
"source-layer": "default",
|
|
1271
|
-
beforeId: beforeId,
|
|
1272
|
-
layout: {
|
|
1273
|
-
visibility: visible ? "visible" : "none"
|
|
1274
|
-
}
|
|
1275
|
-
}));
|
|
1276
|
-
};
|
|
1277
|
-
|
|
1278
|
-
const DEFAULT_COLOR = "#00ffff";
|
|
1279
|
-
const DEFAULT_OPACITY = 0.5;
|
|
1280
|
-
const DEFAULT_SIZE = 4;
|
|
1281
|
-
const DEFAULT_LINE_WIDTH = 1;
|
|
1282
|
-
const DEFAULT_CIRCLE_PAINT = {
|
|
1283
|
-
"circle-radius": DEFAULT_SIZE,
|
|
1284
|
-
"circle-color": DEFAULT_COLOR,
|
|
1285
|
-
"circle-opacity": DEFAULT_OPACITY,
|
|
1286
|
-
"circle-stroke-width": 0,
|
|
1287
|
-
"circle-stroke-color": DEFAULT_COLOR,
|
|
1288
|
-
"circle-stroke-opacity": DEFAULT_OPACITY
|
|
1289
|
-
};
|
|
1290
|
-
const DEFAULT_FILL_PAINT = {
|
|
1291
|
-
"fill-color": DEFAULT_COLOR,
|
|
1292
|
-
"fill-opacity": DEFAULT_OPACITY
|
|
1293
|
-
};
|
|
1294
|
-
const DEFAULT_FILL_EXTRUSION_PAINT = {
|
|
1295
|
-
"fill-extrusion-base": 0,
|
|
1296
|
-
"fill-extrusion-vertical-gradient": true,
|
|
1297
|
-
"fill-extrusion-color": DEFAULT_COLOR,
|
|
1298
|
-
"fill-extrusion-opacity": DEFAULT_OPACITY,
|
|
1299
|
-
"fill-extrusion-height": 0
|
|
1300
|
-
};
|
|
1301
|
-
const DEFAULT_LINE_PAINT = {
|
|
1302
|
-
"line-color": DEFAULT_COLOR,
|
|
1303
|
-
"line-width": DEFAULT_LINE_WIDTH,
|
|
1304
|
-
"line-opacity": DEFAULT_OPACITY
|
|
1305
|
-
};
|
|
1306
|
-
|
|
1307
|
-
const getClientStyleItemPrefixSuffix = (geometryType, type) => {
|
|
1308
|
-
switch (geometryType) {
|
|
1309
|
-
case GeometryType.Point:
|
|
1310
|
-
return ["point-layer-", ""];
|
|
1311
|
-
|
|
1312
|
-
case GeometryType.Polyline:
|
|
1313
|
-
return ["polyline-layer-", ""];
|
|
1314
|
-
|
|
1315
|
-
case GeometryType.Polygon:
|
|
1316
|
-
switch (type) {
|
|
1317
|
-
case "line":
|
|
1318
|
-
return ["polygon-stroke-layer-", "-stroke"];
|
|
1319
|
-
|
|
1320
|
-
case "fill-extrusion":
|
|
1321
|
-
return ["polygon-extrusion-layer-", "-extrusion"];
|
|
1322
|
-
|
|
1323
|
-
default:
|
|
1324
|
-
return ["polygon-layer-", ""];
|
|
1325
|
-
}
|
|
1326
|
-
|
|
1327
|
-
default:
|
|
1328
|
-
return ["", ""];
|
|
1329
|
-
}
|
|
1330
|
-
};
|
|
1331
|
-
|
|
1332
|
-
const VectorLayer = (_ref) => {
|
|
1333
|
-
var _layer$configuration;
|
|
1334
|
-
|
|
1335
|
-
let {
|
|
1336
|
-
layer,
|
|
1337
|
-
tileUrl,
|
|
1338
|
-
visible,
|
|
1339
|
-
beforeId,
|
|
1340
|
-
getLayerTempStyle,
|
|
1341
|
-
onMount = () => null
|
|
1342
|
-
} = _ref;
|
|
1343
|
-
const clientStyle = layer == null || (_layer$configuration = layer.configuration) == null ? void 0 : _layer$configuration.clientStyle;
|
|
1344
|
-
const {
|
|
1345
|
-
idAttribute,
|
|
1346
|
-
geometryType
|
|
1347
|
-
} = layer.layerDefinition || {};
|
|
1348
|
-
const renderLayerByGeometryType = useCallback(() => {
|
|
1349
|
-
var _getLayerTempStyle, _getLayerTempStyle2, _getLayerTempStyle3, _getLayerTempStyle4, _getLayerTempStyle5, _getLayerTempStyle6, _getLayerTempStyle7, _getLayerTempStyle8, _getLayerTempStyle9, _getLayerTempStyle10, _getLayerTempStyle11, _getLayerTempStyle12, _getLayerTempStyle13, _getLayerTempStyle14;
|
|
1350
|
-
|
|
1351
|
-
const visibility = visible ? "visible" : "none";
|
|
1352
|
-
|
|
1353
|
-
switch (geometryType) {
|
|
1354
|
-
case GeometryType.Point:
|
|
1355
|
-
return React.createElement(Layer$1, {
|
|
1356
|
-
id: layer.name,
|
|
1357
|
-
type: "circle",
|
|
1358
|
-
"source-layer": "default",
|
|
1359
|
-
beforeId: beforeId,
|
|
1360
|
-
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle = getLayerTempStyle(layer.name, "circle")) == null ? void 0 : _getLayerTempStyle.layout, {
|
|
1361
|
-
visibility
|
|
1362
|
-
}),
|
|
1363
|
-
paint: _extends({}, DEFAULT_CIRCLE_PAINT, getLayerTempStyle == null || (_getLayerTempStyle2 = getLayerTempStyle(layer.name, "circle")) == null ? void 0 : _getLayerTempStyle2.paint)
|
|
1364
|
-
});
|
|
1365
|
-
|
|
1366
|
-
case GeometryType.Polygon:
|
|
1367
|
-
return [React.createElement(Layer$1, {
|
|
1368
|
-
key: "polygon-layer-" + layer.name,
|
|
1369
|
-
id: layer.name,
|
|
1370
|
-
type: "fill",
|
|
1371
|
-
"source-layer": "default",
|
|
1372
|
-
beforeId: beforeId,
|
|
1373
|
-
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle3 = getLayerTempStyle(layer.name, "fill")) == null ? void 0 : _getLayerTempStyle3.layout, {
|
|
1374
|
-
visibility: visible && (getLayerTempStyle == null || (_getLayerTempStyle4 = getLayerTempStyle(layer.name, "fill-extrusion")) == null || (_getLayerTempStyle4 = _getLayerTempStyle4.settings) == null || (_getLayerTempStyle4 = _getLayerTempStyle4.fill) == null ? void 0 : _getLayerTempStyle4.showBottomSurface) !== false && Boolean(getActualExtrusionHeight(_extends({}, DEFAULT_FILL_EXTRUSION_PAINT, getLayerTempStyle == null || (_getLayerTempStyle5 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle5.paint))) ? "visible" : "none"
|
|
1375
|
-
}),
|
|
1376
|
-
paint: _extends({}, DEFAULT_FILL_PAINT, getLayerTempStyle == null || (_getLayerTempStyle6 = getLayerTempStyle(layer.name, "fill")) == null ? void 0 : _getLayerTempStyle6.paint)
|
|
1377
|
-
}), React.createElement(Layer$1, {
|
|
1378
|
-
key: "polygon-stroke-layer-" + layer.name,
|
|
1379
|
-
id: layer.name + "-stroke",
|
|
1380
|
-
type: "line",
|
|
1381
|
-
"source-layer": "default",
|
|
1382
|
-
beforeId: beforeId,
|
|
1383
|
-
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle7 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle7.layout, {
|
|
1384
|
-
visibility: visible && (getLayerTempStyle == null || (_getLayerTempStyle8 = getLayerTempStyle(layer.name, "fill-extrusion")) == null || (_getLayerTempStyle8 = _getLayerTempStyle8.settings) == null || (_getLayerTempStyle8 = _getLayerTempStyle8.fill) == null ? void 0 : _getLayerTempStyle8.showBottomSurface) !== false && Boolean(getActualExtrusionHeight(_extends({}, DEFAULT_FILL_EXTRUSION_PAINT, getLayerTempStyle == null || (_getLayerTempStyle9 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle9.paint))) ? "visible" : "none"
|
|
1385
|
-
}),
|
|
1386
|
-
paint: _extends({}, DEFAULT_LINE_PAINT, getLayerTempStyle == null || (_getLayerTempStyle10 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle10.paint)
|
|
1387
|
-
}), React.createElement(Layer$1, {
|
|
1388
|
-
key: "polygon-extrusion-layer-" + layer.name,
|
|
1389
|
-
id: layer.name + "-extrusion",
|
|
1390
|
-
type: "fill-extrusion",
|
|
1391
|
-
"source-layer": "default",
|
|
1392
|
-
beforeId: beforeId,
|
|
1393
|
-
minzoom: 0,
|
|
1394
|
-
maxzoom: 23,
|
|
1395
|
-
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle11 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle11.layout, {
|
|
1396
|
-
visibility
|
|
1397
|
-
}),
|
|
1398
|
-
paint: _extends({}, DEFAULT_FILL_EXTRUSION_PAINT, getLayerTempStyle == null || (_getLayerTempStyle12 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle12.paint)
|
|
1399
|
-
})];
|
|
1400
|
-
|
|
1401
|
-
case GeometryType.Polyline:
|
|
1402
|
-
return React.createElement(Layer$1, {
|
|
1403
|
-
id: layer.name,
|
|
1404
|
-
type: "line",
|
|
1405
|
-
"source-layer": "default",
|
|
1406
|
-
beforeId: beforeId,
|
|
1407
|
-
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle13 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle13.layout, {
|
|
1408
|
-
visibility
|
|
1409
|
-
}),
|
|
1410
|
-
paint: _extends({}, DEFAULT_LINE_PAINT, getLayerTempStyle == null || (_getLayerTempStyle14 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle14.paint)
|
|
1411
|
-
});
|
|
1412
|
-
|
|
1413
|
-
default:
|
|
1414
|
-
return null;
|
|
1415
|
-
}
|
|
1416
|
-
}, [geometryType, layer, beforeId, getLayerTempStyle, visible]);
|
|
1417
|
-
const renderClientStyle = useCallback(() => {
|
|
1418
|
-
return clientStyle.items.map(mockItem => {
|
|
1419
|
-
var _clientStyle$items, _getLayerTempStyle15, _getLayerTempStyle16, _currentSettings$fill, _currentSettings$fill2, _clientStyle$minzoom, _clientStyle$maxzoom, _getLayerTempStyle17, _getLayerTempStyle18;
|
|
1420
|
-
|
|
1421
|
-
const prefixSuffix = getClientStyleItemPrefixSuffix(geometryType, mockItem.type);
|
|
1422
|
-
const isExtrusionItem = mockItem.type === "fill-extrusion";
|
|
1423
|
-
const isPolygonPart = clientStyle.items.some(item => item.type === "fill-extrusion") && (mockItem.type === "fill" || mockItem.type === "line");
|
|
1424
|
-
const fillExtrusionPaint = isPolygonPart || isExtrusionItem ? _extends({}, (_clientStyle$items = clientStyle.items) == null || (_clientStyle$items = _clientStyle$items.find(item => item.type === "fill-extrusion")) == null ? void 0 : _clientStyle$items.paint, getLayerTempStyle == null || (_getLayerTempStyle15 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle15.paint) : undefined;
|
|
1425
|
-
|
|
1426
|
-
const currentSettings = _extends({}, clientStyle == null ? void 0 : clientStyle.settings, getLayerTempStyle == null || (_getLayerTempStyle16 = getLayerTempStyle(layer.name, mockItem.type)) == null ? void 0 : _getLayerTempStyle16.settings);
|
|
1427
|
-
|
|
1428
|
-
const processedExtrusionHeight = getActualExtrusionHeight(fillExtrusionPaint);
|
|
1429
|
-
const hasExtrusion = Boolean(processedExtrusionHeight);
|
|
1430
|
-
const visibility = visible && (isExtrusionItem && hasExtrusion || !isPolygonPart && !isExtrusionItem || isPolygonPart && (!hasExtrusion || ((_currentSettings$fill = currentSettings == null || (_currentSettings$fill2 = currentSettings.fill) == null ? void 0 : _currentSettings$fill2.showBottomSurface) != null ? _currentSettings$fill : true))) ? "visible" : "none";
|
|
1431
|
-
return React.createElement(Layer$1, {
|
|
1432
|
-
key: "" + prefixSuffix[0] + layer.name,
|
|
1433
|
-
id: "" + layer.name + prefixSuffix[1],
|
|
1434
|
-
type: mockItem.type,
|
|
1435
|
-
"source-layer": "default",
|
|
1436
|
-
beforeId: beforeId,
|
|
1437
|
-
minzoom: (_clientStyle$minzoom = clientStyle == null ? void 0 : clientStyle.minzoom) != null ? _clientStyle$minzoom : 0,
|
|
1438
|
-
maxzoom: (_clientStyle$maxzoom = clientStyle == null ? void 0 : clientStyle.maxzoom) != null ? _clientStyle$maxzoom : 23,
|
|
1439
|
-
layout: _extends({}, mockItem.layout, getLayerTempStyle == null || (_getLayerTempStyle17 = getLayerTempStyle(layer.name, mockItem.type)) == null ? void 0 : _getLayerTempStyle17.layout, {
|
|
1440
|
-
visibility
|
|
1441
|
-
}),
|
|
1442
|
-
paint: _extends({}, mockItem.paint, getLayerTempStyle == null || (_getLayerTempStyle18 = getLayerTempStyle(layer.name, mockItem.type)) == null ? void 0 : _getLayerTempStyle18.paint)
|
|
1443
|
-
});
|
|
1444
|
-
});
|
|
1445
|
-
}, [beforeId, clientStyle, geometryType, layer.name, visible, getLayerTempStyle]);
|
|
1446
|
-
useEffect(onMount, [layer.name]); // eslint-disable-line
|
|
1447
|
-
|
|
1448
|
-
if (!layer) {
|
|
1449
|
-
return null;
|
|
1450
|
-
}
|
|
1451
|
-
|
|
1452
|
-
return React.createElement(Source, {
|
|
1453
|
-
promoteId: idAttribute,
|
|
1454
|
-
id: layer.name,
|
|
1455
|
-
type: "vector",
|
|
1456
|
-
tiles: [tileUrl]
|
|
1457
|
-
}, clientStyle != null && clientStyle.items ? renderClientStyle() : renderLayerByGeometryType());
|
|
1458
|
-
};
|
|
1459
|
-
|
|
1460
|
-
const Layer = (_ref) => {
|
|
1461
|
-
let {
|
|
1462
|
-
layer,
|
|
1463
|
-
layerType,
|
|
1464
|
-
visible,
|
|
1465
|
-
beforeId,
|
|
1466
|
-
tileUrl,
|
|
1467
|
-
onMount = () => null
|
|
1468
|
-
} = _ref;
|
|
1469
|
-
useEffect(onMount, [layer.name]); // eslint-disable-line
|
|
1470
|
-
|
|
1471
|
-
if (!layer) {
|
|
1472
|
-
return null;
|
|
1473
|
-
}
|
|
1474
|
-
|
|
1475
|
-
if (layerType === "RasterTileLayer") {
|
|
1476
|
-
return React.createElement(RasterLayer, {
|
|
1477
|
-
layer: layer,
|
|
1478
|
-
tileUrl: tileUrl,
|
|
1479
|
-
visible: visible,
|
|
1480
|
-
beforeId: beforeId,
|
|
1481
|
-
onMount: onMount
|
|
1482
|
-
});
|
|
1483
|
-
}
|
|
1484
|
-
|
|
1485
|
-
return React.createElement(VectorLayer, {
|
|
1486
|
-
layer: layer,
|
|
1487
|
-
tileUrl: tileUrl,
|
|
1488
|
-
visible: visible,
|
|
1489
|
-
beforeId: beforeId,
|
|
1490
|
-
onMount: onMount
|
|
1491
|
-
});
|
|
1492
|
-
};
|
|
1493
|
-
|
|
1494
|
-
var _templateObject$2, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
|
|
1495
|
-
const ResizablePanelContainer = /*#__PURE__*/styled.div(_templateObject$2 || (_templateObject$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n flex-shrink: 0;\n position: relative;\n\n ", "\n\n ", "\n\n ", "\n ", "\n ", "\n ", "\n ", "\n"])), (_ref) => {
|
|
1496
|
-
let {
|
|
1497
|
-
horizontal,
|
|
1498
|
-
vertical
|
|
1499
|
-
} = _ref;
|
|
1500
|
-
return horizontal && !vertical ? css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n height: 100%;\n "]))) : !horizontal && vertical ? css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n width: 100%;\n "]))) : "";
|
|
1501
|
-
}, (_ref2) => {
|
|
1502
|
-
let {
|
|
1503
|
-
horizontal,
|
|
1504
|
-
vertical
|
|
1505
|
-
} = _ref2;
|
|
1506
|
-
return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n will-change: ", ";\n "])), [horizontal && "width", vertical && "height"].filter(Boolean).join(","));
|
|
1507
|
-
}, (_ref3) => {
|
|
1508
|
-
let {
|
|
1509
|
-
maxHeight
|
|
1510
|
-
} = _ref3;
|
|
1511
|
-
return maxHeight && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n max-height: ", "px;\n "])), maxHeight);
|
|
1512
|
-
}, (_ref4) => {
|
|
1513
|
-
let {
|
|
1514
|
-
minHeight
|
|
1515
|
-
} = _ref4;
|
|
1516
|
-
return minHeight && css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n min-height: ", "px;\n "])), minHeight);
|
|
1517
|
-
}, (_ref5) => {
|
|
1518
|
-
let {
|
|
1519
|
-
maxWidth
|
|
1520
|
-
} = _ref5;
|
|
1521
|
-
return maxWidth && css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n max-width: ", "px;\n "])), maxWidth);
|
|
1522
|
-
}, (_ref6) => {
|
|
1523
|
-
let {
|
|
1524
|
-
height
|
|
1525
|
-
} = _ref6;
|
|
1526
|
-
return height && css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n height: ", ";\n "])), height);
|
|
1527
|
-
}, (_ref7) => {
|
|
1528
|
-
let {
|
|
1529
|
-
width
|
|
1530
|
-
} = _ref7;
|
|
1531
|
-
return width && css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n width: ", ";\n "])), width);
|
|
1532
|
-
});
|
|
1533
|
-
const getHandlePositionProps = (position, palette) => {
|
|
1534
|
-
switch (position) {
|
|
1535
|
-
case HorizontalPosition.Left:
|
|
1536
|
-
return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n height: 100%;\n border-left: 2px solid ", ";\n top: 0;\n left: 0;\n cursor: ew-resize;\n "])), palette.elementDeep);
|
|
1537
|
-
|
|
1538
|
-
case HorizontalPosition.Right:
|
|
1539
|
-
return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n height: 100%;\n border-right: 2px solid ", ";\n top: 0;\n right: 0;\n cursor: ew-resize;\n "])), palette.elementDeep);
|
|
1540
|
-
|
|
1541
|
-
case VerticalPosition.Top:
|
|
1542
|
-
return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n width: 100%;\n border-top: 2px solid ", ";\n top: 0;\n left: 0;\n cursor: ns-resize;\n "])), palette.elementDeep);
|
|
1543
|
-
|
|
1544
|
-
case VerticalPosition.Bottom:
|
|
1545
|
-
return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n width: 100%;\n border-bottom: 2px solid ", ";\n bottom: 0;\n left: 0;\n cursor: ns-resize;\n "])), palette.elementDeep);
|
|
1546
|
-
|
|
1547
|
-
default:
|
|
1548
|
-
return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n width: 100%;\n border-top: 2px solid ", ";\n top: 0;\n left: 0;\n "])), palette.elementDeep);
|
|
1549
|
-
}
|
|
1550
|
-
};
|
|
1551
|
-
const PanelDragHandle = /*#__PURE__*/styled.div(_templateObject15 || (_templateObject15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n box-sizing: border-box;\n z-index: 3;\n\n padding: 0.25rem;\n pointer-events: ", ";\n transition: border-color 150ms cubic-bezier(0.2, 1, 0.6, 1);\n\n &:hover {\n border-color: ", ";\n }\n\n ", "\n"])), (_ref8) => {
|
|
1552
|
-
let {
|
|
1553
|
-
disabled
|
|
1554
|
-
} = _ref8;
|
|
1555
|
-
return disabled && "none";
|
|
1556
|
-
}, (_ref9) => {
|
|
1557
|
-
let {
|
|
1558
|
-
theme: {
|
|
1559
|
-
palette
|
|
1560
|
-
}
|
|
1561
|
-
} = _ref9;
|
|
1562
|
-
return palette.primary;
|
|
1563
|
-
}, (_ref10) => {
|
|
1564
|
-
let {
|
|
1565
|
-
position,
|
|
1566
|
-
theme: {
|
|
1567
|
-
palette
|
|
1568
|
-
}
|
|
1569
|
-
} = _ref10;
|
|
1570
|
-
return getHandlePositionProps(position, palette);
|
|
1571
|
-
});
|
|
1572
|
-
|
|
1573
|
-
const _excluded$1 = ["className", "handleClassName", "width", "height", "disabled", "handleVerticalPosition", "handleHorizontalPosition", "Handle", "children"];
|
|
1574
|
-
const ResizablePanel = (_ref) => {
|
|
1575
|
-
let {
|
|
1576
|
-
className,
|
|
1577
|
-
handleClassName,
|
|
1578
|
-
width,
|
|
1579
|
-
height,
|
|
1580
|
-
disabled,
|
|
1581
|
-
handleVerticalPosition = VerticalPosition.Top,
|
|
1582
|
-
handleHorizontalPosition = HorizontalPosition.Left,
|
|
1583
|
-
children
|
|
1584
|
-
} = _ref,
|
|
1585
|
-
resizeProps = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
1586
|
-
|
|
1587
|
-
const resizerProps = useMemo(() => _extends({}, resizeProps, {
|
|
1588
|
-
handleVerticalPosition,
|
|
1589
|
-
handleHorizontalPosition
|
|
1590
|
-
}), [resizeProps, handleVerticalPosition, handleHorizontalPosition]);
|
|
1591
|
-
const {
|
|
1592
|
-
containerRef,
|
|
1593
|
-
verticalHandleRef,
|
|
1594
|
-
horizontalHandleRef,
|
|
1595
|
-
onPointerDown
|
|
1596
|
-
} = useResizer(resizerProps);
|
|
1597
|
-
const {
|
|
1598
|
-
vertical,
|
|
1599
|
-
horizontal
|
|
1600
|
-
} = resizeProps;
|
|
1601
|
-
return React.createElement(ResizablePanelContainer, {
|
|
1602
|
-
ref: containerRef,
|
|
1603
|
-
width: width,
|
|
1604
|
-
height: height,
|
|
1605
|
-
style: disabled ? {
|
|
1606
|
-
height: "auto"
|
|
1607
|
-
} : undefined,
|
|
1608
|
-
className: className
|
|
1609
|
-
}, vertical && React.createElement(PanelDragHandle, {
|
|
1610
|
-
ref: verticalHandleRef,
|
|
1611
|
-
position: handleVerticalPosition,
|
|
1612
|
-
disabled: disabled,
|
|
1613
|
-
className: handleClassName,
|
|
1614
|
-
onPointerDown: onPointerDown
|
|
1615
|
-
}), horizontal && React.createElement(PanelDragHandle, {
|
|
1616
|
-
ref: horizontalHandleRef,
|
|
1617
|
-
position: handleHorizontalPosition,
|
|
1618
|
-
disabled: disabled,
|
|
1619
|
-
className: handleClassName,
|
|
1620
|
-
onPointerDown: onPointerDown
|
|
1621
|
-
}), children);
|
|
1622
|
-
};
|
|
1623
|
-
|
|
1624
|
-
const ServerNotificationsProvider = (_ref) => {
|
|
1625
|
-
let {
|
|
1626
|
-
url,
|
|
1627
|
-
initialized,
|
|
1628
|
-
children
|
|
1629
|
-
} = _ref;
|
|
1630
|
-
const connection = useServerNotifications(url, initialized);
|
|
1631
|
-
const addSubscription = useCallback(async payload => {
|
|
1632
|
-
if (!connection || connection.state !== "Connected" || !payload) {
|
|
1633
|
-
return;
|
|
1634
|
-
}
|
|
1635
|
-
|
|
1636
|
-
try {
|
|
1637
|
-
const id = await connection.invoke("AddSubscription", payload);
|
|
1638
|
-
console.info("Подписка добавлена, id:", id);
|
|
1639
|
-
return id;
|
|
1640
|
-
} catch (err) {
|
|
1641
|
-
console.info("Ошибка добавления подписки:", err);
|
|
1642
|
-
return Promise.resolve(null);
|
|
1643
|
-
}
|
|
1644
|
-
}, [connection]);
|
|
1645
|
-
const updateSubscription = useCallback(async (id, payload) => {
|
|
1646
|
-
if (!connection || connection.state !== "Connected" || !id || !payload) {
|
|
1647
|
-
return;
|
|
1648
|
-
}
|
|
1649
|
-
|
|
1650
|
-
try {
|
|
1651
|
-
await connection.invoke("UpdateSubscription", id, payload);
|
|
1652
|
-
} catch (err) {
|
|
1653
|
-
console.info("\u041E\u0448\u0438\u0431\u043A\u0430 \u043E\u0431\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F \u043F\u043E\u0434\u043F\u0438\u0441\u043A\u0438 " + id + ":", err);
|
|
1654
|
-
}
|
|
1655
|
-
}, [connection]);
|
|
1656
|
-
const unsubscribeById = useCallback(async id => {
|
|
1657
|
-
if (!connection || connection.state !== "Connected" || !id) {
|
|
1658
|
-
return;
|
|
1659
|
-
}
|
|
1660
|
-
|
|
1661
|
-
try {
|
|
1662
|
-
await connection.invoke("Unsubscribe", [id]);
|
|
1663
|
-
} catch (err) {
|
|
1664
|
-
console.info("\u041E\u0448\u0438\u0431\u043A\u0430 \u043E\u0442\u043F\u0438\u0441\u043A\u0438 \u043F\u043E " + id + ":", err);
|
|
1665
|
-
}
|
|
1666
|
-
}, [connection]);
|
|
1667
|
-
return React.createElement(ServerNotificationsContext.Provider, {
|
|
1668
|
-
value: {
|
|
1669
|
-
connection,
|
|
1670
|
-
addSubscription,
|
|
1671
|
-
updateSubscription,
|
|
1672
|
-
unsubscribeById
|
|
1673
|
-
}
|
|
1674
|
-
}, children);
|
|
1675
|
-
};
|
|
1676
|
-
|
|
1677
|
-
export { BaseMapTheme, BuildingsLayer, DateFormat, ErrorBoundary, GeometryEditorMode, GeometrySelectionRouteTypes, GeometrySelectionToolTypes, GeometrySelectionTypes, GeometrySelectionZoneTypes, HorizontalPosition, Layer, Map, MapContext, MapProvider, NO_CONTENT_VALUE, ResizablePanel, ServerNotificationsContext, ServerNotificationsProvider, VerticalPosition, convertSpToTurfFeature, drawModeToGeometrySelectionType, findAttributeInExpression, formatDate, geometryToWkt, getActualExtrusionHeight, getDate, getGeometrySelectionTurfFeature, isNumeric, isObject, parseClientStyle, useCurrentSelectedFeature, useEditingFeature, useEwktGeometry, useGeometryEditor, useGeometrySelection, useGeometrySelectionBuffer, useMapContext, useMapDraw, useRedrawLayer, useResizer, useSelectFeaturesCount, useSelectFeaturesCurrentIndex, useSelectFeaturesGeometryMasking, useSelectFeaturesInitialized, useSelectFeaturesLayerName, useSelectFeaturesPagination, useSelectFeaturesStatisticsActive, useSelectFeaturesTotalCounts, useSelectedFeatures, useServerNotifications, useServerNotificationsContext, useToggle, useUpdateCurrentFeature, useZoomToFeatures, useZoomToLayer, useZoomToPoint };
|
|
945
|
+
export { BaseMapTheme, DEFAULT_CIRCLE_PAINT, DEFAULT_FILL_EXTRUSION_PAINT, DEFAULT_FILL_PAINT, DEFAULT_LINE_PAINT, DateFormat, ErrorBoundary, Layer, Map, MapContext, MapProvider, NO_CONTENT_VALUE, ServerNotificationsContext, ServerNotificationsProvider, convertSpToTurfFeature, debounce, findAttributeInExpression, formatDate, getActualExtrusionHeight, getDate, isNumeric, isObject, parseClientStyle, useDebouncedCallback, useMapContext, useMapDraw, useRedrawLayer, useServerNotificationsContext, useToggle, useWindowResize, useZoomToFeatures, useZoomToPoint };
|
|
1678
946
|
//# sourceMappingURL=react.esm.js.map
|