@mappedin/react-sdk 6.0.1-beta.2 → 6.0.1-beta.4

package/lib/esm/index.d.ts

@@ -8,12 +8,12 @@
 //   ../react/geojson
 //   ../react/@mappedin/core-sdk
 //   ../react/@packages/internal/common
-//   ../react/@packages/internal/outdoor-context-v4
 //   ../react/@mappedin/core-sdk/src/camera
 //   ../react/three
 //   ../react/@packages/internal/shave-text/shave-text
 //   ../react/@turf/turf
 //   ../react/@packages/internal/quad-tree
+//   ../react/@packages/internal/outdoor-context-v4
 //   ../react/@packages/internal/geojson-navigator
 //   ../react/three/addons/loaders/GLTFLoader.js
 //   ../react/@mapbox/point-geometry
@@ -54,10 +54,18 @@ declare module '@mappedin/react-sdk/react-sdk/src/Marker' {
         */
     export type MarkerProps = Omit<TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames> & {
             children?: ReactNode | ReactElement;
+            onLoad?: (marker: Mappedin.Marker) => void;
     }, 'contentHtml'>;
     /**
         * Marker component
         *
+        * @example
+        * ```tsx
+        * <Marker target={mapData.getByType('space')[0]}>
+        *  <div>Hello, world!</div>
+        * </Marker>
+        * ```
+        *
         * @category Components
         */
     export const Marker: (props: MarkerProps) => ReactElement | null;
@@ -72,7 +80,9 @@ declare module '@mappedin/react-sdk/react-sdk/src/Label' {
     /**
         * @interface
         */
-    export type LabelProps = TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames>;
+    export type LabelProps = TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames> & {
+            onLoad?: (label: Mappedin.Label) => void;
+    };
     /**
         * Label component
         *
@@ -101,7 +111,9 @@ declare module '@mappedin/react-sdk/react-sdk/src/Path' {
     /**
         * @interface
         */
-    export type PathProps = TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames>;
+    export type PathProps = TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames> & {
+            onLoad?: (path: Mappedin.Path) => void;
+    };
     /**
         * Path component
         *
@@ -116,6 +128,7 @@ declare module '@mappedin/react-sdk/react-sdk/src/MapView' {
     import React from 'react';
     import { show3dMap } from '@mappedin/react-sdk/mappedin-js/src';
     import type { TupleToObjectWithPropNames } from '@mappedin/react-sdk/react-sdk/src/type-utils';
+    import type Mappedin from '@mappedin/react-sdk/react-sdk/src';
     type ParamsArray = Parameters<typeof show3dMap>;
     type StreamAgentParameterNames = ['el', 'mapData', 'options'];
     /**
@@ -124,6 +137,7 @@ declare module '@mappedin/react-sdk/react-sdk/src/MapView' {
     export type MapViewProps = Omit<TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames> & {
             children?: ReactNode;
             fallback?: ReactNode;
+            onLoad?: (mapView: Mappedin.MapView) => void;
     }, 'el'>;
     /**
         * MapView component
@@ -148,7 +162,9 @@ declare module '@mappedin/react-sdk/react-sdk/src/Navigation' {
     /**
         * @interface
         */
-    export type NavigationProps = TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames>;
+    export type NavigationProps = TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames> & {
+            onLoad?: () => void;
+    };
     /**
         * Navigation component
         *
@@ -166,7 +182,9 @@ declare module '@mappedin/react-sdk/react-sdk/src/Shape' {
     /**
         * @interface
         */
-    export type ShapesProps = TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames>;
+    export type ShapesProps = TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames> & {
+            onLoad?: (shape: Mappedin.Shape) => void;
+    };
     /**
         * Shape component
         *
@@ -184,7 +202,9 @@ declare module '@mappedin/react-sdk/react-sdk/src/Model' {
     /**
         * @interface
         */
-    export type ModelProps = TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames>;
+    export type ModelProps = TupleToObjectWithPropNames<ParamsArray, StreamAgentParameterNames> & {
+            onLoad?: (models: Mappedin.Model[]) => void;
+    };
     /**
         * Model component
         *
@@ -224,11 +244,11 @@ declare module '@mappedin/react-sdk/mappedin-js/src' {
     import type { Floor } from '@mappedin/react-sdk/mappedin-js/src/map-data-objects';
     import type { ParsedMVF as TMVF, StyleCollection as TMVFStyleCollection, Style as TMVFStyle, LineStringStyle as TMVFLineStringStyle, PolygonStyle as TMVFPolygonStyle, PointStyle as TMVFPointStyle } from '@mappedin/mvf';
     import { MapView } from '@mappedin/react-sdk/mappedin-js/src/map-view';
-    import type { Shading, PaintStyle, LineStyle, WatermarkOptions, Position } from '@mappedin/react-sdk/geojson/src';
+    import type { Shading, PaintStyle, LineStyle, WatermarkOptions } from '@mappedin/react-sdk/geojson/src';
     import { enableTestMode } from '@mappedin/react-sdk/geojson/src';
     export type { PubSub } from '@packages/internal/common/pubsub';
-    import { MapLibreOverlay } from '@mappedin/react-sdk/geojson/src/maplibre-overlay';
     import { analytics } from '@mappedin/react-sdk/mappedin-js/src/analytics';
+    import { MappedinMapLibreOverlay } from '@mappedin/react-sdk/mappedin-js/src/maplibre-overlay';
     export { setLoggerLevel, E_SDK_LOG_LEVEL } from '@packages/internal/common/Mappedin.Logger';
     /**
         * Represents all the available antialiasing options.
@@ -440,6 +460,14 @@ declare module '@mappedin/react-sdk/mappedin-js/src' {
                 * @experimental
                 */
             style?: {
+                    /**
+                        * Background color. Only relevant if outdoor map is disabled.
+                        */
+                    backgroundColor?: string;
+                    /**
+                        * Background alpha value. Only relevant if outdoor map is disabled.
+                        */
+                    backgroundAlpha?: number;
                     /**
                         * Set the global shading for all elements. True will use default values, false will disable shading.
                         * @default true
@@ -477,26 +505,6 @@ declare module '@mappedin/react-sdk/mappedin-js/src' {
         * const data = await getMapData({ key: 'api_key', secret: 'api_secret', mapId: 'id' });
         */
     export const getMapData: (userOptions: TGetMapDataOptions) => Promise<MapData>;
-    class MappedinMapLibreOverlay extends MapLibreOverlay<{
-            /**
-                * Event emitted when the MappedinMap is loaded
-                */
-            loaded: {
-                    /**
-                        * MapView instance
-                        */
-                    mapView: MapView;
-                    /**
-                        * MapData instance
-                        */
-                    mapData: MapData;
-            };
-    }> {
-            #private;
-            static instance: MappedinMapLibreOverlay;
-            constructor(origin: Position | undefined, mapData: MapData, options?: TShow3DMapOptions);
-            onAdd(map: any): HTMLDivElement;
-    }
     /**
         * Create a MapLibre overlay with a Map to render it within existing MapLibre projects.
         * @experimental
@@ -507,7 +515,7 @@ declare module '@mappedin/react-sdk/mappedin-js/src' {
     export { parseMVF, unzipMVF, enableTestMode };
     export type { MapView, MapData, MappedinMapLibreOverlay, TEvents, TEventPayload, TClickPayload, THoverPayload, TShow3DMapOptions, TGetMapDataOptions, TGetMapDataWithAccessTokenOptions, TGetMapDataWithCredentialsOptions, TGetMapDataSharedOptions, TAmbientOcclusionOptions, TAntialiasingOptions, TMVF, PaintStyle, LineStyle, Shading, TMVFStyleCollection, TMVFStyle, TMVFLineStringStyle, TMVFPolygonStyle, TMVFPointStyle, };
     export type * from 'geojson';
-    export type { TUpdateState, TLabelState, TGeometryState, TCameraAnimationOptions, TAnimationOptions, TFocusOnOptions, TEasingFunction, TCameraTarget, TNavigationTarget, TDirectionZone, TCameraFocusOnTarget, TAddMarkerOptions, TAddPathOptions, TLabelAppearance, TAddLabelOptions, TAddModelOptions, TAddModel, TGetDirectionsOptions, TCollisionRankingTier, TMarkerAnchor, TDirectionInstruction, TDirectionInstructionAction, TGetState, TMarkerState, } from '@mappedin/react-sdk/mappedin-js/src/types';
+    export type { TUpdateState, TLabelState, TGeometryState, TCameraAnimationOptions, TAnimationOptions, TFocusOnOptions, TEasingFunction, TCameraTarget, TNavigationTarget, TDirectionZone, TCameraFocusOnTarget, TAddMarkerOptions, TAddPathOptions, TLabelAppearance, TAddLabelOptions, TAddModelOptions, TAddModel, TGetDirectionsOptions, TCollisionRankingTier, TMarkerAnchor, TDirectionInstruction, TDirectionInstructionAction, TGetState, TMarkerState, TBlueDotOptions, } from '@mappedin/react-sdk/mappedin-js/src/types';
     export type { Label, Marker, Path, Shape, CameraTransform, Model } from '@mappedin/react-sdk/mappedin-js/src/map-view-objects';
     export type { Navigation, TNavigationOptions } from '@mappedin/react-sdk/mappedin-js/src/navigation';
     export type { TSpaceType } from '@mappedin/react-sdk/mappedin-js/src/map-data-objects';
@@ -1127,6 +1135,10 @@ declare module '@mappedin/react-sdk/mappedin-js/src/map-view' {
                 * @internal
                 */
             get __core(): RendererCore;
+            /**
+                * Clears all added elements from the map.
+                */
+            clear(): void;
             /**
                 * Destroys the MapView.
                 */
@@ -1144,8 +1156,8 @@ declare module '@mappedin/react-sdk/geojson/src' {
     import type { MarkerState, AddMarkerOptions } from '@mappedin/react-sdk/geojson/src/components/marker';
     import type { PathState, AddPathOptions } from '@mappedin/react-sdk/geojson/src/components/path';
     import type { AddLabelOptions, LabelAppearance, LabelState } from '@mappedin/react-sdk/geojson/src/components/label';
-    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
-    import type { GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/entity-group';
+    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/group-container';
+    import type { GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/geometry-group';
     import type { Position } from '@mappedin/react-sdk/geojson/src/types/geometry';
     import type { InsetPadding, RendererCoreOptions, ClickPayload, HoverPayload, CameraPayload, MapEvent, MapEventPayload } from '@mappedin/react-sdk/geojson/src/types';
     import type { GeometryState } from '@mappedin/react-sdk/geojson/src/components/mesh';
@@ -1177,31 +1189,49 @@ declare module '@mappedin/react-sdk/geojson/src' {
     }): Promise<RendererCore>;
 }
 
-declare module '@mappedin/react-sdk/geojson/src/maplibre-overlay' {
-    import type { IControl, Map as MapLibreMap } from '@packages/internal/outdoor-context-v4';
-    import type { Position } from '@mappedin/react-sdk/geojson/src/types';
-    import RendererCore from '@mappedin/react-sdk/geojson/src/renderer';
-    import { PubSub } from '@packages/internal/common';
-    export class MapLibreOverlay<T> extends PubSub<T> implements IControl {
-        el: HTMLDivElement;
-        core: RendererCore;
-        origin?: Position;
-        constructor(origin: Position | undefined);
-        onAdd(map: MapLibreMap): HTMLDivElement;
-        onRemove(): void;
-    }
-}
-
 declare module '@mappedin/react-sdk/mappedin-js/src/analytics' {
     export { analytics, analyticsInternal } from '@mappedin/react-sdk/mappedin-js/src/analytics/customer';
     export type { CustomerAnalytics, AnalyticsOptions } from '@mappedin/react-sdk/mappedin-js/src/analytics/customer';
 }
 
+declare module '@mappedin/react-sdk/mappedin-js/src/maplibre-overlay' {
+    import { MapView } from '@mappedin/react-sdk/mappedin-js/src/map-view';
+    import type MapData from '@mappedin/react-sdk/mappedin-js/src/map-data';
+    import type { TShow3DMapOptions } from '@mappedin/react-sdk/mappedin-js/src';
+    import { MapLibreOverlay } from '@mappedin/react-sdk/geojson/src/maplibre-overlay';
+    import type { Position } from '@mappedin/core-sdk';
+    export class MappedinMapLibreOverlay extends MapLibreOverlay<{
+            /**
+                * Event emitted when the MappedinMap is loaded
+                */
+            loaded: {
+                    /**
+                        * MapView instance
+                        */
+                    mapView: MapView;
+                    /**
+                        * MapData instance
+                        */
+                    mapData: MapData;
+            };
+    }> {
+            #private;
+            static instance: MappedinMapLibreOverlay;
+            constructor(origin: Position | undefined, mapData: MapData, options?: TShow3DMapOptions);
+            onAdd(map: any): HTMLDivElement;
+            onRemove(): void;
+    }
+}
+
 declare module '@mappedin/react-sdk/mappedin-js/src/types' {
-    import { Feature, MultiPolygon, Polygon } from 'geojson';
+    import type { Feature, MultiPolygon, Polygon } from 'geojson';
     import type { Coordinate, Floor, Door, Space, MapObject, PointOfInterest, Connection, Annotation } from '@mappedin/react-sdk/mappedin-js/src/map-data-objects';
     import type { Label, Marker, Model } from '@mappedin/react-sdk/mappedin-js/src/map-view-objects';
     import type { EasingCurve } from '@mappedin/core-sdk/src/camera';
+    import { GeometryGroupState } from '@mappedin/core-sdk';
+    export type DeepRequired<T> = Required<{
+            [K in keyof T]: T[K] extends Required<T[K]> ? T[K] : DeepRequired<T[K]>;
+    }>;
     /**
         * @hidden
         */
@@ -1345,11 +1375,19 @@ declare module '@mappedin/react-sdk/mappedin-js/src/types' {
                 * Indicates if the geometry element is interactive. Color can be set using CSS colors names `DarkGoldenRod`, as Hex strings `#0000FF` or the rgb values `rgb(255,0,0)`.
                 */
             interactive: boolean;
+            /**
+                * Opacity of the geometry element.
+                */
+            opacity: number;
+            /**
+                * Height of the geometry element in meters.
+                */
+            height: number;
     };
     /**
         * The type for updating the state of map elements (colors, texts, etc.).
         */
-    export type TUpdateState<T> = T extends 'walls' ? Partial<Omit<TGeometryState, 'interactive' | 'hoverColor' | 'type'>> : T extends Marker ? Partial<TMarkerState> : T extends Label ? Partial<TLabelState> : T extends Space | MapObject ? Partial<TGeometryState> : T extends string ? Record<string, any> : never;
+    export type TUpdateState<T> = T extends 'walls' ? Partial<Omit<GeometryGroupState, 'interactive' | 'hoverColor' | 'type'>> : T extends Marker ? Partial<TMarkerState> : T extends Label ? Partial<TLabelState> : T extends Space | MapObject ? Partial<TGeometryState> : T extends string ? Record<string, any> : never;
     export type TUpdateStates = Partial<Omit<TGeometryState, 'interactive' | 'hoverColor' | 'type'>> | Partial<TMarkerState> | Partial<TLabelState> | Partial<TGeometryState>;
     export type TGetEntityState<T> = T extends Marker ? TMarkerState : T extends Model ? TModelState : T extends Label ? TLabelState : T extends Space | MapObject ? TGeometryState : T extends string ? TLabelState | TGeometryState | TMarkerState | TModelState | undefined : never;
     export type TGetState<T> = TGetEntityState<T> | undefined;
@@ -1880,6 +1918,28 @@ declare module '@mappedin/react-sdk/mappedin-js/src/types' {
                 */
             id?: string;
     };
+    export type TBlueDotOptions = {
+            /** The radius of the BlueDot in pixels. The BlueDot will maintain this size clamped to a minimum of 0.35 metres. */
+            radius?: number;
+            /** The color of the BlueDot core element. */
+            color?: string;
+            /** Options for the accuracy ring around the BlueDot. */
+            accuracyRing?: {
+                    /** The color of the accuracy ring. */
+                    color?: string;
+                    /** The opacity of the accuracy ring. */
+                    opacity?: number;
+            };
+            /**
+                * Options for the bearing directional indicator.
+                */
+            bearing?: {
+                    /** The color of the bearing cone. */
+                    color?: string;
+                    /** The opacity of the bearing cone. */
+                    opacity?: number;
+            };
+    };
 }
 
 declare module '@mappedin/react-sdk/mappedin-js/src/map-view-objects' {
@@ -2998,25 +3058,17 @@ declare module '@mappedin/react-sdk/mappedin-js/src/api-geojson/blue-dot/blue-do
     import type { RendererCore } from '@mappedin/core-sdk';
     import { PubSub } from '@packages/internal/common';
     import type { GeoJsonApi } from '@mappedin/react-sdk/mappedin-js/src/api-geojson/api';
+    import type { TBlueDotOptions } from '@mappedin/react-sdk/mappedin-js/src/types';
     export type TBlueDotEvents = {
         'floor-change': {
             reason: 'blue-dot-floor-change';
             floorId: string;
         };
     };
-    export const POSITION_ANIMATION_DURATION = 500;
-    export const SCALE_ANIMATION_DURATION = 150;
-    export const ROTATION_ANIMATION_DURATION = 150;
-    export const MIN_AURA_RADIUS = 0;
-    export const MAX_AURA_RADIUS = 5;
-    export const MIN_ACCURACY = 5;
-    export const MAX_ACCURACY = 30;
-    export const CONE_START_RADIUS = 0.4;
-    export const CONE_DISTANCE = 1.25;
-    export const BLUE_DOT_RADIUS = 0.35;
     export class BlueDot extends PubSub<TBlueDotEvents> {
+        #private;
         constructor(core: RendererCore, geoJSONApi: GeoJsonApi);
-        enable(): void;
+        enable(options?: TBlueDotOptions): void;
         disable(): void;
     }
 }
@@ -3078,7 +3130,7 @@ declare module '@mappedin/react-sdk/geojson/src/components/marker' {
     import './marker.scss';
     import { Vector2 } from 'three';
     import type { Entity2DHTMLDivElement, EntityId, Position } from '@mappedin/react-sdk/geojson/src/types';
-    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
+    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/group-container';
     import type { CollisionRankingTier } from '@mappedin/react-sdk/geojson/src/utils/collision-ranking-tier';
     /**
         * State reprsenting a Marker
@@ -3211,7 +3263,7 @@ declare module '@mappedin/react-sdk/geojson/src/components/marker' {
 declare module '@mappedin/react-sdk/geojson/src/components/path' {
     import { type Mesh, type ShaderMaterial, type BufferGeometry, Vector3 } from 'three';
     import type { Position } from '@mappedin/react-sdk/geojson/src/types';
-    import { Geometry3DObject3D } from '@mappedin/react-sdk/geojson/src/entities/three-d';
+    import { Geometry3DObject3D } from '@mappedin/react-sdk/geojson/src/entities/geometry3d';
     import type { FeatureCollection, Point } from 'geojson';
     /**
         * State representing a Path
@@ -3312,7 +3364,7 @@ declare module '@mappedin/react-sdk/geojson/src/components/label' {
     import { Vector2 } from 'three';
     import type { TDrawFn } from '@packages/internal/shave-text/shave-text';
     import type { EntityId, Position } from '@mappedin/react-sdk/geojson/src/types';
-    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
+    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/group-container';
     import type { RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
     import type { CollisionRankingTier } from '@mappedin/react-sdk/geojson/src';
     export const labelThemes: {
@@ -3650,18 +3702,18 @@ declare module '@mappedin/react-sdk/geojson/src/components/label' {
     export default LabelComponent;
 }
 
-declare module '@mappedin/react-sdk/geojson/src/entities/entity-group-container' {
+declare module '@mappedin/react-sdk/geojson/src/entities/group-container' {
     import { Object3D } from 'three';
-    import type { GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/entity-group';
-    import { GeometryGroupObject3D } from '@mappedin/react-sdk/geojson/src/entities/entity-group';
-    import { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/two-d';
+    import type { GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/geometry-group';
+    import { GeometryGroupObject3D } from '@mappedin/react-sdk/geojson/src/entities/geometry-group';
+    import { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/geometry2d';
     import type { StackComponent } from '@mappedin/react-sdk/geojson/src/components/stack';
     import type { MarkerState } from '@mappedin/react-sdk/geojson/src/components/marker';
     import type { LabelState } from '@mappedin/react-sdk/geojson/src/components/label';
-    import { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities/three-d';
+    import { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities/geometry3d';
     import type { PathState } from '@mappedin/react-sdk/geojson/src/components/path';
-    import { InteractionComponent } from '@mappedin/react-sdk/geojson/src/components/interaction';
-    export enum EntityContainerComponents {
+    import type { InteractionComponent } from '@mappedin/react-sdk/geojson/src/components/interaction';
+    export enum GroupContainerComponents {
             Stack = 0,
             Interaction = 1
     }
@@ -3703,13 +3755,13 @@ declare module '@mappedin/react-sdk/geojson/src/entities/entity-group-container'
     }
 }
 
-declare module '@mappedin/react-sdk/geojson/src/entities/entity-group' {
+declare module '@mappedin/react-sdk/geojson/src/entities/geometry-group' {
     import type { LineStyle, PaintStyle, Shading } from '@mappedin/react-sdk/geojson/src/types';
     import { Object3D } from 'three';
-    import type { GeometryState } from '@mappedin/react-sdk/geojson/src/components/mesh';
+    import { type GeometryState } from '@mappedin/react-sdk/geojson/src/components/mesh';
     import type { ModelState } from '@mappedin/react-sdk/geojson/src/components/model';
     import { GeometryGroupStyleComponent } from '@mappedin/react-sdk/geojson/src/components/geometry-group-style';
-    export enum GEOMETRY_GROUP_COMPONENTS {
+    export enum GeometryGroupComponents {
             GeometryGroupStyle = 0
     }
     /**
@@ -3776,6 +3828,11 @@ declare module '@mappedin/react-sdk/geojson/src/entities/entity-group' {
             setOpacity(opacity: number): void;
             removeEntity(): void;
             constructor(id: string, style?: GeometryGroupStyleComponent);
+            /**
+                * Get first child entity of a group if it's a batched mesh
+                * We use this logic a lot for getting the material of the group. since group does not have material and batched mesh does
+                */
+            getfirstChildEntityId(): string | number | undefined;
     }
 }
 
@@ -3785,20 +3842,22 @@ declare module '@mappedin/react-sdk/geojson/src/types/geometry' {
 
 declare module '@mappedin/react-sdk/geojson/src/types' {
     import { Mesh, Object3D, InstancedMesh } from 'three';
-    import type { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/two-d';
+    import type { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/geometry2d';
     import type { Position } from '@mappedin/react-sdk/geojson/src/types/geometry';
     import type { GeometryState } from '@mappedin/react-sdk/geojson/src/components/mesh';
-    import type { GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/entity-group';
-    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
+    import type { GeometryGroupObject3D, GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/geometry-group';
+    import type { GroupContainerObject3D, GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/group-container';
     import type { PathState } from '@mappedin/react-sdk/geojson/src/components/path';
     import type { ModelState } from '@mappedin/react-sdk/geojson/src/components/model';
     import type { LabelState } from '@mappedin/react-sdk/geojson/src/components/label';
     import type { MarkerState } from '@mappedin/react-sdk/geojson/src/components/marker';
+    import type { ImageState } from '@mappedin/react-sdk/geojson/src/components/image';
     import type { ShapeState } from '@mappedin/react-sdk/geojson/src/components/custom';
+    import type { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities';
     /**
         * The state of an entity, which can be a geometry, geometry group, group container, path, model, label, or marker.
         */
-    export type EntityState = GeometryState | GeometryGroupState | GroupContainerState | PathState | ModelState | LabelState | MarkerState | ShapeState;
+    export type EntityState = GeometryState | GeometryGroupState | GroupContainerState | PathState | ModelState | LabelState | MarkerState | ImageState | ShapeState;
     /**
         * A wrapper object that contains the ID and type of an entity. This is returned when adding entities to the scene, and can be used
         * to `getState` and `setState` of the entity.
@@ -3847,6 +3906,8 @@ declare module '@mappedin/react-sdk/geojson/src/types' {
             texture?: string;
             shading?: Shading;
             outline?: boolean;
+            showImage?: boolean;
+            flipImageToFaceCamera?: boolean;
     };
     export type Cap = 'round' | 'square' | 'butt';
     export type Join = 'round' | 'bevel' | 'miter';
@@ -3880,6 +3941,12 @@ declare module '@mappedin/react-sdk/geojson/src/types' {
             };
             source: string;
     };
+    export type PolygonImage = {
+            width: number;
+            height: number;
+            verticalOffset?: number;
+            rotation?: number;
+    };
     export type PolygonSource = {
             features: {
                     type: 'Feature';
@@ -4033,6 +4100,21 @@ declare module '@mappedin/react-sdk/geojson/src/types' {
     export type MapEventPayload<EventName extends keyof MapEvent> = MapEvent[EventName] extends {
             data: null;
     } ? MapEvent[EventName]['data'] : MapEvent[EventName];
+    export type Geometry3DTypes = Geometry3D | GeometryGroupObject3D | GroupContainerObject3D;
+    export type RendererState = {
+            geometry3DMap: Map<string | number, Geometry3DTypes>;
+            geometry2DMap: Map<string | number, Geometry2D>;
+            geometry2DIdsInScene: Set<Geometry2D['id']>;
+            geometry3DIdsInScene: Set<Geometry3DTypes['id']>;
+            entityScene: GroupContainerObject3D;
+            hoverColor: string;
+            center?: Position;
+            insetsPadding: InsetPadding;
+            shouldMeasureCanvas: boolean;
+            pixelRatio: number;
+            canvasWidth: number;
+            canvasHeight: number;
+    };
 }
 
 declare module '@mappedin/react-sdk/geojson/src/components/mesh' {
@@ -4092,21 +4174,41 @@ declare module '@mappedin/react-sdk/geojson/src/components/mesh' {
                 * Whether the geometry is outlined with a 30% darkened color. This effect adds lines around the geometry to make it stand out.
                 */
             outline: boolean;
+            /**
+                * Show geometry image if present
+                */
+            showImage: boolean;
+            /**
+                * Attempt to keep the image facing the camera as much as possible
+                */
+            flipImageToFaceCamera: boolean;
             /**
                 * Whether the geometry should emit an event when focused on by the center of the camera
                 */
             focusable: boolean;
+            /**
+                * The opacity of the geometry
+                */
+            opacity: number;
+            /**
+                * The height of the geometry
+                */
+            height: number;
     };
     export class MeshComponent {
             #private;
             mesh?: EntityBatchedMesh;
             focusMesh?: Mesh;
             outline?: LineSegments;
+            imageMesh?: Mesh;
             readonly type = "geometry";
+            dirty: boolean;
+            detached: boolean;
             instanceIndex: number;
             geometry?: BufferGeometry;
             material?: BatchedStandardMaterial;
             feature: Feature<Polygon | LineString | MultiPolygon | MultiLineString>;
+            currentHeight: number;
             constructor(feature: Feature<Polygon | LineString | MultiPolygon | MultiLineString>);
             get visible(): boolean;
             set visible(visible: boolean);
@@ -4115,6 +4217,10 @@ declare module '@mappedin/react-sdk/geojson/src/components/mesh' {
             color: Color;
             topColor: Color;
             setColor(color: string, topColor: string): void;
+            getColor(): {
+                    color: Color;
+                    topColor: Color;
+            } | undefined;
             position: Vector3;
             get altitude(): number;
             set altitude(value: number);
@@ -4135,8 +4241,8 @@ declare module '@mappedin/react-sdk/geojson/src/components/custom' {
     import { Color, type Object3D, type LineSegments } from 'three';
     import type { EntityId, Position } from '@mappedin/react-sdk/geojson/src/types';
     import type { Feature, Point } from 'geojson';
-    import { Geometry3DObject3D } from '@mappedin/react-sdk/geojson/src/entities/three-d';
-    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
+    import { Geometry3DObject3D } from '@mappedin/react-sdk/geojson/src/entities/geometry3d';
+    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/group-container';
     /**
         * State representing a Custom Geometry
         */
@@ -4193,8 +4299,8 @@ declare module '@mappedin/react-sdk/geojson/src/components/model' {
     import type { BatchedStandardMaterial } from '@mappedin/react-sdk/geojson/src/systems/mesh-creation-and-optimization/batched-material';
     import type { Position, EntityId } from '@mappedin/react-sdk/geojson/src/types';
     import type { Feature, Point } from 'geojson';
-    import type { Geometry3DObject3D } from '@mappedin/react-sdk/geojson/src/entities/three-d';
-    import type { GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/entity-group';
+    import type { Geometry3DObject3D } from '@mappedin/react-sdk/geojson/src/entities/geometry3d';
+    import type { GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/geometry-group';
     /**
         * State representing a Model, typically loaded via a URL
         */
@@ -4243,13 +4349,9 @@ declare module '@mappedin/react-sdk/geojson/src/components/model' {
 
 declare module '@mappedin/react-sdk/geojson/src/renderer' {
     import './utils/object-this-polyfill';
-    import type { Position as GeoJsonPosition } from 'geojson';
     import { Vector3, Raycaster, Camera as ThreeCamera } from 'three';
-    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
-    import { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
+    import type { GroupContainerState } from '@mappedin/react-sdk/geojson/src/entities/group-container';
     import { PubSub } from '@mappedin/react-sdk/packages/common/pubsub';
-    import { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities/three-d';
-    import { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/two-d';
     import { CollisionSystem } from '@mappedin/react-sdk/geojson/src/systems/collisions/system';
     import { InteractionSystem } from '@mappedin/react-sdk/geojson/src/systems/interactions';
     import { ZoomInterpolationSystem } from '@mappedin/react-sdk/geojson/src/systems/zoom-interpolation/zoom-interpolation';
@@ -4257,7 +4359,7 @@ declare module '@mappedin/react-sdk/geojson/src/renderer' {
     import type { GLTFExportOptions } from '@mappedin/react-sdk/geojson/src/systems/exporter';
     import { ExporterSystem } from '@mappedin/react-sdk/geojson/src/systems/exporter';
     import type { AddLabelOptions, LabelState } from '@mappedin/react-sdk/geojson/src/components/label';
-    import type { LineStyle, PaintStyle, RendererCoreOptions, Position, ModelProperties, ModelStyle, InsetPadding, EntityState, EntityId, MapEvent, MapEventPayload } from '@mappedin/react-sdk/geojson/src/types';
+    import type { LineStyle, PaintStyle, RendererCoreOptions, Position, ModelProperties, ModelStyle, EntityState, EntityId, MapEvent, MapEventPayload, RendererState } from '@mappedin/react-sdk/geojson/src/types';
     import { MeshCreationAndOptimizationSystem } from '@mappedin/react-sdk/geojson/src/systems/mesh-creation-and-optimization/system';
     import { DOMVisibilitySystem } from '@mappedin/react-sdk/geojson/src/systems/dom-visiblity/system';
     import { TwoDProjectionSystem } from '@mappedin/react-sdk/geojson/src/systems/2d-projection/system';
@@ -4265,7 +4367,7 @@ declare module '@mappedin/react-sdk/geojson/src/renderer' {
     import { DrawSystem } from '@mappedin/react-sdk/geojson/src/systems/draw/system';
     import { TwoDVisibilitySystem } from '@mappedin/react-sdk/geojson/src/systems/2d-visibility/system';
     import { RenderSystem } from '@mappedin/react-sdk/geojson/src/systems/render/system';
-    import type { FeatureCollection, LineString, MultiPolygon, Polygon, Point, Feature } from 'geojson';
+    import type { Position as GeoJsonPosition, FeatureCollection, LineString, MultiPolygon, Polygon, Point, Feature } from 'geojson';
     import type { AddPathOptions, PathState } from '@mappedin/react-sdk/geojson/src/components/path';
     import { StackSystem } from '@mappedin/react-sdk/geojson/src/systems/stack/system';
     import { CameraSystem } from '@mappedin/react-sdk/geojson/src/systems/camera';
@@ -4273,8 +4375,7 @@ declare module '@mappedin/react-sdk/geojson/src/renderer' {
     import { type Map as MapLibreMap } from '@mappedin/react-sdk/packages/outdoor-context-v4';
     import type { GeometryState } from '@mappedin/react-sdk/geojson/src/components/mesh';
     import type { ModelState } from '@mappedin/react-sdk/geojson/src/components/model';
-    import type { GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/entity-group';
-    import { GeometryGroupObject3D } from '@mappedin/react-sdk/geojson/src/entities/entity-group';
+    import type { GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/geometry-group';
     import { DOMResizeSystem } from '@mappedin/react-sdk/geojson/src/systems/dom-resize/system';
     import { Camera } from '@mappedin/react-sdk/geojson/src/camera';
     import { type WatermarkOptions, WatermarkSystem } from '@mappedin/react-sdk/geojson/src/systems/watermark/system';
@@ -4283,9 +4384,13 @@ declare module '@mappedin/react-sdk/geojson/src/renderer' {
     import { type CustomGeometryBuilder, type ShapeState } from '@mappedin/react-sdk/geojson/src/components/custom';
     import { CustomGeometrySystem } from '@mappedin/react-sdk/geojson/src/systems/custom-geometry/system';
     import { OutlineInterpolationSystem } from '@mappedin/react-sdk/geojson/src/systems/outline-interpolation/system';
+    import { ImageSystem } from '@mappedin/react-sdk/geojson/src/systems/image/system';
     import { GeometryInFocusSystem } from '@mappedin/react-sdk/geojson/src/systems/geometry-in-focus/system';
     import { OutdoorLayers } from '@mappedin/react-sdk/geojson/src/systems/outdoor-layers/system';
     import { PathSystem } from '@mappedin/react-sdk/geojson/src/systems/path';
+    import { type ImageProperties, type ImageState, type ImageStyle } from '@mappedin/react-sdk/geojson/src/components/image';
+    import { MeshOpacitySystem } from '@mappedin/react-sdk/geojson/src/systems/mesh-opacity/system';
+    import { MeshModificationSystem } from '@mappedin/react-sdk/geojson/src/systems/mesh-modification/system';
     export type * from '@mappedin/react-sdk/geojson/src/types';
     export const raycaster: Raycaster;
     export const DEFAULT_ZOOM_LEVEL = 18;
@@ -4304,21 +4409,6 @@ declare module '@mappedin/react-sdk/geojson/src/renderer' {
             AFTER_RENDER: number;
             AFTER_ALL_UPDATES: number;
     };
-    export type Entity3DTypes = Geometry3D | GeometryGroupObject3D | GroupContainerObject3D;
-    export type RendererState = {
-            entity3DMap: Map<string | number, Entity3DTypes>;
-            entity2DMap: Map<string | number, Geometry2D>;
-            entity2DIds: Set<Geometry2D['id']>;
-            threeDEntities: (string | number)[];
-            entityScene: GroupContainerObject3D;
-            hoverColor: string;
-            center?: Position;
-            insetsPadding: InsetPadding;
-            shouldMeasureCanvas: boolean;
-            pixelRatio: number;
-            canvasWidth: number;
-            canvasHeight: number;
-    };
     export type Systems = {
             cameraSystem: CameraSystem;
             panBoundsSystem: PanBoundsSystem;
@@ -4342,7 +4432,10 @@ declare module '@mappedin/react-sdk/geojson/src/renderer' {
             outlineInterpolationSystem: OutlineInterpolationSystem;
             outdoorLayersSystem: OutdoorLayers;
             pathSystem: PathSystem;
+            imageSystem: ImageSystem;
             geometryInFocusSystem: GeometryInFocusSystem;
+            meshOpacitySystem: MeshOpacitySystem;
+            meshModificationSystem: MeshModificationSystem;
     };
     export type MapViewState = {
             readonly type: 'map-view';
@@ -4400,6 +4493,7 @@ declare module '@mappedin/react-sdk/geojson/src/renderer' {
                 * Add a geometry group from GeoJSON data
                 */
             addGeometryGroup<T extends FeatureCollection<Polygon | MultiPolygon | LineString, any>>(id: string, geometry: T, style?: T extends FeatureCollection<LineString, any> ? LineStyle : PaintStyle, parent?: EntityId<GroupContainerState> | string | number | null): EntityId<GeometryGroupState>;
+            addImage(id: string, geometry: Feature<Point, ImageProperties>, style: ImageStyle, parent?: EntityId<GroupContainerState> | string | null): EntityId<ImageState> | undefined;
             /**
                 * Add a group of models from GeoJSON data. These will be instanced automatically for better performance.
                 */
@@ -4458,9 +4552,9 @@ declare module '@mappedin/react-sdk/geojson/src/renderer' {
                 * Get the current state of the map view, or any entity that was added, regardless of whether it is visible in the scene
                 */
             getState(): MapViewState;
-            getState<T extends EntityId<EntityState>>(geometryOrGeometryId: T): T extends EntityId<LabelState> ? LabelState : T extends EntityId<GeometryState> ? GeometryState : T extends EntityId<MarkerState> ? MarkerState : T extends EntityId<GeometryGroupState> ? GeometryGroupState : T extends EntityId<GroupContainerState> ? GroupContainerState : T extends EntityId<ModelState> ? ModelState : T extends EntityId<PathState> ? ShapeState : T extends EntityId<ShapeState> ? ShapeState : EntityState;
+            getState<T extends EntityId<EntityState>>(geometryOrGeometryId: T): T extends EntityId<LabelState> ? LabelState : T extends EntityId<GeometryState> ? GeometryState : T extends EntityId<MarkerState> ? MarkerState : T extends EntityId<GeometryGroupState> ? GeometryGroupState : T extends EntityId<GroupContainerState> ? GroupContainerState : T extends EntityId<ModelState> ? ModelState : T extends EntityId<PathState> ? ShapeState : T extends EntityId<ShapeState> ? ShapeState : T extends EntityId<ImageState> ? ImageState : EntityState;
             getState(geometryOrGeometryId?: Record<string | number, any> | string | number): EntityState;
-            getState<T extends EntityState>(geometryOrGeometryId: T['id']): T extends LabelState ? LabelState : T extends GeometryState ? GeometryState : T extends MarkerState ? MarkerState : T extends GeometryGroupState ? GeometryGroupState : T extends GroupContainerState ? GroupContainerState : T extends ModelState ? ModelState : T extends PathState ? ShapeState : T extends ShapeState ? PathState : EntityState;
+            getState<T extends EntityState>(geometryOrGeometryId: T['id']): T extends LabelState ? LabelState : T extends GeometryState ? GeometryState : T extends MarkerState ? MarkerState : T extends GeometryGroupState ? GeometryGroupState : T extends GroupContainerState ? GroupContainerState : T extends ModelState ? ModelState : T extends PathState ? ShapeState : T extends ShapeState ? PathState : T extends ImageState ? ImageState : EntityState;
             /**
                 * Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.
                 */
@@ -4473,6 +4567,7 @@ declare module '@mappedin/react-sdk/geojson/src/renderer' {
             setState<T extends EntityId<ShapeState>>(object: T | T['id'], state: Partial<ShapeState>): void;
             setState<T extends EntityId<PathState>>(object: T | T['id'], state: Partial<PathState>): void;
             setState<T extends EntityId<ModelState>>(object: T | T['id'], state: Partial<ModelState>): void;
+            setState<T extends EntityId<ImageState>>(object: T | T['id'], state: Partial<ImageState>): void;
             setState<T extends EntityState>(object: T | T['id'], state: Partial<T>): void;
             /**
                 * Project a screen coordinate to a geographic coordinate
@@ -4511,6 +4606,10 @@ declare module '@mappedin/react-sdk/geojson/src/renderer' {
                 * Sets the background color of the renderer. Only applies to "standalone mode"
                 */
             setBackgroundColor: (color: any, alpha: any) => void;
+            /**
+                * Returns the current scale of the map in metres per pixel.
+                */
+            getMetresPerPixel: () => number | undefined;
             /**
                 * @internal
                 * Filters out layers at a certain point on the outdoor map. This can be used to hide the outdoor building footprint underneath the 3D geometry.
@@ -4780,40 +4879,40 @@ declare module '@mappedin/react-sdk/geojson/src/utils' {
     import { Box2 } from 'three';
     import { MercatorCoordinate } from '@mappedin/react-sdk/packages/outdoor-context-v4';
     import type { CustomLayerInterface } from '@mappedin/react-sdk/packages/outdoor-context-v4';
-    import type { GeometryGroupObject3D } from '@mappedin/react-sdk/geojson/src/entities/entity-group';
-    import type { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
-    import type { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/two-d';
-    import type { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities/three-d';
+    import type { GeometryGroupObject3D } from '@mappedin/react-sdk/geojson/src/entities/geometry-group';
+    import type { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/group-container';
+    import type { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/geometry2d';
+    import type { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities/geometry3d';
     import type { Position, RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
     import type { Camera } from '@mappedin/react-sdk/geojson/src/camera';
     export function cartesianToGeographic(centerLat: number, centerLon: number, x: number, y: number): {
-        lat: number;
-        lon: number;
+            lat: number;
+            lon: number;
     };
     export function geographicToCartesian(centerLat: number, centerLon: number, targetLat: number, targetLon: number): {
-        x: number;
-        y: number;
+            x: number;
+            y: number;
     };
-    export const extract3DEntitiesFromTree: (tree: any, entities?: (string | number)[]) => (string | number)[];
-    export const extractEntitiesFromTree: (tree: any, entities: Set<Geometry2D["id"]>) => Set<string | number>;
+    export const populateGeometry3DIdsInScene: (tree: any, entities: RendererState["geometry3DIdsInScene"]) => Set<string | number>;
+    export const populateGeometry2DIdsInScene: (tree: any, entities: Set<Geometry2D["id"]>) => Set<string | number>;
     export function convertMapLibreStylePaintProps(paint: any): {
-        color: any;
-        height: any;
-        altitude: any;
-        opacity: any;
-        outline: any;
+            color: any;
+            height: any;
+            altitude: any;
+            opacity: any;
+            outline: any;
     };
     export function convertMapLibreLineStylePaintProps(paint: any): {
-        color: any;
-        join: any;
-        opacity: any;
-        width: any;
-        cap: any;
+            color: any;
+            join: any;
+            opacity: any;
+            width: any;
+            cap: any;
     };
     export function mergeObjects<T extends Record<string, any>>(obj1: T, obj2: T): T;
     export function createCustomLayer(modelAsMercatorCoordinate: MercatorCoordinate, viewCamera: THREECamera, camera: Camera, onRender: () => void): CustomLayerInterface;
     export function getRequestHeaders(authURL: string): Promise<{
-        'x-mappedin-tiles-key': string;
+            'x-mappedin-tiles-key': string;
     }>;
     export function cyrb53(str: string, seed?: number): number;
     export const linearEase: (t: number) => number;
@@ -4825,38 +4924,53 @@ declare module '@mappedin/react-sdk/geojson/src/utils' {
     /*  getProjectionScaleFactor()
     /*  finds the scale ratio between screen coordinates and 3D coordinates (in X-Z plane)
     /*
-          *                                    R
-          *                                  /|
-          *    C : Camera                  /  |
-          *    PQ : Projection Plane     /    |
-          *    OR : Origin             /      |
-          *    F : FOV               /        |
-          *                      Q /          |
-          *                      /|           |
-          *                    /  |           |
-          *                  /    |           |
-          *                /      |           |
-          *              /        |           |
-          *            / F/2      |           |
-          *         C ------------P------------ O
-          *
-          *
-          *   ProjectionScaleFactor = ( OR / PQ )
-          *   PQ = canvasHeight / 2
-          *   CQ = zoom
-          *
-          *   OR / C0 = tan(F/2)
-          *   so OR = CO * tan(F/2)
-          */
+                *                                    R
+                *                                  /|
+                *    C : Camera                  /  |
+                *    PQ : Projection Plane     /    |
+                *    OR : Origin             /      |
+                *    F : FOV               /        |
+                *                      Q /          |
+                *                      /|           |
+                *                    /  |           |
+                *                  /    |           |
+                *                /      |           |
+                *              /        |           |
+                *            / F/2      |           |
+                *         C ------------P------------ O
+                *
+                *
+                *   ProjectionScaleFactor = ( OR / PQ )
+                *   PQ = canvasHeight / 2
+                *   CQ = zoom
+                *
+                *   OR / C0 = tan(F/2)
+                *   so OR = CO * tan(F/2)
+                */
     export function getProjectionScaleFactor(FOV: number, canvasHeight: number, zoom: number): number;
     export function getGeometryByGeometryId(state: RendererState, geometryOrGeometryId?: string | number | Record<string, any>): Geometry3D | GroupContainerObject3D | GeometryGroupObject3D | Geometry2D | undefined;
     export function getBoundingBoxCenter(bbox: Position[]): [number, number];
+    export function toRadians(degrees: number): number;
+    /**
+        * Calculates the approximate distance between two geographic coordinates on Earth's surface.
+        *
+        * This function uses the equirectangular approximation method to compute the distance, which simplifies
+        * the math and speeds up calculations, but is less accurate over long distances compared to other methods
+        * like the haversine formula.
+        *
+        * @param {Position} point1 - The first point's longitude and latitude as [longitude, latitude].
+        * @param {Position} point1 - The second point's longitude and latitude as [longitude, latitude].
+        * @return
+        * @return {number} The approximate distance between the two points in meters.
+        */
+    export function haversineDistance(point1: Position, point2: Position): number;
     export { getCornersOfBoundingBox } from '@mappedin/react-sdk/geojson/src/utils/bounding-box';
     export function isFiniteBox(box: Box2 | Box3): boolean;
     export { getPixelRatio } from '@mappedin/react-sdk/geojson/src/utils/get-pixel-ratio';
     export { debounce } from '@mappedin/react-sdk/geojson/src/utils/async';
     export { shouldDisableOffscreenCanvas } from '@mappedin/react-sdk/geojson/src/utils/browser';
     export { noop } from '@mappedin/react-sdk/geojson/src/utils/fp';
+    export { transformRequest } from '@mappedin/react-sdk/geojson/src/utils/tranform-request';
 }
 
 declare module '@mappedin/react-sdk/geojson/src/utils/constants' {
@@ -5152,6 +5266,23 @@ declare module '@mappedin/react-sdk/mappedin-js/src/analytics/customer' {
     export {};
 }
 
+declare module '@mappedin/react-sdk/geojson/src/maplibre-overlay' {
+    import type { IControl, Map as MapLibreMap, CustomLayerInterface } from '@packages/internal/outdoor-context-v4';
+    import type { Position } from '@mappedin/react-sdk/geojson/src/types';
+    import RendererCore from '@mappedin/react-sdk/geojson/src/renderer';
+    import { PubSub } from '@packages/internal/common';
+    export class MapLibreOverlay<T> extends PubSub<T> implements IControl {
+        el: HTMLDivElement;
+        core: RendererCore;
+        origin?: Position;
+        map?: MapLibreMap;
+        layer?: CustomLayerInterface;
+        constructor(origin: Position | undefined);
+        onAdd(map: MapLibreMap): HTMLDivElement;
+        onRemove(): void;
+    }
+}
+
 declare module '@mappedin/react-sdk/mappedin-js/src/map-view-objects/label' {
     /**
         * Class representing a label on the {@link MapView}.
@@ -5316,8 +5447,7 @@ declare module '@mappedin/react-sdk/mappedin-js/src/api-geojson/api' {
     import type { Position, RendererCore, WatermarkOptions } from '@mappedin/core-sdk';
     import { type TShow3DMapOptions } from '@mappedin/react-sdk/mappedin-js/src';
     import type MapData from '@mappedin/react-sdk/mappedin-js/src/map-data';
-    import { Floor } from '@mappedin/react-sdk/mappedin-js/src/map-data-objects';
-    import { Coordinate, MapObject, Space } from '@mappedin/react-sdk/mappedin-js/src/map-data-objects';
+    import { Coordinate, MapObject, Space, Floor } from '@mappedin/react-sdk/mappedin-js/src/map-data-objects';
     import type { MapView } from '@mappedin/react-sdk/mappedin-js/src/map-view';
     import { Label, Marker, type Model } from '@mappedin/react-sdk/mappedin-js/src/map-view-objects';
     import { Navigation } from '@mappedin/react-sdk/mappedin-js/src/navigation';
@@ -5382,6 +5512,7 @@ declare module '@mappedin/react-sdk/mappedin-js/src/api-geojson/api' {
           * @internal
           */
         get __core(): RendererCore;
+        clear(): void;
         destroy(): void;
     }
 }
@@ -5971,7 +6102,7 @@ declare module '@mappedin/react-sdk/mappedin-js/src/api-geojson/floor-object' {
         elevation: number;
         containerId: string;
         layers: Map<string, string>;
-        constructor(parentId: string, floor: ParsedMVF['map.geojson'][0], renderer: RendererCore, options: TShow3DMapOptions, mvf?: ParsedMVF, styleMap?: AggregatedStyleMap);
+        constructor(parentId: string, floor: ParsedMVF['map.geojson'][0], renderer: RendererCore, options: TShow3DMapOptions, mvf: ParsedMVF, styleMap?: AggregatedStyleMap);
         load: () => this;
     }
 }
@@ -6004,17 +6135,18 @@ declare module '@mappedin/react-sdk/mappedin-js/src/map-data-objects/base-metada
     }
 }
 
-declare module '@mappedin/react-sdk/geojson/src/entities/three-d' {
+declare module '@mappedin/react-sdk/geojson/src/entities/geometry3d' {
     import { Object3D } from 'three';
     import type { InteractionComponent } from '@mappedin/react-sdk/geojson/src/components/interaction';
     import type { MeshComponent } from '@mappedin/react-sdk/geojson/src/components/mesh';
     import type { ModelComponent } from '@mappedin/react-sdk/geojson/src/components/model';
     import type { PathComponent } from '@mappedin/react-sdk/geojson/src/components/path';
     import type { StyleComponent } from '@mappedin/react-sdk/geojson/src/components/style';
+    import type { ImageComponent } from '@mappedin/react-sdk/geojson/src/components/image';
     import type { CustomGeometryComponent } from '@mappedin/react-sdk/geojson/src/components/custom';
-    import type { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
-    import { GeometryGroupObject3D } from '@mappedin/react-sdk/geojson/src/entities/entity-group';
-    export enum ThreeDComponents {
+    import type { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/group-container';
+    import type { GeometryGroupObject3D } from '@mappedin/react-sdk/geojson/src/entities/geometry-group';
+    export enum Geometry3DComponents {
         Mesh = 0,
         Style = 1,
         Interaction = 2
@@ -6022,27 +6154,27 @@ declare module '@mappedin/react-sdk/geojson/src/entities/three-d' {
     export class Geometry3DObject3D extends Object3D {
         userData: {
             entityId: string;
-            type: 'geometry' | 'path' | 'model' | 'custom-geometry';
+            type: 'geometry' | 'path' | 'model' | 'custom-geometry' | 'image';
         };
     }
-    export type MeshComponentTypes = MeshComponent | PathComponent | ModelComponent | CustomGeometryComponent;
+    export type MeshComponentTypes = MeshComponent | PathComponent | ModelComponent | CustomGeometryComponent | ImageComponent;
     export class Geometry3D {
         id: string | number;
         components: [MeshComponentTypes, StyleComponent, InteractionComponent?];
         get object3d(): import("../components/mesh").EntityBatchedMesh | Geometry3DObject3D | undefined;
         get parent(): GroupContainerObject3D | GeometryGroupObject3D | null;
-        get type(): 'geometry' | 'path' | 'model' | 'custom-geometry';
-        constructor(meshComponent: MeshComponent | PathComponent | ModelComponent | CustomGeometryComponent, styleComponent: StyleComponent);
+        get type(): 'geometry' | 'path' | 'model' | 'custom-geometry' | 'image';
+        constructor(meshComponent: MeshComponent | PathComponent | ModelComponent | CustomGeometryComponent | ImageComponent, styleComponent: StyleComponent);
     }
 }
 
-declare module '@mappedin/react-sdk/geojson/src/entities/two-d' {
+declare module '@mappedin/react-sdk/geojson/src/entities/geometry2d' {
     import { Object3D, Vector3 } from 'three';
     import type { MarkerComponent } from '@mappedin/react-sdk/geojson/src/components/marker';
     import type LabelComponent from '@mappedin/react-sdk/geojson/src/components/label';
-    import type { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
+    import type { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/group-container';
     import type { InteractionComponent } from '@mappedin/react-sdk/geojson/src/components/interaction';
-    export enum TWOD_COMPONENTS {
+    export enum Geometry2DComponents {
         UI = 0,
         Interaction = 1
     }
@@ -6095,6 +6227,11 @@ declare module '@mappedin/react-sdk/geojson/src/components/geometry-group-style'
         topColor?: string;
         opacity: number;
         outline: boolean;
+        /**
+          * Ideally for handling all style component changes. However, it's only used for handling outline for now.
+          * Color update is handled separately in each child. See: https://github.com/MappedIn/sdk/blob/v6.0.1-beta.1/sdks/geojson/src/entities/utils.ts#L70
+          */
+        dirty: boolean;
         get shading(): Required<Shading> | undefined;
         set shading(value: Shading | undefined);
         constructor(style?: Partial<GeometryGroupStyle>);
@@ -6102,6 +6239,79 @@ declare module '@mappedin/react-sdk/geojson/src/components/geometry-group-style'
     export {};
 }
 
+declare module '@mappedin/react-sdk/geojson/src/components/image' {
+    import type { LineSegments, PlaneGeometry, MeshLambertMaterial } from 'three';
+    import { Vector3, Mesh } from 'three';
+    import type { Position } from '@mappedin/react-sdk/geojson/src/types';
+    import type { Feature, Point } from 'geojson';
+    import { Geometry3DObject3D } from '@mappedin/react-sdk/geojson/src/entities/geometry3d';
+    export class EntityMesh extends Mesh {
+            userData: {
+                    entityId: string | number;
+            };
+    }
+    export type ImageStyle = {
+            /**
+                * Attempt to keep the image facing the camera as much as possible
+                */
+            flipImageToFaceCamera?: boolean;
+            /**
+                * url of the image
+                */
+            url: string;
+    };
+    export type ImageProperties = {
+            width: number;
+            height: number;
+            rotation?: number;
+            verticalOffset?: number;
+    };
+    export function validImageFeature(feature: Feature<Point, ImageProperties>): feature is Feature<Point, ImageProperties>;
+    /**
+        * State representing an Image
+        */
+    export type ImageState = {
+            readonly id: string | number;
+            readonly type: 'image';
+            /**
+                * The position of the image in [lon, lat]
+                */
+            readonly position: Position;
+            /**
+                * The offset of the image in the z direction
+                */
+            readonly verticalOffset: number;
+            /**
+                * Whether the image is visible
+                */
+            visible: boolean;
+            /**
+                * Attempt to keep the image facing the camera as much as possible
+                */
+            flipImageToFaceCamera: boolean;
+    };
+    export class ImageComponent {
+            mesh: Geometry3DObject3D;
+            imageMesh?: EntityMesh;
+            outline?: LineSegments;
+            readonly type = "image";
+            instanceIndex: number;
+            geometry?: PlaneGeometry;
+            material?: MeshLambertMaterial;
+            feature: Feature<Point, ImageProperties>;
+            constructor(feature: Feature<Point, ImageProperties>);
+            get visible(): boolean;
+            set visible(visible: boolean);
+            position: Vector3;
+    }
+}
+
+declare module '@mappedin/react-sdk/geojson/src/entities' {
+    export { updateInteractivity } from '@mappedin/react-sdk/geojson/src/entities/utils';
+    export { Geometry2D, Geometry2DComponents } from '@mappedin/react-sdk/geojson/src/entities/geometry2d';
+    export { Geometry3D, Geometry3DComponents } from '@mappedin/react-sdk/geojson/src/entities/geometry3d';
+}
+
 declare module '@mappedin/react-sdk/geojson/src/types/options' {
     import type { Position } from '@mappedin/react-sdk/geojson/src/types/geometry';
     import type { Map as MapLibreMap } from '@mappedin/react-sdk/packages/outdoor-context-v4';
@@ -6149,6 +6359,10 @@ declare module '@mappedin/react-sdk/geojson/src/systems/mesh-creation-and-optimi
         set topTexture(texture: Texture);
         setGradientShading(start: number, end: number, intensity: number): void;
         setColor(batchId: number, color: Color, topColor: Color): void;
+        getColor(batchId: number): {
+            color: Color;
+            topColor: Color;
+        };
         showTextures: (batchId: number) => void;
         hideTextures(batchId: number): void;
         dispose(): void;
@@ -6225,6 +6439,7 @@ declare module '@mappedin/react-sdk/geojson/src/systems/collisions/system' {
     import { PubSub } from '@mappedin/react-sdk/packages/common/pubsub';
     import type { RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
     import type { TSerializedCollider, TSerializedColliderResponse } from '@mappedin/react-sdk/geojson/src/systems/collisions/collider-processor';
+    import { WatermarkPosition } from '@mappedin/react-sdk/geojson/src/systems/watermark/system';
     export type TMessageEvent = MessageEvent<{
         msgId: string;
         colliders: TSerializedColliderResponse[];
@@ -6241,6 +6456,7 @@ declare module '@mappedin/react-sdk/geojson/src/systems/collisions/system' {
         totalHeight: number;
         watermarkWidth: number;
         watermarkHeight: number;
+        watermarkPosition: WatermarkPosition;
         colliders: TSerializedCollider[];
         devicePixelRatio: number;
     };
@@ -6256,7 +6472,8 @@ declare module '@mappedin/react-sdk/geojson/src/systems/collisions/system' {
         totalHeight: number,
         totalWidth: number,
         watermarkWidth: number,
-        watermarkHeight: number
+        watermarkHeight: number,
+        watermarkPosition: WatermarkPosition
     ];
     export class CollisionSystem extends PubSub<TCollisionSystemEvent, keyof TCollisionSystemEvent> {
         dirty: boolean;
@@ -6275,8 +6492,8 @@ declare module '@mappedin/react-sdk/geojson/src/systems/collisions/system' {
         currentMsgId: string;
         working: boolean;
         componentArray: (MarkerComponent | LabelComponent)[];
-        update: (watermarkWidth: number, watermarkHeight: number) => void;
-        resize(watermarkWidth: number, watermarkHeight: number): void;
+        update: (watermarkWidth: number, watermarkHeight: number, watermarkPosition?: WatermarkPosition) => void;
+        resize(watermarkWidth: number, watermarkHeight: number, watermarkPosition: WatermarkPosition): void;
         /**
           * Resolve collisions
           */
@@ -6317,7 +6534,7 @@ declare module '@mappedin/react-sdk/geojson/src/systems/zoom-interpolation/zoom-
 declare module '@mappedin/react-sdk/geojson/src/systems/mesh-creation-and-optimization/system' {
     import type { BufferGeometry } from 'three';
     import type { RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
-    import { Geometry3D, Geometry3DObject3D } from '@mappedin/react-sdk/geojson/src/entities/three-d';
+    import { Geometry3D, Geometry3DObject3D } from '@mappedin/react-sdk/geojson/src/entities/geometry3d';
     import type { Feature, LineString, MultiPolygon, Point, Polygon } from 'geojson';
     import type { LineStyle, ModelProperties, ModelStyle, PaintStyle } from '@mappedin/react-sdk/geojson/src/types';
     import type { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
@@ -6698,11 +6915,13 @@ declare module '@mappedin/react-sdk/geojson/src/systems/custom-geometry/system'
 declare module '@mappedin/react-sdk/geojson/src/systems/outline-interpolation/system' {
     import type { RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
     export class OutlineInterpolationSystem {
+            #private;
             /**
                 * Set to true when we need to update the outline color of all entities, regardless of zoom level.
                 */
             dirty: boolean;
-            geometries3DDirty: boolean;
+            get geometries3DDirty(): boolean;
+            set geometries3DDirty(value: boolean);
             constructor(rendererState: RendererState);
             /**
                 * Update the outline color of all entities with an outline component.
@@ -6713,6 +6932,19 @@ declare module '@mappedin/react-sdk/geojson/src/systems/outline-interpolation/sy
     }
 }
 
+declare module '@mappedin/react-sdk/geojson/src/systems/image/system' {
+    import type { RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
+    import type { RendererCore } from '@mappedin/react-sdk/geojson/src';
+    import { PubSub } from '@packages/internal/common';
+    export const DEFAULT_VERTICAL_OFFSET = 0.01;
+    export class ImageSystem extends PubSub<{
+        'image-loaded': void;
+    }> {
+        constructor(rendererState: RendererState, convertTo3DMapPosition: RendererCore['convertTo3DMapPosition']);
+        update(cameraRotationRadians: number): void;
+    }
+}
+
 declare module '@mappedin/react-sdk/geojson/src/systems/geometry-in-focus/system' {
     import { PubSub } from '@packages/internal/common';
     import type { RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
@@ -6746,6 +6978,45 @@ declare module '@mappedin/react-sdk/geojson/src/systems/path' {
     export { PathSystem } from '@mappedin/react-sdk/geojson/src/systems/path/system';
 }
 
+declare module '@mappedin/react-sdk/geojson/src/systems/mesh-opacity/system' {
+    import { type Geometry3DTypes, type RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
+    /**
+      * This system is responsible for updating the opacity of the mesh, which results in the mesh
+      * being detached from the parent's optimized geometry group and rendered as a separate mesh.
+      */
+    export class MeshOpacitySystem {
+        #private;
+        rendererState: RendererState;
+        dirty: boolean;
+        constructor(rendererState: RendererState);
+        updateOne(geometry: Geometry3DTypes | undefined): void;
+        update(): void;
+    }
+}
+
+declare module '@mappedin/react-sdk/geojson/src/systems/mesh-modification/system' {
+    import { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities';
+    import type { GeometryGroupObject3D } from '@mappedin/react-sdk/geojson/src/entities/geometry-group';
+    import type { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/group-container';
+    import type { RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
+    /**
+      * Any physical changes to geometry should go in here. This includes height changes, etc.
+      * This is to ensure that physical changes apply before any other systems need to do their work,
+      * such as the outline system.
+      *
+      * TODO: For now, this piggybacks of style.dirty, but we may want to create a flag indicating geometry dirty.
+      */
+    export class MeshModificationSystem {
+        #private;
+        rendererState: RendererState;
+        dirty: boolean;
+        constructor(rendererState: RendererState);
+        updateOne(entity: Geometry3D | GeometryGroupObject3D | GroupContainerObject3D | undefined): void;
+        update(): void;
+        cleanup(): void;
+    }
+}
+
 declare module '@mappedin/react-sdk/packages/geojson-navigator/src' {
     export { Navigator } from '@mappedin/react-sdk/packages/geojson-navigator/src/navigator';
     export type { SimplifyDirectionsOptions } from '@mappedin/react-sdk/packages/geojson-navigator/src/navigator/navigator';
@@ -6812,10 +7083,13 @@ declare module '@mappedin/react-sdk/geojson/src/utils/fp' {
     export function noop(): void;
 }
 
-declare module '@mappedin/react-sdk/geojson/src/entities' {
-    export { updateInteractivity } from '@mappedin/react-sdk/geojson/src/entities/utils';
-    export { Geometry2D, TWOD_COMPONENTS } from '@mappedin/react-sdk/geojson/src/entities/two-d';
-    export { Geometry3D, ThreeDComponents } from '@mappedin/react-sdk/geojson/src/entities/three-d';
+declare module '@mappedin/react-sdk/geojson/src/utils/tranform-request' {
+    export const transformRequest: (headers: {
+        "x-mappedin-tiles-key": string;
+    }) => (url: string) => {
+        url: string;
+        headers: {};
+    };
 }
 
 declare module '@mappedin/react-sdk/geojson/src/systems/exporter/exporter' {
@@ -6851,6 +7125,7 @@ declare module '@mappedin/react-sdk/geojson/src/systems/exporter/exporter' {
 declare module '@mappedin/react-sdk/mappedin-js/src/api-geojson/utils' {
     import { Coordinate } from '@mappedin/react-sdk/mappedin-js/src/map-data-objects';
     import type { Position, EntranceCollection, LineString, Polygon, Point, SpaceProperties, ObstructionProperties, StyleCollection, PolygonStyle, LineStringStyle, Feature, ObstructionCollection, PointStyle } from '@mappedin/mvf';
+    import type { WithPolygonImage } from '@packages/internal/mvf-utils';
     import type { MultiLineString } from 'geojson';
     import type { LabelState, MarkerState, GeometryState, CollisionRankingTier, LineStyle, PaintStyle } from '@mappedin/core-sdk';
     import type { TGeometryState, TLabelState, TDirectionInstructionAction, TShow3DMapOptions } from '@mappedin/react-sdk/mappedin-js/src';
@@ -6874,12 +7149,13 @@ declare module '@mappedin/react-sdk/mappedin-js/src/api-geojson/utils' {
     export type WithId<T> = T & {
         id?: string;
     };
-    export function groupGeometryByStyle(features: Feature<LineString | Polygon | Point, SpaceProperties | ObstructionProperties>[], styleMap: AggregatedStyleMap): Map<WithId<PolygonStyle> | WithId<LineStringStyle> | WithId<PointStyle>, Feature<Point | LineString | Polygon, ObstructionProperties | SpaceProperties>[]>;
+    export function groupGeometryByStyle(features: Feature<LineString | Polygon | Point, SpaceProperties | ObstructionProperties>[], styleMap: AggregatedStyleMap): Map<WithId<PolygonStyle> | WithId<LineStringStyle> | WithId<PointStyle>, Feature<Point | LineString | Polygon, WithPolygonImage<SpaceProperties> | WithPolygonImage<ObstructionProperties>>[]>;
     export function translateToCoreStyle(style: PolygonStyle | LineStringStyle, userOptions?: TShow3DMapOptions): PaintStyle | LineStyle;
 }
 
 declare module '@mappedin/react-sdk/geojson/src/components/style' {
     import type { Cap, Join } from '@mappedin/react-sdk/geojson/src/types';
+    export const DEFAULT_HEIGHT = 0.1;
     type Style = {
         color: string;
         width: number;
@@ -6893,6 +7169,9 @@ declare module '@mappedin/react-sdk/geojson/src/components/style' {
         texture?: string;
         topTexture?: string;
         outline: boolean;
+        showImage: boolean;
+        flipImageToFaceCamera: boolean;
+        url?: string;
     };
     export class StyleComponent implements Style {
         initialColor: string;
@@ -6910,11 +7189,44 @@ declare module '@mappedin/react-sdk/geojson/src/components/style' {
         join: Join;
         cap: Cap;
         outline: boolean;
+        showImage: boolean;
+        flipImageToFaceCamera: boolean;
+        url?: string;
         constructor(style?: Partial<Style>);
     }
     export {};
 }
 
+declare module '@mappedin/react-sdk/geojson/src/entities/utils' {
+    import type { CollisionRankingTier, GeometryState, LabelState, PathState, RendererCore } from '@mappedin/react-sdk/geojson/src';
+    import type { MarkerState } from '@mappedin/react-sdk/geojson/src/components/marker';
+    import type { Geometry3DTypes, Position, RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
+    import { GeometryGroupObject3D, type GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/geometry-group';
+    import { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/group-container';
+    import { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities/geometry3d';
+    import { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/geometry2d';
+    export function updateInteractivity(entity: Geometry3DTypes | Geometry2D, update: boolean | undefined, state: RendererState): boolean;
+    export function updateGroupColor(entity: GeometryGroupObject3D, state: RendererState, update: Partial<Pick<GeometryGroupState, 'color' | 'topColor'>>): boolean | undefined;
+    export function updateGroupShading(entity: GeometryGroupObject3D, update?: GeometryGroupState['shading']): boolean;
+    export function updateImageProps(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update?: Partial<GeometryState>): void;
+    export function updateHeight(entity: Geometry3D, update?: number): boolean;
+    export function updateColor(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update?: Partial<GeometryState>): void;
+    export function updatePosition(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: Position | undefined, convertTo3DMapPosition: RendererCore['convertTo3DMapPosition']): void;
+    export function updateParent(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: GroupContainerObject3D | undefined): boolean;
+    export function updateEnabled(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: boolean | undefined): void;
+    export function updatePath(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: Partial<PathState> | undefined): void;
+    export function updateMarker(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: Partial<MarkerState> | undefined): boolean;
+    export function updateRank(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: CollisionRankingTier | undefined): boolean;
+    export function updateLabel(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: Partial<LabelState> | undefined): void;
+    export function updateHoverColor(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update?: string): void;
+    export function updateFlipImageToFaceCamera(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update?: boolean): void;
+    export function updateVisibility(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update?: boolean): boolean;
+    export function updateOpacity(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, state: RendererState, update?: number): void;
+    export function updateIndividualGeometryOpacity(entity: Geometry3D, update?: number): boolean;
+    export function updateAltitude(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update?: number): void;
+    export function updateOutline(entity: Geometry3DTypes, update?: boolean): boolean;
+}
+
 declare module '@mappedin/react-sdk/geojson/src/systems/collisions/collider-processor' {
     import { Rectangle } from '@packages/internal/quad-tree';
     export type TSerializedCollider = {
@@ -6930,7 +7242,7 @@ declare module '@mappedin/react-sdk/geojson/src/systems/collisions/collider-proc
         shouldCollideWithScreenEdges?: boolean;
     };
     export type TSerializedColliderResponse = [number, boolean, Rectangle?];
-    export function processColliders(colliders: TSerializedCollider[], totalWidth: any, totalHeight: any, watermarkWidth: any, watermarkHeight: any, msgId?: string): {
+    export function processColliders(colliders: TSerializedCollider[], totalWidth: any, totalHeight: any, watermarkWidth: any, watermarkHeight: any, watermarkPosition: any, msgId?: string): {
         msgId: string;
         colliders: TSerializedColliderResponse[];
         debug: {
@@ -6945,16 +7257,16 @@ declare module '@mappedin/react-sdk/geojson/src/systems/collisions/collider-proc
 declare module '@mappedin/react-sdk/geojson/src/systems/interactions/system' {
     import type { PerspectiveCamera, Vector3, Object3D, Mesh } from 'three';
     import { Raycaster } from 'three';
-    import type { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/two-d';
+    import type { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/geometry2d';
     import { QuadTree } from '@packages/internal/quad-tree';
-    import type { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities/three-d';
+    import type { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities/geometry3d';
     import { PubSub } from '@mappedin/react-sdk/packages/common/pubsub';
     import type { EntityMesh } from '@mappedin/react-sdk/geojson/src/types';
     import { TapsController } from '@mappedin/react-sdk/geojson/src/systems/interactions/tap-controller';
     import type { RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
     import 'style.scss';
     import type { EntityBatchedMesh } from '@mappedin/react-sdk/geojson/src/components/mesh';
-    import type { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
+    import type { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/group-container';
     type InteractionPayload = {
             entity2D?: Geometry2D;
             entity3D?: Geometry3D;
@@ -6980,8 +7292,8 @@ declare module '@mappedin/react-sdk/geojson/src/systems/interactions/system' {
             } | undefined;
     };
     export type InteractionRequiredCoreStateProps = {
-            twoDEntities: Geometry2D[];
-            threeDEntities: Geometry3D[];
+            geometry2DIdsInScene: Set<Geometry2D['id']>;
+            geometry3DIdsInScene: Set<Geometry3D['id']>;
     };
     /**
         * TODO: touch support
@@ -7023,6 +7335,7 @@ declare module '@mappedin/react-sdk/geojson/src/systems/interactions/system' {
                 * Get the current cursor type determined by the interaction.
                 */
             getCursor(): CursorTypes;
+            resize: () => void;
     }
     export {};
 }
@@ -15716,32 +16029,6 @@ declare module '@mappedin/react-sdk/packages/geojson-navigator/src/types/coordin
     export type CoordinateFeature = Feature<Point, CoordinateProperties>;
 }
 
-declare module '@mappedin/react-sdk/geojson/src/entities/utils' {
-    import type { CollisionRankingTier, GeometryState, LabelState, PathState, RendererCore } from '@mappedin/react-sdk/geojson/src';
-    import type { MarkerState } from '@mappedin/react-sdk/geojson/src/components/marker';
-    import type { Entity3DTypes, Position, RendererState } from '@mappedin/react-sdk/geojson/src/renderer';
-    import { GeometryGroupObject3D, type GeometryGroupState } from '@mappedin/react-sdk/geojson/src/entities/entity-group';
-    import { GroupContainerObject3D } from '@mappedin/react-sdk/geojson/src/entities/entity-group-container';
-    import { Geometry3D } from '@mappedin/react-sdk/geojson/src/entities/three-d';
-    import { Geometry2D } from '@mappedin/react-sdk/geojson/src/entities/two-d';
-    export function updateInteractivity(entity: Entity3DTypes | Geometry2D, update: boolean | undefined, state: RendererState): boolean;
-    export function updateGroupColor(entity: GeometryGroupObject3D, state: RendererState, update?: Partial<GeometryGroupState>): boolean;
-    export function updateGroupShading(entity: GeometryGroupObject3D, update?: GeometryGroupState['shading']): boolean;
-    export function updateColor(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update?: Partial<GeometryState>): void;
-    export function updatePosition(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: Position | undefined, convertTo3DMapPosition: RendererCore['convertTo3DMapPosition']): void;
-    export function updateParent(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: GroupContainerObject3D | undefined): boolean;
-    export function updateEnabled(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: boolean | undefined): void;
-    export function updatePath(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: Partial<PathState> | undefined): void;
-    export function updateMarker(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: Partial<MarkerState> | undefined): boolean;
-    export function updateRank(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: CollisionRankingTier | undefined): boolean;
-    export function updateLabel(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update: Partial<LabelState> | undefined): void;
-    export function updateHoverColor(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update?: string): void;
-    export function updateVisibility(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update?: boolean): boolean;
-    export function updateOpacity(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, state: RendererState, update?: number): void;
-    export function updateAltitude(entity: Geometry3D | Geometry2D | GeometryGroupObject3D | GroupContainerObject3D, update?: number): void;
-    export function updateOutline(entity: Entity3DTypes, update?: boolean): boolean;
-}
-
 declare module '@mappedin/react-sdk/geojson/src/systems/interactions/tap-controller' {
     export enum TapType {
         onefinger = 0,