@opengeoweb/webmap-react 10.0.0 → 10.1.0

package/index.esm.js

@@ -1,4 +1,4 @@
-import { legendImageStore, WMImageEventType, webmapUtils, getLegendGraphicURLForLayer, getPixelCoordFromLatLong, WMJSMAP_LONLAT_EPSGCODE, getLatLongFromPixelCoord, LayerType, getWMJSMapById, debugLogger, DebugType, WMLayer, registerWMLayer, tilesettings, WMBBOX, getWMLayerById, WMJSMap } from '@opengeoweb/webmap';
+import { legendImageStore, WMImageEventType, webmapUtils, getLegendGraphicURLForLayer, getPixelCoordFromLatLong, WMJSMAP_LONLAT_EPSGCODE, getLatLongFromPixelCoord, LayerType, getWMJSMapById, debugLogger, DebugType, WMLayer, registerWMLayer, tilesettings, WMBBOX, getWMLayerById, WMJSMap, privateWebMapUtils, generateLayerId } from '@opengeoweb/webmap';
 export { WEBMAP_NAMESPACE, webmapTranslations } from '@opengeoweb/webmap';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
@@ -16,6 +16,7 @@ import { produce } from 'immer';
 import { useResizeDetector } from 'react-resize-detector';
 import Box$1 from '@mui/material/Box';
 import Typography$1 from '@mui/material/Typography';
