@mapka/maplibre-gl-sdk 0.16.1 → 0.16.3

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 (124) hide show
  1. package/README.md +10 -5
  2. package/lib/.buildInfo.json +1 -1
  3. package/lib/components/ImageCarousel.d.ts +7 -0
  4. package/lib/components/ImageCarousel.d.ts.map +1 -0
  5. package/lib/components/ImageCarousel.js +22 -0
  6. package/lib/components/PopupContent.d.ts +5 -1
  7. package/lib/components/PopupContent.d.ts.map +1 -1
  8. package/lib/components/PopupContent.js +12 -40
  9. package/lib/components/PopupDataRows.d.ts +7 -0
  10. package/lib/components/PopupDataRows.d.ts.map +1 -0
  11. package/lib/components/PopupDataRows.js +22 -0
  12. package/lib/components/PopupList.d.ts +10 -0
  13. package/lib/components/PopupList.d.ts.map +1 -0
  14. package/lib/components/PopupList.js +8 -0
  15. package/lib/components/PopupListItem.d.ts +13 -0
  16. package/lib/components/PopupListItem.d.ts.map +1 -0
  17. package/lib/components/PopupListItem.js +11 -0
  18. package/lib/components/icons/ChevronLeftIcon.d.ts +2 -0
  19. package/lib/components/icons/ChevronLeftIcon.d.ts.map +1 -0
  20. package/lib/components/icons/ChevronLeftIcon.js +4 -0
  21. package/lib/components/icons/ChevronRightIcon.d.ts +2 -0
  22. package/lib/components/icons/ChevronRightIcon.d.ts.map +1 -0
  23. package/lib/components/icons/ChevronRightIcon.js +4 -0
  24. package/lib/components/icons/CircleIcon.d.ts.map +1 -0
  25. package/lib/components/icons/CloseIcon.d.ts +2 -0
  26. package/lib/components/icons/CloseIcon.d.ts.map +1 -0
  27. package/lib/components/icons/CloseIcon.js +4 -0
  28. package/lib/components/icons/DownloadIcon.d.ts.map +1 -0
  29. package/lib/components/icons/FreehandIcon.d.ts.map +1 -0
  30. package/lib/components/icons/HeartIcon.d.ts +4 -0
  31. package/lib/components/icons/HeartIcon.d.ts.map +1 -0
  32. package/lib/components/icons/HeartIcon.js +4 -0
  33. package/lib/components/icons/LineIcon.d.ts.map +1 -0
  34. package/lib/components/icons/PencilIcon.d.ts.map +1 -0
  35. package/lib/components/icons/PolygonIcon.d.ts.map +1 -0
  36. package/lib/components/icons/ProgressDownIcon.d.ts +2 -0
  37. package/lib/components/icons/ProgressDownIcon.d.ts.map +1 -0
  38. package/lib/components/icons/RectangleIcon.d.ts.map +1 -0
  39. package/lib/components/icons/SelectIcon.d.ts.map +1 -0
  40. package/lib/components/icons/TrashIcon.d.ts.map +1 -0
  41. package/lib/controls/MapkaDrawControl.js +7 -7
  42. package/lib/controls/MapkaExportControl.js +2 -2
  43. package/lib/map.d.ts +8 -7
  44. package/lib/map.d.ts.map +1 -1
  45. package/lib/map.js +15 -9
  46. package/lib/modules/layerPopup.d.ts +2 -1
  47. package/lib/modules/layerPopup.d.ts.map +1 -1
  48. package/lib/modules/layerPopup.js +22 -15
  49. package/lib/modules/markers.d.ts +5 -0
  50. package/lib/modules/markers.d.ts.map +1 -1
  51. package/lib/modules/markers.js +21 -16
  52. package/lib/modules/popup.d.ts +3 -10
  53. package/lib/modules/popup.d.ts.map +1 -1
  54. package/lib/modules/popup.js +116 -100
  55. package/lib/modules/popupGroups.d.ts +14 -0
  56. package/lib/modules/popupGroups.d.ts.map +1 -0
  57. package/lib/modules/popupGroups.js +130 -0
  58. package/lib/styles.css +1 -1
  59. package/lib/types/popup.d.ts +10 -1
  60. package/lib/types/popup.d.ts.map +1 -1
  61. package/package.json +26 -7
  62. package/src/components/ImageCarousel.css +73 -0
  63. package/src/components/ImageCarousel.tsx +76 -0
  64. package/src/components/PopupContent.css +52 -189
  65. package/src/components/PopupContent.tsx +26 -195
  66. package/src/components/PopupDataRows.css +41 -0
  67. package/src/components/PopupDataRows.tsx +39 -0
  68. package/src/components/PopupList.css +24 -0
  69. package/src/components/PopupList.tsx +27 -0
  70. package/src/components/PopupListItem.css +61 -0
  71. package/src/components/PopupListItem.tsx +40 -0
  72. package/src/components/icons/ChevronLeftIcon.tsx +20 -0
  73. package/src/components/icons/ChevronRightIcon.tsx +20 -0
  74. package/src/components/icons/CloseIcon.tsx +13 -0
  75. package/src/components/icons/HeartIcon.tsx +18 -0
  76. package/src/components/{ProgressDownIcon.tsx → icons/ProgressDownIcon.tsx} +0 -3
  77. package/src/controls/MapkaDrawControl.tsx +7 -7
  78. package/src/controls/MapkaExportControl.tsx +2 -2
  79. package/src/map.ts +22 -20
  80. package/src/modules/layerPopup.ts +32 -21
  81. package/src/modules/markers.ts +26 -16
  82. package/src/modules/popup.tsx +129 -112
  83. package/src/modules/popupGroups.ts +190 -0
  84. package/src/styles.css +4 -0
  85. package/src/types/popup.ts +12 -1
  86. package/lib/components/CircleIcon.d.ts.map +0 -1
  87. package/lib/components/DownloadIcon.d.ts.map +0 -1
  88. package/lib/components/FreehandIcon.d.ts.map +0 -1
  89. package/lib/components/LineIcon.d.ts.map +0 -1
  90. package/lib/components/PencilIcon.d.ts.map +0 -1
  91. package/lib/components/PolygonIcon.d.ts.map +0 -1
  92. package/lib/components/ProgressDownIcon.d.ts +0 -4
  93. package/lib/components/ProgressDownIcon.d.ts.map +0 -1
  94. package/lib/components/RectangleIcon.d.ts.map +0 -1
  95. package/lib/components/SelectIcon.d.ts.map +0 -1
  96. package/lib/components/TrashIcon.d.ts.map +0 -1
  97. /package/lib/components/{CircleIcon.d.ts → icons/CircleIcon.d.ts} +0 -0
  98. /package/lib/components/{CircleIcon.js → icons/CircleIcon.js} +0 -0
  99. /package/lib/components/{DownloadIcon.d.ts → icons/DownloadIcon.d.ts} +0 -0
  100. /package/lib/components/{DownloadIcon.js → icons/DownloadIcon.js} +0 -0
  101. /package/lib/components/{FreehandIcon.d.ts → icons/FreehandIcon.d.ts} +0 -0
  102. /package/lib/components/{FreehandIcon.js → icons/FreehandIcon.js} +0 -0
  103. /package/lib/components/{LineIcon.d.ts → icons/LineIcon.d.ts} +0 -0
  104. /package/lib/components/{LineIcon.js → icons/LineIcon.js} +0 -0
  105. /package/lib/components/{PencilIcon.d.ts → icons/PencilIcon.d.ts} +0 -0
  106. /package/lib/components/{PencilIcon.js → icons/PencilIcon.js} +0 -0
  107. /package/lib/components/{PolygonIcon.d.ts → icons/PolygonIcon.d.ts} +0 -0
  108. /package/lib/components/{PolygonIcon.js → icons/PolygonIcon.js} +0 -0
  109. /package/lib/components/{ProgressDownIcon.js → icons/ProgressDownIcon.js} +0 -0
  110. /package/lib/components/{RectangleIcon.d.ts → icons/RectangleIcon.d.ts} +0 -0
  111. /package/lib/components/{RectangleIcon.js → icons/RectangleIcon.js} +0 -0
  112. /package/lib/components/{SelectIcon.d.ts → icons/SelectIcon.d.ts} +0 -0
  113. /package/lib/components/{SelectIcon.js → icons/SelectIcon.js} +0 -0
  114. /package/lib/components/{TrashIcon.d.ts → icons/TrashIcon.d.ts} +0 -0
  115. /package/lib/components/{TrashIcon.js → icons/TrashIcon.js} +0 -0
  116. /package/src/components/{CircleIcon.tsx → icons/CircleIcon.tsx} +0 -0
  117. /package/src/components/{DownloadIcon.tsx → icons/DownloadIcon.tsx} +0 -0
  118. /package/src/components/{FreehandIcon.tsx → icons/FreehandIcon.tsx} +0 -0
  119. /package/src/components/{LineIcon.tsx → icons/LineIcon.tsx} +0 -0
  120. /package/src/components/{PencilIcon.tsx → icons/PencilIcon.tsx} +0 -0
  121. /package/src/components/{PolygonIcon.tsx → icons/PolygonIcon.tsx} +0 -0
  122. /package/src/components/{RectangleIcon.tsx → icons/RectangleIcon.tsx} +0 -0
  123. /package/src/components/{SelectIcon.tsx → icons/SelectIcon.tsx} +0 -0
  124. /package/src/components/{TrashIcon.tsx → icons/TrashIcon.tsx} +0 -0
