@open-pioneer/legend 0.11.0 → 0.12.0-dev.20250905090001
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +46 -1
- package/Legend.d.ts +14 -0
- package/Legend.js +62 -45
- package/Legend.js.map +1 -1
- package/README.md +4 -0
- package/index.d.ts +1 -1
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,51 @@
|
|
|
1
1
|
# @open-pioneer/legend
|
|
2
2
|
|
|
3
|
+
## 0.12.0-dev.20250905090001
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 2702df4: A layer's `internal` property is now respected by the Legend widget. If a layer is marked as internal (`internal` is `true`) no legend entry is displayed for this layer even if the legend is configured in the layer attributes.
|
|
8
|
+
- 2732052: Icons have been changed to unify the appearance of the components. Preferably, Lucide react-icons are used.
|
|
9
|
+
|
|
10
|
+
### Patch Changes
|
|
11
|
+
|
|
12
|
+
- 10d2fe7: Update dependencies
|
|
13
|
+
- 1723382: Introduce `listMode` for layer legend configurations:
|
|
14
|
+
|
|
15
|
+
```typescript
|
|
16
|
+
//sublayer with legend configuration
|
|
17
|
+
const internalLayer = new SimpleLayer({
|
|
18
|
+
id: "layer1",
|
|
19
|
+
title: "layer 1",
|
|
20
|
+
olLayer: myOlLayer,
|
|
21
|
+
visible: true,
|
|
22
|
+
attributes: {
|
|
23
|
+
legend: {
|
|
24
|
+
listMode: "show"
|
|
25
|
+
} satisfies LegendItemAttributes
|
|
26
|
+
},
|
|
27
|
+
sublayers: [
|
|
28
|
+
{
|
|
29
|
+
name: "sublayer1",
|
|
30
|
+
title: "Sub Layer 1"
|
|
31
|
+
}
|
|
32
|
+
]
|
|
33
|
+
});
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
- da6a410: Update dependencies
|
|
37
|
+
- Updated dependencies [29a10df]
|
|
38
|
+
- Updated dependencies [10d2fe7]
|
|
39
|
+
- Updated dependencies [2702df4]
|
|
40
|
+
- Updated dependencies [12561fe]
|
|
41
|
+
- Updated dependencies [5df900f]
|
|
42
|
+
- Updated dependencies [8986b3b]
|
|
43
|
+
- Updated dependencies [aeb9000]
|
|
44
|
+
- Updated dependencies [5df900f]
|
|
45
|
+
- Updated dependencies [f1f69f2]
|
|
46
|
+
- Updated dependencies [da6a410]
|
|
47
|
+
- @open-pioneer/map@0.12.0-dev.20250905090001
|
|
48
|
+
|
|
3
49
|
## 0.11.0
|
|
4
50
|
|
|
5
51
|
### Minor Changes
|
|
@@ -72,7 +118,6 @@
|
|
|
72
118
|
### Minor Changes
|
|
73
119
|
|
|
74
120
|
- 2fa8020: Update trails core package dependencies.
|
|
75
|
-
|
|
76
121
|
- Also updates Chakra UI to the latest 2.x version and Chakra React Select to version 5.
|
|
77
122
|
- Removes any obsolete references to `@chakra-ui/system`.
|
|
78
123
|
This dependency seems to be no longer required and may lead to duplicate packages in your dependency tree.
|
package/Legend.d.ts
CHANGED
|
@@ -27,6 +27,10 @@ export interface LegendItemAttributes {
|
|
|
27
27
|
* (Optional) React component that will be shown as customized legend for the layer.
|
|
28
28
|
*/
|
|
29
29
|
Component?: ComponentType<LegendItemComponentProps>;
|
|
30
|
+
/**
|
|
31
|
+
* (Optional) Additional property to control the display of the layer in the legend.
|
|
32
|
+
*/
|
|
33
|
+
listMode?: ListMode;
|
|
30
34
|
}
|
|
31
35
|
/**
|
|
32
36
|
* These are special properties for the Legend.
|
|
@@ -38,6 +42,16 @@ export interface LegendProps extends CommonComponentProps, MapModelProps {
|
|
|
38
42
|
*/
|
|
39
43
|
showBaseLayers?: boolean;
|
|
40
44
|
}
|
|
45
|
+
/**
|
|
46
|
+
* ListMode determines if a layer item is displayed in the Legend for the layer.
|
|
47
|
+
* The option `"hide-children"` provides a shortcut to hide all child layers (e.g. sublayers of group) of the layer in the Legend.
|
|
48
|
+
* It has the same effect as manually setting the `listMode` to `"hide"` on all child layers.
|
|
49
|
+
*
|
|
50
|
+
* ListMode has precedence over the layer's `internal` attribute but specifically configures the layer's display in the legend.
|
|
51
|
+
*
|
|
52
|
+
* By default, the list mode becomes `"hide-children"` if a layer has an associated legend.
|
|
53
|
+
*/
|
|
54
|
+
export type ListMode = "show" | "hide" | "hide-children";
|
|
41
55
|
/**
|
|
42
56
|
* The `Legend` component can be used to display the legend of layers that are visible in the map.
|
|
43
57
|
*/
|
package/Legend.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
|
-
import { IoIosWarning } from 'react-icons/io';
|
|
3
2
|
import { Box, List, Text, Icon, Image } from '@chakra-ui/react';
|
|
4
|
-
import {
|
|
3
|
+
import { useMapModelValue, isLayer } from '@open-pioneer/map';
|
|
5
4
|
import { useCommonComponentProps } from '@open-pioneer/react-utils';
|
|
6
5
|
import { useReactiveSnapshot } from '@open-pioneer/reactivity';
|
|
7
6
|
import classNames from 'classnames';
|
|
8
7
|
import { useIntl } from './_virtual/_virtual-pioneer-module_react-hooks.js';
|
|
9
|
-
import { useState, useEffect
|
|
8
|
+
import { useMemo, useState, useEffect } from 'react';
|
|
9
|
+
import { LuTriangleAlert } from 'react-icons/lu';
|
|
10
10
|
|
|
11
11
|
const Legend = (props) => {
|
|
12
12
|
const { showBaseLayers = false } = props;
|
|
13
13
|
const { containerProps } = useCommonComponentProps("legend", props);
|
|
14
|
-
const
|
|
15
|
-
return /* @__PURE__ */ jsx(Box, { ...containerProps, children:
|
|
14
|
+
const map = useMapModelValue(props);
|
|
15
|
+
return /* @__PURE__ */ jsx(Box, { ...containerProps, children: /* @__PURE__ */ jsx(LegendList, { map, showBaseLayers }) });
|
|
16
16
|
};
|
|
17
17
|
function LegendList(props) {
|
|
18
18
|
const { map, showBaseLayers } = props;
|
|
@@ -33,56 +33,38 @@ function LegendList(props) {
|
|
|
33
33
|
}
|
|
34
34
|
function LegendItem(props) {
|
|
35
35
|
const { layer, showBaseLayers } = props;
|
|
36
|
-
const isVisible = useReactiveSnapshot(() =>
|
|
36
|
+
const { isVisible, isInternal } = useReactiveSnapshot(() => {
|
|
37
|
+
return {
|
|
38
|
+
isVisible: layer.visible,
|
|
39
|
+
isInternal: layer.internal
|
|
40
|
+
};
|
|
41
|
+
}, [layer]);
|
|
37
42
|
const childLayers = useChildLayers(layer);
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
if (!
|
|
42
|
-
return
|
|
43
|
+
const listModeProp = useListMode(layer);
|
|
44
|
+
const legendContent = useLegendContent(layer);
|
|
45
|
+
const listMode = getListMode(listModeProp, isInternal, !!legendContent);
|
|
46
|
+
if (!isVisible || listMode === "hide" || !showBaseLayers && isBaseLayer(layer)) {
|
|
47
|
+
return;
|
|
43
48
|
}
|
|
44
|
-
|
|
45
|
-
if (
|
|
46
|
-
childLayers.
|
|
47
|
-
childItems.push(
|
|
48
|
-
/* @__PURE__ */ jsx(
|
|
49
|
-
LegendItem,
|
|
50
|
-
{
|
|
51
|
-
layer: childLayer,
|
|
52
|
-
showBaseLayers
|
|
53
|
-
},
|
|
54
|
-
childLayer.id
|
|
55
|
-
)
|
|
56
|
-
);
|
|
57
|
-
});
|
|
49
|
+
let childItems = [];
|
|
50
|
+
if (listMode === "show") {
|
|
51
|
+
childItems = childLayers.map((child) => /* @__PURE__ */ jsx(LegendItem, { layer: child, showBaseLayers }, child.id));
|
|
58
52
|
}
|
|
59
53
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
60
|
-
/* @__PURE__ */ jsx(LegendContent, { layer,
|
|
54
|
+
/* @__PURE__ */ jsx(LegendContent, { layer, content: legendContent }),
|
|
61
55
|
childItems
|
|
62
56
|
] });
|
|
63
57
|
}
|
|
64
58
|
function LegendContent(props) {
|
|
65
59
|
const intl = useIntl();
|
|
66
|
-
const { layer,
|
|
60
|
+
const { layer, content } = props;
|
|
67
61
|
const baseLayer = isBaseLayer(layer);
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
let renderedComponent;
|
|
71
|
-
if (legendAttributes?.Component) {
|
|
72
|
-
renderedComponent = /* @__PURE__ */ jsx(legendAttributes.Component, { layer });
|
|
73
|
-
} else if (legendAttributes?.imageUrl) {
|
|
74
|
-
renderedComponent = /* @__PURE__ */ jsx(LegendImage, { layer, imageUrl: legendAttributes.imageUrl });
|
|
75
|
-
} else {
|
|
76
|
-
if (legendUrl) {
|
|
77
|
-
renderedComponent = /* @__PURE__ */ jsx(LegendImage, { layer, imageUrl: legendUrl });
|
|
78
|
-
}
|
|
79
|
-
}
|
|
80
|
-
return renderedComponent ? /* @__PURE__ */ jsxs(Box, { as: "li", className: classNames("legend-item", `layer-${slug(layer.id)}`), children: [
|
|
81
|
-
showBaseLayers && baseLayer ? (
|
|
62
|
+
return content ? /* @__PURE__ */ jsxs(Box, { as: "li", className: classNames("legend-item", `layer-${slug(layer.id)}`), children: [
|
|
63
|
+
baseLayer ? (
|
|
82
64
|
/* Render additional text, if layer is a configured basemap */
|
|
83
65
|
/* @__PURE__ */ jsx(Text, { as: "b", children: intl.formatMessage({ id: "basemapLabel" }) })
|
|
84
66
|
) : null,
|
|
85
|
-
|
|
67
|
+
content
|
|
86
68
|
] }) : void 0;
|
|
87
69
|
}
|
|
88
70
|
function LegendImage(props) {
|
|
@@ -95,7 +77,7 @@ function LegendImage(props) {
|
|
|
95
77
|
const content = useMemo(() => {
|
|
96
78
|
if (isError) {
|
|
97
79
|
return /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(Text, { children: [
|
|
98
|
-
/* @__PURE__ */ jsx(Icon, { me: 2, children: /* @__PURE__ */ jsx(
|
|
80
|
+
/* @__PURE__ */ jsx(Icon, { me: 2, children: /* @__PURE__ */ jsx(LuTriangleAlert, {}) }),
|
|
99
81
|
intl.formatMessage({ id: "fallbackLabel" })
|
|
100
82
|
] }) });
|
|
101
83
|
}
|
|
@@ -116,6 +98,23 @@ function LegendImage(props) {
|
|
|
116
98
|
content
|
|
117
99
|
] });
|
|
118
100
|
}
|
|
101
|
+
function useLegendContent(layer) {
|
|
102
|
+
const legendAttributes = useLegendAttributes(layer);
|
|
103
|
+
const legendUrl = useReactiveSnapshot(() => layer.legend, [layer]);
|
|
104
|
+
return useMemo(() => {
|
|
105
|
+
let renderedComponent;
|
|
106
|
+
if (legendAttributes?.Component) {
|
|
107
|
+
renderedComponent = /* @__PURE__ */ jsx(legendAttributes.Component, { layer });
|
|
108
|
+
} else if (legendAttributes?.imageUrl) {
|
|
109
|
+
renderedComponent = /* @__PURE__ */ jsx(LegendImage, { layer, imageUrl: legendAttributes.imageUrl });
|
|
110
|
+
} else {
|
|
111
|
+
if (legendUrl) {
|
|
112
|
+
renderedComponent = /* @__PURE__ */ jsx(LegendImage, { layer, imageUrl: legendUrl });
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
return renderedComponent;
|
|
116
|
+
}, [legendUrl, legendAttributes, layer]);
|
|
117
|
+
}
|
|
119
118
|
function useLayers(map) {
|
|
120
119
|
return useReactiveSnapshot(() => {
|
|
121
120
|
const layers = map.layers.getLayers({ sortByDisplayOrder: true }) ?? [];
|
|
@@ -131,7 +130,7 @@ function useChildLayers(layer) {
|
|
|
131
130
|
}
|
|
132
131
|
childLayers.reverse();
|
|
133
132
|
return childLayers;
|
|
134
|
-
}, [layer]);
|
|
133
|
+
}, [layer]) ?? [];
|
|
135
134
|
}
|
|
136
135
|
function useLegendAttributes(layer) {
|
|
137
136
|
return useReactiveSnapshot(
|
|
@@ -139,12 +138,30 @@ function useLegendAttributes(layer) {
|
|
|
139
138
|
[layer]
|
|
140
139
|
);
|
|
141
140
|
}
|
|
141
|
+
function getListMode(listModeProp, isInternal, hasLegendContent) {
|
|
142
|
+
if (listModeProp) {
|
|
143
|
+
return listModeProp;
|
|
144
|
+
}
|
|
145
|
+
if (isInternal) {
|
|
146
|
+
return "hide";
|
|
147
|
+
}
|
|
148
|
+
if (hasLegendContent) {
|
|
149
|
+
return "hide-children";
|
|
150
|
+
}
|
|
151
|
+
return "show";
|
|
152
|
+
}
|
|
142
153
|
function isBaseLayer(layer) {
|
|
143
|
-
return
|
|
154
|
+
return isLayer(layer) && layer.isBaseLayer;
|
|
144
155
|
}
|
|
145
156
|
function slug(id) {
|
|
146
157
|
return id.toLowerCase().replace(/[^a-z0-9 -]/g, "").replace(/\s+/g, "-").replace(/-+/g, "-");
|
|
147
158
|
}
|
|
159
|
+
function useListMode(layer) {
|
|
160
|
+
return useReactiveSnapshot(
|
|
161
|
+
() => layer.attributes.legend?.listMode,
|
|
162
|
+
[layer]
|
|
163
|
+
);
|
|
164
|
+
}
|
|
148
165
|
|
|
149
166
|
export { Legend };
|
|
150
167
|
//# sourceMappingURL=Legend.js.map
|
package/Legend.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Legend.js","sources":["Legend.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { IoIosWarning } from \"react-icons/io\";\nimport { Box, Image, List, Text, Icon } from \"@chakra-ui/react\";\nimport { Layer, AnyLayer, MapModel, useMapModel, MapModelProps, isLayer } from \"@open-pioneer/map\";\nimport { CommonComponentProps, useCommonComponentProps } from \"@open-pioneer/react-utils\";\nimport { useReactiveSnapshot } from \"@open-pioneer/reactivity\";\nimport classNames from \"classnames\";\nimport { useIntl } from \"open-pioneer:react-hooks\";\nimport { ComponentType, FC, ReactNode, useEffect, useMemo, useState } from \"react\";\n\n/**\n * Properties of a legend item React component.\n */\nexport interface LegendItemComponentProps {\n /**\n * Related layer of the legend.\n */\n layer: AnyLayer;\n}\n\n/**\n * Attributes of the legend attribute that can be specified on a layer.\n *\n * To show a legend for the layer, provide an imageUrl to an image to show\n * or provide a React component that will be rendered as a legend.\n *\n * LegendItemAttributes should be registered with a layer as the `\"legend\"` attribute.\n */\nexport interface LegendItemAttributes {\n /**\n * (Optional) URL to an image that will be shown as a legend for the layer.\n */\n imageUrl?: string;\n\n /**\n * (Optional) React component that will be shown as customized legend for the layer.\n */\n Component?: ComponentType<LegendItemComponentProps>;\n}\n\n/**\n * These are special properties for the Legend.\n */\nexport interface LegendProps extends CommonComponentProps, MapModelProps {\n /**\n * Specifies whether legend for active base layer is shown in the legend UI.\n * Defaults to `false`.\n */\n showBaseLayers?: boolean;\n}\n\n/**\n * The `Legend` component can be used to display the legend of layers that are visible in the map.\n */\nexport const Legend: FC<LegendProps> = (props) => {\n const { showBaseLayers = false } = props;\n const { containerProps } = useCommonComponentProps(\"legend\", props);\n const { map } = useMapModel(props);\n\n return (\n <Box {...containerProps}>\n {map ? <LegendList map={map} showBaseLayers={showBaseLayers} /> : null}\n </Box>\n );\n};\n\nfunction LegendList(props: { map: MapModel; showBaseLayers: boolean }): ReactNode {\n const { map, showBaseLayers } = props;\n\n const layers = useLayers(map);\n const legendListItems: ReactNode[] = layers.map((layer) => {\n return (\n <LegendItem key={layer.id} layer={layer} showBaseLayers={showBaseLayers}></LegendItem>\n );\n });\n\n return (\n <List.Root\n // Note: not using UnorderedList because it adds default margins\n as=\"ul\"\n className=\"legend-layer-list\"\n listStyleType=\"none\"\n gap={2}\n >\n {legendListItems}\n </List.Root>\n );\n}\n\nfunction LegendItem(props: { layer: AnyLayer; showBaseLayers: boolean }): ReactNode {\n const { layer, showBaseLayers } = props;\n const isVisible = useReactiveSnapshot(() => layer.visible, [layer]);\n const childLayers = useChildLayers(layer);\n\n if (!isVisible) {\n return undefined;\n }\n\n if (!showBaseLayers && isLayer(layer) && isBaseLayer(layer)) {\n return undefined;\n }\n\n // legend items for all child layers (sublayers or layers in a group)\n const childItems: ReactNode[] = [];\n if (childLayers?.length) {\n childLayers.forEach((childLayer) => {\n childItems.push(\n <LegendItem\n key={childLayer.id}\n layer={childLayer}\n showBaseLayers={showBaseLayers}\n />\n );\n });\n }\n\n return (\n <>\n <LegendContent layer={layer} showBaseLayers={showBaseLayers} />\n {childItems}\n </>\n );\n}\n\nfunction LegendContent(props: { layer: AnyLayer; showBaseLayers: boolean }) {\n const intl = useIntl();\n\n const { layer, showBaseLayers } = props;\n const baseLayer = isBaseLayer(layer);\n const legendAttributes = useLegendAttributes(layer);\n const legendUrl = useReactiveSnapshot(() => layer.legend, [layer]);\n\n let renderedComponent: ReactNode | undefined;\n if (legendAttributes?.Component) {\n renderedComponent = <legendAttributes.Component layer={layer} />;\n } else if (legendAttributes?.imageUrl) {\n renderedComponent = <LegendImage layer={layer} imageUrl={legendAttributes.imageUrl} />;\n } else {\n if (legendUrl) {\n renderedComponent = <LegendImage layer={layer} imageUrl={legendUrl} />;\n }\n }\n\n return renderedComponent ? (\n <Box as=\"li\" className={classNames(\"legend-item\", `layer-${slug(layer.id)}`)}>\n {showBaseLayers && baseLayer ? (\n /* Render additional text, if layer is a configured basemap */\n <Text as=\"b\">{intl.formatMessage({ id: \"basemapLabel\" })}</Text>\n ) : null}\n {renderedComponent}\n </Box>\n ) : undefined;\n}\n\nfunction LegendImage(props: { imageUrl: string; layer: AnyLayer }) {\n const intl = useIntl();\n\n const { layer, imageUrl } = props;\n\n const [isError, setIsError] = useState(false);\n useEffect(() => {\n setIsError(false);\n }, [imageUrl]);\n\n const content = useMemo(() => {\n if (isError) {\n return (\n <Box>\n <Text>\n <Icon me={2}>\n <IoIosWarning />\n </Icon>\n {intl.formatMessage({ id: \"fallbackLabel\" })}\n </Text>\n </Box>\n );\n }\n\n return (\n <Image\n maxW=\"none\"\n maxH=\"none\"\n src={imageUrl}\n alt={intl.formatMessage({ id: \"altLabel\" }, { layerName: layer.title })}\n className={\"legend-item__image\"}\n onError={() => setIsError(true)}\n />\n );\n }, [intl, layer.title, imageUrl, isError]);\n\n return (\n <Box>\n <Text>{layer.title}</Text>\n {content}\n </Box>\n );\n}\n\n/** Returns the top level operational layers in render order (topmost layer first). */\nfunction useLayers(map: MapModel): Layer[] {\n return useReactiveSnapshot(() => {\n const layers = map.layers.getLayers({ sortByDisplayOrder: true }) ?? [];\n layers.reverse(); // render topmost layer first\n return layers;\n }, [map]);\n}\n\n/**\n * Returns the child layers (sublayers or layers belonging to a GroupLayer) of the given layer\n * (or undefined, if the child layer cannot have any).\n * Layers are returned in render order (topmost layer first).\n */\nfunction useChildLayers(layer: AnyLayer): AnyLayer[] | undefined {\n return useReactiveSnapshot(() => {\n const childLayers = layer.children?.getItems();\n if (!childLayers) {\n return undefined;\n }\n\n childLayers.reverse(); // render topmost layer first\n return childLayers;\n }, [layer]);\n}\n\nfunction useLegendAttributes(layer: AnyLayer): LegendItemAttributes | undefined {\n return useReactiveSnapshot(\n () => layer.attributes.legend as LegendItemAttributes | undefined,\n [layer]\n );\n}\n\nfunction isBaseLayer(layer: AnyLayer) {\n return !(\"parentLayer\" in layer) && layer.isBaseLayer;\n}\n\nfunction slug(id: string) {\n return id\n .toLowerCase()\n .replace(/[^a-z0-9 -]/g, \"\")\n .replace(/\\s+/g, \"-\")\n .replace(/-+/g, \"-\");\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Legend.js","sources":["Legend.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { Box, Icon, Image, List, Text } from \"@chakra-ui/react\";\nimport {\n AnyLayer,\n Layer,\n MapModel,\n MapModelProps,\n isLayer,\n useMapModelValue\n} from \"@open-pioneer/map\";\nimport { CommonComponentProps, useCommonComponentProps } from \"@open-pioneer/react-utils\";\nimport { useReactiveSnapshot } from \"@open-pioneer/reactivity\";\nimport classNames from \"classnames\";\nimport { useIntl } from \"open-pioneer:react-hooks\";\nimport { ComponentType, FC, ReactNode, useEffect, useMemo, useState } from \"react\";\nimport { LuTriangleAlert } from \"react-icons/lu\";\n\n/**\n * Properties of a legend item React component.\n */\nexport interface LegendItemComponentProps {\n /**\n * Related layer of the legend.\n */\n layer: AnyLayer;\n}\n\n/**\n * Attributes of the legend attribute that can be specified on a layer.\n *\n * To show a legend for the layer, provide an imageUrl to an image to show\n * or provide a React component that will be rendered as a legend.\n *\n * LegendItemAttributes should be registered with a layer as the `\"legend\"` attribute.\n */\nexport interface LegendItemAttributes {\n /**\n * (Optional) URL to an image that will be shown as a legend for the layer.\n */\n imageUrl?: string;\n\n /**\n * (Optional) React component that will be shown as customized legend for the layer.\n */\n Component?: ComponentType<LegendItemComponentProps>;\n\n /**\n * (Optional) Additional property to control the display of the layer in the legend.\n */\n listMode?: ListMode;\n}\n\n/**\n * These are special properties for the Legend.\n */\nexport interface LegendProps extends CommonComponentProps, MapModelProps {\n /**\n * Specifies whether legend for active base layer is shown in the legend UI.\n * Defaults to `false`.\n */\n showBaseLayers?: boolean;\n}\n\n/**\n * ListMode determines if a layer item is displayed in the Legend for the layer.\n * The option `\"hide-children\"` provides a shortcut to hide all child layers (e.g. sublayers of group) of the layer in the Legend.\n * It has the same effect as manually setting the `listMode` to `\"hide\"` on all child layers.\n *\n * ListMode has precedence over the layer's `internal` attribute but specifically configures the layer's display in the legend.\n *\n * By default, the list mode becomes `\"hide-children\"` if a layer has an associated legend.\n */\nexport type ListMode = \"show\" | \"hide\" | \"hide-children\";\n\n/**\n * The `Legend` component can be used to display the legend of layers that are visible in the map.\n */\nexport const Legend: FC<LegendProps> = (props) => {\n const { showBaseLayers = false } = props;\n const { containerProps } = useCommonComponentProps(\"legend\", props);\n const map = useMapModelValue(props);\n\n return (\n <Box {...containerProps}>\n <LegendList map={map} showBaseLayers={showBaseLayers} />\n </Box>\n );\n};\n\nfunction LegendList(props: { map: MapModel; showBaseLayers: boolean }): ReactNode {\n const { map, showBaseLayers } = props;\n\n const layers = useLayers(map);\n const legendListItems: ReactNode[] = layers.map((layer) => {\n return (\n <LegendItem key={layer.id} layer={layer} showBaseLayers={showBaseLayers}></LegendItem>\n );\n });\n\n return (\n <List.Root\n // Note: not using UnorderedList because it adds default margins\n as=\"ul\"\n className=\"legend-layer-list\"\n listStyleType=\"none\"\n gap={2}\n >\n {legendListItems}\n </List.Root>\n );\n}\n\nfunction LegendItem(props: { layer: AnyLayer; showBaseLayers: boolean }): ReactNode {\n const { layer, showBaseLayers } = props;\n const { isVisible, isInternal } = useReactiveSnapshot(() => {\n return {\n isVisible: layer.visible,\n isInternal: layer.internal\n };\n }, [layer]);\n const childLayers = useChildLayers(layer);\n const listModeProp = useListMode(layer);\n const legendContent = useLegendContent(layer);\n const listMode = getListMode(listModeProp, isInternal, !!legendContent);\n\n if (!isVisible || listMode === \"hide\" || (!showBaseLayers && isBaseLayer(layer))) {\n return;\n }\n\n // legend items for all child layers (sublayers or layers in a group)\n let childItems: ReactNode[] = [];\n if (listMode === \"show\") {\n childItems = childLayers.map((child) => (\n <LegendItem key={child.id} layer={child} showBaseLayers={showBaseLayers} />\n ));\n }\n // listMode: hide/hide-children -> childItems stays empty\n\n return (\n <>\n <LegendContent layer={layer} content={legendContent} />\n {childItems}\n </>\n );\n}\n\nfunction LegendContent(props: { layer: AnyLayer; content: ReactNode }) {\n const intl = useIntl();\n\n const { layer, content } = props;\n const baseLayer = isBaseLayer(layer);\n return content ? (\n <Box as=\"li\" className={classNames(\"legend-item\", `layer-${slug(layer.id)}`)}>\n {baseLayer ? (\n /* Render additional text, if layer is a configured basemap */\n <Text as=\"b\">{intl.formatMessage({ id: \"basemapLabel\" })}</Text>\n ) : null}\n {content}\n </Box>\n ) : undefined;\n}\n\nfunction LegendImage(props: { imageUrl: string; layer: AnyLayer }) {\n const intl = useIntl();\n\n const { layer, imageUrl } = props;\n\n const [isError, setIsError] = useState(false);\n useEffect(() => {\n setIsError(false);\n }, [imageUrl]);\n\n const content = useMemo(() => {\n if (isError) {\n return (\n <Box>\n <Text>\n <Icon me={2}>\n <LuTriangleAlert />\n </Icon>\n {intl.formatMessage({ id: \"fallbackLabel\" })}\n </Text>\n </Box>\n );\n }\n\n return (\n <Image\n maxW=\"none\"\n maxH=\"none\"\n src={imageUrl}\n alt={intl.formatMessage({ id: \"altLabel\" }, { layerName: layer.title })}\n className={\"legend-item__image\"}\n onError={() => setIsError(true)}\n />\n );\n }, [intl, layer.title, imageUrl, isError]);\n\n return (\n <Box>\n <Text>{layer.title}</Text>\n {content}\n </Box>\n );\n}\n\n/**\n * Resolves the content that would be rendered for the given layer.\n */\nfunction useLegendContent(layer: AnyLayer): ReactNode | undefined {\n const legendAttributes = useLegendAttributes(layer);\n const legendUrl = useReactiveSnapshot(() => layer.legend, [layer]);\n return useMemo(() => {\n let renderedComponent: ReactNode | undefined;\n if (legendAttributes?.Component) {\n renderedComponent = <legendAttributes.Component layer={layer} />;\n } else if (legendAttributes?.imageUrl) {\n renderedComponent = <LegendImage layer={layer} imageUrl={legendAttributes.imageUrl} />;\n } else {\n if (legendUrl) {\n renderedComponent = <LegendImage layer={layer} imageUrl={legendUrl} />;\n }\n }\n return renderedComponent;\n }, [legendUrl, legendAttributes, layer]);\n}\n\n/** Returns the top level operational layers in render order (topmost layer first). */\nfunction useLayers(map: MapModel): Layer[] {\n return useReactiveSnapshot(() => {\n const layers = map.layers.getLayers({ sortByDisplayOrder: true }) ?? [];\n layers.reverse(); // render topmost layer first\n return layers;\n }, [map]);\n}\n\n/**\n * Returns the child layers (sublayers or layers belonging to a GroupLayer) of the given layer.\n * Layers are returned in render order (topmost layer first).\n */\nfunction useChildLayers(layer: AnyLayer): AnyLayer[] {\n return (\n useReactiveSnapshot(() => {\n const childLayers = layer.children?.getItems();\n if (!childLayers) {\n return undefined;\n }\n\n childLayers.reverse(); // render topmost layer first\n return childLayers;\n }, [layer]) ?? []\n );\n}\n\nfunction useLegendAttributes(layer: AnyLayer): LegendItemAttributes | undefined {\n return useReactiveSnapshot(\n () => layer.attributes.legend as LegendItemAttributes | undefined,\n [layer]\n );\n}\n\nfunction getListMode(\n listModeProp: ListMode | undefined,\n isInternal: boolean,\n hasLegendContent: boolean\n): ListMode {\n if (listModeProp) {\n return listModeProp; // Explicit value wins\n }\n if (isInternal) {\n return \"hide\";\n }\n if (hasLegendContent) {\n return \"hide-children\";\n }\n return \"show\";\n}\n\nfunction isBaseLayer(layer: AnyLayer) {\n return isLayer(layer) && layer.isBaseLayer;\n}\n\nfunction slug(id: string) {\n return id\n .toLowerCase()\n .replace(/[^a-z0-9 -]/g, \"\")\n .replace(/\\s+/g, \"-\")\n .replace(/-+/g, \"-\");\n}\n\nfunction useListMode(layer: AnyLayer): ListMode | undefined {\n return useReactiveSnapshot(\n () => (layer.attributes.legend as LegendItemAttributes | undefined)?.listMode,\n [layer]\n );\n}\n"],"names":[],"mappings":";;;;;;;;;;AA8EO,MAAM,MAAA,GAA0B,CAAC,KAAA,KAAU;AAC9C,EAAA,MAAM,EAAE,cAAA,GAAiB,KAAA,EAAM,GAAI,KAAA;AACnC,EAAA,MAAM,EAAE,cAAA,EAAe,GAAI,uBAAA,CAAwB,UAAU,KAAK,CAAA;AAClE,EAAA,MAAM,GAAA,GAAM,iBAAiB,KAAK,CAAA;AAElC,EAAA,uBACI,GAAA,CAAC,OAAK,GAAG,cAAA,EACL,8BAAC,UAAA,EAAA,EAAW,GAAA,EAAU,gBAAgC,CAAA,EAC1D,CAAA;AAER;AAEA,SAAS,WAAW,KAAA,EAA8D;AAC9E,EAAA,MAAM,EAAE,GAAA,EAAK,cAAA,EAAe,GAAI,KAAA;AAEhC,EAAA,MAAM,MAAA,GAAS,UAAU,GAAG,CAAA;AAC5B,EAAA,MAAM,eAAA,GAA+B,MAAA,CAAO,GAAA,CAAI,CAAC,KAAA,KAAU;AACvD,IAAA,uBACI,GAAA,CAAC,UAAA,EAAA,EAA0B,KAAA,EAAc,cAAA,EAAA,EAAxB,MAAM,EAAkD,CAAA;AAAA,EAEjF,CAAC,CAAA;AAED,EAAA,uBACI,GAAA;AAAA,IAAC,IAAA,CAAK,IAAA;AAAA,IAAL;AAAA,MAEG,EAAA,EAAG,IAAA;AAAA,MACH,SAAA,EAAU,mBAAA;AAAA,MACV,aAAA,EAAc,MAAA;AAAA,MACd,GAAA,EAAK,CAAA;AAAA,MAEJ,QAAA,EAAA;AAAA;AAAA,GACL;AAER;AAEA,SAAS,WAAW,KAAA,EAAgE;AAChF,EAAA,MAAM,EAAE,KAAA,EAAO,cAAA,EAAe,GAAI,KAAA;AAClC,EAAA,MAAM,EAAE,SAAA,EAAW,UAAA,EAAW,GAAI,oBAAoB,MAAM;AACxD,IAAA,OAAO;AAAA,MACH,WAAW,KAAA,CAAM,OAAA;AAAA,MACjB,YAAY,KAAA,CAAM;AAAA,KACtB;AAAA,EACJ,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AACV,EAAA,MAAM,WAAA,GAAc,eAAe,KAAK,CAAA;AACxC,EAAA,MAAM,YAAA,GAAe,YAAY,KAAK,CAAA;AACtC,EAAA,MAAM,aAAA,GAAgB,iBAAiB,KAAK,CAAA;AAC5C,EAAA,MAAM,WAAW,WAAA,CAAY,YAAA,EAAc,UAAA,EAAY,CAAC,CAAC,aAAa,CAAA;AAEtE,EAAA,IAAI,CAAC,aAAa,QAAA,KAAa,MAAA,IAAW,CAAC,cAAA,IAAkB,WAAA,CAAY,KAAK,CAAA,EAAI;AAC9E,IAAA;AAAA,EACJ;AAGA,EAAA,IAAI,aAA0B,EAAC;AAC/B,EAAA,IAAI,aAAa,MAAA,EAAQ;AACrB,IAAA,UAAA,GAAa,WAAA,CAAY,GAAA,CAAI,CAAC,KAAA,qBAC1B,GAAA,CAAC,UAAA,EAAA,EAA0B,KAAA,EAAO,KAAA,EAAO,cAAA,EAAA,EAAxB,KAAA,CAAM,EAAkD,CAC5E,CAAA;AAAA,EACL;AAGA,EAAA,uBACI,IAAA,CAAA,QAAA,EAAA,EACI,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,aAAA,EAAA,EAAc,KAAA,EAAc,OAAA,EAAS,aAAA,EAAe,CAAA;AAAA,IACpD;AAAA,GAAA,EACL,CAAA;AAER;AAEA,SAAS,cAAc,KAAA,EAAgD;AACnE,EAAA,MAAM,OAAO,OAAA,EAAQ;AAErB,EAAA,MAAM,EAAE,KAAA,EAAO,OAAA,EAAQ,GAAI,KAAA;AAC3B,EAAA,MAAM,SAAA,GAAY,YAAY,KAAK,CAAA;AACnC,EAAA,OAAO,OAAA,mBACH,IAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAG,MAAK,SAAA,EAAW,UAAA,CAAW,aAAA,EAAe,CAAA,MAAA,EAAS,IAAA,CAAK,KAAA,CAAM,EAAE,CAAC,EAAE,CAAA,EACtE,QAAA,EAAA;AAAA,IAAA,SAAA;AAAA;AAAA,sBAEG,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAG,GAAA,EAAK,QAAA,EAAA,IAAA,CAAK,cAAc,EAAE,EAAA,EAAI,cAAA,EAAgB,CAAA,EAAE;AAAA,QACzD,IAAA;AAAA,IACH;AAAA,GAAA,EACL,CAAA,GACA,MAAA;AACR;AAEA,SAAS,YAAY,KAAA,EAA8C;AAC/D,EAAA,MAAM,OAAO,OAAA,EAAQ;AAErB,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAS,GAAI,KAAA;AAE5B,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,SAAS,KAAK,CAAA;AAC5C,EAAA,SAAA,CAAU,MAAM;AACZ,IAAA,UAAA,CAAW,KAAK,CAAA;AAAA,EACpB,CAAA,EAAG,CAAC,QAAQ,CAAC,CAAA;AAEb,EAAA,MAAM,OAAA,GAAU,QAAQ,MAAM;AAC1B,IAAA,IAAI,OAAA,EAAS;AACT,MAAA,uBACI,GAAA,CAAC,GAAA,EAAA,EACG,QAAA,kBAAA,IAAA,CAAC,IAAA,EAAA,EACG,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAI,CAAA,EACN,QAAA,kBAAA,GAAA,CAAC,mBAAgB,CAAA,EACrB,CAAA;AAAA,QACC,IAAA,CAAK,aAAA,CAAc,EAAE,EAAA,EAAI,iBAAiB;AAAA,OAAA,EAC/C,CAAA,EACJ,CAAA;AAAA,IAER;AAEA,IAAA,uBACI,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACG,IAAA,EAAK,MAAA;AAAA,QACL,IAAA,EAAK,MAAA;AAAA,QACL,GAAA,EAAK,QAAA;AAAA,QACL,GAAA,EAAK,IAAA,CAAK,aAAA,CAAc,EAAE,EAAA,EAAI,UAAA,EAAW,EAAG,EAAE,SAAA,EAAW,KAAA,CAAM,KAAA,EAAO,CAAA;AAAA,QACtE,SAAA,EAAW,oBAAA;AAAA,QACX,OAAA,EAAS,MAAM,UAAA,CAAW,IAAI;AAAA;AAAA,KAClC;AAAA,EAER,GAAG,CAAC,IAAA,EAAM,MAAM,KAAA,EAAO,QAAA,EAAU,OAAO,CAAC,CAAA;AAEzC,EAAA,4BACK,GAAA,EAAA,EACG,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,IAAA,EAAA,EAAM,gBAAM,KAAA,EAAM,CAAA;AAAA,IAClB;AAAA,GAAA,EACL,CAAA;AAER;AAKA,SAAS,iBAAiB,KAAA,EAAwC;AAC9D,EAAA,MAAM,gBAAA,GAAmB,oBAAoB,KAAK,CAAA;AAClD,EAAA,MAAM,YAAY,mBAAA,CAAoB,MAAM,MAAM,MAAA,EAAQ,CAAC,KAAK,CAAC,CAAA;AACjE,EAAA,OAAO,QAAQ,MAAM;AACjB,IAAA,IAAI,iBAAA;AACJ,IAAA,IAAI,kBAAkB,SAAA,EAAW;AAC7B,MAAA,iBAAA,mBAAoB,GAAA,CAAC,gBAAA,CAAiB,SAAA,EAAjB,EAA2B,KAAA,EAAc,CAAA;AAAA,IAClE,CAAA,MAAA,IAAW,kBAAkB,QAAA,EAAU;AACnC,MAAA,iBAAA,mBAAoB,GAAA,CAAC,WAAA,EAAA,EAAY,KAAA,EAAc,QAAA,EAAU,iBAAiB,QAAA,EAAU,CAAA;AAAA,IACxF,CAAA,MAAO;AACH,MAAA,IAAI,SAAA,EAAW;AACX,QAAA,iBAAA,mBAAoB,GAAA,CAAC,WAAA,EAAA,EAAY,KAAA,EAAc,QAAA,EAAU,SAAA,EAAW,CAAA;AAAA,MACxE;AAAA,IACJ;AACA,IAAA,OAAO,iBAAA;AAAA,EACX,CAAA,EAAG,CAAC,SAAA,EAAW,gBAAA,EAAkB,KAAK,CAAC,CAAA;AAC3C;AAGA,SAAS,UAAU,GAAA,EAAwB;AACvC,EAAA,OAAO,oBAAoB,MAAM;AAC7B,IAAA,MAAM,MAAA,GAAS,IAAI,MAAA,CAAO,SAAA,CAAU,EAAE,kBAAA,EAAoB,IAAA,EAAM,CAAA,IAAK,EAAC;AACtE,IAAA,MAAA,CAAO,OAAA,EAAQ;AACf,IAAA,OAAO,MAAA;AAAA,EACX,CAAA,EAAG,CAAC,GAAG,CAAC,CAAA;AACZ;AAMA,SAAS,eAAe,KAAA,EAA6B;AACjD,EAAA,OACI,oBAAoB,MAAM;AACtB,IAAA,MAAM,WAAA,GAAc,KAAA,CAAM,QAAA,EAAU,QAAA,EAAS;AAC7C,IAAA,IAAI,CAAC,WAAA,EAAa;AACd,MAAA,OAAO,MAAA;AAAA,IACX;AAEA,IAAA,WAAA,CAAY,OAAA,EAAQ;AACpB,IAAA,OAAO,WAAA;AAAA,EACX,CAAA,EAAG,CAAC,KAAK,CAAC,KAAK,EAAC;AAExB;AAEA,SAAS,oBAAoB,KAAA,EAAmD;AAC5E,EAAA,OAAO,mBAAA;AAAA,IACH,MAAM,MAAM,UAAA,CAAW,MAAA;AAAA,IACvB,CAAC,KAAK;AAAA,GACV;AACJ;AAEA,SAAS,WAAA,CACL,YAAA,EACA,UAAA,EACA,gBAAA,EACQ;AACR,EAAA,IAAI,YAAA,EAAc;AACd,IAAA,OAAO,YAAA;AAAA,EACX;AACA,EAAA,IAAI,UAAA,EAAY;AACZ,IAAA,OAAO,MAAA;AAAA,EACX;AACA,EAAA,IAAI,gBAAA,EAAkB;AAClB,IAAA,OAAO,eAAA;AAAA,EACX;AACA,EAAA,OAAO,MAAA;AACX;AAEA,SAAS,YAAY,KAAA,EAAiB;AAClC,EAAA,OAAO,OAAA,CAAQ,KAAK,CAAA,IAAK,KAAA,CAAM,WAAA;AACnC;AAEA,SAAS,KAAK,EAAA,EAAY;AACtB,EAAA,OAAO,EAAA,CACF,WAAA,EAAY,CACZ,OAAA,CAAQ,cAAA,EAAgB,EAAE,CAAA,CAC1B,OAAA,CAAQ,MAAA,EAAQ,GAAG,CAAA,CACnB,OAAA,CAAQ,OAAO,GAAG,CAAA;AAC3B;AAEA,SAAS,YAAY,KAAA,EAAuC;AACxD,EAAA,OAAO,mBAAA;AAAA,IACH,MAAO,KAAA,CAAM,UAAA,CAAW,MAAA,EAA6C,QAAA;AAAA,IACrE,CAAC,KAAK;AAAA,GACV;AACJ;;;;"}
|
package/README.md
CHANGED
|
@@ -69,6 +69,10 @@ If a configuration is done, it supersedes the automatic legend retrieval.
|
|
|
69
69
|
Showing legend entries is also supported for **sublayers** (configuration and automatic retrieval).
|
|
70
70
|
The legend content for sublayers is shown plain and without hierarchical structure in the Legend UI.
|
|
71
71
|
|
|
72
|
+
#### Internal layers
|
|
73
|
+
|
|
74
|
+
If a layer is marked as internal (layer's `internal` property is `true`) it will not be considered in the legend widget. Even if a legend is configured it will not be displayed. The `internal` property also affects other UI widgets (e.g. Toc).
|
|
75
|
+
|
|
72
76
|
### Showing legend for basemap
|
|
73
77
|
|
|
74
78
|
By default, the legend for the active basemap is not shown.
|
package/index.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { Legend, type LegendProps, type LegendItemAttributes, type LegendItemComponentProps } from "./Legend";
|
|
1
|
+
export { Legend, type LegendProps, type LegendItemAttributes, type LegendItemComponentProps, type ListMode } from "./Legend";
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"type": "module",
|
|
3
3
|
"name": "@open-pioneer/legend",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.12.0-dev.20250905090001",
|
|
5
5
|
"description": "This package provides a legend UI component that allows a user to see legend information for layers in the map.",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"open-pioneer-trails"
|
|
@@ -14,15 +14,15 @@
|
|
|
14
14
|
"directory": "src/packages/legend"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@chakra-ui/react": "^3.
|
|
17
|
+
"@chakra-ui/react": "^3.24.2",
|
|
18
18
|
"@open-pioneer/react-utils": "^4.0.0",
|
|
19
19
|
"@open-pioneer/runtime": "^4.0.0",
|
|
20
20
|
"classnames": "^2.5.1",
|
|
21
|
-
"ol": "^10.
|
|
22
|
-
"react": "^19.1.
|
|
21
|
+
"ol": "^10.6.1",
|
|
22
|
+
"react": "^19.1.1",
|
|
23
23
|
"@open-pioneer/reactivity": "^4.0.0",
|
|
24
24
|
"react-icons": "^5.5.0",
|
|
25
|
-
"@open-pioneer/map": "
|
|
25
|
+
"@open-pioneer/map": "0.12.0-dev.20250905090001"
|
|
26
26
|
},
|
|
27
27
|
"exports": {
|
|
28
28
|
"./package.json": "./package.json",
|