@map-colonies/react-components 4.13.5 → 4.14.1

package/dist/cesium-map/active-layers/active-layers-panel.css

@@ -1,3 +1,8 @@
+body[dir='rtl'] .cesium-viewer .activeLayersPanel .cesium-cesiumInspector-sectionHeader::before {
+  margin-right: 0;
+  margin-left: 5px;
+}
+
 .cesium-viewer .activeLayersPanel .layer {
   display: flex;
   justify-content: space-between;
@@ -11,6 +16,10 @@
   text-overflow: ellipsis;
 }
 
+.cesium-viewer .activeLayersPanel .name:not(.disabled) {
+  cursor: default;
+}
+
 .cesium-viewer .activeLayersPanel .name.disabled {
   opacity: 0.5;
   pointer-events: none;

package/dist/cesium-map/debug/debugger-widget.css

@@ -0,0 +1,95 @@
+.cesium-viewer .cesium-mc-title {
+  cursor: text;
+}
+
+.cesium-viewer .debuggerWidgetSections {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.cesium-viewer .debuggerWidgetSection {
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  border-radius: 6px;
+  background: rgba(0, 0, 0, 0.25);
+  overflow: hidden;
+}
+
+.cesium-viewer .debuggerWidgetSectionHeader {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  padding: 6px 8px;
+  font-size: 13px;
+  font-weight: 700;
+  letter-spacing: 0.2px;
+  text-transform: uppercase;
+  color: var(--mdc-theme-cesium-color);
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.03));
+  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
+  cursor: pointer;
+  user-select: none;
+}
+
+.cesium-viewer .debuggerWidgetSectionHeaderLabel {
+  flex: 1;
+}
+
+.cesium-viewer .debuggerWidgetSectionHeaderToggle {
+  margin-right: 5px;
+}
+
+body[dir='rtl'] .cesium-viewer .debuggerWidgetSectionHeaderToggle {
+  margin-right: 0;
+  margin-left: 5px;
+}
+
+.cesium-viewer .debuggerWidgetSectionContent {
+  padding: 8px;
+}
+
+.cesium-viewer .debuggerWidgetSectionContent .wfsContainer {
+  margin-top: 0;
+}
+
+.cesium-viewer .debuggerWidgetSectionContent .wfsContainer .title {
+  display: none;
+}
+
+.cesium-viewer .debuggerWidgetSectionContent .optimizationCheckbox,
+.cesium-viewer .debuggerWidgetSectionContent .cesiumInspectorCheckbox {
+  margin-bottom: 0;
+}
+
+.cesium-viewer .debuggerWidgetSectionContent .optimizationCheckbox label,
+.cesium-viewer .debuggerWidgetSectionContent .cesiumInspectorCheckbox label {
+  cursor: pointer;
+}
+
+.cesium-viewer .debuggerLayerList {
+  margin-top: 8px;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  border-top: 1px solid rgba(255, 255, 255, 0.1);
+  padding-top: 6px;
+  text-align: left;
+  direction: ltr;
+}
+
+.cesium-viewer .debuggerLayerItem {
+  font-size: 11px;
+  line-height: 1.6;
+  font-weight: bold;
+  opacity: 0.5;
+  cursor: text;
+}
+
+.cesium-viewer .debuggerLayerItem.relevant {
+  color: #AEF;
+  opacity: 1;
+}
+
+.cesium-viewer .debuggerLayerItem[data-has-tooltip='true'] {
+  cursor: default;
+}

package/dist/cesium-map/debug/{wfs-debug-widget.d.ts → debugger-widget.d.ts}

