@open-pioneer/coordinate-search 0.9.0 → 0.10.0

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.
Files changed (5) hide show
  1. package/CHANGELOG.md +32 -0
  2. package/CoordinateSearch.js +2 -2
  3. package/CoordinateSearch.js.map +1 -1
  4. package/README.md +10 -8
  5. package/package.json +10 -10
package/CHANGELOG.md CHANGED
@@ -1,5 +1,37 @@
1
1
  # @open-pioneer/coordinate-search
2
2
 
3
+ ## 0.10.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 193068a: Deprecate the `mapId` property on React components.
8
+ Use the `MapModel` directly instead to pass a reference to the map.
9
+
10
+ Example:
11
+
12
+ ```tsx
13
+ // Default map for entire component tree
14
+ <DefaultMapProvider map={mapModel}>
15
+ <Toc />
16
+ </DefaultMapProvider>
17
+
18
+ // Map for specific component
19
+ <Toc map={mapModel} />
20
+ ```
21
+
22
+ ### Patch Changes
23
+
24
+ - cd1435b: Update ol to 10.5.0
25
+ - 032eed7: Bump dependencies.
26
+ - cd1435b: Update to react 19.1.0
27
+ - Updated dependencies [2bafdad]
28
+ - Updated dependencies [cd1435b]
29
+ - Updated dependencies [193068a]
30
+ - Updated dependencies [032eed7]
31
+ - Updated dependencies [cd1435b]
32
+ - Updated dependencies [7558df4]
33
+ - @open-pioneer/map@0.10.0
34
+
3
35
  ## 0.9.0
4
36
 
5
37
  ### Minor Changes
