isard 1.1.0 → 1.2.0

package/dist/react/Viewshed.js

@@ -0,0 +1,28 @@
+/** `<Viewshed>`: an observer's viewshed, several drawn together */
+import { useContext, useEffect, useMemo } from 'react';
+import { MapContext } from "./context.js";
+/** An observer's viewshed; several `<Viewshed>` are drawn together */
+export const Viewshed = (props) => {
+    const binding = useContext(MapContext);
+    const key = useMemo(() => ({}), []);
+    // Numbers, strings and the position: compared by value
+    const options = JSON.stringify(props);
+    // Its observer taken off the map's viewsheds when unmounted
+    useEffect(() => {
+        if (!binding)
+            return;
+        return () => {
+            binding.viewsheds.delete(key);
+            binding.applyViewsheds();
+        };
+    }, [binding, key]);
+    // Its observer set among the map's viewsheds when its options change (compared by value)
+    useEffect(() => {
+        if (!binding)
+            return;
+        binding.viewsheds.set(key, JSON.parse(options));
+        binding.applyViewsheds();
+    }, [binding, key, options]);
+    return null;
+};
+//# sourceMappingURL=Viewshed.js.map

package/dist/react/Viewshed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Viewshed.js","sourceRoot":"","sources":["../../src/react/Viewshed.tsx"],"names":[],"mappings":"AAAA,mEAAmE;AAEnE,OAAO,EAAkB,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,sEAAsE;AACtE,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAsB,EAAa,EAAE;IAC5D,MAAM,OAAO,GAAG,UAAU,CAAC,UAAU,CAAC,CAAC;IACvC,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;IACpC,uDAAuD;IACvD,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;IAEtC,4DAA4D;IAC5D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;YAC9B,OAAO,CAAC,cAAc,EAAE,CAAC;QAC3B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC;IAEnB,yFAAyF;IACzF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO;YAAE,OAAO;QACrB,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAoB,CAAC,CAAC;QACnE,OAAO,CAAC,cAAc,EAAE,CAAC;IAC3B,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,EAAE,OAAO,CAAC,CAAC,CAAC;IAE5B,OAAO,IAAI,CAAC;AACd,CAAC,CAAC","sourcesContent":["/** `<Viewshed>`: an observer's viewshed, several drawn together */\n\nimport { type ReactNode, useContext, useEffect, useMemo } from 'react';\nimport type { ViewshedOptions } from '../types.ts';\nimport { MapContext } from './context.ts';\n\n/** An observer's viewshed; several `<Viewshed>` are drawn together */\nexport const Viewshed = (props: ViewshedOptions): ReactNode => {\n  const binding = useContext(MapContext);\n  const key = useMemo(() => ({}), []);\n  // Numbers, strings and the position: compared by value\n  const options = JSON.stringify(props);\n\n  // Its observer taken off the map's viewsheds when unmounted\n  useEffect(() => {\n    if (!binding) return;\n\n    return () => {\n      binding.viewsheds.delete(key);\n      binding.applyViewsheds();\n    };\n  }, [binding, key]);\n\n  // Its observer set among the map's viewsheds when its options change (compared by value)\n  useEffect(() => {\n    if (!binding) return;\n    binding.viewsheds.set(key, JSON.parse(options) as ViewshedOptions);\n    binding.applyViewsheds();\n  }, [binding, key, options]);\n\n  return null;\n};\n"]}

package/dist/react/context.d.ts

@@ -0,0 +1,32 @@
+/** What the components of a map share: the map, the order of their layers, the viewsheds, the swipe and the marker
+ * around; the hooks */
+import type { LayerOrder } from '../bind/layers.ts';
+import type { Layer as LayerHandle } from '../layers/layers.ts';
+import type { GeoMap } from '../map.ts';
+import type { LonLat, MapEvents, ViewshedOptions } from '../types.ts';
+import type { Marker as MarkerHandle } from '../ui/overlay.ts';
+export interface Binding {
+    map: GeoMap;
+    order: LayerOrder;
+    /** The observers of the `<Viewshed>` components, set on the map together */
+    viewsheds: Map<object, ViewshedOptions>;
+    applyViewsheds(): void;
+}
+export declare const MapContext: import("react").Context<Binding | undefined>;
+/** The layers of a `<Swipe>` around, its `<Layer>` children joining it */
+export interface SwipeGroup {
+    set(layer: LayerHandle): void;
+    unset(layer: LayerHandle): void;
+}
+export declare const SwipeContext: import("react").Context<SwipeGroup | undefined>;
+/** The marker of a `<Marker>` around and its position (a `<Popup>` in it opens on its click, at that position) */
+export declare const MarkerContext: import("react").Context<{
+    marker: MarkerHandle;
+    lonLat: LonLat;
+} | undefined>;
+/** The map of the `<IsardMap>` around, once created (undefined before) */
+export declare const useMap: () => GeoMap | undefined;
+/** Listens to an event of the map around while the component is mounted; the listener may change at each render */
+export declare const useMapEvent: <K extends keyof MapEvents>(type: K, listener: (event: MapEvents[K]) => void) => void;
+/** The entries of an object whose value is defined (`exactOptionalPropertyTypes`) */
+export declare const defined: <T extends object>(object: T) => { [K in keyof T]?: Exclude<T[K], undefined>; };

package/dist/react/context.js

@@ -0,0 +1,20 @@
+/** What the components of a map share: the map, the order of their layers, the viewsheds, the swipe and the marker
+ * around; the hooks */
+import { createContext, useContext, useEffect, useRef } from 'react';
+export const MapContext = createContext(undefined);
+export const SwipeContext = createContext(undefined);
+/** The marker of a `<Marker>` around and its position (a `<Popup>` in it opens on its click, at that position) */
+export const MarkerContext = createContext(undefined);
+/** The map of the `<IsardMap>` around, once created (undefined before) */
+export const useMap = () => useContext(MapContext)?.map;
+/** Listens to an event of the map around while the component is mounted; the listener may change at each render */
+export const useMapEvent = (type, listener) => {
+    const map = useMap();
+    const latest = useRef(listener);
+    latest.current = listener;
+    // Listening while mounted, to the listener of the last render; stops when unmounted or the map changes
+    useEffect(() => map?.on(type, (event) => latest.current(event)), [map, type]);
+};
+/** The entries of an object whose value is defined (`exactOptionalPropertyTypes`) */
+export const defined = (object) => Object.fromEntries(Object.entries(object).filter(([, value]) => value !== undefined));
+//# sourceMappingURL=context.js.map

package/dist/react/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sourceRoot":"","sources":["../../src/react/context.ts"],"names":[],"mappings":"AAAA;uBACuB;AAEvB,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAerE,MAAM,CAAC,MAAM,UAAU,GAAG,aAAa,CAAsB,SAAS,CAAC,CAAC;AAQxE,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAyB,SAAS,CAAC,CAAC;AAE7E,kHAAkH;AAClH,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAAuD,SAAS,CAAC,CAAC;AAE5G,0EAA0E;AAC1E,MAAM,CAAC,MAAM,MAAM,GAAG,GAAuB,EAAE,CAAC,UAAU,CAAC,UAAU,CAAC,EAAE,GAAG,CAAC;AAE5E,mHAAmH;AACnH,MAAM,CAAC,MAAM,WAAW,GAAG,CAA4B,IAAO,EAAE,QAAuC,EAAQ,EAAE;IAC/G,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,MAAM,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IAEhC,MAAM,CAAC,OAAO,GAAG,QAAQ,CAAC;IAC1B,uGAAuG;IACvG,SAAS,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC;AAChF,CAAC,CAAC;AAEF,qFAAqF;AACrF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAmB,MAAS,EAAiD,EAAE,CACpG,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,KAAK,KAAK,SAAS,CAAC,CAEnF,CAAC","sourcesContent":["/** What the components of a map share: the map, the order of their layers, the viewsheds, the swipe and the marker\n * around; the hooks */\n\nimport { createContext, useContext, useEffect, useRef } from 'react';\nimport type { LayerOrder } from '../bind/layers.ts';\nimport type { Layer as LayerHandle } from '../layers/layers.ts';\nimport type { GeoMap } from '../map.ts';\nimport type { LonLat, MapEvents, ViewshedOptions } from '../types.ts';\nimport type { Marker as MarkerHandle } from '../ui/overlay.ts';\n\nexport interface Binding {\n  map: GeoMap;\n  order: LayerOrder;\n  /** The observers of the `<Viewshed>` components, set on the map together */\n  viewsheds: Map<object, ViewshedOptions>;\n  applyViewsheds(): void;\n}\n\nexport const MapContext = createContext<Binding | undefined>(undefined);\n\n/** The layers of a `<Swipe>` around, its `<Layer>` children joining it */\nexport interface SwipeGroup {\n  set(layer: LayerHandle): void;\n  unset(layer: LayerHandle): void;\n}\n\nexport const SwipeContext = createContext<SwipeGroup | undefined>(undefined);\n\n/** The marker of a `<Marker>` around and its position (a `<Popup>` in it opens on its click, at that position) */\nexport const MarkerContext = createContext<{ marker: MarkerHandle; lonLat: LonLat } | undefined>(undefined);\n\n/** The map of the `<IsardMap>` around, once created (undefined before) */\nexport const useMap = (): GeoMap | undefined => useContext(MapContext)?.map;\n\n/** Listens to an event of the map around while the component is mounted; the listener may change at each render */\nexport const useMapEvent = <K extends keyof MapEvents>(type: K, listener: (event: MapEvents[K]) => void): void => {\n  const map = useMap();\n  const latest = useRef(listener);\n\n  latest.current = listener;\n  // Listening while mounted, to the listener of the last render; stops when unmounted or the map changes\n  useEffect(() => map?.on(type, (event) => latest.current(event)), [map, type]);\n};\n\n/** The entries of an object whose value is defined (`exactOptionalPropertyTypes`) */\nexport const defined = <T extends object>(object: T): { [K in keyof T]?: Exclude<T[K], undefined> } =>\n  Object.fromEntries(Object.entries(object).filter(([, value]) => value !== undefined)) as {\n    [K in keyof T]?: Exclude<T[K], undefined>;\n  };\n"]}

package/dist/react/index.d.ts

@@ -9,111 +9,18 @@
  * </IsardMap>
  * ```
  */
-import { type CSSProperties, type ReactNode } from 'react';
-import type { Layer as LayerHandle } from '../layers/layers.ts';
-import { GeoMap, type LayerSpec } from '../map.ts';
-import type { GeoMapOptions, LonLat, MapEvents, Point, SwipeOptions, ViewshedOptions } from '../types.ts';
-import { type Anchor, Marker as MarkerHandle, Panel as PanelHandle, type PanelOptions, Popup as PopupHandle, type PopupOptions } from '../ui/overlay.ts';
-import type { Camera } from '../wasm/isard.js';
-/** The map of the `<IsardMap>` around, once created (undefined before) */
-export declare function useMap(): GeoMap | undefined;
-/** Listens to an event of the map around while the component is mounted; the listener may change at each render */
-export declare function useMapEvent<K extends keyof MapEvents>(type: K, listener: (event: MapEvents[K]) => void): void;
-/** The props of the map's events: `onClick` for 'click', `onMoveEnd` for 'moveend'… */
-export interface MapEventProps {
-    onMoveStart?: (camera: Camera) => void;
-    onMove?: (camera: Camera) => void;
-    onMoveEnd?: (camera: Camera) => void;
-    onResize?: (event: MapEvents['resize']) => void;
-    onHover?: (event: MapEvents['hover']) => void;
-    onHoverFeature?: (event: MapEvents['hoverfeature']) => void;
-    onClick?: (event: MapEvents['click']) => void;
-    onRender?: (event: MapEvents['render']) => void;
-    onIdle?: () => void;
-    onLeave?: () => void;
-}
-export interface IsardMapProps extends Omit<GeoMapOptions, keyof Camera>, MapEventProps {
-    /** The camera at creation, then left to the user's gestures */
-    center?: LonLat;
-    zoom?: number;
-    pitch?: number;
-    bearing?: number;
-    /** A camera the map follows: set again whenever it changes (with `onMove` to keep it in a state) */
-    camera?: Partial<Camera>;
-    /** The map, once created */
-    onLoad?: (map: GeoMap) => void;
-    /** The map's creation failed (no WebGL2, the engine not found) */
-    onError?: (error: unknown) => void;
-    id?: string;
-    className?: string;
-    style?: CSSProperties;
-    /** Layers, markers, popups, panels, effects; drawn once the map is created */
-    children?: ReactNode;
-}
-/**
- * A map filling its element (give it a height). Created once mounted, destroyed when unmounted; the options read at
- * creation only (`body`, `preset`, `interactive`, the URLs) need a new `key` to take another value
- */
-export declare const IsardMap: import("react").ForwardRefExoticComponent<IsardMapProps & import("react").RefAttributes<GeoMap | undefined>>;
-export type LayerProps<P = Record<string, unknown>> = LayerSpec<P> & {
-    /** Its place among the layers of the components: from the bottom up, the same order by mounting (default 0) */
-    order?: number;
-    /** The layer, once created and each time it is made anew */
-    onLayer?: (layer: LayerHandle) => void;
-};
-/**
- * A layer: the options of its `add…` method with its `type` (`map.add`). A change of data, style or instances updates
- * it; a change of what is set at creation (its URL, grid, nodes…) makes it anew, in its place. Data, functions and
- * arrays are compared by identity: keep them in a memo or a state. The ref gives the layer's handle
- */
-export declare const Layer: import("react").ForwardRefExoticComponent<LayerProps<Record<string, unknown>> & import("react").RefAttributes<LayerHandle | undefined>>;
-export interface MarkerProps {
-    lonLat: LonLat;
-    /** Metres above the ground, its stem down to `base` (what it stands on: a roof, a mesh) */
-    height?: number;
-    base?: number;
-    draggable?: boolean;
-    offset?: Point;
-    /** Which part of the element sits on the position (default 'bottom' for the pin, 'center' with an icon) */
-    anchor?: Anchor;
-    className?: string;
-    /** The marker's look, in place of the default pin; the element changes with it */
-    icon?: ReactNode;
-    onDragStart?: (lonLat: LonLat) => void;
-    onDrag?: (lonLat: LonLat) => void;
-    onDragEnd?: (lonLat: LonLat) => void;
-    /** A `<Popup>` opened by a click on the marker */
-    children?: ReactNode;
-}
-/** A marker at a position, its look the default pin or the `icon` given */
-export declare function Marker(props: MarkerProps): ReactNode;
-export interface PopupProps extends PopupOptions {
-    /** Its position; in a `<Marker>`, the marker's */
-    lonLat?: LonLat;
-    /** Metres above the ground (in a `<Marker>`, the marker's) */
-    height?: number;
-    /** Open or closed, when the application decides; else open when mounted alone, on the marker's click in a marker */
-    open?: boolean;
-    onOpen?: () => void;
-    /** Closed by its button, a click on the map, or the marker's click */
-    onClose?: () => void;
-    children?: ReactNode;
-}
-/** A popup of JSX content, at a position or on a `<Marker>` */
-export declare function Popup(props: PopupProps): ReactNode;
-export interface PanelProps extends Omit<PanelOptions, 'element'> {
-    lonLat: LonLat;
-    /** What stands in 3D: a video, an iframe, a sign */
-    children?: ReactNode;
-}
-/** JSX standing in 3D at a position, `width` metres wide, facing `heading` */
-export declare function Panel(props: PanelProps): ReactNode;
-/** An observer's viewshed; several `<Viewshed>` are drawn together */
-export declare function Viewshed(props: ViewshedOptions): ReactNode;
-export interface SwipeProps extends Omit<SwipeOptions, 'layers'> {
-    /** The `<Layer>` shown on one side of the line only */
-    children?: ReactNode;
-}
-/** The `<Layer>` in it shown on one side of a vertical line only, at `position` CSS pixels from the left */
-export declare function Swipe(props: SwipeProps): ReactNode;
-export type { Camera, GeoMap, LayerHandle, LayerSpec, LonLat, MarkerHandle, PanelHandle, PopupHandle };
+export type { Layer as LayerHandle } from '../layers/layers.ts';
+export type { GeoMap, LayerSpec } from '../map.ts';
+export type { LonLat } from '../types.ts';
+export type { Marker as MarkerHandle, Panel as PanelHandle, Popup as PopupHandle } from '../ui/overlay.ts';
+export type { Camera } from '../wasm/isard.js';
+export { Control, type ControlProps } from './Control.tsx';
+export { CustomLayer, type CustomLayerProps } from './CustomLayer.tsx';
+export { useMap, useMapEvent } from './context.ts';
+export { IsardMap, type IsardMapProps, type MapEventProps } from './IsardMap.tsx';
+export { Layer, type LayerHandles, type LayerProps, type LayerType } from './Layer.tsx';
+export { Marker, type MarkerProps } from './Marker.tsx';
+export { Panel, type PanelProps } from './Panel.tsx';
+export { Popup, type PopupProps } from './Popup.tsx';
+export { Swipe, type SwipeProps } from './Swipe.tsx';
+export { Viewshed } from './Viewshed.tsx';

package/dist/react/index.js

@@ -9,401 +9,14 @@
  * </IsardMap>
  * ```
  */
-import { createContext, createElement, forwardRef, useContext, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState, } from 'react';
-import { createPortal } from 'react-dom';
-import { applyLayerChange, LayerOrder, layerChange } from "../bind/layers.js";
-import { GeoMap } from "../map.js";
-import { Marker as MarkerHandle, Panel as PanelHandle, Popup as PopupHandle, } from "../ui/overlay.js";
-const MapContext = createContext(undefined);
-/** The map of the `<IsardMap>` around, once created (undefined before) */
-export function useMap() {
-    return useContext(MapContext)?.map;
-}
-/** Listens to an event of the map around while the component is mounted; the listener may change at each render */
-export function useMapEvent(type, listener) {
-    const map = useMap();
-    const latest = useRef(listener);
-    latest.current = listener;
-    useEffect(() => map?.on(type, (event) => latest.current(event)), [map, type]);
-}
-const EVENT_PROPS = {
-    onMoveStart: 'movestart',
-    onMove: 'move',
-    onMoveEnd: 'moveend',
-    onResize: 'resize',
-    onHover: 'hover',
-    onHoverFeature: 'hoverfeature',
-    onClick: 'click',
-    onRender: 'render',
-    onIdle: 'idle',
-    onLeave: 'leave',
-};
-/** Options the map takes again after its creation, and how */
-const LIVE_OPTIONS = {
-    basemap: (map, p) => {
-        if (p.basemap)
-            map.setBasemap(p.basemap, p.hillshade);
-    },
-    hillshade: (map, p) => {
-        if (p.basemap)
-            map.setBasemap(p.basemap, p.hillshade);
-    },
-    terrain: (map, p) => map.setTerrain(p.terrain ?? false),
-    minZoom: (map, p) => map.setMinZoom(p.minZoom ?? 0),
-    maxZoom: (map, p) => map.setMaxZoom(p.maxZoom ?? 22),
-    maxPitch: (map, p) => map.setMaxPitch(p.maxPitch ?? 70),
-    atmosphere: (map, p) => map.setAtmosphere(p.atmosphere),
-    projection: (map, p) => map.setProjection(p.projection ?? 'globe'),
-    loading: (map, p) => map.setLoading(p.loading ?? 'immediate'),
-    sky: (map, p) => map.setSky(p.sky ?? true),
-    background: (map, p) => {
-        if (p.background)
-            map.setBackground(p.background);
-    },
-};
-function sameCamera(a, b) {
-    return ((b.center === undefined || (a.center[0] === b.center[0] && a.center[1] === b.center[1])) &&
-        (b.zoom === undefined || a.zoom === b.zoom) &&
-        (b.pitch === undefined || a.pitch === b.pitch) &&
-        (b.bearing === undefined || a.bearing === b.bearing));
-}
-/**
- * A map filling its element (give it a height). Created once mounted, destroyed when unmounted; the options read at
- * creation only (`body`, `preset`, `interactive`, the URLs) need a new `key` to take another value
- */
-export const IsardMap = forwardRef(function IsardMap(props, ref) {
-    const element = useRef(null);
-    const [binding, setBinding] = useState();
-    const latest = useRef(props);
-    latest.current = props;
-    useImperativeHandle(ref, () => binding?.map, [binding]);
-    useEffect(() => {
-        const container = element.current;
-        if (!container)
-            return;
-        let cancelled = false;
-        let created;
-        const { camera, center, zoom, pitch, bearing, children: _, ...options } = latest.current;
-        GeoMap.create(container, {
-            ...stripProps(options),
-            ...defined({ center, zoom, pitch, bearing }),
-            ...camera,
-        }).then((map) => {
-            // Unmounted while the engine was loading (or StrictMode's second mount): that map is not wanted
-            if (cancelled) {
-                map.destroy();
-                return;
-            }
-            created = map;
-            const viewsheds = new Map();
-            setBinding({
-                map,
-                order: new LayerOrder(),
-                viewsheds,
-                applyViewsheds: () => map.setViewshed(viewsheds.size > 0 ? [...viewsheds.values()] : undefined),
-            });
-            latest.current.onLoad?.(map);
-        }, (error) => {
-            if (cancelled)
-                return;
-            if (latest.current.onError)
-                latest.current.onError(error);
-            else
-                console.error(error);
-        });
-        return () => {
-            cancelled = true;
-            created?.destroy();
-            setBinding(undefined);
-        };
-    }, []);
-    // The events, each listened to once: the props may give another function at each render
-    const map = binding?.map;
-    useEffect(() => {
-        if (!map)
-            return;
-        const offs = Object.entries(EVENT_PROPS).map(([prop, type]) => map.on(type, (event) => latest.current[prop]?.(event)));
-        return () => {
-            for (const off of offs)
-                off();
-        };
-    }, [map]);
-    // The options taken again, compared with what the map was given last
-    const applied = useRef(props);
-    useEffect(() => {
-        if (!map)
-            return;
-        const last = applied.current;
-        applied.current = props;
-        const done = new Set();
-        for (const [key, apply] of Object.entries(LIVE_OPTIONS)) {
-            if (!apply || done.has(apply) || Object.is(last[key], props[key])) {
-                continue;
-            }
-            done.add(apply);
-            apply(map, props);
-        }
-    });
-    const { camera } = props;
-    useEffect(() => {
-        if (map && camera && !sameCamera(map.getCamera(), camera))
-            map.setCamera(camera);
-    }, [map, camera]);
-    return createElement('div', { ref: element, id: props.id, className: props.className, style: props.style }, binding ? createElement(MapContext.Provider, { value: binding }, props.children) : null);
-});
-/** The props that are not options of the map */
-function stripProps(props) {
-    const options = { ...props };
-    for (const key of [...Object.keys(EVENT_PROPS), 'onLoad', 'onError', 'id', 'className', 'style'])
-        delete options[key];
-    return options;
-}
-/** The entries of an object whose value is defined (`exactOptionalPropertyTypes`) */
-function defined(object) {
-    return Object.fromEntries(Object.entries(object).filter(([, value]) => value !== undefined));
-}
-// ── Layers ──
-const SwipeContext = createContext(undefined);
-/**
- * A layer: the options of its `add…` method with its `type` (`map.add`). A change of data, style or instances updates
- * it; a change of what is set at creation (its URL, grid, nodes…) makes it anew, in its place. Data, functions and
- * arrays are compared by identity: keep them in a memo or a state. The ref gives the layer's handle
- */
-export const Layer = forwardRef(function Layer(props, ref) {
-    const binding = useContext(MapContext);
-    const swipe = useContext(SwipeContext);
-    const { order = 0, onLayer, ...spec } = props;
-    const state = useRef(undefined);
-    const [layer, setLayer] = useState();
-    useImperativeHandle(ref, () => layer, [layer]);
-    const latest = useRef({ spec, order, onLayer });
-    latest.current = { spec, order, onLayer };
-    useEffect(() => {
-        if (!binding)
-            return;
-        const { spec, order, onLayer } = latest.current;
-        const created = binding.map.add(spec);
-        binding.order.place(created, order);
-        state.current = { layer: created, spec, order };
-        swipe?.set(created);
-        setLayer(created);
-        onLayer?.(created);
-        return () => {
-            const current = state.current;
-            state.current = undefined;
-            if (!current)
-                return;
-            binding.order.remove(current.layer);
-            swipe?.unset(current.layer);
-            if (binding.map.hasLayer(current.layer))
-                current.layer.remove();
-        };
-    }, [binding, swipe]);
-    useEffect(() => {
-        const current = state.current;
-        if (!binding || !current)
-            return;
-        const next = spec;
-        const change = layerChange(current.spec, next);
-        current.spec = next;
-        if (change?.rebuild) {
-            const old = current.layer;
-            const fresh = binding.map.rebuildLayer(old, next);
-            binding.order.place(fresh, order, old);
-            swipe?.unset(old);
-            swipe?.set(fresh);
-            current.layer = fresh;
-            current.order = order;
-            setLayer(fresh);
-            latest.current.onLayer?.(fresh);
-            return;
-        }
-        if (change)
-            applyLayerChange(current.layer, next, change);
-        if (current.order !== order) {
-            current.order = order;
-            binding.order.place(current.layer, order, current.layer);
-        }
-    });
-    return null;
-});
-// ── Markers, popups, panels ──
-/** The marker of a `<Marker>` around (a `<Popup>` in it opens on its click) */
-const MarkerContext = createContext(undefined);
-/** A marker at a position, its look the default pin or the `icon` given */
-export function Marker(props) {
-    const map = useMap();
-    const custom = props.icon !== undefined;
-    const { anchor, className } = props;
-    const element = useMemo(() => (custom ? document.createElement('div') : undefined), [custom]);
-    const marker = useMemo(() => new MarkerHandle({ ...defined({ anchor, className, element }) }), [anchor, className, element]);
-    const latest = useRef(props);
-    latest.current = props;
-    useEffect(() => {
-        if (!map)
-            return;
-        marker.addTo(map);
-        const offs = [
-            marker.on('dragstart', (e) => latest.current.onDragStart?.(e.lonLat)),
-            marker.on('drag', (e) => latest.current.onDrag?.(e.lonLat)),
-            marker.on('dragend', (e) => latest.current.onDragEnd?.(e.lonLat)),
-        ];
-        return () => {
-            for (const off of offs)
-                off();
-            marker.remove();
-        };
-    }, [map, marker]);
-    const { lonLat, height = 0, base = 0, draggable = false, offset } = props;
-    useLayoutEffect(() => {
-        marker.setLonLat(lonLat);
-    }, [marker, lonLat[0], lonLat[1]]);
-    useLayoutEffect(() => {
-        marker.setHeight(height, base);
-    }, [marker, height, base]);
-    useLayoutEffect(() => {
-        marker.setDraggable(draggable);
-    }, [marker, draggable]);
-    useLayoutEffect(() => {
-        if (offset)
-            marker.setOffset(offset);
-    }, [marker, offset?.[0], offset?.[1]]);
-    return createElement(MarkerContext.Provider, { value: marker }, element ? createPortal(props.icon, element) : null, props.children);
-}
-/** A popup of JSX content, at a position or on a `<Marker>` */
-export function Popup(props) {
-    const map = useMap();
-    const marker = useContext(MarkerContext);
-    const { anchor, closeButton, closeOnClick, maxWidth, className } = props;
-    const content = useMemo(() => document.createElement('div'), []);
-    const popup = useMemo(() => new PopupHandle(defined({ anchor, closeButton, closeOnClick, maxWidth, className })).setDOMContent(content), [anchor, closeButton, closeOnClick, maxWidth, className, content]);
-    const latest = useRef(props);
-    latest.current = props;
-    useEffect(() => {
-        if (!map)
-            return;
-        const offs = [
-            popup.on('open', () => latest.current.onOpen?.()),
-            popup.on('close', () => latest.current.onClose?.()),
-        ];
-        if (marker)
-            marker.setPopup(popup);
-        return () => {
-            for (const off of offs)
-                off();
-            if (marker?.getPopup() === popup)
-                marker.setPopup(undefined);
-            popup.remove();
-        };
-    }, [map, marker, popup]);
-    const { lonLat, height, open, offset } = props;
-    const opened = open ?? !marker;
-    useLayoutEffect(() => {
-        if (offset)
-            popup.setOffset(offset);
-    }, [popup, offset?.[0], offset?.[1]]);
-    useLayoutEffect(() => {
-        if (!map)
-            return;
-        if (lonLat)
-            popup.setLonLat(lonLat);
-        else if (marker)
-            popup.setLonLat(marker.getLonLat());
-        if (height !== undefined)
-            popup.setHeight(height);
-        if (open === undefined && marker)
-            return;
-        if (opened && !popup.isOpen())
-            popup.addTo(map);
-        if (!opened && popup.isOpen())
-            popup.remove();
-    }, [map, marker, popup, lonLat?.[0], lonLat?.[1], height, open, opened]);
-    return createPortal(props.children, content);
-}
-/** JSX standing in 3D at a position, `width` metres wide, facing `heading` */
-export function Panel(props) {
-    const map = useMap();
-    const { className } = props;
-    const element = useMemo(() => document.createElement('div'), []);
-    // The width at creation: the placement is set again by the effect below
-    const initialWidth = useRef(props.width);
-    const panel = useMemo(() => new PanelHandle({ element, width: initialWidth.current, ...defined({ className }) }), [element, className]);
-    useEffect(() => {
-        if (!map)
-            return;
-        panel.addTo(map);
-        return () => {
-            panel.remove();
-        };
-    }, [map, panel]);
-    const { lonLat, width, heading, pitch, height } = props;
-    useLayoutEffect(() => {
-        panel.setLonLat(lonLat);
-    }, [panel, lonLat[0], lonLat[1]]);
-    useLayoutEffect(() => {
-        panel.setPlacement(defined({ width, heading, pitch, height }));
-    }, [panel, width, heading, pitch, height]);
-    // Its content may change its CSS size
-    useLayoutEffect(() => {
-        panel.resize();
-    });
-    return createPortal(props.children, element);
-}
-// ── Effects ──
-/** An observer's viewshed; several `<Viewshed>` are drawn together */
-export function Viewshed(props) {
-    const binding = useContext(MapContext);
-    const key = useMemo(() => ({}), []);
-    useEffect(() => {
-        if (!binding)
-            return;
-        return () => {
-            binding.viewsheds.delete(key);
-            binding.applyViewsheds();
-        };
-    }, [binding, key]);
-    // Numbers, strings and the position: compared by value
-    const options = JSON.stringify(props);
-    useEffect(() => {
-        if (!binding)
-            return;
-        binding.viewsheds.set(key, JSON.parse(options));
-        binding.applyViewsheds();
-    }, [binding, key, options]);
-    return null;
-}
-/** The `<Layer>` in it shown on one side of a vertical line only, at `position` CSS pixels from the left */
-export function Swipe(props) {
-    const map = useMap();
-    const layers = useMemo(() => new Set(), []);
-    const latest = useRef(props);
-    latest.current = props;
-    const group = useMemo(() => {
-        if (!map)
-            return undefined;
-        const apply = () => {
-            const { position, side } = latest.current;
-            map.setSwipe(layers.size > 0 ? { position, layers: [...layers], ...defined({ side }) } : undefined);
-        };
-        return {
-            set: (layer) => {
-                layers.add(layer);
-                apply();
-            },
-            unset: (layer) => {
-                layers.delete(layer);
-                apply();
-            },
-        };
-    }, [map, layers]);
-    const { position, side } = props;
-    useEffect(() => {
-        if (map && layers.size > 0)
-            map.setSwipe({ position, layers: [...layers], ...defined({ side }) });
-    }, [map, layers, position, side]);
-    useEffect(() => () => {
-        map?.setSwipe(undefined);
-    }, [map]);
-    return createElement(SwipeContext.Provider, { value: group }, props.children);
-}
+export { Control } from "./Control.js";
+export { CustomLayer } from "./CustomLayer.js";
+export { useMap, useMapEvent } from "./context.js";
+export { IsardMap } from "./IsardMap.js";
+export { Layer } from "./Layer.js";
+export { Marker } from "./Marker.js";
+export { Panel } from "./Panel.js";
+export { Popup } from "./Popup.js";
+export { Swipe } from "./Swipe.js";
+export { Viewshed } from "./Viewshed.js";
 //# sourceMappingURL=index.js.map