@@ -11,10 +11,10 @@ interface IFeatureTypeMetadata {
 export type IActiveFeatureTypes = IFeatureTypeMetadata & {
     zoomLevel: number;
 };
-export interface IWFSDebugWidgetProps extends IWidgetProps {
+export interface IDebuggerWidgetProps extends IWidgetProps {
     locale?: {
         [key: string]: string;
     };
 }
-export declare const WFSDebugWidget: (props: Omit<IWFSDebugWidgetProps, keyof IWidgetProps>) => React.JSX.Element;
+export declare const DebuggerWidget: (props: Omit<IDebuggerWidgetProps, keyof IWidgetProps>) => React.JSX.Element;
 export {};

package/dist/cesium-map/debug/wfs.css

@@ -1,3 +1,7 @@
+.cesium-viewer .wfsContainer {
+  margin-top: 12px;
+}
+
 .cesium-viewer .wfsContainer .title {
   text-align: center;
   font-weight: bold;
@@ -5,6 +9,14 @@
   width: 260px;
 }
 
+.cesium-viewer .optimizationCheckbox {
+  margin-bottom: 12px;
+}
+
+.cesium-viewer .cesiumInspectorCheckbox {
+  margin-bottom: 12px;
+}
+
 .cesium-viewer .wfsContainer .featureType {
   font-size: 12px;
   margin-bottom: 12px;
@@ -32,6 +44,12 @@ body[dir='rtl'] .cesium-viewer .wfsContainer .featureType {
   margin: 0 20px;
 }
 
+.cesium-viewer .wfsContainer .noDataLayers {
+  font-size: 12px;
+  opacity: 0.5;
+  cursor: text;
+}
+
 .cesium-viewer .wfsContainer .blinking {
   animation: blink 1s infinite;
 }

package/dist/cesium-map/debug/wfs.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { IActiveFeatureTypes } from './wfs-debug-widget';
+import { IActiveFeatureTypes } from './debugger-widget';
 interface IWFSProps {
     featureTypes: IActiveFeatureTypes[];
     locale?: {

package/dist/cesium-map/helpers/customImageryProviders.d.ts

@@ -4,15 +4,23 @@ import { CesiumViewer } from '../map';
 export interface CustomImageryProvider extends ImageryProvider {
     readonly layerListInstance: ICesiumImageryLayer[];
     tileTransparencyCheckedCounter: number;
+    examinedTilesForTransparencyCheck: IExaminedTileCoordinates[];
     mapViewer: CesiumViewer;
     readonly maxTilesForTransparencyCheck: number;
 }
+interface IExaminedTileCoordinates {
+    x: number;
+    y: number;
+    level: number;
+}
 export declare const HAS_TRANSPARENCY_META_PROP = "hasTransparency";
+export declare const EXAMINED_TILES_META_PROP = "examinedTiles";
 export declare class CustomUrlTemplateImageryProvider extends UrlTemplateImageryProvider {
     readonly layerListInstance: ICesiumImageryLayer[];
     readonly mapViewer: CesiumViewer;
     readonly maxTilesForTransparencyCheck = 3;
     tileTransparencyCheckedCounter: number;
+    examinedTilesForTransparencyCheck: IExaminedTileCoordinates[];
     constructor(opts: UrlTemplateImageryProvider.ConstructorOptions, mapViewer: CesiumViewer);
     requestImage(x: number, y: number, level: number, request?: Request | undefined): Promise<ImageryTypes> | undefined;
 }
@@ -21,6 +29,7 @@ export declare class CustomWebMapServiceImageryProvider extends WebMapServiceIma
     readonly mapViewer: CesiumViewer;
     readonly maxTilesForTransparencyCheck = 3;
     tileTransparencyCheckedCounter: number;
+    examinedTilesForTransparencyCheck: IExaminedTileCoordinates[];
     constructor(opts: WebMapServiceImageryProvider.ConstructorOptions, mapViewer: CesiumViewer);
     requestImage(x: number, y: number, level: number, request?: Request | undefined): Promise<ImageryTypes> | undefined;
 }
@@ -29,6 +38,8 @@ export declare class CustomWebMapTileServiceImageryProvider extends WebMapTileSe
     readonly mapViewer: CesiumViewer;
     readonly maxTilesForTransparencyCheck = 3;
     tileTransparencyCheckedCounter: number;
+    examinedTilesForTransparencyCheck: IExaminedTileCoordinates[];
     constructor(opts: WebMapTileServiceImageryProvider.ConstructorOptions, mapViewer: CesiumViewer);
     requestImage(x: number, y: number, level: number, request?: Request | undefined): Promise<ImageryTypes> | undefined;
 }
+export {};

package/dist/cesium-map/helpers/utils.d.ts

@@ -38,6 +38,7 @@ export declare const center: (bbox: Rectangle) => Feature<Point>;
  * @returns BBox array
  */
 export declare const rectangle2bbox: (bbox: Rectangle) => BBox;
+export declare const rectangle2Feature: (rect: Rectangle) => Feature<Polygon>;
 export declare const customComputeViewRectangle: (mapViewer: CesiumViewer) => Rectangle;
 /**
  * Computes a limited view rectangle in case of 3D mode based on the camera position and max distance.

package/dist/cesium-map/layers/wfs.layer.d.ts

@@ -21,9 +21,33 @@ export interface ICesiumWFSLayerLabelingOptions {
     strokeStyle: string | CanvasGradient | CanvasPattern;
     lineWidth: number;
 }
+export interface IGqlServiceConfig {
+    query: string;
+    variablesDescriptor: {
+        featureProp: string;
+        startIndexProp: string;
+        countProp: string;
+        typeNameProp: string;
+    };
+    variables: {
+        data: Record<string, unknown>;
+    };
+}
+export interface IApiServiceConfig {
+    method?: 'GET' | 'POST';
+    headers?: Record<string, string>;
+}
+export type AlternativePayload = {
+    type: 'gql';
+    gql: IGqlServiceConfig;
+} | {
+    type: 'api';
+    api: IApiServiceConfig;
+};
 export interface ICesiumWFSLayerOptions {
     url: string;
     featureType: string;
+    alternativePayload?: AlternativePayload;
     style: {
         color: string;
         hover: string;

package/dist/cesium-map/layers-manager.d.ts

@@ -26,6 +26,7 @@ export interface IVectorLayer {
 export type LegendExtractor = (layers: (any & {
     meta: any;
 })[]) => IMapLegend[];
+export declare const TRANSPARENT_LAYER_ID = "TRANSPARENT_BASE_LAYER";
 declare class LayerManager {
     mapViewer: CesiumViewer;
     legendsList: IMapLegend[];
@@ -35,7 +36,9 @@ declare class LayerManager {
     private readonly dataLayers;
     private readonly legendsExtractor?;
     private readonly layerManagerFootprintMetaFieldPath;
-    private readonly shouldOptimizedTileRequests?;
+    private shouldOptimizedTileRequests?;
+    private relevancyListenersCleanup;
+    private relevancyLayerUpdatedHandler?;
     constructor(mapViewer: CesiumViewer, legendsExtractor?: LegendExtractor, onLayersUpdate?: () => void, layerManagerFootprintMetaFieldPath?: string, shouldOptimizedTileRequests?: boolean);
     get layerList(): ICesiumImageryLayer[];
     get dataLayerList(): ICesiumWFSLayer[];
@@ -64,12 +67,17 @@ declare class LayerManager {
     removeLayerUpdatedListener(callback: (meta: any) => void): void;
     addDataLayerUpdatedListener(callback: (meta: any) => void): void;
     removeDataLayerUpdatedListener(callback: (meta: any) => void): void;
+    setShouldOptimizedTileRequests(shouldOptimize: boolean): void;
     findDataLayerById(dataLayerId: string): ICesiumWFSLayer | undefined;
     private setLegends;
     private getBaseLayersCount;
     private findLayerById;
     private updateLayersOrder;
     private hideNonRelevantLayers;
+    private restoreAllLayersVisibility;
+    private clearLayersRelevancy;
+    private bindRelevancyListeners;
+    private unbindRelevancyListeners;
     private markRelevantLayersForExtent;
 }
 export default LayerManager;

package/dist/cesium-map/map.css

@@ -18,6 +18,10 @@ body[dir='rtl'] .cesium-viewer .cesium-viewer-toolbar {
 .cesium-viewer .widgetsContainer {
   top: 24px;
   left: 10px;
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  gap: 12px;
 }
 
 body[dir='rtl'] .cesium-viewer .widgetsContainer {
@@ -25,6 +29,31 @@ body[dir='rtl'] .cesium-viewer .widgetsContainer {
   right: 10px;
 }
 
+.cesium-viewer .cesium-viewer-cesiumInspectorWrapper .cesium-viewer-cesiumInspectorContainer {
+  left: 0;
+}
+
+body[dir='rtl'] .cesium-viewer .cesium-viewer-cesiumInspectorWrapper .cesium-viewer-cesiumInspectorContainer {
+  left: unset;
+  right: 0;
+}
+
+.cesium-viewer .cesium-viewer-cesiumInspectorWrapper {
+  direction: ltr;
+}
+
+.cesium-viewer .cesium-viewer-cesiumInspectorWrapper .cesium-cesiumInspector {
+  box-sizing: content-box;
+}
+
+.cesium-viewer .cesium-viewer-cesiumInspectorWrapper .cesium-cesiumInspector-hidden {
+  height: 16px;
+}
+
+.cesium-viewer .cesium-viewer-cesiumInspectorWrapper .cesium-cesiumInspector-visible {
+  width: auto;
+}
+
 .cesium-viewer .cesium-mc-tool {
   display: block;
   position: absolute;
@@ -147,7 +176,7 @@ body[dir='rtl'] .cesium-viewer .bottomToolsContainer {
   right: unset;
 }
 
-/* #region for NATIVE CONTROLS */
+/* #region NATIVE CONTROLS */
 .cesium-viewer input[type='checkbox'] {
   accent-color: var(--mdc-theme-cesium-checkbox-color);
 }
@@ -178,10 +207,9 @@ body[dir='rtl'] .cesium-viewer .bottomToolsContainer {
   background-color: #aaa;
   border-radius: 6px;
 }
-
 /* #endregion for NATIVE CONTROLS */
 
-/* #region for mdc-checkbox */
+/* #region mdc-checkbox */
 .cesium-viewer .mdc-checkbox .mdc-checkbox__native-control:enabled:checked ~ .mdc-checkbox__background,
 .mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate ~ .mdc-checkbox__background,
 .mdc-checkbox .mdc-checkbox__native-control[data-indeterminate='true']:enabled ~ .mdc-checkbox__background {
@@ -216,7 +244,6 @@ body[dir='rtl'] .cesium-viewer .bottomToolsContainer {
 .cesium-viewer .mdc-ripple-upgraded--unbounded {
   --mdc-ripple-fg-size: 0px !important;
 }
-
 /* #endregion mdc-checkbox */
 
 /* #region mdc-list */
@@ -238,7 +265,6 @@ body[dir='rtl'] .cesium-viewer .bottomToolsContainer {
 .cesium-viewer .mdc-text-field--filled {
   height: 32px;
 }
-
 /* #endregion mdc-list */
 
 /* #region mdc-TextField */
@@ -262,7 +288,6 @@ body[dir='rtl'] .cesium-viewer .bottomToolsContainer {
 .cesium-viewer .mdc-line-ripple::after {
   border-bottom: none !important;
 }
-
 /* #endregion mdc-TextField */
 
 .cesium-viewer .disabled {

package/dist/cesium-map/map.d.ts

@@ -14,6 +14,7 @@ export declare class CesiumViewer extends CesiumViewerCls {
 export type MapViewState = {
     currentZoomLevel: number;
     shouldOptimizedTileRequests: boolean;
+    showCesiumInspector: boolean;
 };
 interface IMapViewState {
     viewState: MapViewState;
@@ -83,7 +84,6 @@ export interface CesiumMapProps extends ViewerProps {
     };
     baseMaps?: IBaseMaps;
     terrains?: ITerrain[];
-    useOptimizedTileRequests?: boolean;
     terrainProvider?: TerrainProvider;
     imageryContextMenu?: React.ReactElement<IContextMenuData>;
     imageryContextMenuSize?: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@map-colonies/react-components",
-  "version": "4.13.5",
+  "version": "4.14.1",
   "main": "./dist/@map-colonies/react-components.umd.js",
   "module": "./dist/@map-colonies/react-components.es.js",
   "types": "./dist/index.d.ts",
@@ -87,5 +87,5 @@
   "files": [
     "dist"
   ],
-  "gitHead": "7b59e4a26949588febe4e6ced814260ecdc7bf14"
+  "gitHead": "7bf420cd0cd690cfa1c966a592fccf7b7c5fbb35"
 }