package/CoordinateSearch.js CHANGED
@@ -11,11 +11,11 @@ const CoordinateSearch = (props) => {
11
11
  const { map } = useMapModel(props);
12
12
  const olMap = map?.olMap;
13
13
  const { coordinates } = useCoordinates(olMap);
14
- return /* @__PURE__ */ jsx(
14
+ return map && /* @__PURE__ */ jsx(
15
15
  CoordinateInput,
16
16
  {
17
17
  ...containerProps,
18
- mapId: props.mapId,
18
+ map,
19
19
  onSelect: (event) => {
20
20
  if (!map) {
21
21
  return;
package/CoordinateSearch.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"CoordinateSearch.js","sources":["CoordinateSearch.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { MapModelProps, useMapModel } from \"@open-pioneer/map\";\nimport { CommonComponentProps, useCommonComponentProps } from \"@open-pioneer/react-utils\";\nimport { FC, useEffect, useState } from \"react\";\nimport { Coordinate } from \"ol/coordinate\";\nimport { EventsKey } from \"ol/events\";\nimport { unByKey } from \"ol/Observable\";\nimport OlMap from \"ol/Map\";\nimport { CoordinateInput, CoordinatesSelectEvent, ProjectionInput } from \"./CoordinateInput\";\n\n/**\n * Properties for the {@link CoordinateSearch}.\n */\nexport interface CoordinateSearchProps extends CommonComponentProps, MapModelProps {\n /**\n * Searchable projections, only projections that are known by the map as projection are shown.\n * Each projection can have an individual precision of coordinates. If no precision is given, the default precision is used.\n */\n projections?: ProjectionInput[];\n\n /**\n * Optional event that gets called if some coordinates are entered or projection is changed by the user.\n */\n onSelect?: (event: CoordinatesSelectEvent) => void;\n\n /**\n * Optional event that gets called if the input is cleared.\n */\n onClear?: () => void;\n}\n\n/**\n * The `CoordinateSearch` component can be used in an app to search for entered coordinates in a selected projection\n */\nexport const CoordinateSearch: FC<CoordinateSearchProps> = (props) => {\n const { onSelect, onClear, projections } = props;\n const { containerProps } = useCommonComponentProps(\"coordinate-search\", props);\n const { map } = useMapModel(props);\n const olMap = map?.olMap;\n\n const { coordinates } = useCoordinates(olMap); // coordinates of the pointer in the map\n\n return (\n <CoordinateInput\n {...containerProps}\n mapId={props.mapId}\n onSelect={(event: CoordinatesSelectEvent) => {\n if (!map) {\n return;\n }\n\n olMap?.getView().setCenter(event.coords);\n onSelect?.(event);\n }}\n onClear={onClear}\n placeholder={coordinates ? coordinates : \"\"}\n projections={projections}\n />\n );\n};\n\n/* get the current coordinates of the pointer on the map */\nfunction useCoordinates(map: OlMap | undefined): { coordinates: Coordinate | undefined } {\n const [coordinates, setCoordinates] = useState<Coordinate | undefined>();\n\n useEffect(() => {\n if (!map) {\n return;\n }\n\n const eventsKey: EventsKey = map.on(\"pointermove\", (evt) => {\n setCoordinates(evt.coordinate);\n });\n\n return () => unByKey(eventsKey);\n }, [map]);\n\n return { coordinates };\n}\n"],"names":[],"mappings":";;;;;;;AAmCa,MAAA,gBAAA,GAA8C,CAAC,KAAU,KAAA;AAClE,EAAA,MAAM,EAAE,QAAA,EAAU,OAAS,EAAA,WAAA,EAAgB,GAAA,KAAA;AAC3C,EAAA,MAAM,EAAE,cAAA,EAAmB,GAAA,uBAAA,CAAwB,qBAAqB,KAAK,CAAA;AAC7E,EAAA,MAAM,EAAE,GAAA,EAAQ,GAAA,WAAA,CAAY,KAAK,CAAA;AACjC,EAAA,MAAM,QAAQ,GAAK,EAAA,KAAA;AAEnB,EAAA,MAAM,EAAE,WAAA,EAAgB,GAAA,cAAA,CAAe,KAAK,CAAA;AAE5C,EACI,uBAAA,GAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACI,GAAG,cAAA;AAAA,MACJ,OAAO,KAAM,CAAA,KAAA;AAAA,MACb,QAAA,EAAU,CAAC,KAAkC,KAAA;AACzC,QAAA,IAAI,CAAC,GAAK,EAAA;AACN,UAAA;AAAA;AAGJ,QAAA,KAAA,EAAO,OAAQ,EAAA,CAAE,SAAU,CAAA,KAAA,CAAM,MAAM,CAAA;AACvC,QAAA,QAAA,GAAW,KAAK,CAAA;AAAA,OACpB;AAAA,MACA,OAAA;AAAA,MACA,WAAA,EAAa,cAAc,WAAc,GAAA,EAAA;AAAA,MACzC;AAAA;AAAA,GACJ;AAER;AAGA,SAAS,eAAe,GAAiE,EAAA;AACrF,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,QAAiC,EAAA;AAEvE,EAAA,SAAA,CAAU,MAAM;AACZ,IAAA,IAAI,CAAC,GAAK,EAAA;AACN,MAAA;AAAA;AAGJ,IAAA,MAAM,SAAuB,GAAA,GAAA,CAAI,EAAG,CAAA,aAAA,EAAe,CAAC,GAAQ,KAAA;AACxD,MAAA,cAAA,CAAe,IAAI,UAAU,CAAA;AAAA,KAChC,CAAA;AAED,IAAO,OAAA,MAAM,QAAQ,SAAS,CAAA;AAAA,GAClC,EAAG,CAAC,GAAG,CAAC,CAAA;AAER,EAAA,OAAO,EAAE,WAAY,EAAA;AACzB;;;;"}
1
+ {"version":3,"file":"CoordinateSearch.js","sources":["CoordinateSearch.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { MapModelProps, useMapModel } from \"@open-pioneer/map\";\nimport { CommonComponentProps, useCommonComponentProps } from \"@open-pioneer/react-utils\";\nimport { FC, useEffect, useState } from \"react\";\nimport { Coordinate } from \"ol/coordinate\";\nimport { EventsKey } from \"ol/events\";\nimport { unByKey } from \"ol/Observable\";\nimport OlMap from \"ol/Map\";\nimport { CoordinateInput, CoordinatesSelectEvent, ProjectionInput } from \"./CoordinateInput\";\n\n/**\n * Properties for the {@link CoordinateSearch}.\n */\nexport interface CoordinateSearchProps extends CommonComponentProps, MapModelProps {\n /**\n * Searchable projections, only projections that are known by the map as projection are shown.\n * Each projection can have an individual precision of coordinates. If no precision is given, the default precision is used.\n */\n projections?: ProjectionInput[];\n\n /**\n * Optional event that gets called if some coordinates are entered or projection is changed by the user.\n */\n onSelect?: (event: CoordinatesSelectEvent) => void;\n\n /**\n * Optional event that gets called if the input is cleared.\n */\n onClear?: () => void;\n}\n\n/**\n * The `CoordinateSearch` component can be used in an app to search for entered coordinates in a selected projection\n */\nexport const CoordinateSearch: FC<CoordinateSearchProps> = (props) => {\n const { onSelect, onClear, projections } = props;\n const { containerProps } = useCommonComponentProps(\"coordinate-search\", props);\n const { map } = useMapModel(props);\n const olMap = map?.olMap;\n\n const { coordinates } = useCoordinates(olMap); // coordinates of the pointer in the map\n\n return (\n map && (\n <CoordinateInput\n {...containerProps}\n map={map}\n onSelect={(event: CoordinatesSelectEvent) => {\n if (!map) {\n return;\n }\n\n olMap?.getView().setCenter(event.coords);\n onSelect?.(event);\n }}\n onClear={onClear}\n placeholder={coordinates ? coordinates : \"\"}\n projections={projections}\n />\n )\n );\n};\n\n/* get the current coordinates of the pointer on the map */\nfunction useCoordinates(map: OlMap | undefined): { coordinates: Coordinate | undefined } {\n const [coordinates, setCoordinates] = useState<Coordinate | undefined>();\n\n useEffect(() => {\n if (!map) {\n return;\n }\n\n const eventsKey: EventsKey = map.on(\"pointermove\", (evt) => {\n setCoordinates(evt.coordinate);\n });\n\n return () => unByKey(eventsKey);\n }, [map]);\n\n return { coordinates };\n}\n"],"names":[],"mappings":";;;;;;;AAmCa,MAAA,gBAAA,GAA8C,CAAC,KAAU,KAAA;AAClE,EAAA,MAAM,EAAE,QAAA,EAAU,OAAS,EAAA,WAAA,EAAgB,GAAA,KAAA;AAC3C,EAAA,MAAM,EAAE,cAAA,EAAmB,GAAA,uBAAA,CAAwB,qBAAqB,KAAK,CAAA;AAC7E,EAAA,MAAM,EAAE,GAAA,EAAQ,GAAA,WAAA,CAAY,KAAK,CAAA;AACjC,EAAA,MAAM,QAAQ,GAAK,EAAA,KAAA;AAEnB,EAAA,MAAM,EAAE,WAAA,EAAgB,GAAA,cAAA,CAAe,KAAK,CAAA;AAE5C,EAAA,OACI,GACI,oBAAA,GAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACI,GAAG,cAAA;AAAA,MACJ,GAAA;AAAA,MACA,QAAA,EAAU,CAAC,KAAkC,KAAA;AACzC,QAAA,IAAI,CAAC,GAAK,EAAA;AACN,UAAA;AAAA;AAGJ,QAAA,KAAA,EAAO,OAAQ,EAAA,CAAE,SAAU,CAAA,KAAA,CAAM,MAAM,CAAA;AACvC,QAAA,QAAA,GAAW,KAAK,CAAA;AAAA,OACpB;AAAA,MACA,OAAA;AAAA,MACA,WAAA,EAAa,cAAc,WAAc,GAAA,EAAA;AAAA,MACzC;AAAA;AAAA,GACJ;AAGZ;AAGA,SAAS,eAAe,GAAiE,EAAA;AACrF,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,QAAiC,EAAA;AAEvE,EAAA,SAAA,CAAU,MAAM;AACZ,IAAA,IAAI,CAAC,GAAK,EAAA;AACN,MAAA;AAAA;AAGJ,IAAA,MAAM,SAAuB,GAAA,GAAA,CAAI,EAAG,CAAA,aAAA,EAAe,CAAC,GAAQ,KAAA;AACxD,MAAA,cAAA,CAAe,IAAI,UAAU,CAAA;AAAA,KAChC,CAAA;AAED,IAAO,OAAA,MAAM,QAAQ,SAAS,CAAA;AAAA,GAClC,EAAG,CAAC,GAAG,CAAC,CAAA;AAER,EAAA,OAAO,EAAE,WAAY,EAAA;AACzB;;;;"}
package/README.md CHANGED
@@ -7,7 +7,9 @@ This package provides a UI component which allow users to search for coordinates
7
7
  To integrate the coordinate search in your app, insert the following snippet:
8
8
 
9
9
  ```jsx
10
- <CoordinateSearch mapId="map_id" />
10
+ <CoordinateSearch
11
+ map={map}
12
+ /> /* instead of passing the map, the `DefaultMapProvider` can alternatively be used */
11
13
  ```
12
14
 
13
15
  ### Configuration
@@ -16,7 +18,7 @@ To define the selectable projections, set the optional `projections` property:
16
18
 
17
19
  ```jsx
18
20
  <CoordinateSearch
19
- mapId="map_id"
21
+ map={map}
20
22
  projections={[
21
23
  {
22
24
  label: "EPSG:25832",
@@ -49,7 +51,7 @@ With the `onClear` option, you can set a callback function that gets called if t
49
51
 
50
52
  ```tsx
51
53
  <CoordinateSearch
52
- mapId="map_id"
54
+ map={map}
53
55
  onSelect={(event: CoordinatesEvent) => {
54
56
  // do something
55
57
  }}
@@ -64,7 +66,7 @@ With the `onClear` option, you can set a callback function that gets called if t
64
66
  To integrate the coordinate input component in your app, insert the following snippet:
65
67
 
66
68
  ```jsx
67
- <CoordinateInput mapId="map_id" />
69
+ <CoordinateInput map={map} />
68
70
  ```
69
71
 
70
72
  ### Configure projections
@@ -73,7 +75,7 @@ To define the selectable projections, set the optional `projections` property:
73
75
 
74
76
  ```jsx
75
77
  <CoordinateInput
76
- mapId="map_id"
78
+ map={map}
77
79
  projections={[
78
80
  {
79
81
  label: "EPSG:25832",
@@ -105,7 +107,7 @@ The coordinates have to be in the projection of the map.
105
107
  If the value changes, the `onSelect` function is triggered (see below).
106
108
 
107
109
  ```jsx
108
- <CoordinateInput mapId="map_id" input={[761166, 6692084]} />
110
+ <CoordinateInput map={map} input={[761166, 6692084]} />
109
111
  ```
110
112
 
111
113
  ### Configure the placeholder
@@ -119,8 +121,8 @@ A `Coordinate` input can be used for example for showing the coordinates of a se
119
121
  The Coordinates have to be in the projection of the map.
120
122
 
121
123
  ```jsx
122
- <CoordinateInput mapId="map_id" placeholder={[700000, 6000000]} />
123
- <CoordinateInput mapId="map_id" placeholder={"Enter coordinates here"} />
124
+ <CoordinateInput map={map} placeholder={[700000, 6000000]} />
125
+ <CoordinateInput map={map} placeholder={"Enter coordinates here"} />
124
126
  ```
125
127
 
126
128
  ### Listening to events
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "type": "module",
3
3
  "name": "@open-pioneer/coordinate-search",
4
- "version": "0.9.0",
4
+ "version": "0.10.0",
5
5
  "description": "This package provides a UI component to search for entered coordinates in the choosen projection.",
6
6
  "keywords": [
7
7
  "open-pioneer-trails"
@@ -14,17 +14,17 @@
14
14
  "directory": "src/packages/coordinate-search"
15
15
  },
16
16
  "dependencies": {
17
- "@conterra/reactivity-core": "^0.4.3",
18
- "@open-pioneer/core": "^3.0.0",
19
- "@open-pioneer/chakra-integration": "^3.0.0",
20
- "@open-pioneer/runtime": "^3.0.0",
21
- "@open-pioneer/react-utils": "^3.0.0",
22
- "@open-pioneer/reactivity": "^3.0.0",
17
+ "@conterra/reactivity-core": "^0.5.0",
18
+ "@open-pioneer/core": "^3.1.0",
19
+ "@open-pioneer/chakra-integration": "^3.1.0",
20
+ "@open-pioneer/runtime": "^3.1.0",
21
+ "@open-pioneer/react-utils": "^3.1.0",
22
+ "@open-pioneer/reactivity": "^3.1.0",
23
23
  "chakra-react-select": "^5.0.4",
24
24
  "@chakra-ui/icons": "^2.2.4",
25
- "ol": "^10.4.0",
26
- "react": "^19.0.0",
27
- "@open-pioneer/map": "^0.9.0"
25
+ "ol": "^10.5.0",
26
+ "react": "^19.1.0",
27
+ "@open-pioneer/map": "^0.10.0"
28
28
  },
29
29
  "exports": {
30
30
  "./package.json": "./package.json",