+import { useQuery } from '@tanstack/react-query';
 
 var en = {
 	"webmap-react-event": "event:",
@@ -8162,9 +8163,11 @@ var DimensionSelectSlider = function DimensionSelectSlider(_ref) {
           value: sliderValue,
           onKeyDown: upDownNavigation,
           onChange: function onChange(e, val) {
-            onChangeDimensionValue(values[val].toString());
-            if (!managedValue) {
-              setCurrentIndex(val);
+            if (typeof val === 'number') {
+              onChangeDimensionValue(values[val].toString());
+              if (!managedValue) {
+                setCurrentIndex(val);
+              }
             }
           }
         })
@@ -8458,7 +8461,12 @@ var LayerInfoDialog = function LayerInfoDialog(_ref) {
     order = _ref$order === void 0 ? 0 : _ref$order,
     _ref$source = _ref.source,
     source = _ref$source === void 0 ? 'app' : _ref$source,
-    dialogHeight = _ref.dialogHeight;
+    dialogHeight = _ref.dialogHeight,
+    _ref$startPosition = _ref.startPosition,
+    startPosition = _ref$startPosition === void 0 ? {
+      top: 150,
+      left: 900
+    } : _ref$startPosition;
   var styles = getLayerStyles(layer);
   var dimensions = getDimensionsList(layer.dimensions);
   var _useWebmapReactTransl = useWebmapReactTranslation(),
@@ -8470,10 +8478,7 @@ var LayerInfoDialog = function LayerInfoDialog(_ref) {
       width: 288,
       height: dialogHeight || 650
     },
-    startPosition: {
-      top: 150,
-      left: 900
-    },
+    startPosition: startPosition,
     title: t('webmap-react-layer-info'),
     isOpen: isOpen,
     onMouseDown: onMouseDown,
@@ -9077,4 +9082,142 @@ var publicLayers = /*#__PURE__*/Object.freeze({
   veiligheidsRegiosGebiedsIndelingenLabels: veiligheidsRegiosGebiedsIndelingenLabels
 });
 
-export { DRAWMODE, DimensionSelectButton, DimensionSelectDialog, DimensionSelectSlider, EDITMODE, EditModeButton as EditModeButtonField, FeatureLayers, GeoJSONTextField, IntersectionSelect, LayerInfoButton, LayerInfoDialog, LayerInfoLegend, LayerInfoList, LayerInfoText, Legend, LegendButton, LegendDialog, LegendLayout, MINUTE_TO_MILLISECOND, MapControlButton, MapControls, MapDimensionSelect, MapDrawContainer, MapTime, MapView, MapViewLayer, MapWarningProperties, NEW_FEATURE_CREATED, NEW_LINESTRING_CREATED, NEW_POINT_CREATED, ORIGIN_REACTMAPVIEW_ONMAPCHANGEDIMENSION, ORIGIN_REACTMAPVIEW_ONUPDATELAYERINFO, Proj4js, radarGetCapabilities_spec as RadarGetCapabilities, ReactMapView, ReactMapViewLayer, SelectField, StoryLayoutGrid, WEBMAP_REACT_NAMESPACE, ZoomControls, addFeatureProperties, addGeoJSONProperties, addSelectionTypeToGeoJSON, addWMLayerPropsBasedOnChildProps, basicExampleDrawOptions, basicExampleMultipleShapeDrawOptions, basicExampleMultipleShapeWithValuesDrawOptions, checkHoverFeatures, convertGeoCoordsToScreenCoords, createInterSections, currentlySupportedDrawModes, defaultBox, defaultDelete, defaultGeoJSONStyleProperties, defaultIntersectionStyleProperties, defaultLayers, defaultModes, defaultPoint, defaultPolygon, defaultTimeFormat, dimensionConfig, distance, drawPolyStoryStyles, emptyGeoJSON, endToolExampleConfig, exampleIntersectionOptions, exampleIntersectionWithShapeOptions, exampleIntersections, exampleIntersectionsMultiDrawTool, featureBox, featureMultiPoint, featurePoint, featurePolygon, fillOptions, findClosestCoords, firSelectionType, formatTime, getCurrentDimensionValue, getDimensionIcon, getDimensionLabel, getDimensionValue, getDimensionsList, getDoubleControlToolIcon, getDrawFunctionFromStore, getFeatureCollection, getFeatureExtent, getFeatureLayers, getFirTitle, getGeoJSONPropertyValue, getGeoJson, getIcon, getIntersectionToolIcon, getIsInsideAcceptanceTime, getLastEmptyFeatureIndex, getLayerBbox, getLayerStyles, getLayerUpdateInfo, getPixelCoordFromGeoCoord, getProj4, getTimeDimension, getToolIcon, intersectPointGeoJSONS, intersectPolygonGeoJSONS, intersectionFeatureBE, intersectionFeatureNL, isAGeoJSONLayer, isAMapLayer, isBetween, isGeoJSONFeatureCreatedByTool, isPointFeatureCollection, lineString, lineStringCollection, makeLayerPropListFromChildren, marksByDimension, moveFeature, opacityOptions, orderLayers, parseWMJSLayer, projectorCache, publicLayers, publicServices, registerDrawFunction, removeWMLayerFromMap, rewindGeometry, setWMLayerPropsBasedOnChildProps, simpleBoxGeoJSON, simpleBoxGeoJSONWrongOrder, simpleFlightRouteLineStringGeoJSON, simpleFlightRoutePointsGeoJSON, simpleGeometryCollectionGeoJSON, simpleLineStringGeoJSON, simpleMultiPolygon, simplePointsGeojson, simplePolygonGeoJSON, simpleSmallLineStringGeoJSON, startToolExampleConfig, strokeWidthOptions, textStyle, textStyleWithMargin, updateEditModeButtonsWithFir, useGeoJSON, useMapDrawTool, webmapReactTranslations };
+var privateWmsGetCapabilities = privateWebMapUtils.privateWmsGetCapabilities,
+  privateGetWMSServiceInfo = privateWebMapUtils.privateGetWMSServiceInfo,
+  privateWmsGetLayerTree = privateWebMapUtils.privateWmsGetLayerTree,
+  privateWmsFlattenLayerTree = privateWebMapUtils.privateWmsFlattenLayerTree,
+  QUERYWMS_GETCAPABILITIES = privateWebMapUtils.QUERYWMS_GETCAPABILITIES;
+/**
+ * Queries the WMS GetCapabilities. This is the base TanStack hook for the other hooks in this file.
+ *
+ * @param {string} serviceUrl
+ * @returns {UseQueryResult<GetCapabilitiesJson>}
+ */
+var useQueryGetWMSGetCapabilities = function useQueryGetWMSGetCapabilities(serviceUrl) {
+  var uriKey = new URLSearchParams(serviceUrl).toString();
+  return useQuery({
+    queryKey: [uriKey, QUERYWMS_GETCAPABILITIES],
+    queryFn: function queryFn() {
+      return privateWmsGetCapabilities(serviceUrl);
+    }
+  });
+};
+/**
+ * Returns details about the WMS service
+ *
+ * @param {string} serviceUrl
+ * @returns {(WMSServiceInfo | null)}
+ */
+var useQueryGetWMSServiceInfo = function useQueryGetWMSServiceInfo(serviceUrl) {
+  var _React$useState = React__default.useState(null),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    serviceInfo = _React$useState2[0],
+    setServiceInfo = _React$useState2[1];
+  var _useQueryGetWMSGetCap = useQueryGetWMSGetCapabilities(serviceUrl),
+    getCapabilitiesJSON = _useQueryGetWMSGetCap.data;
+  React__default.useEffect(function () {
+    if (!getCapabilitiesJSON) {
+      setServiceInfo(null);
+    } else {
+      setServiceInfo(privateGetWMSServiceInfo(getCapabilitiesJSON, serviceUrl));
+    }
+  }, [serviceUrl, getCapabilitiesJSON]);
+  return serviceInfo;
+};
+/**
+ * Gets the layer tree in hierarchical order for a WMS service. Cached by TanStack. Uses the same store as in queryWMSGetCapabilities.
+ *
+ * @param {string} serviceUrl
+ * @returns {(LayerTree | null)}
+ */
+var useQueryGetWMSLayersTree = function useQueryGetWMSLayersTree(serviceUrl) {
+  var _React$useState3 = React__default.useState(null),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    layerTree = _React$useState4[0],
+    setLayerTree = _React$useState4[1];
+  var _useQueryGetWMSGetCap2 = useQueryGetWMSGetCapabilities(serviceUrl),
+    getCapabilitiesJSON = _useQueryGetWMSGetCap2.data;
+  React__default.useEffect(function () {
+    if (!getCapabilitiesJSON) {
+      setLayerTree(null);
+    } else {
+      setLayerTree(privateWmsGetLayerTree(getCapabilitiesJSON));
+    }
+  }, [serviceUrl, getCapabilitiesJSON]);
+  return layerTree;
+};
+/**
+ * Gets the flat layer list (without hierarchy) for a WMS service. Cached by TanStack. Uses the same store as in queryWMSGetCapabilities.
+ *
+ * @param {string} serviceUrl
+ * @returns {LayerProps[]}
+ */
+var useQueryGetWMSLayers = function useQueryGetWMSLayers(serviceUrl) {
+  var _React$useState5 = React__default.useState([]),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    layers = _React$useState6[0],
+    setLayers = _React$useState6[1];
+  var _useQueryGetWMSGetCap3 = useQueryGetWMSGetCapabilities(serviceUrl),
+    getCapabilitiesJSON = _useQueryGetWMSGetCap3.data;
+  React__default.useEffect(function () {
+    if (!getCapabilitiesJSON) {
+      setLayers([]);
+    } else {
+      setLayers(privateWmsFlattenLayerTree(privateWmsGetLayerTree(getCapabilitiesJSON)));
+    }
+  }, [serviceUrl, getCapabilitiesJSON]);
+  return layers;
+};
+/**
+ * Returns specific layer from the WMS service
+ *
+ * @param {string} serviceUrl
+ * @param {string} name
+ * @returns {(LayerProps | null)}
+ */
+var useQueryGetWMSLayer = function useQueryGetWMSLayer(serviceUrl, name) {
+  var _React$useState7 = React__default.useState(null),
+    _React$useState8 = _slicedToArray(_React$useState7, 2),
+    layer = _React$useState8[0],
+    setLayer = _React$useState8[1];
+  var layers = useQueryGetWMSLayers(serviceUrl);
+  React__default.useEffect(function () {
+    setLayer(layers.find(function (l) {
+      return l.name === name;
+    }) || null);
+  }, [layers, name]);
+  return layer;
+};
+/**
+ * Returns WMLayer instance. The layer will contains parsed dimensions and styles and keeps a state for these properties.
+ *
+ * @param {string} serviceUrl
+ * @param {string} name
+ * @returns {(WMLayer | null)}
+ */
+var useGetWMLayerInstance = function useGetWMLayerInstance(serviceUrl, name) {
+  var _React$useState9 = React__default.useState(null),
+    _React$useState10 = _slicedToArray(_React$useState9, 2),
+    layer = _React$useState10[0],
+    setLayer = _React$useState10[1];
+  var layerId = useRef(generateLayerId()).current;
+  React__default.useEffect(function () {
+    var l = getWMLayerById(layerId);
+    if (l) {
+      return;
+    }
+    var wmLayer = new WMLayer({
+      name: name,
+      service: serviceUrl,
+      layerType: LayerType.mapLayer,
+      id: layerId
+    });
+    void wmLayer.parseLayer().then(function () {
+      registerWMLayer(wmLayer, layerId);
+      setLayer(wmLayer);
+    });
+  }, [layerId, name, serviceUrl]);
+  return layer;
+};
+
+export { DRAWMODE, DimensionSelectButton, DimensionSelectDialog, DimensionSelectSlider, EDITMODE, EditModeButton as EditModeButtonField, FeatureLayers, GeoJSONTextField, IntersectionSelect, LayerInfoButton, LayerInfoDialog, LayerInfoLegend, LayerInfoList, LayerInfoText, Legend, LegendButton, LegendDialog, LegendLayout, MINUTE_TO_MILLISECOND, MapControlButton, MapControls, MapDimensionSelect, MapDrawContainer, MapTime, MapView, MapViewLayer, MapWarningProperties, NEW_FEATURE_CREATED, NEW_LINESTRING_CREATED, NEW_POINT_CREATED, ORIGIN_REACTMAPVIEW_ONMAPCHANGEDIMENSION, ORIGIN_REACTMAPVIEW_ONUPDATELAYERINFO, Proj4js, radarGetCapabilities_spec as RadarGetCapabilities, ReactMapView, ReactMapViewLayer, SelectField, StoryLayoutGrid, WEBMAP_REACT_NAMESPACE, ZoomControls, addFeatureProperties, addGeoJSONProperties, addSelectionTypeToGeoJSON, addWMLayerPropsBasedOnChildProps, basicExampleDrawOptions, basicExampleMultipleShapeDrawOptions, basicExampleMultipleShapeWithValuesDrawOptions, checkHoverFeatures, convertGeoCoordsToScreenCoords, createInterSections, currentlySupportedDrawModes, defaultBox, defaultDelete, defaultGeoJSONStyleProperties, defaultIntersectionStyleProperties, defaultLayers, defaultModes, defaultPoint, defaultPolygon, defaultTimeFormat, dimensionConfig, distance, drawPolyStoryStyles, emptyGeoJSON, endToolExampleConfig, exampleIntersectionOptions, exampleIntersectionWithShapeOptions, exampleIntersections, exampleIntersectionsMultiDrawTool, featureBox, featureMultiPoint, featurePoint, featurePolygon, fillOptions, findClosestCoords, firSelectionType, formatTime, getCurrentDimensionValue, getDimensionIcon, getDimensionLabel, getDimensionValue, getDimensionsList, getDoubleControlToolIcon, getDrawFunctionFromStore, getFeatureCollection, getFeatureExtent, getFeatureLayers, getFirTitle, getGeoJSONPropertyValue, getGeoJson, getIcon, getIntersectionToolIcon, getIsInsideAcceptanceTime, getLastEmptyFeatureIndex, getLayerBbox, getLayerStyles, getLayerUpdateInfo, getPixelCoordFromGeoCoord, getProj4, getTimeDimension, getToolIcon, intersectPointGeoJSONS, intersectPolygonGeoJSONS, intersectionFeatureBE, intersectionFeatureNL, isAGeoJSONLayer, isAMapLayer, isBetween, isGeoJSONFeatureCreatedByTool, isPointFeatureCollection, lineString, lineStringCollection, makeLayerPropListFromChildren, marksByDimension, moveFeature, opacityOptions, orderLayers, parseWMJSLayer, projectorCache, publicLayers, publicServices, registerDrawFunction, removeWMLayerFromMap, rewindGeometry, setWMLayerPropsBasedOnChildProps, simpleBoxGeoJSON, simpleBoxGeoJSONWrongOrder, simpleFlightRouteLineStringGeoJSON, simpleFlightRoutePointsGeoJSON, simpleGeometryCollectionGeoJSON, simpleLineStringGeoJSON, simpleMultiPolygon, simplePointsGeojson, simplePolygonGeoJSON, simpleSmallLineStringGeoJSON, startToolExampleConfig, strokeWidthOptions, textStyle, textStyleWithMargin, updateEditModeButtonsWithFir, useGeoJSON, useGetWMLayerInstance, useMapDrawTool, useQueryGetWMSGetCapabilities, useQueryGetWMSLayer, useQueryGetWMSLayers, useQueryGetWMSLayersTree, useQueryGetWMSServiceInfo, webmapReactTranslations };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/webmap-react",
-  "version": "10.0.0",
+  "version": "10.1.0",
   "description": "GeoWeb react wrapper for webmap",
   "license": "Apache-2.0",
   "repository": {

package/src/lib/components/Axis/ProfileAxis.stories.d.ts

@@ -1,9 +1,7 @@
-import * as React from 'react';
-export declare const ProfileAxisStory: {
-    (): React.ReactElement;
-    storyName: string;
-};
-declare const _default: {
-    title: string;
-};
-export default _default;
+import type { Meta, StoryObj } from '@storybook/react';
+import { ProfileAxis } from './ProfileAxis';
+declare const meta: Meta<typeof ProfileAxis>;
+export default meta;
+type Story = StoryObj<typeof ProfileAxis>;
+export declare const Component: Story;
+export declare const ProfileAxisStory: Story;

package/src/lib/components/LayerInfo/LayerInfoDialog.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Source } from '@opengeoweb/shared';
+import { Position, Source } from '@opengeoweb/shared';
 import { LayerProps } from '@opengeoweb/webmap';
 export interface LayerInfoDialogProps {
     layer: LayerProps;
@@ -10,5 +10,6 @@ export interface LayerInfoDialogProps {
     order?: number;
     source?: Source;
     dialogHeight?: number;
+    startPosition?: Position;
 }
 export declare const LayerInfoDialog: React.FC<LayerInfoDialogProps>;

package/src/lib/components/LayerInfo/LayerInfoDialog.stories.d.ts

@@ -1,25 +1,10 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const LayerInfoDialogLight: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const LayerInfoDialogDark: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { LayerInfoDialog } from './LayerInfoDialog';
+declare const meta: Meta<typeof LayerInfoDialog>;
+export default meta;
+type Story = StoryObj<typeof LayerInfoDialog>;
+export declare const Component: Story;
+export declare const LayerInfoDialogLightDoc: Story;
+export declare const LayerInfoDialogLight: Story;
+export declare const LayerInfoDialogDarkDoc: Story;
+export declare const LayerInfoDialogDark: Story;

package/src/lib/components/Legend/Legend.stories.d.ts

@@ -1,8 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const SimpleLegend: () => React.ReactElement;
-export declare const SimpleLegendWithMultiDimensions: () => React.ReactElement;
-export declare const SimpleLegendWithoutDimensionsOrGraphic: () => React.ReactElement;
+import type { Meta, StoryObj } from '@storybook/react';
+import { Legend } from './Legend';
+declare const meta: Meta<typeof Legend>;
+export default meta;
+type Story = StoryObj<typeof Legend>;
+export declare const SimpleLegend: Story;
+export declare const SimpleLegendWithMultiDimensions: Story;
+export declare const SimpleLegendWithoutDimensionsOrGraphic: Story;

package/src/lib/components/MapDimensionSelect/DimensionSelectDialog.stories.d.ts

@@ -1,29 +1,13 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const DimensionSelectElevationLight: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const DimensionSelectElevationDark: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const DimensionSelectEnsembleMemberLight: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const DimensionSelectEnsembleMemberDark: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const DimensionSelectInvalidSyncLight: {
-    (): React.ReactElement;
-    tags: string[];
-};
-export declare const DimensionSelectInvalidSyncDark: {
-    (): React.ReactElement;
-    tags: string[];
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import MapDimensionSelect from './MapDimensionSelect';
+declare const meta: Meta<typeof MapDimensionSelect>;
+export default meta;
+type Story = StoryObj<typeof MapDimensionSelect>;
+export declare const Component: Story;
+export declare const ComponentDark: Story;
+export declare const DimensionSelectElevationLight: Story;
+export declare const DimensionSelectElevationDark: Story;
+export declare const DimensionSelectEnsembleMemberLight: Story;
+export declare const DimensionSelectEnsembleMemberDark: Story;
+export declare const DimensionSelectInvalidSyncLight: Story;
+export declare const DimensionSelectInvalidSyncDark: Story;

package/src/lib/components/MapDimensionSelect/MapDimensionSelect.stories.d.ts

@@ -1,7 +1,10 @@
 import * as React from 'react';
+import type { StoryObj } from '@storybook/react';
+import MapDimensionSelect from './MapDimensionSelect';
 declare const _default: {
     title: string;
     component: React.FC<import("../MapView").MapViewProps>;
 };
 export default _default;
-export declare const MapDimensionOnMap: () => React.ReactElement;
+type Story = StoryObj<typeof MapDimensionSelect>;
+export declare const MapDimensionOnMap: Story;

package/src/lib/components/MapDraw/MapDraw.stories.d.ts

@@ -1,37 +1,13 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const Map1: {
-    (): React.ReactElement;
-    storyName: string;
-};
-export declare const Map2: {
-    (): React.ReactElement;
-    storyName: string;
-};
-export declare const Map3: {
-    (): React.ReactElement;
-    storyName: string;
-};
-export declare const Map4: {
-    (): React.ReactElement;
-    storyName: string;
-};
-export declare const Map5: {
-    (): React.ReactElement;
-    storyName: string;
-};
-export declare const Map6: {
-    (): React.ReactElement;
-    storyName: string;
-};
-export declare const Map7: {
-    (): React.ReactElement;
-    storyName: string;
-};
-export declare const Map8: {
-    (): React.ReactElement;
-    storyName: string;
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapDrawGeoJSON } from './storyComponents/MapDrawGeoJSON';
+declare const meta: Meta<typeof MapDrawGeoJSON>;
+export default meta;
+type Story = StoryObj<typeof MapDrawGeoJSON>;
+export declare const Map1: Story;
+export declare const Map2: Story;
+export declare const Map3: Story;
+export declare const Map4: Story;
+export declare const Map5: Story;
+export declare const Map6: Story;
+export declare const Map7: Story;
+export declare const Map8: Story;

package/src/lib/components/MapDrawTool/MapDrawTool.stories.d.ts

@@ -1,13 +1,9 @@
-import React from 'react';
-import { MapDrawToolOptions } from './useMapDrawTool';
-declare const _default: {
-    title: string;
-};
-export default _default;
-interface BasicMapDrawToolProps {
-    mapDrawOptions: MapDrawToolOptions;
-}
-export declare const BasicMapDrawTool: React.FC<BasicMapDrawToolProps>;
-export declare const BasicMapDrawToolShape: () => React.ReactElement;
-export declare const BasicMapDrawToolWithMultipleShapes: () => React.ReactElement;
-export declare const BasicMapDrawToolWithMultipleShapesValues: () => React.ReactElement;
+import type { Meta, StoryObj } from '@storybook/react';
+import { useMapDrawTool } from './useMapDrawTool';
+declare const meta: Meta<typeof useMapDrawTool>;
+export default meta;
+type Story = StoryObj<typeof useMapDrawTool>;
+export declare const BasicMapDrawTool: Story;
+export declare const BasicMapDrawToolShape: Story;
+export declare const BasicMapDrawToolWithMultipleShapes: Story;
+export declare const BasicMapDrawToolWithMultipleShapesValues: Story;

package/src/lib/components/MapDrawTool/MapDrawToolIntersection.stories.d.ts

@@ -1,11 +1,7 @@
-import React from 'react';
-import { MapDrawToolOptions } from './useMapDrawTool';
-declare const _default: {
-    title: string;
-};
-export default _default;
-interface MapDrawToolIntersectDemoProps {
-    mapDrawOptions: MapDrawToolOptions;
-}
-export declare const IntersectionDemo: React.FC<MapDrawToolIntersectDemoProps>;
-export declare const IntersectionWithShapeDemo: () => React.ReactElement;
+import type { Meta, StoryObj } from '@storybook/react';
+import { useMapDrawTool } from './useMapDrawTool';
+declare const meta: Meta<typeof useMapDrawTool>;
+export default meta;
+type Story = StoryObj<typeof useMapDrawTool>;
+export declare const IntersectionDemo: Story;
+export declare const IntersectionWithShapeDemo: Story;

package/src/lib/components/MapDrawTool/MapDrawToolMultipleDrawTools.stories.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const MultipleDrawToolsDemo: () => React.ReactElement;
+import type { Meta, StoryObj } from '@storybook/react';
+import { useMapDrawTool } from './useMapDrawTool';
+declare const meta: Meta<typeof useMapDrawTool>;
+export default meta;
+type Story = StoryObj<typeof useMapDrawTool>;
+export declare const MultipleDrawToolsDemo: Story;

package/src/lib/components/MapView/MapView.Error.stories.d.ts

@@ -1,14 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MapView").MapViewProps>;
-};
-export default _default;
-export declare const MapError: {
-    (): React.ReactElement;
-    storyName: string;
-};
-export declare const MapWithDuplicateLayerIdsError: {
-    (): React.ReactElement;
-    storyName: string;
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from '.';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
+export declare const Component: Story;
+export declare const MapError: Story;
+export declare const MapWithDuplicateLayerIdsError: Story;

package/src/lib/components/MapView/MapView.MapPin.stories.d.ts

@@ -1,10 +1,6 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MapView").MapViewProps>;
-};
-export default _default;
-export declare const SetMapPin: {
-    (): React.ReactElement;
-    storyName: string;
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from '.';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
+export declare const SetMapPin: Story;

package/src/lib/components/MapView/MapView.Passive.stories.d.ts

@@ -1,10 +1,6 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MapView").MapViewProps>;
-};
-export default _default;
-export declare const PassiveMap: {
-    (): React.ReactElement;
-    storyName: string;
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from '.';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
+export declare const PassiveMap: Story;

package/src/lib/components/MapView/MapView.ProfileSounding.stories.d.ts

@@ -1,9 +1,6 @@
-import * as React from 'react';
-export declare const MapViewProfile: {
-    (): React.ReactElement;
-    storyName: string;
-};
-declare const _default: {
-    title: string;
-};
-export default _default;
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from './MapView';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
+export declare const MapViewProfile: Story;

package/src/lib/components/MapView/MapView.RadarAnimation.stories.d.ts

@@ -1,10 +1,6 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MapView").MapViewProps>;
-};
-export default _default;
-export declare const RadarAnimation: {
-    (): React.ReactElement;
-    storyName: string;
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from '.';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
+export declare const RadarAnimation: Story;

package/src/lib/components/MapView/MapView.RadarData.stories.d.ts

@@ -1,10 +1,6 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MapView").MapViewProps>;
-};
-export default _default;
-export declare const MapViewRadar: {
-    (): React.ReactElement;
-    storyName: string;
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from './MapView';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
+export declare const MapViewRadar: Story;

package/src/lib/components/MapView/MapView.SetProjectionBBox.stories.d.ts

@@ -1,10 +1,6 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MapView").MapViewProps>;
-};
-export default _default;
-export declare const SetProjectionBBox: {
-    (): React.ReactElement;
-    storyName: string;
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from '.';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
+export declare const SetProjectionBBox: Story;

package/src/lib/components/MapView/MapView.SetProjectionBBoxLocalState.stories.d.ts

@@ -1,10 +1,6 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MapView").MapViewProps>;
-};
-export default _default;
-export declare const SetProjectionBBoxLocalState: {
-    (): React.ReactElement;
-    storyName: string;
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from '.';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
+export declare const SetProjectionBBoxLocalState: Story;

package/src/lib/components/MapView/MapView.ShiftToZoom.stories.d.ts

@@ -1,10 +1,6 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MapView").MapViewProps>;
-};
-export default _default;
-export declare const HoldShiftToZoom: {
-    (): React.ReactElement;
-    storyName: string;
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from '.';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
+export declare const HoldShiftToZoom: Story;

package/src/lib/components/MapView/MapView.ShowLayerInfo.stories.d.ts

@@ -1,10 +1,6 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MapView").MapViewProps>;
-};
-export default _default;
-export declare const MapWithShowLayerInfoEnabled: {
-    (): React.ReactElement;
-    storyName: string;
-};
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from '.';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
+export declare const MapWithShowLayerInfoEnabled: Story;

package/src/lib/components/MapView/MapView.TiledBaseLayers.stories.d.ts

@@ -1,9 +1,8 @@
-import * as React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MapView").MapViewProps>;
-};
-export default _default;
+import type { Meta, StoryObj } from '@storybook/react';
+import { MapView } from './MapView';
+declare const meta: Meta<typeof MapView>;
+export default meta;
+type Story = StoryObj<typeof MapView>;
 export interface MapDropDownItem {
     name: string;
     title: string;
@@ -15,8 +14,4 @@ export interface MapDropDownProps {
     top?: number;
     left?: number;
 }
-export declare const MapDropDown: ({ value, change, options, top, left, }: MapDropDownProps) => React.ReactElement<MapDropDownProps>;
-export declare const MapViewTiledBaseLayers: {
-    (): React.ReactElement;
-    storyName: string;
-};
+export declare const MapViewTiledBaseLayers: Story;

package/src/lib/components/WMSViewerDemo/WebmapReact.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+type Story = StoryObj;
+export declare const DemoDemoWMSViewerStory: Story;
+export declare const MapComponentDemo: Story;
+declare const meta: Meta<typeof DemoDemoWMSViewerStory>;
+export default meta;

package/src/lib/components/WMSViewerDemo/components/WMSDimTimeYearSelector.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+export declare enum TimeMode {
+    YEAR = 0,
+    MONTH = 1,
+    DAY = 2,
+    HOUR = 3,
+    MINUTE = 4,
+    SECOND = 5
+}
+interface WMSDimTimeYearSelectorProps {
+    selectedISOTime: string;
+    layerId: string;
+    onSelectTime: (time: string) => void;
+    mode: TimeMode;
+}
+export declare const increaseTime: (selectedISOTime: string, timeRes: string) => string;
+declare const WMSDimTimeYearSelector: ({ selectedISOTime, layerId, onSelectTime, mode, }: WMSDimTimeYearSelectorProps) => React.ReactElement<WMSDimTimeYearSelectorProps> | null;
+export default WMSDimTimeYearSelector;

package/src/lib/components/WMSViewerDemo/components/WMSLayerSelector.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { LayerProps, LayerFoundation } from '@opengeoweb/webmap';
+interface WMSLayerSelectorProps {
+    layer: LayerFoundation;
+    layers: LayerProps[];
+    onSelectLayer: (layer: LayerProps) => void;
+}
+declare const WMSLayerSelector: ({ layer, layers, onSelectLayer, }: WMSLayerSelectorProps) => React.ReactElement<WMSLayerSelectorProps>;
+export default WMSLayerSelector;

package/src/lib/components/WMSViewerDemo/components/WMSStyleSelector.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { LayerFoundation } from '@opengeoweb/webmap';
+interface WMSStyleSelectorProps {
+    layer: LayerFoundation;
+    onSelectStyle: (layer: LayerFoundation) => void;
+}
+declare const WMSStyleSelector: ({ layer, onSelectStyle, }: WMSStyleSelectorProps) => React.ReactElement<WMSStyleSelectorProps> | null;
+export default WMSStyleSelector;

package/src/lib/components/WMSViewerDemo/components/WMSTimeSlider.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+interface WMSTimeSliderProps {
+    selectedISOTime: string;
+    layerId: string;
+    onSelectTime: (time: string) => void;
+}
+declare const WMSTimeSlider: ({ selectedISOTime, layerId, onSelectTime, }: WMSTimeSliderProps) => React.ReactElement<WMSTimeSliderProps> | null;
+export default WMSTimeSlider;

package/src/lib/index.d.ts

@@ -1,3 +1,4 @@
 export * from './components';
 export * from './layers';
+export * from './hooks/useHooksGetCapabilities';
 export { WEBMAP_REACT_NAMESPACE } from './utils/i18n';