@@ -0,0 +1,7 @@
1
+ export declare function ImageCarousel({ imageUrls, title, }: {
2
+ imageUrls: string[];
3
+ title?: string;
4
+ onFavorite?: (id: string) => void;
5
+ id?: string;
6
+ }): import("preact").JSX.Element;
7
+ //# sourceMappingURL=ImageCarousel.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ImageCarousel.d.ts","sourceRoot":"","sources":["../../src/components/ImageCarousel.tsx"],"names":[],"mappings":"AAIA,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,KAAK,GACN,EAAE;IACD,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,gCA+DA"}
@@ -0,0 +1,22 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
2
+ import { useState } from "preact/hooks";
3
+ import { ChevronLeftIcon } from "./icons/ChevronLeftIcon.js";
4
+ import { ChevronRightIcon } from "./icons/ChevronRightIcon.js";
5
+ export function ImageCarousel({ imageUrls, title, }) {
6
+ const [currentIndex, setCurrentIndex] = useState(0);
7
+ const isFirstImage = currentIndex === 0;
8
+ const isLastImage = currentIndex === imageUrls.length - 1;
9
+ const handlePrev = (e) => {
10
+ e.stopPropagation();
11
+ if (currentIndex > 0) {
12
+ setCurrentIndex((prev) => prev - 1);
13
+ }
14
+ };
15
+ const handleNext = (e) => {
16
+ e.stopPropagation();
17
+ if (currentIndex < imageUrls.length - 1) {
18
+ setCurrentIndex((prev) => prev + 1);
19
+ }
20
+ };
21
+ return (_jsxs("div", { class: "mapka-popup-carousel", children: [_jsx("div", { class: "mapka-popup-carousel-image-container", children: _jsx("div", { class: "mapka-popup-carousel-track", style: { transform: `translateX(-${currentIndex * 100}%)` }, children: imageUrls.map((url, index) => (_jsx("img", { src: url, alt: title || `Image ${index + 1}`, class: "mapka-popup-carousel-image mapka-popup-image" }, index))) }) }), imageUrls.length > 1 && (_jsxs("div", { class: "mapka-popup-carousel-controls", children: [!isFirstImage && (_jsx("button", { type: "button", class: "mapka-popup-carousel-btn mapka-popup-carousel-prev", onClick: handlePrev, "aria-label": "Previous image", children: _jsx(ChevronLeftIcon, {}) })), !isLastImage && (_jsx("button", { type: "button", class: "mapka-popup-carousel-btn mapka-popup-carousel-next", onClick: handleNext, "aria-label": "Next image", children: _jsx(ChevronRightIcon, {}) }))] }))] }));
22
+ }
@@ -1,8 +1,12 @@
1
+ import type { MouseEventHandler } from "preact";
1
2
  import type { MapkaPopupContent } from "../types/popup.js";
2
3
  interface PopupProps extends MapkaPopupContent {
3
4
  onClose?: () => void;
4
5
  closeButton?: boolean;
5
6
  }
