@mappedin/mappedin-js 5.10.2 → 5.11.0

package/lib/esm/renderer/index.d.ts

@@ -26,6 +26,7 @@ declare module '@mappedin/mappedin-js' {
     export type { BlueDot } from '@mappedin/mappedin-js/renderer/public/api/BlueDot';
     export type { Markers } from '@mappedin/mappedin-js/renderer/public/api/Markers';
     export type { Paths } from '@mappedin/mappedin-js/renderer/public/api/Paths';
+    export type { TOOLTIP_ANCHOR } from '@mappedin/mappedin-js/renderer/internal/Mappedin.SmartTooltip';
     export type TMappedinInitializeOutput = {
             mapView: MapView;
             venue: Mappedin;
@@ -118,16 +119,46 @@ declare module '@mappedin/mappedin-js/renderer/public/MapView' {
     import { Paths } from '@mappedin/mappedin-js/renderer/public/api/Paths';
     import { BlueDot } from '@mappedin/mappedin-js/renderer/public/api/BlueDot';
     import { Camera } from '@mappedin/mappedin-js/renderer/public/api/Camera';
+    /**
+        * Primary API class for controlling and interacting with a 3D map.
+        */
     export class MapView extends PubSub<E_SDK_EVENT_PAYLOAD, E_SDK_EVENT> {
             #private;
+            /**
+                * API for representing sets of directions on the map.
+                */
             Journey: Journey;
+            /**
+                * API for controlling the camera in the scene.
+                */
             Camera: Camera;
+            /**
+                * API for controlling flat labels.
+                */
             FlatLabels: IFlatLabels<void>;
+            /**
+                * API for controlling floating labels.
+                */
             FloatingLabels: IFloatingLabels<void>;
+            /**
+                * API for adding 2D markers.
+                */
             Markers: Markers;
+            /**
+                * API for drawing arbitrary paths.
+                */
             Paths: Paths;
+            /**
+                * API for handling a user's position on the map.
+                */
             BlueDot: BlueDot;
+            /**
+                * The options that the mapView was instantiated with.
+                */
             options: TMapViewOptions;
+            /**
+                * @hidden
+                */
             constructor(container: HTMLElement, venue: Mappedin, options?: TMapViewOptions & {
                     onFirstMapLoaded: () => void;
             });
@@ -140,75 +171,184 @@ declare module '@mappedin/mappedin-js/renderer/public/MapView' {
                 */
             labelAllLocations(options?: TLabelAllLocationFloatingLabelOptions | TLabelAllLocationFlatLabelOptions): never[];
             /**
-                * Get Nearest Node to a screen coordinate x, y, map. Useful for doing directions from any place on the map
+                * Get the nearest {@link MappedinNode} on a map to an XY-coordinate on the screen.
+                * This can be useful for generating directions from an arbitrary point on the map.
+                *
+                * ```
+                * // Get the nearest node on map[0] to (100,100)
+                * const nearestNode = mapView.getNearestNodeByScreenCoordinates(100, 100, mapView.venue.maps[0]);
+                * const destination = mapView.venue.locations.find((l) => l.name === "Apple")!;
+                *
+                * // Find out how to get from that node to Apple
+                * const directions = nearestNode.directionsTo(destination);
+                * ```
                 *
-                * @param x
-                * @param y
-                * @param mapOrMapId Map of MapId
+                * @param x The x position of a coordinate on the screen.
+                * @param y The y position of a coordinate on the screen.
+                * @param mapOrMapId The {@link MappedinMap} the node should belong to.
                 */
             getNearestNodeByScreenCoordinates(x: number, y: number, mapOrMapId?: MappedinMap | MappedinMap['id']): MappedinNode;
             /**
-                * Unsubscribe from SDK events
+                * Subscribe a function to an {@link E_SDK_EVENT}.
+                *
+                * ```ts
+                * // Set a polygon to be red when it is clicked
+                * const mapClickHandler = ({ polygons }: E_SDK_EVENT_PAYLOAD["CLICK"]) => {
+                * 	if (polygons.length > 0) {
+                * 		mapView.setPolygonColor(polygons[0], 'red');
+                * 	}
+                * }
+                * mapView.on(E_SDK_EVENT.CLICK, mapClickHandler);
+                * ```
+                *
+                * @param eventName An {@link E_SDK_EVENT} which, when fired, will call the provided
+                * function.
+                * @param fn A callback that gets called when the corresponding event is fired. The
+                * callback will get passed an argument with a type that's one of {@link E_SDK_EVENT_PAYLOAD}.
+                */
+            on: PubSub<E_SDK_EVENT_PAYLOAD, E_SDK_EVENT>['on'];
+            /**
+                * Unsubscribe a function previously subscribed with {@link on} from
+                * and {@link E_SDK_EVENT}.
+                *
+                * ```ts
+                * mapView.on(E_SDK_EVENT.CLICK, mapClickHandler);
+                *
+                * ...
+                *
+                * // Something changed and I no longer want this event
+                * mapView.off(E_SDK_EVENT.CLICK, mapClickHandler);
+                * ```
+                *
+                * @param eventName An {@link E_SDK_EVENT} to which the provided function was previously
+                * subscribed.
+                * @param fn A function that was previously passed to {@link on}. The function must
+                * have the same reference as the function that was subscribed.
+                */
+            off: PubSub<E_SDK_EVENT_PAYLOAD, E_SDK_EVENT>['off'];
+            /**
+                * Set state of the mapView to one of {@link STATE}.
+                *
+                * @param state The {@link STATE} to set the SDK to.
                 */
             setState(state: STATE): Promise<void>;
+            /**
+                * The current {@link STATE} on the mapView.
+                */
             get state(): STATE;
             /**
-                * The Venue data this MapView is using.
-                *
-                * @property venue {MappedinVenue}
-                * @final
+                * The {@link Mappedin} data this mapView is using.
                 */
             get venue(): Mappedin;
             /**
-                * The div MapView is using.
-                *
-                * @property container {Div}
-                * @final
+                * The HTML element that the mapView is rendered into.
                 */
             get container(): HTMLElement;
             /**
-                * The current map being displayed
+                * The current {@link MappedinMap} being displayed.
                 */
             get currentMap(): MappedinMap;
             /**
-                * Remove all interactive polygons
+                * Prevent any polygons from showing a hover effect and being clicked on.
+                * See also {@link addInteractivePolygon} and {@link addInteractivePolygonsForAllLocations}.
+                *
+                * ```ts
+                * mapView.removeAllInteractivePolygons()
+                * ```
                 */
             removeAllInteractivePolygons(): void;
             /**
-                * Change the currently displayed Map to a new one.
+                * Change the currently displayed {@link MappedinMap} to a new one.
                 *
-                * @method setMap
-                * @param mapOrMapId The Map ID or Map Object to change the Map to.
+                * ```ts
+                * await mapView.setMap(mapView.venue.maps[1]);
+                * ```
+                *
+                * @param mapOrMapId The {@link MappedinMap} to display.
+                * @returns A promise that resolves when the map is fully switched.
                 */
             setMap(mapOrMapId: MappedinMap | string): Promise<null>;
             /**
-                * Given a polygon, set it to a specific color.
+                * Given a {@link MappedinPolygon}, set it to a specific color.
+                *
+                * ```ts
+                * // Find the polygons of the Apple store and change them to blue
+                * const location = mapView.venue.locations.find((l) => l.name === "Apple")!;
+                * for (const polygon of location.polygons) {
+                * 	mapView.setPolygonColor(polygon, "#0000ff");
+                * }
+                * ```
                 *
-                * @param polygon The Polygon ({@link MappedinPolygon}) to change the color of.
-                * @param color The color to use.
+                * @param polygon The {@link MappedinPolygon} to change the color of.
+                * @param color A hexidecimal color string to use as the new color.
                 */
             setPolygonColor(polygon: MappedinPolygon, color: string): void;
             /**
-                * Resets a Polygon back to it's original color.
-                * If the user is hovering over a polygon, it will still have the hover effect.
+                * Resets a {@link MappedinPolygon} back to it's original color. See also {@link clearAllPolygonColors} and
+                * {@link setPolygonColor}. If the user is hovering over a polygon, it will still
+                * have the hover color set by {@link setHoverColor}.
+                *
+                * ```ts
+                * mapView.setPolygonColor(polygon, "#0000ff");
                 *
-                * @param polygonOrPolygonId The Polygon/Polygon ID to reset.
+                * ...
+                *
+                * // Reset the polygon color
+                * mapView.clearPolygonColor(polygon);
+                * ```
+                *
+                * @param polygonOrPolygonId The {@link MappedinPolygon} to reset the color of.
                 */
             clearPolygonColor(polygonOrPolygonId: MappedinPolygon | string): void;
             /**
-                * Resets ALL Polygons you have changed with {@link MapView.setPolygonColor} back to their original color.
-                * The hover effect will still be present if the user is currently hovering over a Polygon.
+                * Resets all {@link MappedinPolygon} instances back to their original colors. See also {@link clearPolygonColor} and
+                * {@link setPolygonColor}. If the user is hovering over a polygon, it will still
+                * have the hover color set by {@link setHoverColor}.
+                *
+                * ```ts
+                * mapView.clearAllPolygonColors();
+                * ```
                 */
             clearAllPolygonColors(): void;
             /**
-                * Makes a single Polygon hoverable/clickable. Polygons you haven't called this on will be treated as non-interactive and not respond to any mouse events.
+                * Makes a {@link MappedinPolygon} interactive. This means it will receive a hover effect and
+                * respond to the `CLICK` {@link E_SDK_EVENT}. See also {@link on} and {@link addInteractivePolygonsForAllLocations}.
+                *
+                * ```ts
+                * // Make all washroom polygons clickable
+                * const washroom = mapView.venue.find((l) => l.name === "Washroom")!;
+                * for (const polygon of washroom.polygons) {
+                * 	mapView.addInteractivePolygon(polygon);
+                * }
+                *
+                * // Now they will be populated in click events
+                * mapView.on(E_SDK_EVENT.CLICK, ({ polygons }) -> {
+                * 	if (polygons.length > 0) {
+                * 		console.log("Clicked on a washroom!");
+                * 	}
+                * })
+                * ```
                 *
+                * @param polygonOrPolygonId The {@link MappedinPolygon} to make interactive.
                 */
             addInteractivePolygon(polygonOrPolygonId: MappedinPolygon | string): void;
             /**
-                * Makes all polygons attached to a location hoverable/clickable. Polygons you haven't called this on will be treated as non-interactive
-                * This is a convenience function for calling {@link MapView.addInteractivePolygon} on all the polygons attached to all locations. You may also make individual polygons interactive with the addInteractivePolygon method instead of, or in addition to this method.
+                * Makes all {@link MappedinPolygon} instances with an attached {@link MappedinLocation} interactive.
+                * This means they will receive a hover effect and respond to the `CLICK` {@link E_SDK_EVENT}. See also
+                * {@link on} and {@link addInteractivePolygon}.
                 *
+                * ```ts
+                * mapView.addInteractivePolygonsForAllLocations();
+                *
+                * // Now all polygons with locations can be clicked
+                * mapView.on(E_SDK_EVENT.CLICK, ({ polygons }) => {
+                * 	if (polygons.length > 0) {
+                * 		for (const polygon of polygons) {
+                * 			console.log(`clicked on ${polygon.locations[0].name}`)
+                * 		}
+                * 	}
+                * });
+                * ```
                 */
             addInteractivePolygonsForAllLocations(options?: {
                     /**
@@ -221,28 +361,33 @@ declare module '@mappedin/mappedin-js/renderer/public/MapView' {
                     locations?: MappedinLocation[];
             }): void;
             /**
-                * Makes a polygon no longer hoverable/clickable.
+                * Makes a polygon no longer hoverable/clickable. See also {@link addInteractivePolygon} and
+                * {@link addInteractivePolygonsForAllLocations}.
                 *
-                * @param polygonOrPolygonId  The previously interactive Polygon/Polygon ID to make non-interactive.
+                * @param polygonOrPolygonId  The {@link MappedinPolygon} to make no longer interactive.
                 */
             removeInteractivePolygon(polygonOrPolygonId: MappedinPolygon | string): void;
             /**
                 * Attach any HTML to a {@link MappedinNode} or {@link MappedinCoordinate}, and have the marker interact and collide with smart labels and tooltips
-                * @deprecated use `mapView.Markers.add` instead.
+                * @deprecated use {@link Markers.add} instead.
                 */
             createMarker(nodeOrCoordinate: MappedinNode | MappedinCoordinate, contentHtml: string, options?: TCreateMarkerOptions): Marker;
             /**
                 * Remove Marker
-                * @deprecated use `mapView.Markers.remove` instead.
+                * @deprecated use {@link Markers.remove} instead.
                 */
             removeMarker(markerOrMarkerId: Marker | Marker['id']): void;
             /**
                 * Removes all Markers (from all Maps, not just the current one).
-                * @deprecated use `mapView.Markers.removeAll` instead.
+                * @deprecated use {@link Markers.removeAll} instead.
                 */
             removeAllMarkers(): void;
             /**
-                * Remove all tooltips
+                * Remove all tooltips created with {@link createTooltip} or {@link createCustomTooltip}.
+                *
+                * ```ts
+                * mapView.removeAllTooltips();
+                * ```
                 */
             removeAllTooltips(): void;
             /**
@@ -302,12 +447,12 @@ declare module '@mappedin/mappedin-js/renderer/public/MapView' {
                 */
             removeTooltip(tooltipOrTooltipId: SmartTooltip | SmartTooltip['id']): void;
             /**
-                * Let any image attached to a Polygon attached to a Location flip 180 degrees with the camera so it's always upright.
+                * Let any image attached to a Polygon attached to a Location flip 180 degrees with the camera
+                * so it's always upright. See also {@link enableImageFlippingForPolygon}.
                 *
-                * @method enableImageFlippingForAllLocations
-                * @param options
-                *	@param [options.excludeTypes=[]] {[String]} A list of Location types to skip, if for some reason there are Locations that have logos that shouldn't flip.
-                *	@param [options.locations] {[MappedinLocation]|[String]} An array of Location objects, or Location IDs. If excludeTypes is not sufficient you can explicitly set the Locations you are marking to flip. You can also call {{#crossLink "MapView/enableImageFlippingForPolygon:method"}}{{/crossLink}} manually for every polygon you care about instead.
+                * ```ts
+                * mapView.enableImageFlippingForAllLocations();
+                * ```
                 */
             enableImageFlippingForAllLocations(options?: {
                     /**
@@ -320,13 +465,29 @@ declare module '@mappedin/mappedin-js/renderer/public/MapView' {
                     locations?: MappedinLocation[] | string[];
             }): void;
             /**
-                * Mark a specific Polygon so, if it has an image, it rotates with the camera.
+                * Mark a specific {@link MappedinPolygon} so, if it has an image, it rotates with the camera.
+                * See also {@link enableImageFlippingForAllLocations}.
+                *
+                * ```ts
+                * // Enable image flipping for locations with type "Anchor"
+                * const anchorStores = mapView.venue.locations.filter((l) => l.type === "Anchor");
+                * for(const store of anchorStores) {
+                * 	for(const polygon of anchorStores.polygons) {
+                * 		mapView.enableImageFlippingForPolygon(polygon);
+                * 	}
+                * }
+                * ```
                 *
+                * @param polygon The {@link MappedinPolygon} to enable image flipping for.
                 */
             enableImageFlippingForPolygon(polygon: MappedinPolygon): void;
+            /**
+                * Disable image flipping that was enabled with {@link enableImageFlippingForPolygon} or
+                * {@link enableImageFlippingForAllLocations}.
+                */
             disableImageFlippingForAllPolygons(): void;
             /**
-                * @deprecated Use `mapView.Paths.add` instead.
+                * @deprecated Use {@link Paths.add} instead.
                 *
                 * Draws an entire path. It takes a list of Nodes and will break them into separate pathSegments on every map change, putting the resultant segment on the right Map.
                 *
@@ -335,85 +496,125 @@ declare module '@mappedin/mappedin-js/renderer/public/MapView' {
                 */
             drawPath(path: MappedinNode[], options?: TPathOptions): string;
             /**
-                * @deprecated Use `mapView.Paths.remove` instead.
+                * @deprecated Use {@link Paths.remove} instead.
                 *
                 * Remove a path by id
                 */
             removePath(pathId: string): void;
             /**
-                * @deprecated Use `mapView.Paths.removeAll` instead.
+                * @deprecated Use {@link Paths.removeAll} instead.
                 *
                 * Removes all pathSegments from all Maps.
                 */
             removeAllPaths(): void;
             /**
-                * Sets the clear color of the Map something else, it you want it to fit it more with your website. Otherwise the div will be white where there is no Map visible.
+                * Sets the color of empty space in the scene. Useful for matching the aesthetics of the
+                * surrounding website of application. Otherwise the container element will be white where
+                * there is no map visible.
                 *
-                * @param color The color to use. Not an HTML color name.
-                * @param alpha Opacity between 0 and 1.
+                * ```ts
+                * // Make the background a dark grey
+                * mapView.setBackgroundColor("#050505");
+                * ```
+                *
+                * @param color A hexidecimal color string to use.
+                * @param alpha A number between 0 and 1 representing opacity.
                 */
             setBackgroundColor(color: string, alpha?: number): void;
             /**
-                * Sets the color for hovering over polygons
+                * Sets a color that {@link MappedinPolygon} instances will receive when they are
+                * beneath a cursor. This only applies to interactive polygons set using {@link addInteractivePolygon}
+                * or {@link addInteractivePolygonsForAllLocations}.
+                *
+                * ```ts
+                * // Make all location polygons interactive and have a red hover color
+                * mapView.addInteractivePolygonsForAllLocations()
+                * mapView.setHoverColor("#ff0000");
+                * ```
                 */
             setHoverColor(color: string): void;
             /**
-                * The scene only renders when something has changed. This should be something a 3rd party developer doesn't need to worry about,
-                * but if you are doing something weird, or have your own special tween for something, you will want to call this function.
-                * You can call it as often as you want, it just sets a flag that we need to render again, and renders a few frames if we weren't already doing that.
-                * Ignored in 2D.
-                * @deprecated
+                * @deprecated This should no longer need to be called externally and is now a no-op.
                 */
             tryRendering(_renderMode?: any): void;
             /**
-                * Finds the main Location associated with a Polygon. This means a Location
-                * attached to the Polygon that has no parents, or, if there are none of those,
-                * a Location nearest the top of some hierarchy that does have the Polygon attached.
+                * Finds the main {@link MappedinLocation} associated with a {@link MappedinPolygon}.
+                * This means a location attached to the polygon that has no parents, or, if there
+                * are none of those, a location nearest the top of some hierarchy that does have the
+                * polygon attached.
                 *
-                * This means if there are multiple hierarchies of Locations attached to the Polygon,
+                * This means if there are multiple hierarchies of locations attached to the polygon,
                 * the one that gets returned is not guaranteed to be what you want.
                 *
-                * @param polygon The Polygon you want the primary Location of.
+                * ```
+                * // Log the primary location of a clicked polygon
+                * mapView.on(E_SDK_EVENT.CLICK, ({ polygons }) => {
+                * 	if (polygons.length > 0) {
+                * 		for(const polygon of polygons) {
+                * 			console.log(mapView.getPrimaryLocationForPolygon(polygon));
+                * 		}
+                * 	}
+                * });
+                * ```
+                *
+                * @param polygon The {@link MappedinPolygon} you want the primary location of.
                 */
             getPrimaryLocationForPolygon(polygon: MappedinPolygon): MappedinLocation;
             /**
-                * Finds all polygons that contain the specified MappedinCoordinate. If multiple
-                * polygons are stacked on top of each other, the array of polygons returned will be
+                * Finds all {@link MappedinPolygon} instances that contain the specified {@link MappedinCoordinate}.
+                * If multiple polygons are stacked on top of each other, the array of polygons returned will be
                 * in the order of top to bottom.
                 *
-                * By default, this only considers interactive polygons.
+                * By default, this only considers interactive polygons set through {@link addInteractivePolygon} or
+                * {@link addInteractivePolygonsForAllLocations}. This behaviour can be changed by passing
+                * `options.includeNonInteractive`.
                 *
-                * @param coordinate The MappedinCoordinate to check
-                * @param options {@link TGetPolygonsAtCoordinateOptions}
-                * @returns MappedinPolygon[]
+                * ```ts
+                * const polygons = mapView.getPolygonsAtCoordinate(coordinate);
+                * ```
+                *
+                * @param coordinate The {@link MappedinCoordinate} to check.
+                * @param options
+                * @returns An array of {@link MappedinPolygon} instances intersecting the given coordinate.
                 */
             getPolygonsAtCoordinate(coordinate: MappedinCoordinate, options?: TGetPolygonsAtCoordinateOptions): MappedinPolygon[];
             /**
-                * Finds all the polygons on a screen coordinate x and y. If multiple
-                * polygons are stacked on top of each other, the array of polygons returned will be
-                * in the order of farthest to closest.
+                * Finds all {@link MappedinPolygon} instances that intersect the specified XY-coordinate on screen.
+                * If multiple polygons are stacked on top of each other, the array of polygons returned will be
+                * in the order of top to bottom.
                 *
-                * By default, this only considers interactive polygons.
+                * By default, this only considers interactive polygons set through {@link addInteractivePolygon} or
+                * {@link addInteractivePolygonsForAllLocations}. This behaviour can be changed by passing
+                * `options.includeNonInteractive`.
                 *
-                * @param x
-                * @param y
-                * @param options {@link TGetPolygonsAtCoordinateOptions}
-                * @returns MappedinPolygon[]
+                * ```ts
+                * const polygons = mapView.getPolygonsAtScreenCoordinate(100, 100);
+                * ```
+                *
+                * @param x The x value of a screen coordinate
+                * @param y The y value of a screen coordinate
+                * @param options
+                * @returns An array of {@link MappedinPolygon} instances intersecting the given coordinate.
                 */
             getPolygonsAtScreenCoordinate(x: number, y: number, options?: TGetPolygonsAtCoordinateOptions): MappedinPolygon[];
             /**
-                * Destroy instance and reclaim memory. Note: this does not destroy the instance of {@link Mappedin}
-                * that was passed in. For applications that require destroying and re-creating the mapView, it is
-                * recommended to keep the {@link Mappedin} object around.
+                * Destroy the mapView instance and reclaim memory.
+                *
+                * NOTE: this does not destroy the instance of {@link Mappedin} that was passed in. For applications that
+                * require destroying and re-creating the mapView, it is recommended to keep the {@link Mappedin} object
+                * around.
+                *
+                * ```ts
+                * mapView.destroy();
+                * ```
                 */
             destroy(): void;
     }
 }
 
 declare module '@mappedin/mappedin-js/get-venue' {
-    import type { TGetVenueOptions } from '@mappedin/mappedin-js/get-venue/Mappedin.types';
+    import type { TGetVenueOptions, TVenueMetadata } from '@mappedin/mappedin-js/get-venue/Mappedin.types';
     import { Mappedin } from '@mappedin/mappedin-js/get-venue/Mappedin';
-    export { E_SDK_LOG_LEVEL, setLoggerLevel } from '@mappedin/mappedin-js/--/common/Mappedin.Logger';
     /**
         * This is how we can avoid bundling in node-fetch (via isomorphic fetch),
         * which keeps popping up in security advisories
@@ -498,6 +699,7 @@ declare module '@mappedin/mappedin-js/get-venue' {
         * Get Venue Data for a Mappedin Venue
         */
     export function getVenue(userOptions: TGetVenueOptions): Promise<Mappedin>;
+    export function getVenueMetadata(userOptions: TGetVenueOptions): Promise<TVenueMetadata>;
     /**
         * @internal
         */
@@ -836,6 +1038,9 @@ declare module '@mappedin/mappedin-js/renderer/MapView.types' {
             location?: MappedinLocation;
     };
     export type TMarkerTemplateFn = ({ icon, location }: TMarkerTemplateProps) => string;
+    /**
+        * Configure the behaviour of a {@link Journey}.
+        */
     export type TJourneyOptions = {
             /**
                 * What color to highlight departure and destination polygons
@@ -1120,6 +1325,9 @@ declare module '@mappedin/mappedin-js/renderer/MapView.types' {
             onWebGLContextRestored?: () => void;
             onWebGLRendererError?: () => void;
     };
+    /**
+        * Control how a flat label looks
+        */
     export type TFlatLabelOptions = {
             text: string;
             /**
@@ -1148,6 +1356,9 @@ declare module '@mappedin/mappedin-js/renderer/MapView.types' {
                     align: 'left' | 'right' | 'center';
             };
     };
+    /**
+        * Control how a flat label looks
+        */
     export type TFlatLabelAppearance = {
             /**
                 * By default this is the upper bounds of the Polygon. If you don't have a Polygon, or want a custom height for some reason, you can set this.
@@ -1253,6 +1464,9 @@ declare module '@mappedin/mappedin-js/renderer/MapView.types' {
     };
     /**
         * @deprecated
+        *
+        * Use {@link FlatLabels.add} or {@link FloatingLabels.add} to get more fine tuned control when labelling
+        * all locations.
         */
     export type TLabelAllLocationFlatLabelOptions = TLabelAllLocationCommonOptions & {
             /**
@@ -1262,10 +1476,16 @@ declare module '@mappedin/mappedin-js/renderer/MapView.types' {
             flatLabels: true;
             appearance?: TFlatLabelAppearance;
     };
+    /**
+        * Options for controlling bulk location labelling
+        */
     export type TFloatingLabelAllLocationsOptions = TLabelAllLocationCommonOptions & {
             appearance?: TFloatingLabelAppearance;
             interactive?: boolean;
     };
+    /**
+        * Options for controlling bulk location labelling
+        */
     export type TFlatLabelAllLocationsOptions = TLabelAllLocationCommonOptions & {
             appearance?: TFlatLabelAppearance;
     };
@@ -1309,6 +1529,9 @@ declare module '@mappedin/mappedin-js/renderer/MapView.types' {
                 */
             paths?: Path[];
     };
+    /**
+        * Arguments that get passed to listeners of an {@link E_SDK_EVENT}.
+        */
     export type E_SDK_EVENT_PAYLOAD = {
             [E_SDK_EVENT.CLICK]: TMapClickEvent;
             [E_SDK_EVENT.STATE_CHANGE]: STATE;
@@ -1316,6 +1539,9 @@ declare module '@mappedin/mappedin-js/renderer/MapView.types' {
             [E_SDK_EVENT.NOTHING_CLICKED]: undefined;
             [E_SDK_EVENT.MAP_CHANGED]: MappedinMap;
     };
+    /**
+        * Arguments that get passed to listeners of an {@link E_BLUEDOT_EVENT}.
+        */
     export type E_BLUEDOT_EVENT_PAYLOAD = {
             /**
                 * Emitted when the BlueDot position updates
@@ -1327,7 +1553,7 @@ declare module '@mappedin/mappedin-js/renderer/MapView.types' {
             [E_BLUEDOT_EVENT.STATE_CHANGE]: TBlueDotStateChange;
     };
     /**
-        * @enum
+        * Arguments that get passed to listeners of an {@link E_CAMERA_EVENT}.
         */
     export type CAMERA_EVENT_PAYLOAD = {
             [E_CAMERA_EVENT.USER_INTERACTION_START]: void;
@@ -1408,7 +1634,7 @@ declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.Marker' {
 
 declare module '@mappedin/mappedin-js/renderer/private/controllers/MarkersController' {
     import { MappedinCoordinate, MappedinNode } from '@mappedin/mappedin-js/get-venue';
-    import type { ICore, TCreateMarkerOptions, TAnimationOptions } from '@mappedin/mappedin-js/renderer/internal';
+    import { ICore, TCreateMarkerOptions, TAnimationOptions } from '@mappedin/mappedin-js/renderer/internal';
     import { InternalMarker } from '@mappedin/mappedin-js/renderer/internal';
     import TWEEN from '@tweenjs/tween.js';
     /**
@@ -1614,34 +1840,93 @@ declare module '@mappedin/mappedin-js/renderer/public/api/FlatLabels' {
     import { MappedinPolygon } from '@mappedin/mappedin-js/get-venue';
     import FlatLabelsController from '@mappedin/mappedin-js/renderer/private/controllers/FlatLabelsController';
     import { TFlatLabelAllLocationsOptions, TAddFlatLabelOptions, TFlatLabelAppearance } from '@mappedin/mappedin-js/renderer/MapView.types';
+    /**
+        * API to add and remove flat labels on the map.
+        */
     export interface IFlatLabels<T = void> {
             /**
-                * Adds a flat label to the polygons associated with all locations on the venue.
+                * Add a flat label to the polygons associated with all locations on the venue.
                 * The text is automatically determined based on location data.
+                *
+                * ```ts
+                * // Draw red labels on all polygons with a location
+                * mapView.FlatLabels.labelAllLocations({
+                * 	appearance: {
+                * 		color: 'red',
+                * 	}
+                * });
+                * ```
+                * @param options
                 */
             labelAllLocations(options?: TFlatLabelAllLocationsOptions): T;
             /**
-                * Adds a flat label to a single polygon.
+                * Add a flat label to a single polygon.
+                *
+                * ```ts
+                * // Label the apple store with the label "Apple Store"
+                * const location = mapView.venue.locations.find((l) => l.name === "Apple")!;
+                * mapView.FlatLabels.add(location.polygons[0], "Apple Store");
+                * ```
+                *
+                * @param polygon The {@link MappedinPolygon} to label.
+                * @param text The text to display on the label.
+                * @param options
                 */
             add(polygon: MappedinPolygon, text: string, options?: TAddFlatLabelOptions): T;
             /**
-                * Removes a flat label from a single polygon.
+                * Remove a flat label from a single polygon.
+                *
+                * ```ts
+                * mapView.FlatLabels.add(polygon, "Label");
+                *
+                * ...
+                *
+                * // Remove the label currently on this polygon
+                * mapView.FlatLabels.remove(polygon);
+                * ```
+                *
+                * @param polygon The {@link MappedinPolygon} with a label to remove.
                 */
             remove(polygon: MappedinPolygon): T;
             /**
-                * Removes all flat labels from the venue.
+                * Remove all flat labels from the venue.
+                *
+                * ```ts
+                * mapView.FlatLabels.add(polygon1, "Label 1");
+                * mapView.FlatLabels.add(polygon2, "Label 2");
+                *
+                * ...
+                *
+                * // Remove all labels from all polygons
+                * mapView.FlatLabels.removeAll();
+                * ```
                 */
             removeAll(): T;
             /**
-                * Updates the appearance attributes of an already-existing label. If the
+                * Update the appearance attributes of an already-existing label. If the
                 * provided polygon does not have a label already, this is a no-op.
+                *
+                * ```ts
+                * mapView.FlatLabels.setAppearance(polygon, {
+                * 	color: 'blue',
+                * 	font: 'times',
+                * });
+                * ```
+                *
+                * @param polygon The {@link MappedinPolygon} with a label to update.
+                * @param appearance The new {@link TFlatLabelAppearance} settings to apply to the polygon's label.
                 */
             setAppearance(polygon: MappedinPolygon, appearance: TFlatLabelAppearance): T;
             /**
-                * Sets the hover text color for all Flat Labels.
-                * Expects color in hexadecimal string e.g. `#2e2e2e`
+                * Set the hover text color for all Flat Labels. To set hover color for all polygons,
+                * see {@link MapView.setHoverColor}.
+                *
+                * ```ts
+                * // Make all flat labels turn red on hover
+                * mapView.FlatLabels.setHoverColorForAll('#ff0000');
+                * ```
                 *
-                * To set hover color for all polygons, see {@link MapView.setHoverColor}.
+                * @param color A hexidecimal string representing the hover color.
                 */
             setHoverColorForAll(color: string): T;
     }
@@ -1664,37 +1949,117 @@ declare module '@mappedin/mappedin-js/renderer/public/api/FloatingLabels' {
     import { MappedinNode, MappedinPolygon } from '@mappedin/mappedin-js/get-venue';
     import { TAddFloatingLabelOptions, TFloatingLabelAllLocationsOptions, TFloatingLabelAppearance } from '@mappedin/mappedin-js/renderer/MapView.types';
     import FloatingLabelsController from '@mappedin/mappedin-js/renderer/private/controllers/FloatingLabelsController';
+    /**
+        * API to add and remove floating labels on the map.
+        */
     export interface IFloatingLabels<T = void> {
             /**
-                * Adds a floating label to the polygons associated with all locations on the venue.
-                * The text is automatically determined based on location data.
+                * Add a floating label to one entrance node of each polygons associated with all
+                * locations on the venue. The text is automatically determined based on location data.
+                *
+                * ```ts
+                * // Draw red labels with black outlines on an entrance node of all polygons with a location
+                * mapView.FloatingLabels.labelAllLocations({
+                * 	appearance: {
+                * 		text: {
+                * 			foregroundColor: 'red',
+                * 			backgroundColor: 'black',
+                * 		}
+                * 	}
+                * });
+                * ```
+                * @param options
                 */
             labelAllLocations(options?: TFloatingLabelAllLocationsOptions): T;
             /**
-                * Adds a floating label to a single polygon or node.
+                * Add a floating label to a single polygon or node. When labelling a polygon,
+                * all entrance nodes of that polygon receive a label.
+                *
+                * ```ts
+                * // Label the apple store with the label "Apple Store"
+                * const location = mapView.venue.locations.find((l) => l.name === "Apple")!;
+                * mapView.FloatingLabels.add(location.nodes[0], "Apple Store");
+                * ```
+                *
+                * @param polygonOrNode The {@link MappedinPolygon} or {@link MappedinNode} to label.
+                * @param text The text to display on the label.
+                * @param options
                 */
             add(polygonOrNode: MappedinPolygon | MappedinNode, text: string, options?: TAddFloatingLabelOptions): T;
             /**
-                * Updates the appearance of the label of a single polygon or node
+                * Update the appearance attributes of an already-existing label. If the
+                * provided polygon or node does not have a label already, this is a no-op.
+                *
+                * ```ts
+                * mapView.FloatingLabels.setAppearance(node, {
+                * 	text: {
+                * 		size: 25,
+                * 	}
+                * });
+                * ```
+                *
+                * @param polygonOrNode The {@link MappedinPolygon} or {@link MappedinNode} with a label to update.
+                * @param appearance The new {@link TFlatLabelAppearance} settings to apply to the polygon's label.
                 */
             setAppearance(polygonOrNode: MappedinPolygon | MappedinNode, appearance: TFloatingLabelAppearance): T;
             /**
-                * Removes a floating label from a single polygon or node.
+                * Remove a floating label from a single polygon or node.
+                *
+                * ```ts
+                * mapView.FloatingLabels.add(polygon, "Label");
+                *
+                * ...
+                *
+                * // Remove the label currently on this polygon's first entrance
+                * mapView.FloatingLabels.remove(polygon.entrances[0]);
+                * ```
+                *
+                * @param polygonOrNode The {@link MappedinPolygon} or {@link MappedinNode} with a label to remove.
                 */
             remove(polygonOrNode: MappedinPolygon | MappedinNode): T;
             /**
-                * Removes all floating labels from the venue.
+                * Remove all floating labels from the venue.
+                *
+                * ```ts
+                * mapView.FloatingLabels.add(polygon, "Label 1");
+                * mapView.FloatingLabels.add(node, "Label 2");
+                *
+                * ...
+                *
+                * // Remove all labels from all polygons
+                * mapView.FloatingLabels.removeAll();
+                * ```
                 */
             removeAll(): T;
             /**
                 * Updates the priority of an existing floating label (or labels, in the case
                 * of a polygon). This controls whether it is preferred over other labels
                 * during collisions.
+                *
+                * ```ts
+                * // Polygon 1's label should always show above polygon 2's label
+                * mapView.FloatingLabels.setPriority(polygon0, 0);
+                * mapView.FloatingLabels.setPriority(polygon1, 1);
+                * ```
+                *
+                * @param polygonOrNode The {@link MappedinPolygon} or {@link MappedinNode} with a label to update.
                 */
             setPriority(polygonOrNode: MappedinPolygon | MappedinNode, priority: number): T;
             /**
                 * Resets the priority of an existing floating label (or labels, in the case
                 * of a polygon)
+                *
+                * ```ts
+                * mapView.FloatingLabels.setPriority(polygon0, 0);
+                * mapView.FloatingLabels.setPriority(polygon1, 1);
+                *
+                * ...
+                *
+                * // Labels should now behave as they did by default
+                * mapView.FloatingLabels.resetPriority();
+                * ```
+                *
+                * @param polygonOrNode The {@link MappedinPolygon} or {@link MappedinNode} with a label to update.
                 */
             resetPriority(polygonOrNode: MappedinPolygon | MappedinNode): T;
     }
@@ -1717,6 +2082,9 @@ declare module '@mappedin/mappedin-js/renderer/public/api/FloatingLabels' {
 declare module '@mappedin/mappedin-js/renderer/public/api/Camera' {
     import { E_CAMERA_DIRECTION } from '@mappedin/mappedin-js/renderer/MapView.enums';
     import CameraController, { TCameraAnimationOptions, TCameraTargets, TCameraTransform, TFocusOnCameraOptions } from '@mappedin/mappedin-js/renderer/private/controllers/CameraController';
+    /**
+        * API to control and respond to the state of the camera within the scene.
+        */
     export class Camera {
             #private;
             /**
@@ -1932,17 +2300,73 @@ declare module '@mappedin/mappedin-js/renderer/public/api/Camera' {
 
 declare module '@mappedin/mappedin-js/renderer/public/api/BlueDot' {
     import { BlueDotController, TEnableBlueDotOptions } from '@mappedin/mappedin-js/renderer/MapView.types';
+    /**
+        * API to enable and respond to user position updates.
+        */
     export class BlueDot {
             #private;
+            /**
+                * @hidden
+                */
             constructor(controller: BlueDotController);
+            /**
+                * Subscribe a function to be called when an {@link E_BLUEDOT_EVENT} is fired.
+                *
+                * ```ts
+                * const blueDotChangeHandler = ({ map, nearestNode, position, bearing }) => {
+                * 	// Do something with the new values
+                * };
+                * mapView.BlueDot.on(E_BLUEDOT_EVENT.POSITION_UPDATE, blueDotChangeHandler);
+                * ```
+                *
+                * @param eventName An {@link E_BLUEDOT_EVENT} that is fired when the blue dot changes.
+                * @param fn A callback that gets called when the corresponding event is fired. The
+                * callback will get passed an argument with a type that's one of {@link E_BLUEDOT_EVENT_PAYLOAD}.
+                */
             on: BlueDotController['on'];
+            /**
+                * Unsubscribe a function that was previously subscribed with {@link on}.
+                *
+                * ```ts
+                * mapView.BlueDot.on(E_BLUEDOT_EVENT.POSITION_UPDATE, blueDotChangeHandler);
+                *
+                * ...
+                *
+                * // Something changed and I no longer want this event to fire
+                * mapView.BlueDot.off(E_BLUEDOT_EVENT.POSITION_UPDATE, blueDotChangeHandler);
+                * ```
+                *
+                * @param eventName An {@link E_BLUEDOT_EVENT} that is fired when the blue dot changes.
+                * @param fn A function that was previously passed to {@link on}. The function must
+                * have the same reference as the function that was subscribed.
+                */
             off: BlueDotController['off'];
             /**
-                * Enables Blue Dot. BlueDot then emits {@link TBlueDotStateChange} and {@link TBlueDotPositionUpdate} events via {@link E_BLUEDOT_EVENT}
+                * Enables Blue Dot. A blue dot will appear on the map that responds to the device's geolocation
+                * updates. It then emits {@link TBlueDotStateChange} and {@link TBlueDotPositionUpdate} events
+                * via {@link E_BLUEDOT_EVENT}.
+                *
+                * ```ts
+                * // Enable blue dot
+                * mapView.BlueDot.enable();
+                *
+                * // Disable blue dot
+                * mapView.BlueDot.disable();
+                * ```
+                *
+                * @param options
                 */
             enable(options?: TEnableBlueDotOptions): void;
             /**
-                * Disables Blue Dot and stops emitting events.
+                * Disables Blue Dot that was enabled with {@link enable} and stops emitting events.
+                *
+                * ```ts
+                * // Enable blue dot
+                * mapView.BlueDot.enable();
+                *
+                * // Disable blue dot
+                * mapView.BlueDot.disable();
+                * ```
                 */
             disable(): void;
     }
@@ -1953,38 +2377,95 @@ declare module '@mappedin/mappedin-js/renderer/public/api/Markers' {
     import { MappedinCoordinate, MappedinNode } from '@mappedin/mappedin-js/get-venue';
     import { TCreateMarkerOptions } from '@mappedin/mappedin-js/renderer/index.rn';
     import MarkersController, { Marker } from '@mappedin/mappedin-js/renderer/private/controllers/MarkersController';
+    /**
+        * API to control adding 2D markers to the scene.
+        */
     export class Markers {
             #private;
+            /**
+                * @hidden
+                */
             constructor(markersController: MarkersController);
+            /**
+                * An array of {@link Marker} instances that currently exist.
+                */
             get markers(): Marker[];
             /**
-                * Create a new Marker, containing some HTML, at the specified position
-                * @param nodeOrCoordinate the position for the Marker
-                * @param contentHtml the content to show in the Marker
-                * @param options options for the display of the Marker
-                * @returns the Marker object that was created.
+                * Create a new {@link Marker}, containing some HTML, at the specified position.
+                *
+                * ```ts
+                * mapView.Markers.add(coordinate, `
+                * 	<div
+                * 		id="my-marker"
+                * 		style="width:100px;height:40px;background:red;"
+                * 	>
+                * 		My Marker
+                * 	</div>
+                * `);
+                * ```
+                *
+                * @param nodeOrCoordinate The {@link MappedinNode} or {@link MappedinCoordinate} to
+                * which the marker is pinned.
+                * @param contentHtml Stringified HTML content to render inside the Marker.
+                * @param options
+                * @returns The {@link Marker} object that was created.
                 */
             add(nodeOrCoordinate: MappedinNode | MappedinCoordinate, contentHtml: string, options?: TCreateMarkerOptions): Marker;
             /**
-                * Moves a Marker to a new position instantaneously.
-                * @param markerOrMarkerId the Marker to move
-                * @param target the new position for this Marker
+                * Moves an existing {@link Marker} to a new position instantaneously. See
+                * also {@link animate}.
+                *
+                * ```ts
+                * const marker = mapView.Markers.add(...);
+                *
+                * // Move the marker to a new coordinate
+                * mapView.Markers.setPosition(marker, newCoordinate);
+                * ```
+                *
+                * @param markerOrMarkerId The {@link Marker} to move.
+                * @param target The {@link MappedinNode} or {@link MappedinCoordinate} to
+                * which the marker should be moved.
                 */
             setPosition(markerOrMarkerId: Marker | Marker['id'], target: MappedinNode | MappedinCoordinate): void;
             /**
-                * Moves a Marker to a new position over time.
-                * @param markerOrMarkerId the Marker to move
-                * @param target the new position for this Marker
-                * @param options the options for how this movement should be animated
+                * Moves an existing {@link Marker} to a new position smoothly over time.
+                *
+                * ```ts
+                * const marker = mapView.Markers.add(...);
+                *
+                * // Animate the marker to a new coordinate over 500ms
+                * mapView.Markers.animate(marker, newCoordinate, {
+                * 	duration: 500
+                * });
+                * ```
+                *
+                * @param markerOrMarkerId The {@link Marker} to move.
+                * @param target The {@link MappedinNode} or {@link MappedinCoordinate} to
+                * which the marker should be moved.
+                * @param options
                 */
             animate(markerOrMarkerId: Marker | Marker['id'], target: MappedinCoordinate | MappedinNode, options?: TAnimationOptions): Promise<void>;
             /**
-                * Removes a Marker.
-                * @param markerOrMarkerId the Marker to be removed
+                * Removes an existing {@link Marker}.
+                *
+                * ```ts
+                * const marker = mapView.Markers.add(...);
+                *
+                * ...
+                *
+                * // The marker is no longer needed
+                * mapView.Markers.remove(marker);
+                * ```
+                *
+                * @param markerOrMarkerId the {@link Marker} to be removed.
                 */
             remove(markerOrMarkerId: Marker | Marker['id']): void;
             /**
-                * Remove all Markers from all maps.
+                * Remove all {@link Marker} instances from all maps.
+                *
+                * ```ts
+                * mapView.Markers.removeAll();
+                * ```
                 */
             removeAll(): void;
     }
@@ -1995,35 +2476,140 @@ declare module '@mappedin/mappedin-js/renderer/public/api/Paths' {
     import { TPathOptions } from '@mappedin/mappedin-js/renderer/index.rn';
     import PathsController, { Path } from '@mappedin/mappedin-js/renderer/private/controllers/PathsController';
     /**
-        * Add and remove paths from maps.
+        * API to add and remove paths from maps. See also {@link Journey}.
         */
     export class Paths {
             #private;
+            /**
+                * @hidden
+                */
             constructor(pathsController: PathsController);
             /**
-                * An array of all paths that are currently drawn.
+                * An array of all {@link Path} instances that are currently drawn.
                 */
             get paths(): Path[];
             /**
-                * Takes an array of nodes and draws path segments on each map for the nodes on that map.
+                * Takes an array of {@link MappedinNode} instances and draws an {@link Path} with
+                * path segments on each map corresponding to the nodes on that map.
+                *
+                * ```ts
+                * const departure = mapView.venue.locations.find((l) => l.name === "Apple")!;
+                * const destination = mapView.venue.locations.find((l) => l.name === "Cleo")!;
+                * const directions = departure.directionsTo(destination);
+                *
+                * // Draw the above directions as a path on the map
+                * mapView.Paths.add(directions.path);
+                * ```
                 *
                 * @param nodes A {@link MappedinNode} array, probably from a {@link MappedinDirections} instance.
-                * @param options A optional {@link TPathOptions} object.
+                * @param options
                 */
             add(nodes: MappedinNode[], options?: TPathOptions): Path;
             /**
-                * Remove a path from all maps it exists on.
+                * Remove a {@link Path} from all maps it exists on.
+                *
+                * ```ts
+                * const path = mapView.Paths.add(nodes);
+                *
+                * ...
+                *
+                * // The path is no longer needed
+                * mapView.Paths.remove(path);
+                * ```
                 *
-                * @param path A {@link Path} instance returned from {@link Paths.add}.
+                * @param path The {@link Path} instance to be removed.
                 */
             remove(path: Path): void;
             /**
-                * Remove all paths from all maps.
+                * Remove all {@link Path} instances from all maps.
                 */
             removeAll(): void;
     }
 }
 
+declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.SmartTooltip' {
+    import './Mappedin.SmartTooltip.scss';
+    import { HTMLCollider, COLLISION_RANKING_TIERS } from '@mappedin/mappedin-js/renderer/internal';
+    import type { IHTMLCollider, TColliderStrategy } from '@mappedin/mappedin-js/renderer/internal';
+    import { Vector3 } from 'three';
+    /**
+        *
+        * A Tooltip is an html element that attempts to orient itself around an anchor in 3D space. It will always maintain the same size on the screen, but will attempt to change its orientation based on other colliders in the scene.
+        *
+        * Make your own and add it directly to the map with {{#crossLink "MapView/createTooltip:method"}}{{/crossLink}}, or use the constructor and add it when you want.
+        *
+        * You will need to specify at least `options.position` and one of `options.html` and `options.selector` OR `options.contentHtml`.
+        *
+        *
+        * @class Tooltip
+        *
+        * @constructor
+        * @param options {Object} Passes on options (e.g. html, text, position, map, padding, defaultAnchorType, enabledAnchorTypes, collisionRank) to MapView.Tooltip's options argument.
+        * @param [options.html] Pass in custom html for your marker, if using this method you must also pass in a selector for your content.
+        * @param [options.selector] Used in conjuction with the html property to select the div for repositioning
+        * @param [options.contentHtml] Use mappedin's default tooltip styling with custom inner html content
+        * @param [options.text] Instead of passing html pass in plain text to be displayed in the tooltip
+        * @param [options.position] should be something you got from {{#crossLink "MapView/getPositionPolygon:method"}}{{/crossLink}} or {{#crossLink "MapView/getPositionNode:method"}}{{/crossLink}}.
+        * @param [options.map] The map ID where the tooltip should be displayed
+        * @param [options.defaultAnchorType] The default orientation to place the tooltip.
+        * @param [options.padding] The distance in pixel to offset the tooltip from the anchor point.
+        * @param [options.enabledAnchorTypes] An object used to disable certain anchor positions from being used.
+        * @param [options.collisionRank]  The rank of the object used when comparing colliders to determine which should be shown.
+        */
+    export type TSmartTooltipOptions = {
+            html?: string;
+            contentHtml?: string;
+            text?: string;
+            position: Vector3;
+            selector?: string;
+            map: string;
+            padding?: number;
+            collisionRank?: COLLISION_RANKING_TIERS;
+            defaultAnchorType?: string;
+            enabledAnchorTypes?: {
+                    [type: string]: boolean;
+            };
+    };
+    type TTooltipStyle = {
+            top?: string;
+            left?: string;
+    };
+    /**
+        * An object that defines which anchors are enabled for a tooltip. An anchor is a direction, relative
+        * to a position, where a tooltip may appear. For example, a tooltip with a `right` anchor will appear
+        * to the right of its position.
+        */
+    export type TOOLTIP_ANCHOR = {
+            top?: boolean;
+            left?: boolean;
+            topLeft?: boolean;
+            right?: boolean;
+            topRight?: boolean;
+            bottom?: boolean;
+            bottomLeft?: boolean;
+            bottomRight?: boolean;
+    };
+    class SmartTooltip extends HTMLCollider implements IHTMLCollider {
+            #private;
+            className: string;
+            _el: Element | null;
+            style: TTooltipStyle;
+            constructor(options: TSmartTooltipOptions);
+            updateClassName: (className: any) => void;
+            get strategies(): TColliderStrategy[];
+            colliderDidMount(): void;
+            /**
+                * @internal
+                */
+            updateDimensionsImmediately(): void;
+            setAction(action: any): void;
+            colliderDidNotFindAHome(): void;
+            colliderDidGoOffscreen(): void;
+            colliderDidUpdateVisiblity(): void;
+    }
+    export default SmartTooltip;
+}
+
 declare module '@mappedin/mappedin-js/renderer/MapView.enums' {
     export enum GEOLOCATION_STATUS {
             SUCCESS = 0
@@ -2107,6 +2693,9 @@ declare module '@mappedin/mappedin-js/renderer/MapView.enums' {
                 */
             UNCERTAIN = 3
     }
+    /**
+        * @enum The state of the {@link MapView}.
+        */
     export enum STATE {
             /**
                 * The map is in exploration mode where the user controls the camera position.
@@ -2148,6 +2737,9 @@ declare module '@mappedin/mappedin-js/renderer/MapView.enums' {
                 */
             MAP_CHANGED = "MAP_CHANGED"
     }
+    /**
+        * @enum
+        */
     export enum E_BLUEDOT_EVENT {
             /**
                 * Emitted when the BlueDot position changes
@@ -2477,84 +3069,6 @@ declare module '@mappedin/mappedin-js/renderer/bundle-asset-manager' {
     }
 }
 
-declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.SmartTooltip' {
-    import './Mappedin.SmartTooltip.scss';
-    import { HTMLCollider, COLLISION_RANKING_TIERS } from '@mappedin/mappedin-js/renderer/internal';
-    import type { IHTMLCollider, TColliderStrategy } from '@mappedin/mappedin-js/renderer/internal';
-    import { Vector3 } from 'three';
-    /**
-        *
-        * A Tooltip is an html element that attempts to orient itself around an anchor in 3D space. It will always maintain the same size on the screen, but will attempt to change its orientation based on other colliders in the scene.
-        *
-        * Make your own and add it directly to the map with {{#crossLink "MapView/createTooltip:method"}}{{/crossLink}}, or use the constructor and add it when you want.
-        *
-        * You will need to specify at least `options.position` and one of `options.html` and `options.selector` OR `options.contentHtml`.
-        *
-        *
-        * @class Tooltip
-        *
-        * @constructor
-        * @param options {Object} Passes on options (e.g. html, text, position, map, padding, defaultAnchorType, enabledAnchorTypes, collisionRank) to MapView.Tooltip's options argument.
-        * @param [options.html] Pass in custom html for your marker, if using this method you must also pass in a selector for your content.
-        * @param [options.selector] Used in conjuction with the html property to select the div for repositioning
-        * @param [options.contentHtml] Use mappedin's default tooltip styling with custom inner html content
-        * @param [options.text] Instead of passing html pass in plain text to be displayed in the tooltip
-        * @param [options.position] should be something you got from {{#crossLink "MapView/getPositionPolygon:method"}}{{/crossLink}} or {{#crossLink "MapView/getPositionNode:method"}}{{/crossLink}}.
-        * @param [options.map] The map ID where the tooltip should be displayed
-        * @param [options.defaultAnchorType] The default orientation to place the tooltip.
-        * @param [options.padding] The distance in pixel to offset the tooltip from the anchor point.
-        * @param [options.enabledAnchorTypes] An object used to disable certain anchor positions from being used.
-        * @param [options.collisionRank]  The rank of the object used when comparing colliders to determine which should be shown.
-        */
-    export type TSmartTooltipOptions = {
-            html?: string;
-            contentHtml?: string;
-            text?: string;
-            position: Vector3;
-            selector?: string;
-            map: string;
-            padding?: number;
-            collisionRank?: COLLISION_RANKING_TIERS;
-            defaultAnchorType?: string;
-            enabledAnchorTypes?: {
-                    [type: string]: boolean;
-            };
-    };
-    type TTooltipStyle = {
-            top?: string;
-            left?: string;
-    };
-    export type TOOLTIP_ANCHOR = {
-            top?: boolean;
-            left?: boolean;
-            topLeft?: boolean;
-            right?: boolean;
-            topRight?: boolean;
-            bottom?: boolean;
-            bottomLeft?: boolean;
-            bottomRight?: boolean;
-    };
-    class SmartTooltip extends HTMLCollider implements IHTMLCollider {
-            #private;
-            className: string;
-            _el: Element | null;
-            style: TTooltipStyle;
-            constructor(options: TSmartTooltipOptions);
-            updateClassName: (className: any) => void;
-            get strategies(): TColliderStrategy[];
-            colliderDidMount(): void;
-            /**
-                * @internal
-                */
-            updateDimensionsImmediately(): void;
-            setAction(action: any): void;
-            colliderDidNotFindAHome(): void;
-            colliderDidGoOffscreen(): void;
-            colliderDidUpdateVisiblity(): void;
-    }
-    export default SmartTooltip;
-}
-
 declare module '@mappedin/mappedin-js/renderer/internal/pub-sub.typed' {
     export class PubSub<EVENT_PAYLOAD, EVENT extends keyof EVENT_PAYLOAD> {
             /**
@@ -2582,6 +3096,9 @@ declare module '@mappedin/mappedin-js/renderer/public/api/Journey' {
     import { JourneyController } from '@mappedin/mappedin-js/renderer/private/controllers/JourneyController';
     import { Path } from '@mappedin/mappedin-js/renderer/private/controllers/PathsController';
     import { ICore } from '@mappedin/mappedin-js/renderer/private/Core.interface';
+    /**
+        * API to control drawing a set of directions. See also {@link Paths}.
+        */
     class Journey {
             #private;
             /**
@@ -2591,27 +3108,80 @@ declare module '@mappedin/mappedin-js/renderer/public/api/Journey' {
             /**
                 * Draw a Journey based on directions. Example usage:
                 *
-                * ```typescript
-                * const startLocation = venue.locations.find(location => location.name === "Cleo");
-                * const endLocation = venue.locations.find(location => location.name === "American Eagle");
+                * ```ts
+                * const startLocation = mapView.venue.locations.find(location => location.name === "Cleo");
+                * const endLocation = mapView.venue.locations.find(location => location.name === "American Eagle");
                 *
                 * const directions = startLocation.directionsTo(endLocation);
                 * mapView.Journey.draw(directions);
                 * ```
                 *
-                * Use options to set connection (such as elevators and escalators) HTML tooltip template, departure and destination marker templates, path style and polygon higlight color. If no options are set, sane defaults are used to draw markers, tooltips and polygon highlights.
+                * Use options to set connection (such as elevators and escalators) HTML tooltip template,
+                * departure and destination marker templates, path style and polygon higlight color. If
+                * no options are set, sane defaults are used to draw markers, tooltips and polygon highlights.
+                *
+                * @param directions A single instance or an array of {@link MappedinDirections} used for the Journey.
+                * @param options
                 */
             draw(directions: MappedinDirections | MappedinDirections[], options?: TJourneyOptions): JourneyController;
             /**
-                * Set the step of a multipart Journey
+                * Set the step of a multipart Journey. Requires {@link draw} to have been called with an array
+                * of {@link MappedinDirections}. An active step receives different styling.
+                *
+                * ```ts
+                * // A multi destination set of directions
+                * const departure = mapView.venue.locations.find((l) => l.name === "Apple")!;
+                * const destination1 = mapView.venue.locations.find((l) => l.name === "Cleo")!;
+                * const destination2 = mapView.venue.locations.find((l) => l.name === "KFC")!;
+                * const destinationSet = new MappedinDestinationSet([destination1, destination2]);
+                * const directions = departure.directionsTo(destinationSet);
+                *
+                * // By default step 0 is active, meaning Apple to Cleo
+                * mapView.Journey.draw(directions);
+                *
+                * // Activate the step of the Journey from Cleo to KFC
+                * mapView.Journey.setStep(1);
+                * ```
+                *
+                * @param step The step of the Journey to mark as active.
                 */
             setStep(step: number): void;
             /**
-                * Set the step using a Path object
+                * Set the step using a {@link Path} instance. Requires {@link draw} to have been called with an array
+                * of {@link MappedinDirections}. An active step receives different styling. This is most commonly
+                * used to activate a step when a path has been clicked.
+                *
+                * ```ts
+                * // A multi destination set of directions
+                * const departure = mapView.venue.locations.find((l) => l.name === "Apple")!;
+                * const destination1 = mapView.venue.locations.find((l) => l.name === "Cleo")!;
+                * const destination2 = mapView.venue.locations.find((l) => l.name === "KFC")!;
+                * const destinationSet = new MappedinDestinationSet([destination1, destination2]);
+                * const directions = departure.directionsTo(destinationSet);
+                *
+                * // Make sure that the paths are all interactive
+                * mapView.Journey.draw(directions, {
+                * 	pathOptions: { interactive: true },
+                * 	inactivePathOptions: { interactive: true },
+                * });
+                *
+                * // Listen for a path being clicked
+                * mapView.on(E_SDK_EVENT.CLICK, ({ path }) => {
+                * 	if (path != null) {
+                * 		mapView.Journey.setStepByPath(path);
+                * 	}
+                * });
+                * ```
+                *
+                * @param path A {@link Path} instance that corresponds to a step in the Journey.
                 */
             setStepByPath(path: Path): void;
             /**
-                * Clear the current Journey
+                * Clear the current Journey drawn by {@link draw}.
+                *
+                * ```ts
+                * mapView.Journey.clear();
+                * ```
                 */
             clear(): void;
     }
@@ -2638,6 +3208,7 @@ declare module '@mappedin/mappedin-js/renderer' {
     export type { BlueDot } from '@mappedin/mappedin-js/renderer/public/api/BlueDot';
     export type { Markers } from '@mappedin/mappedin-js/renderer/public/api/Markers';
     export type { Paths } from '@mappedin/mappedin-js/renderer/public/api/Paths';
+    export type { TOOLTIP_ANCHOR } from '@mappedin/mappedin-js/renderer/internal/Mappedin.SmartTooltip';
     export type TMappedinInitializeOutput = {
             mapView: MapView;
             venue: Mappedin;
@@ -2732,6 +3303,7 @@ declare module '@mappedin/mappedin-js/get-venue/Mappedin.types' {
             useDraftData?: boolean;
             platformString?: string;
             emitAnalyticsEvents?: boolean;
+            secure?: boolean;
     };
     export type TGetVenueOptionsInternal = {
             baseUrl?: string;
@@ -2743,6 +3315,13 @@ declare module '@mappedin/mappedin-js/get-venue/Mappedin.types' {
             things?: any;
             headers?: any;
     };
+    export type TVenueMetadata = {
+            languages: {
+                    name: string;
+                    code: string;
+            }[];
+            hasSecureAssets: boolean;
+    };
     export enum MAP_RENDER_MODE {
             /** Each polygon, its geometry and mesh are sent to the GPU every render frame.
                 * This was the default rendering mode before 4.0.17
@@ -3631,6 +4210,11 @@ declare module '@mappedin/mappedin-js/get-venue/MappedinVenue' {
         tzidOverride: string;
         utcOffset: string;
         website: string;
+        secureContentStorage: boolean;
+        languages: {
+            name: string;
+            code: string;
+        }[];
         constructor(mappedin: Mappedin, data: any);
         get metadata(): any;
         set metadata(value: any);
@@ -4460,7 +5044,7 @@ declare module '@mappedin/mappedin-js/renderer/internal' {
     export { labelThemes } from '@mappedin/mappedin-js/renderer/MapView.types';
     export { GEOLOCATION_STATUS, COLLISION_RANKING_TIERS, E_BLUEDOT_STATE_REASON, E_BLUEDOT_STATE, E_BLUEDOT_MARKER_STATE, STATE, MARKER_ANCHOR, E_SDK_EVENT, E_BLUEDOT_EVENT, E_CAMERA_EVENT, E_CAMERA_DIRECTION, SAFE_AREA_INSET_TYPE, CAMERA_EASING_MODE, MAP_RENDER_MODE, ANIMATION_TWEENS, } from '@mappedin/mappedin-js/renderer/MapView.enums';
     export { default as RENDER } from '@mappedin/mappedin-js/renderer/internal/Mappedin.RenderTasks';
-    export { FrameUpdate, TaskScheduler } from '@mappedin/mappedin-js/get-venue/Mappedin.TaskScheduler';
+    export { FrameUpdate, FrameTask, TaskScheduler } from '@mappedin/mappedin-js/get-venue/Mappedin.TaskScheduler';
     export { default as SceneManager } from '@mappedin/mappedin-js/renderer/MapView.SceneManager';
     export { PubSub } from '@mappedin/mappedin-js/renderer/internal/pub-sub.typed';
     export { default as MapObject } from '@mappedin/mappedin-js/renderer/internal/Mappedin.MapObject';
@@ -4475,8 +5059,8 @@ declare module '@mappedin/mappedin-js/renderer/internal' {
             RENDER = 2,
             RENDER_NOW = 3,
             UPDATE_FLIPPABLES = 4,
-            SET_MAP_START = 5,
-            SET_MAP = 6,
+            SET_SCENE_START = 5,
+            SET_SCENE = 6,
             CAMERA_MOVING = 7,
             SET_BLUE_DOT_SIZE_FROM_ZOOM = 8,
             PUBLISH_BLUE_DOT = 9,
@@ -4499,13 +5083,13 @@ declare module '@mappedin/mappedin-js/renderer/internal' {
             USER_HANDS_OFF = 26
     }
     export type INTERNAL_EVENT_PAYLOAD = {
-            [INTERNAL_EVENT.SET_MAP_START]: undefined;
+            [INTERNAL_EVENT.SET_SCENE_START]: undefined;
             [INTERNAL_EVENT.ON_FIRST_MAP_LOADED]: undefined;
             [INTERNAL_EVENT.TEXTURE_LOADED]: Texture;
             [INTERNAL_EVENT.RENDER]: undefined;
             [INTERNAL_EVENT.RENDER_NOW]: undefined;
             [INTERNAL_EVENT.UPDATE_FLIPPABLES]: undefined | boolean;
-            [INTERNAL_EVENT.SET_MAP]: undefined;
+            [INTERNAL_EVENT.SET_SCENE]: undefined;
             [INTERNAL_EVENT.CAMERA_MOVING]: any;
             [INTERNAL_EVENT.SET_BLUE_DOT_SIZE_FROM_ZOOM]: number;
             [INTERNAL_EVENT.PUBLISH_BLUE_DOT]: undefined;
@@ -4622,6 +5206,9 @@ declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.FloatingLabel'
             getCachedSymbol: (orientation: string, textAlign: TEXTALIGN, xCoordinate: number) => HTMLCanvasElement | OffscreenCanvas;
             draw: (context: CanvasRenderingContext2D) => void;
     }
+    /**
+        * Control how a floating label looks
+        */
     export type TFloatingLabelAppearance = {
             /**
                 * Margin around the label and marker. This will affect label density, with a mininum of 7px around
@@ -4967,7 +5554,7 @@ declare module '@mappedin/mappedin-js/navigator/Directive' {
 }
 
 declare module '@mappedin/mappedin-js/renderer/private/controllers/FlatLabelsController' {
-    import type { TAddFlatLabelOptions, TFlatLabelAllLocationsOptions, TFlatLabelAppearance, ICore } from '@mappedin/mappedin-js/renderer/internal';
+    import { TAddFlatLabelOptions, TFlatLabelAllLocationsOptions, TFlatLabelAppearance, ICore } from '@mappedin/mappedin-js/renderer/internal';
     import { FlatLabel } from '@mappedin/mappedin-js/renderer/internal';
     import { MappedinPolygon } from '@mappedin/mappedin-js/get-venue';
     export type FlatLabelRenderObject = TAddFlatLabelOptions & {
@@ -5281,6 +5868,7 @@ declare module '@mappedin/mappedin-js/renderer/private/Core.interface' {
             cameraParameters: Vector2;
             resolution: Vector2;
             determineNewLabelSize: any;
+            visibleMapsInCurrentScene: MappedinMap[];
             on<EVENT_NAME extends keyof INTERNAL_EVENT_PAYLOAD>(eventName: EVENT_NAME, fn: (payload: INTERNAL_EVENT_PAYLOAD[EVENT_NAME] extends {
                     data: null;
             } ? INTERNAL_EVENT_PAYLOAD[EVENT_NAME]['data'] : INTERNAL_EVENT_PAYLOAD[EVENT_NAME]) => void): void;
@@ -5602,12 +6190,12 @@ declare module '@mappedin/mappedin-js/get-venue/Mappedin.TaskScheduler' {
                 *		Arbitrary data that you can store along with this task.
                 */
             constructor(options: {
-                    userdata: Record<string, any>;
-                    priority: number;
+                    userdata?: Record<string, any>;
+                    priority?: number;
                     group?: FrameTaskGroup;
-                    postponeOnAdd: number | boolean;
+                    postponeOnAdd?: number | boolean;
                     name: string;
-                    lastFrameTime: number;
+                    lastFrameTime?: number;
                     callback: (...args: any[]) => any;
             });
             _postponed: number | boolean;
@@ -6115,6 +6703,7 @@ declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.MapObject' {
             _loaderPromise: null;
             _promiseResolve: null;
             hoverableMeshChildren: any[];
+            visible: boolean;
             objectsDictionary: {};
             north: null;
             mapScale: null;
@@ -6185,7 +6774,6 @@ declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.MapObject' {
             getMapScale(): null;
             getNorth(): null;
             disableAllImageFlipping(): void;
-            get visible(): boolean;
             /**
                 * Return true if this map has been loaded to the point where it can be
                 * manipulated as a complete object. In synchronous mode, this requires all
@@ -7215,7 +7803,7 @@ declare module '@mappedin/mappedin-js/renderer/private/controllers/PolygonIntera
 }
 
 declare module '@mappedin/mappedin-js/renderer/private/controllers/TooltipsController' {
-    import type { ICore, TCreateTooltipCommonOptions, TCreateTooltipOptions } from '@mappedin/mappedin-js/renderer/internal';
+    import { ICore, TCreateTooltipCommonOptions, TCreateTooltipOptions } from '@mappedin/mappedin-js/renderer/internal';
     import { MappedinNode, MappedinCoordinate } from '@mappedin/mappedin-js/get-venue';
     import { SmartTooltip } from '@mappedin/mappedin-js/renderer/internal';
     class TooltipsController {
@@ -7508,8 +8096,8 @@ declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.BinaryAssetMana
 declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.SmartCollisionEngine' {
     import './Mappedin.SmartCollisionEngine.scss';
     import { ICollider, TRange, TColliderPosition } from '@mappedin/mappedin-js/renderer/internal/Mappedin.SmartCollider';
-    import { MappedinMap } from '@mappedin/mappedin-js/renderer';
-    import { ICore } from '@mappedin/mappedin-js/renderer/private/Core.interface';
+    import { MappedinMap } from '@mappedin/mappedin-js/get-venue';
+    import type { ICore } from '@mappedin/mappedin-js/renderer/internal';
     import { Rectangle, QuadTree } from '@mappedin/mappedin-js/renderer/internal/quad-tree';
     export const COLLIDER_STRATEGY_LOW_PRIORITY = "LOW_PRIORITY";
     class SmartCollisionEngine {
@@ -10470,6 +11058,10 @@ declare module '@mappedin/mappedin-js/renderer/private/Core' {
             currentScale: number;
             rendererDomElement: HTMLCanvasElement;
             resolutionScale: number;
+            /**
+                * Get all maps that are "visible" in the scene.
+                */
+            get visibleMapsInCurrentScene(): any[];
             constructor(container: HTMLDivElement, venue: IMappedin, options: (TMapViewOptions & {
                     onDataLoaded?: ((data: IMappedin) => void) | undefined;
                     onFirstMapLoaded?: ((data: IMappedin) => void) | undefined;