6
- export declare function PopupContent({ title, description, rows, closeButton, imageUrls, onFavorite, onClose, }: PopupProps): import("preact").JSX.Element;
7
+ export declare function CloseButton({ onClose }: {
8
+ onClose?: MouseEventHandler<HTMLButtonElement>;
9
+ }): import("preact").JSX.Element;
10
+ export declare function PopupContent({ title, description, rows, closeButton, imageUrls, primaryAction, onClose, }: PopupProps): import("preact").JSX.Element;
7
11
  export {};
8
12
  //# sourceMappingURL=PopupContent.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"PopupContent.d.ts","sourceRoot":"","sources":["../../src/components/PopupContent.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAE3D,UAAU,UAAW,SAAQ,iBAAiB;IAC5C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAqLD,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,WAAW,EACX,IAAI,EACJ,WAAW,EACX,SAAS,EACT,UAAU,EACV,OAAO,GACR,EAAE,UAAU,gCAyCZ"}
1
+ {"version":3,"file":"PopupContent.d.ts","sourceRoot":"","sources":["../../src/components/PopupContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAChD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAK3D,UAAU,UAAW,SAAQ,iBAAiB;IAC5C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAeD,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CAAE,gCAM1F;AAED,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,WAAW,EACX,IAAI,EACJ,WAAW,EACX,SAAc,EACd,aAAa,EACb,OAAO,GACR,EAAE,UAAU,gCA4BZ"}
@@ -1,51 +1,23 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
2
- import { Fragment } from "preact";
3
- import { useState } from "preact/hooks";
4
- function HeartIcon({ filled }) {
5
- return (_jsx("svg", { viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", class: "mapka-popup-icon", children: _jsx("path", { d: "M16 28c7-4.73 14-10 14-17a6.98 6.98 0 0 0-7-7c-1.8 0-3.58.68-4.95 2.05L16 8.1l-2.05-2.05a6.98 6.98 0 0 0-9.9 0A6.98 6.98 0 0 0 2 11c0 7 7 12.27 14 17z", fill: filled ? "currentColor" : "none", stroke: "currentColor", "stroke-width": "2" }) }));
6
- }
7
- function CloseIcon() {
8
- return (_jsx("svg", { viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", class: "mapka-popup-icon", children: _jsx("path", { d: "m8 8 16 16M24 8 8 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }) }));
9
- }
10
- function ChevronLeftIcon() {
11
- return (_jsx("svg", { viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", class: "mapka-popup-icon mapka-popup-icon-sm", children: _jsx("path", { d: "M20 28 8.7 16.7a1 1 0 0 1 0-1.4L20 4", fill: "none", stroke: "currentColor", "stroke-width": "4" }) }));
12
- }
13
- function ChevronRightIcon() {
14
- return (_jsx("svg", { viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", class: "mapka-popup-icon mapka-popup-icon-sm", children: _jsx("path", { d: "m12 4 11.3 11.3a1 1 0 0 1 0 1.4L12 28", fill: "none", stroke: "currentColor", "stroke-width": "4" }) }));
15
- }
16
- function ImageCarousel({ imageUrls, title, onFavorite, id, }) {
17
- const [currentIndex, setCurrentIndex] = useState(0);
18
- const isFirstImage = currentIndex === 0;
19
- const isLastImage = currentIndex === imageUrls.length - 1;
20
- const handlePrev = (e) => {
2
+ import { CloseIcon } from "./icons/CloseIcon.js";
3
+ import { PopupDataRows } from "./PopupDataRows.js";
4
+ import { ImageCarousel } from "./ImageCarousel.js";
5
+ function PrimaryButton({ label, onClick }) {
6
+ const handleClick = (e) => {
21
7
  e.stopPropagation();
22
- if (currentIndex > 0) {
23
- setCurrentIndex((prev) => prev - 1);
24
- }
8
+ onClick?.();
25
9
  };
26
- const handleNext = (e) => {
27
- e.stopPropagation();
28
- if (currentIndex < imageUrls.length - 1) {
29
- setCurrentIndex((prev) => prev + 1);
30
- }
31
- };
32
- const handleFavoriteClick = (e) => {
33
- e.stopPropagation();
34
- if (onFavorite && id) {
35
- onFavorite(id);
36
- }
37
- };
38
- return (_jsxs("div", { class: "mapka-popup-carousel", children: [_jsx("div", { class: "mapka-popup-carousel-track", style: { transform: `translateX(-${currentIndex * 100}%)` }, children: imageUrls.map((url, index) => (_jsx("img", { src: url, alt: title || `Image ${index + 1}`, class: "mapka-popup-carousel-image mapka-popup-image" }, index))) }), onFavorite && (_jsx("div", { class: "mapka-popup-carousel-actions", children: _jsx("button", { type: "button", class: "mapka-popup-action-btn", onClick: handleFavoriteClick, "aria-label": "Add to favorites", children: _jsx(HeartIcon, {}) }) })), imageUrls.length > 1 && (_jsxs(Fragment, { children: [!isFirstImage && (_jsx("button", { type: "button", class: "mapka-popup-carousel-btn mapka-popup-carousel-prev", onClick: handlePrev, "aria-label": "Previous image", children: _jsx(ChevronLeftIcon, {}) })), !isLastImage && (_jsx("button", { type: "button", class: "mapka-popup-carousel-btn mapka-popup-carousel-next", onClick: handleNext, "aria-label": "Next image", children: _jsx(ChevronRightIcon, {}) })), _jsx("div", { class: "mapka-popup-dots", children: imageUrls.map((_, index) => (_jsx("button", { type: "button", class: `mapka-popup-dot ${index === currentIndex ? "mapka-popup-dot-active" : ""}`, onClick: (e) => {
39
- e.stopPropagation();
40
- setCurrentIndex(index);
41
- }, "aria-label": `Go to image ${index + 1}` }, index))) })] }))] }));
10
+ return (_jsx("button", { type: "button", class: "mapka-popup-button-primary", onClick: handleClick, children: label }));
11
+ }
12
+ export function CloseButton({ onClose }) {
13
+ return (_jsx("button", { type: "button", class: "mapka-popup-close-btn", onClick: onClose, "aria-label": "Close", children: _jsx(CloseIcon, {}) }));
42
14
  }
43
- export function PopupContent({ title, description, rows, closeButton, imageUrls, onFavorite, onClose, }) {
15
+ export function PopupContent({ title, description, rows, closeButton, imageUrls = [], primaryAction, onClose, }) {
44
16
  const hasImages = imageUrls && imageUrls.length > 0;
45
17
  const hasRows = rows && rows.length > 0;
46
18
  const handleCloseClick = (e) => {
47
19
  e.stopPropagation();
48
20
  onClose?.();
49
21
  };
50
- return (_jsxs("div", { class: "mapka-popup", children: [closeButton && (_jsx("button", { type: "button", class: "mapka-popup-close-btn", onClick: handleCloseClick, "aria-label": "Close", children: _jsx(CloseIcon, {}) })), hasImages && _jsx(ImageCarousel, { imageUrls: imageUrls, title: title, onFavorite: onFavorite }), _jsxs("div", { class: "mapka-popup-content", children: [title && _jsx("h3", { class: "mapka-popup-title", children: title }), description && _jsx("p", { class: "mapka-popup-description", children: description }), hasRows && (_jsx("dl", { class: "mapka-popup-rows", children: rows.map((row, index) => (_jsxs("div", { class: "mapka-popup-row", children: [_jsx("dt", { class: "mapka-popup-row-label", children: row.name }), _jsx("dd", { class: "mapka-popup-row-value", children: row.value != null ? String(row.value) : "—" })] }, index))) }))] })] }));
22
+ return (_jsxs("div", { class: "mapka-popup", children: [closeButton && _jsx(CloseButton, { onClose: handleCloseClick }), hasImages && _jsx(ImageCarousel, { imageUrls: imageUrls, title: title }), _jsxs("div", { class: "mapka-popup-content", children: [title && _jsx("h3", { class: "mapka-popup-title", children: title }), description && _jsx("p", { class: "mapka-popup-description", children: description }), hasRows && _jsx(PopupDataRows, { rows: rows }), primaryAction && (_jsx("div", { class: "mapka-popup-actions", children: _jsx(PrimaryButton, { label: primaryAction.label, onClick: primaryAction.onClick }) }))] })] }));
51
23
  }
@@ -0,0 +1,7 @@
1
+ import type { MapkaPopupRow } from "../types/popup.js";
2
+ export declare function displayRowValue(value: unknown): {};
3
+ export declare function displayRowName(name: string): string;
4
+ export declare function PopupDataRows({ rows }: {
5
+ rows: MapkaPopupRow[];
6
+ }): import("preact").JSX.Element;
7
+ //# sourceMappingURL=PopupDataRows.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PopupDataRows.d.ts","sourceRoot":"","sources":["../../src/components/PopupDataRows.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAEvD,wBAAgB,eAAe,CAAC,KAAK,EAAE,OAAO,MAgB7C;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,UAE1C;AAED,wBAAgB,aAAa,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,aAAa,EAAE,CAAA;CAAE,gCAchE"}
@@ -0,0 +1,22 @@
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "preact/jsx-runtime";
2
+ export function displayRowValue(value) {
3
+ if (value == null) {
4
+ return "-";
5
+ }
6
+ if (typeof value === "number") {
7
+ return value.toLocaleString();
8
+ }
9
+ if (typeof value === "boolean") {
10
+ return value ? "true" : "false";
11
+ }
12
+ if (typeof value === "object") {
13
+ return JSON.stringify(value);
14
+ }
15
+ return value;
16
+ }
17
+ export function displayRowName(name) {
18
+ return name;
19
+ }
20
+ export function PopupDataRows({ rows }) {
21
+ return (_jsx("dl", { class: "mapka-popup-rows", children: rows.map((row, index) => (_jsxs(_Fragment, { children: [index > 0 && _jsx("div", { class: "mapka-popup-row-divider" }), _jsxs("div", { class: "mapka-popup-row", children: [_jsx("dt", { class: "mapka-popup-row-label", children: displayRowName(row.name) }), _jsx("dd", { class: "mapka-popup-row-value", children: displayRowValue(row.value) })] }, index)] }))) }));
22
+ }
@@ -0,0 +1,10 @@
1
+ import type { MapkaPopupOptionsResolved } from "../types/popup.js";
2
+ interface PopupCollectionProps {
3
+ items: MapkaPopupOptionsResolved[];
4
+ }
5
+ export declare function PopupCustomElement({ popup }: {
6
+ popup: HTMLElement;
7
+ }): HTMLElement;
8
+ export declare function PopupList({ items }: PopupCollectionProps): import("preact").JSX.Element;
9
+ export {};
10
+ //# sourceMappingURL=PopupList.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PopupList.d.ts","sourceRoot":"","sources":["../../src/components/PopupList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAGnE,UAAU,oBAAoB;IAC5B,KAAK,EAAE,yBAAyB,EAAE,CAAC;CACpC;AAED,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,WAAW,CAAA;CAAE,eAEnE;AAED,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,EAAE,oBAAoB,gCAexD"}
@@ -0,0 +1,8 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
2
+ import { PopupListItem } from "./PopupListItem.js";
3
+ export function PopupCustomElement({ popup }) {
4
+ return popup;
5
+ }
6
+ export function PopupList({ items }) {
7
+ return (_jsxs("div", { class: "mapka-popup-list-wrapper", children: [_jsx("div", { class: "mapka-popup-list", children: items.map(({ content, id }) => content instanceof HTMLElement ? (_jsx(PopupCustomElement, { popup: content }, id)) : (_jsx(PopupListItem, { popup: content }, id))) }), _jsx("div", { class: "mapka-popup-list-gradient" })] }));
8
+ }
@@ -0,0 +1,13 @@
1
+ import type { MapkaPopupContent } from "../types/popup.js";
2
+ interface PopupHeaderProps {
3
+ title?: string;
4
+ description?: string;
5
+ imageUrls: string[];
6
+ }
7
+ export declare function PopupHeader({ title, description, imageUrls: [firstImage] }: PopupHeaderProps): import("preact").JSX.Element;
8
+ interface PopupCollectionItemProps {
9
+ popup: MapkaPopupContent;
10
+ }
11
+ export declare function PopupListItem({ popup: { title, description, rows, imageUrls }, }: PopupCollectionItemProps): import("preact").JSX.Element;
12
+ export {};
13
+ //# sourceMappingURL=PopupListItem.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PopupListItem.d.ts","sourceRoot":"","sources":["../../src/components/PopupListItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAE3D,UAAU,gBAAgB;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,EAAE,CAAC;CACrB;AAED,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,CAAC,UAAU,CAAC,EAAE,EAAE,gBAAgB,gCAW5F;AAED,UAAU,wBAAwB;IAChC,KAAK,EAAE,iBAAiB,CAAC;CAC1B;AAED,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,IAAS,EAAE,SAAc,EAAE,GACzD,EAAE,wBAAwB,gCAW1B"}
@@ -0,0 +1,11 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
2
+ import { PopupDataRows } from "./PopupDataRows.js";
3
+ export function PopupHeader({ title, description, imageUrls: [firstImage] }) {
4
+ return (_jsxs("div", { class: "mapka-popup-list-item-header", children: [firstImage && _jsx("img", { src: firstImage, alt: title, class: "mapka-popup-list-item-image" }), _jsxs("div", { class: "mapka-popup-list-item-info", children: [title && _jsx("span", { class: "mapka-popup-list-item-title", children: title }), description && _jsx("span", { class: "mapka-popup-list-item-description", children: description })] })] }));
5
+ }
6
+ export function PopupListItem({ popup: { title, description, rows = [], imageUrls = [] }, }) {
7
+ const hasImages = Boolean(imageUrls.length);
8
+ const hasHeader = Boolean(title || description || hasImages);
9
+ const hasDataRows = Boolean(rows.length);
10
+ return (_jsxs("div", { class: "mapka-popup-list-item", children: [hasHeader && _jsx(PopupHeader, { title: title, description: description, imageUrls: imageUrls }), hasDataRows && _jsx(PopupDataRows, { rows: rows })] }));
11
+ }
@@ -0,0 +1,2 @@
1
+ export declare function ChevronLeftIcon(): import("preact").JSX.Element;
2
+ //# sourceMappingURL=ChevronLeftIcon.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChevronLeftIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/ChevronLeftIcon.tsx"],"names":[],"mappings":"AAAA,wBAAgB,eAAe,iCAmB9B"}
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "preact/jsx-runtime";
2
+ export function ChevronLeftIcon() {
3
+ return (_jsx("svg", { viewBox: "0 0 16 16", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", class: "mapka-popup-icon mapka-popup-icon-sm", children: _jsx("path", { d: "M10 3 5.7 7.3a1 1 0 0 0 0 1.4L10 13", fill: "none", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }) }));
4
+ }
@@ -0,0 +1,2 @@
1
+ export declare function ChevronRightIcon(): import("preact").JSX.Element;
2
+ //# sourceMappingURL=ChevronRightIcon.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChevronRightIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/ChevronRightIcon.tsx"],"names":[],"mappings":"AAAA,wBAAgB,gBAAgB,iCAmB/B"}
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "preact/jsx-runtime";
2
+ export function ChevronRightIcon() {
3
+ return (_jsx("svg", { viewBox: "0 0 16 16", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", class: "mapka-popup-icon mapka-popup-icon-sm", children: _jsx("path", { d: "m6 3 4.3 4.3a1 1 0 0 1 0 1.4L6 13", fill: "none", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }) }));
4
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CircleIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/CircleIcon.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU,oCAmBtB,CAAC"}
@@ -0,0 +1,2 @@
1
+ export declare function CloseIcon(): import("preact").JSX.Element;
2
+ //# sourceMappingURL=CloseIcon.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CloseIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/CloseIcon.tsx"],"names":[],"mappings":"AAAA,wBAAgB,SAAS,iCAYxB"}
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "preact/jsx-runtime";
2
+ export function CloseIcon() {
3
+ return (_jsx("svg", { viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", class: "mapka-popup-icon", children: _jsx("path", { d: "m8 8 16 16M24 8 8 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }) }));
4
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DownloadIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/DownloadIcon.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY,oCAqBxB,CAAC"}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FreehandIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/FreehandIcon.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY,oCAmBxB,CAAC"}
@@ -0,0 +1,4 @@
1
+ export declare function HeartIcon({ filled }: {
2
+ filled?: boolean;
3
+ }): import("preact").JSX.Element;
4
+ //# sourceMappingURL=HeartIcon.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"HeartIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/HeartIcon.tsx"],"names":[],"mappings":"AAAA,wBAAgB,SAAS,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,CAAC,EAAE,OAAO,CAAA;CAAE,gCAiBzD"}
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "preact/jsx-runtime";
2
+ export function HeartIcon({ filled }) {
3
+ return (_jsx("svg", { viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", class: "mapka-popup-icon", children: _jsx("path", { d: "M16 28c7-4.73 14-10 14-17a6.98 6.98 0 0 0-7-7c-1.8 0-3.58.68-4.95 2.05L16 8.1l-2.05-2.05a6.98 6.98 0 0 0-9.9 0A6.98 6.98 0 0 0 2 11c0 7 7 12.27 14 17z", fill: filled ? "currentColor" : "none", stroke: "currentColor", "stroke-width": "2" }) }));
4
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LineIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/LineIcon.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,QAAQ,oCAqBpB,CAAC"}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PencilIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/PencilIcon.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU,oCAoBtB,CAAC"}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PolygonIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/PolygonIcon.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW,oCA0BvB,CAAC"}
@@ -0,0 +1,2 @@
1
+ export declare const ProgressDownIcon: () => import("preact").JSX.Element;
2
+ //# sourceMappingURL=ProgressDownIcon.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ProgressDownIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/ProgressDownIcon.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB,oCAyB5B,CAAC"}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"RectangleIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/RectangleIcon.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,aAAa,oCAmBzB,CAAC"}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SelectIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/SelectIcon.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU,oCAoBtB,CAAC"}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TrashIcon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/TrashIcon.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS,oCAuBrB,CAAC"}
@@ -3,13 +3,13 @@ import { render } from "preact";
3
3
  import maplibregl from "maplibre-gl";
4
4
  import { TerraDraw, TerraDrawSelectMode, TerraDrawPolygonMode, TerraDrawRectangleMode, TerraDrawCircleMode, TerraDrawLineStringMode, TerraDrawFreehandMode, } from "terra-draw";
5
5
  import { TerraDrawMapLibreGLAdapter } from "terra-draw-maplibre-gl-adapter";
6
- import { SelectIcon } from "../components/SelectIcon.js";
7
- import { PolygonIcon } from "../components/PolygonIcon.js";
8
- import { RectangleIcon } from "../components/RectangleIcon.js";
9
- import { CircleIcon } from "../components/CircleIcon.js";
10
- import { LineIcon } from "../components/LineIcon.js";
11
- import { TrashIcon } from "../components/TrashIcon.js";
12
- import { FreehandIcon } from "../components/FreehandIcon.js";
6
+ import { SelectIcon } from "../components/icons/SelectIcon.js";
7
+ import { PolygonIcon } from "../components/icons/PolygonIcon.js";
8
+ import { RectangleIcon } from "../components/icons/RectangleIcon.js";
9
+ import { CircleIcon } from "../components/icons/CircleIcon.js";
10
+ import { LineIcon } from "../components/icons/LineIcon.js";
11
+ import { TrashIcon } from "../components/icons/TrashIcon.js";
12
+ import { FreehandIcon } from "../components/icons/FreehandIcon.js";
13
13
  import { isEmpty } from "es-toolkit/compat";
14
14
  const ModeButton = ({ mode, isActive, onClick, }) => {
15
15
  if (mode === "static")
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx } from "preact/jsx-runtime";
2
2
  import { render } from "preact";
3
- import { DownloadIcon } from "../components/DownloadIcon.js";
4
- import { ProgressDownIcon } from "../components/ProgressDownIcon.js";
3
+ import { DownloadIcon } from "../components/icons/DownloadIcon.js";
4
+ import { ProgressDownIcon } from "../components/icons/ProgressDownIcon.js";
5
5
  const Button = ({ isExporting, onClick }) => {
6
6
  return (_jsx("button", { type: "button", className: "maplibregl-ctrl maplibregl-ctrl-group", title: "Export map as PNG", "aria-label": "Export map as PNG", disabled: isExporting, onClick: onClick, children: isExporting ? _jsx(ProgressDownIcon, {}) : _jsx(DownloadIcon, {}) }));
7
7
  };
package/lib/map.d.ts CHANGED
@@ -2,7 +2,7 @@ import * as maplibregl from "maplibre-gl";
2
2
  import type { Marker, Popup, MapOptions, StyleSwapOptions, StyleOptions, StyleSpecification } from "maplibre-gl";
3
3
  import type { MapkaMarkerOptions } from "./types/marker.js";
4
4
  import type { MapkaExportOptions } from "./types/export.js";
5
- import type { MapkaPopupOptions } from "./types/popup.js";
5
+ import type { MapkaPopupOptions, MapkaPopupOptionsResolved } from "./types/popup.js";
6
6
  import type { MapkaAddLayerObject } from "./types/layer.js";
7
7
  export interface MapkaMapOptions extends MapOptions {
8
8
  maxPopups?: number;
@@ -11,8 +11,8 @@ export interface MapkaMapOptions extends MapOptions {
11
11
  env?: "dev" | "prod" | "local";
12
12
  }
13
13
  export type MapMapkaPopup = {
14
- id: string | string[];
15
- options: MapkaPopupOptions;
14
+ ids: string[];
15
+ options: MapkaPopupOptionsResolved[];
16
16
  container: HTMLElement;
17
17
  popup: Popup;
18
18
  };
@@ -33,14 +33,15 @@ export declare class MapkaMap extends maplibregl.Map {
33
33
  maxPopups: number;
34
34
  scrollPopups: boolean;
35
35
  popups: MapMapkaPopup[];
36
- constructor({ transformRequest, apiKey, maxPopups, ...options }: MapkaMapOptions);
36
+ constructor({ transformRequest, apiKey, maxPopups, scrollPopups, ...options }: MapkaMapOptions);
37
37
  setStyle(style: string | StyleSpecification, options?: StyleSwapOptions & StyleOptions): this;
38
38
  addMarkers(markers: MapkaMarkerOptions[]): void;
39
39
  updateMarkers(markers: MapkaMarkerOptions[]): void;
40
40
  removeMarkers(): void;
41
- openPopup(popup: MapkaPopupOptions): string;
42
- closePopup(id: string): void;
43
- updatePopup(popup: MapkaPopupOptions): void;
41
+ openPopup(popup: MapkaPopupOptions | MapkaPopupOptions[]): string[];
42
+ closePopup(id: string | string[]): void;
43
+ updatePopup(popup: MapkaPopupOptions): string[];
44
+ getPopups(): MapMapkaPopup[];
44
45
  removePopups(): void;
45
46
  export(options?: MapkaExportOptions): Promise<HTMLImageElement>;
46
47
  addLayer(layer: MapkaAddLayerObject, beforeId?: string): this;
package/lib/map.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"map.d.ts","sourceRoot":"","sources":["../src/map.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,UAAU,MAAM,aAAa,CAAC;AAiB1C,OAAO,KAAK,EACV,MAAM,EACN,KAAK,EAGL,UAAU,EAEV,gBAAgB,EAChB,YAAY,EACZ,kBAAkB,EACnB,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAG5D,MAAM,WAAW,eAAgB,SAAQ,UAAU;IACjD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,MAAM,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;CAChC;AA0BD,MAAM,MAAM,aAAa,GAAG;IAC1B,EAAE,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACtB,OAAO,EAAE,iBAAiB,CAAC;IAC3B,SAAS,EAAE,WAAW,CAAC;IACvB,KAAK,EAAE,KAAK,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,kBAAkB,CAAC;IAC5B,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,UAAU,MAAM;IACd,GAAG,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;IAClC,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;CACrC;AAED,qBAAa,QAAS,SAAQ,UAAU,CAAC,GAAG;IAC1C,MAAM,CAAC,GAAG,EAAE,MAAM,CAAU;IAErB,MAAM,EAAE,MAAM,CAAW;IACzB,OAAO,EAAE,cAAc,EAAE,CAAM;IAE/B,SAAS,EAAE,MAAM,CAAK;IACtB,YAAY,EAAE,OAAO,CAAQ;IAC7B,MAAM,EAAE,aAAa,EAAE,CAAM;gBAEjB,EAAE,gBAAgB,EAAE,MAAM,EAAE,SAAa,EAAE,GAAG,OAAO,EAAE,EAAE,eAAe;IAsBpF,QAAQ,CACb,KAAK,EAAE,MAAM,GAAG,kBAAkB,EAClC,OAAO,GAAE,gBAAgB,GAAG,YAAiB;IAexC,UAAU,CAAC,OAAO,EAAE,kBAAkB,EAAE;IAIxC,aAAa,CAAC,OAAO,EAAE,kBAAkB,EAAE;IAI3C,aAAa;IAIb,SAAS,CAAC,KAAK,EAAE,iBAAiB;IAIlC,UAAU,CAAC,EAAE,EAAE,MAAM;IAIrB,WAAW,CAAC,KAAK,EAAE,iBAAiB;IAIpC,YAAY;IAIN,MAAM,CAAC,OAAO,CAAC,EAAE,kBAAkB;IAIzC,QAAQ,CAAC,KAAK,EAAE,mBAAmB,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CAIrE"}
1
+ {"version":3,"file":"map.d.ts","sourceRoot":"","sources":["../src/map.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,UAAU,MAAM,aAAa,CAAC;AAW1C,OAAO,KAAK,EACV,MAAM,EACN,KAAK,EAGL,UAAU,EAEV,gBAAgB,EAChB,YAAY,EACZ,kBAAkB,EACnB,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AACrF,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAG5D,MAAM,WAAW,eAAgB,SAAQ,UAAU;IACjD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,MAAM,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;CAChC;AA0BD,MAAM,MAAM,aAAa,GAAG;IAC1B,GAAG,EAAE,MAAM,EAAE,CAAC;IACd,OAAO,EAAE,yBAAyB,EAAE,CAAC;IACrC,SAAS,EAAE,WAAW,CAAC;IACvB,KAAK,EAAE,KAAK,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,kBAAkB,CAAC;IAC5B,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,UAAU,MAAM;IACd,GAAG,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;IAClC,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;CACrC;AAED,qBAAa,QAAS,SAAQ,UAAU,CAAC,GAAG;IAC1C,MAAM,CAAC,GAAG,EAAE,MAAM,CAAU;IAErB,MAAM,EAAE,MAAM,CAAW;IACzB,OAAO,EAAE,cAAc,EAAE,CAAM;IAE/B,SAAS,EAAE,MAAM,CAAK;IACtB,YAAY,EAAE,OAAO,CAAQ;IAC7B,MAAM,EAAE,aAAa,EAAE,CAAM;gBAEjB,EAAE,gBAAgB,EAAE,MAAM,EAAE,SAAa,EAAE,YAAmB,EAAE,GAAG,OAAO,EAAE,EAAE,eAAe;IA0BzG,QAAQ,CACb,KAAK,EAAE,MAAM,GAAG,kBAAkB,EAClC,OAAO,GAAE,gBAAgB,GAAG,YAAiB;IAexC,UAAU,CAAC,OAAO,EAAE,kBAAkB,EAAE;IAIxC,aAAa,CAAC,OAAO,EAAE,kBAAkB,EAAE;IAI3C,aAAa;IAIb,SAAS,CAAC,KAAK,EAAE,iBAAiB,GAAG,iBAAiB,EAAE;IAIxD,UAAU,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,EAAE;IAIhC,WAAW,CAAC,KAAK,EAAE,iBAAiB;IAIpC,SAAS;IAIT,YAAY;IAIN,MAAM,CAAC,OAAO,CAAC,EAAE,kBAAkB;IAIzC,QAAQ,CAAC,KAAK,EAAE,mBAAmB,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CAIrE"}
package/lib/map.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import * as maplibregl from "maplibre-gl";
2
2
  import { loadLayersIcons } from "./modules/icons.js";
3
3
  import { exportMap } from "./modules/export.js";
4
- import { closeOnMapClickPopups, closePopupsById, openPopup, removePopups, updatePopup, } from "./modules/popup.js";
4
+ import { closePopupsByIds, reconciliatePopups, closePopups } from "./modules/popup.js";
5
5
  import { addMarkers, addStyleDiffMarkers, addStyleMarkers, removeMarkers, updateMarkers, } from "./modules/markers.js";
6
- import { openOnFeatureClickPopups } from "./modules/layerPopup.js";
6
+ import { openClickPopups } from "./modules/layerPopup.js";
7
7
  const noopTransformRequest = (url) => {
8
8
  return {
9
9
  url,
@@ -30,18 +30,21 @@ export class MapkaMap extends maplibregl.Map {
30
30
  maxPopups = 1;
31
31
  scrollPopups = true;
32
32
  popups = [];
33
- constructor({ transformRequest, apiKey, maxPopups = 1, ...options }) {
33
+ constructor({ transformRequest, apiKey, maxPopups = 1, scrollPopups = true, ...options }) {
34
34
  super({
35
35
  ...options,
36
36
  transformRequest: createTransformRequest(apiKey, transformRequest),
37
37
  });
38
38
  this.maxPopups = maxPopups;
39
+ this.scrollPopups = scrollPopups;
39
40
  super.on("styleimagemissing", (event) => {
40
41
  loadLayersIcons(this, event);
41
42
  });
42
43
  super.on("click", (event) => {
43
- closeOnMapClickPopups(this);
44
- openOnFeatureClickPopups(this, event);
44
+ openClickPopups(this, event);
45
+ });
46
+ super.on("zoomend", () => {
47
+ reconciliatePopups(this);
45
48
  });
46
49
  super.on("style.load", () => {
47
50
  addStyleMarkers(this);
@@ -68,16 +71,19 @@ export class MapkaMap extends maplibregl.Map {
68
71
  removeMarkers(this);
69
72
  }
70
73
  openPopup(popup) {
71
- return openPopup(this, popup);
74
+ return reconciliatePopups(this, Array.isArray(popup) ? popup : [popup]);
72
75
  }
73
76
  closePopup(id) {
74
- closePopupsById(this, id);
77
+ closePopupsByIds(this, Array.isArray(id) ? id : [id]);
75
78
  }
76
79
  updatePopup(popup) {
77
- return updatePopup(this, popup);
80
+ return reconciliatePopups(this, Array.isArray(popup) ? popup : [popup]);
81
+ }
82
+ getPopups() {
83
+ return this.popups;
78
84
  }
79
85
  removePopups() {
80
- removePopups(this);
86
+ closePopups(this);
81
87
  }
82
88
  async export(options) {
83
89
  return exportMap(this, options);
@@ -1,4 +1,5 @@
1
1
  import type { MapMouseEvent } from "maplibre-gl";
2
2
  import type { MapkaMap } from "../map.js";
3
- export declare function openOnFeatureClickPopups(map: MapkaMap, { lngLat, point }: MapMouseEvent): void;
3
+ export declare function openClickPopups(map: MapkaMap, { lngLat, point }: MapMouseEvent): void;
4
+ export declare function openOnHoverPopups(map: MapkaMap, { lngLat, point }: MapMouseEvent): void;
4
5
  //# sourceMappingURL=layerPopup.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"layerPopup.d.ts","sourceRoot":"","sources":["../../src/modules/layerPopup.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAA6B,MAAM,aAAa,CAAC;AAC5E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAI1C,wBAAgB,wBAAwB,CAAC,GAAG,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,aAAa,QAgBvF"}
1
+ {"version":3,"file":"layerPopup.d.ts","sourceRoot":"","sources":["../../src/modules/layerPopup.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAoC,MAAM,aAAa,CAAC;AACnF,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AA+D1C,wBAAgB,eAAe,CAAC,GAAG,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,aAAa,QAQ9E;AAED,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,aAAa,QAOhF"}
@@ -1,22 +1,10 @@
1
1
  import { get } from "es-toolkit/compat";
2
2
  import { isBoolean, isPlainObject } from "es-toolkit";
3
- export function openOnFeatureClickPopups(map, { lngLat, point }) {
4
- const features = map.queryRenderedFeatures(point);
5
- if (features.length === 0) {
6
- return;
7
- }
8
- const popups = getFeaturePopups(features, lngLat);
9
- if (popups.length === 0) {
10
- return;
11
- }
12
- for (const popup of popups) {
13
- map.openPopup(popup);
14
- }
15
- }
3
+ import { closeOnMapClickPopups, getPopupId } from "./popup.js";
16
4
  function genericPropertiesToPopup(feature, lngLat) {
17
5
  const { id, properties, layer } = feature;
18
6
  return {
19
- id: id ?? properties.id,
7
+ id: id ?? properties.id ?? getPopupId(layer),
20
8
  lngLat: lngLat.toArray(),
21
9
  content: {
22
10
  title: layer.id,
@@ -30,7 +18,8 @@ function genericPropertiesToPopup(feature, lngLat) {
30
18
  function buildConfigDrivenPopup(feature, config, lngLat) {
31
19
  throw new Error("Not implemented", { cause: { config, feature, lngLat } });
32
20
  }
33
- function getFeaturePopups(features, lngLat) {
21
+ function getFeaturePopups(map, point, lngLat, trigger) {
22
+ const features = map.queryRenderedFeatures(point);
34
23
  const popups = [];
35
24
  for (const feature of features) {
36
25
  const { layer: { metadata }, } = feature;
@@ -43,8 +32,26 @@ function getFeaturePopups(features, lngLat) {
43
32
  continue;
44
33
  }
45
34
  if (isPlainObject(mapkaPopup)) {
35
+ if (mapkaPopup.trigger && mapkaPopup.trigger !== trigger) {
36
+ continue;
37
+ }
46
38
  popups.push(buildConfigDrivenPopup(feature, mapkaPopup, lngLat));
47
39
  }
48
40
  }
49
41
  return popups;
50
42
  }
43
+ export function openClickPopups(map, { lngLat, point }) {
44
+ closeOnMapClickPopups(map);
45
+ const featurePopups = getFeaturePopups(map, point, lngLat, "click");
46
+ if (featurePopups.length === 0) {
47
+ return;
48
+ }
49
+ map.openPopup(featurePopups);
50
+ }
51
+ export function openOnHoverPopups(map, { lngLat, point }) {
52
+ const featurePopups = getFeaturePopups(map, point, lngLat, "hover");
53
+ if (featurePopups.length === 0) {
54
+ return;
55
+ }
56
+ map.openPopup(featurePopups);
57
+ }
@@ -4,6 +4,11 @@ import type { MapkaMarkerOptions } from "../types/marker.js";
4
4
  export declare function getMarkerId(marker: {
5
5
  id?: string;
6
6
  }): string;
7
+ export declare function getMarkerPopupId(marker: {
8
+ id?: string;
9
+ }, popup: {
10
+ id?: string;
11
+ }): string;
7
12
  export declare function addMarkers(currentMap: MapkaMap, markersOptions: MapkaMarkerOptions[]): void;
8
13
  export declare function removeMarkersByIds(map: MapkaMap, ids: string[]): void;
9
14
  export declare function updateMarkers(map: MapkaMap, markersOptions: MapkaMarkerOptions[]): void;
@@ -1 +1 @@
1
- {"version":3,"file":"markers.d.ts","sourceRoot":"","sources":["../../src/modules/markers.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAU,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAC9D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAC1C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAkB7D,wBAAgB,WAAW,CAAC,MAAM,EAAE;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,UAElD;AA4ED,wBAAgB,UAAU,CAAC,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,kBAAkB,EAAE,QAcpF;AAED,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,MAAM,EAAE,QAK9D;AAED,wBAAgB,aAAa,CAAC,GAAG,EAAE,QAAQ,EAAE,cAAc,EAAE,kBAAkB,EAAE,QAKhF;AAED,wBAAgB,aAAa,CAAC,GAAG,EAAE,QAAQ,QAK1C;AAED,wBAAgB,eAAe,CAAC,GAAG,EAAE,QAAQ,QAK5C;AAED,wBAAgB,mBAAmB,CAAC,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,kBAAkB,QAG1E"}
1
+ {"version":3,"file":"markers.d.ts","sourceRoot":"","sources":["../../src/modules/markers.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAU,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAC9D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAC1C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAkB7D,wBAAgB,WAAW,CAAC,MAAM,EAAE;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,UAElD;AAED,wBAAgB,gBAAgB,CAAC,MAAM,EAAE;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,EAAE,KAAK,EAAE;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,UAE/E;AAmFD,wBAAgB,UAAU,CAAC,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,kBAAkB,EAAE,QAcpF;AAED,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,MAAM,EAAE,QAK9D;AAED,wBAAgB,aAAa,CAAC,GAAG,EAAE,QAAQ,EAAE,cAAc,EAAE,kBAAkB,EAAE,QAKhF;AAED,wBAAgB,aAAa,CAAC,GAAG,EAAE,QAAQ,QAK1C;AAED,wBAAgB,eAAe,CAAC,GAAG,EAAE,QAAQ,QAK5C;AAED,wBAAgB,mBAAmB,CAAC,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,kBAAkB,QAG1E"}