mirror of
https://github.com/maputnik/editor.git
synced 2026-09-12 07:17:26 +00:00
Compare commits
2 Commits
f59e481280
...
5c1c3fd8cb
| Author | SHA1 | Date | |
|---|---|---|---|
 dependabot[bot]
|
5c1c3fd8cb | ||
|
dependabot[bot]
|
4424276073 |
@@ -2,9 +2,13 @@
|
|||||||
|
|
||||||
### ✨ Features and improvements
|
### ✨ Features and improvements
|
||||||
- Replace Cypress with Playwright for end-to-end tests and Vitest browser mode (Playwright provider) for component tests; drop the `@shellygo/cypress-test-utils` helper in favour of a `MaputnikDriver` page object
|
- Replace Cypress with Playwright for end-to-end tests and Vitest browser mode (Playwright provider) for component tests; drop the `@shellygo/cypress-test-utils` helper in favour of a `MaputnikDriver` page object
|
||||||
|
- Upgrade to MapLibre GL JS 6 and Vite 8, and update the remaining dependencies
|
||||||
|
- Serve the RTL text plugin from `@mapbox/mapbox-gl-rtl-text` instead of a pinned CDN URL, so its version is tracked in `package.json`
|
||||||
|
- Exported HTML now loads MapLibre GL JS as an ES module, since v6 no longer ships a UMD bundle
|
||||||
- _...Add new stuff here..._
|
- _...Add new stuff here..._
|
||||||
|
|
||||||
### 🐞 Bug fixes
|
### 🐞 Bug fixes
|
||||||
|
- The map's data listener now fires on tile loads again, so source and vector layer field autocompletion is populated
|
||||||
- _...Add new stuff here..._
|
- _...Add new stuff here..._
|
||||||
|
|
||||||
## 3.1.0
|
## 3.1.0
|
||||||
|
|||||||
@@ -14,6 +14,7 @@ export default defineConfig({
|
|||||||
files: ["**/*.{js,jsx,ts,tsx}"],
|
files: ["**/*.{js,jsx,ts,tsx}"],
|
||||||
ignores: [
|
ignores: [
|
||||||
"dist/**/*",
|
"dist/**/*",
|
||||||
|
"public/**/*",
|
||||||
],
|
],
|
||||||
languageOptions: {
|
languageOptions: {
|
||||||
ecmaVersion: 2024,
|
ecmaVersion: 2024,
|
||||||
|
|||||||
Generated
+939
-1405
File diff suppressed because it is too large
Load Diff
+19
-18
@@ -5,10 +5,11 @@
|
|||||||
"type": "module",
|
"type": "module",
|
||||||
"main": "''",
|
"main": "''",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "vite",
|
"copy-rtl-text-plugin": "mkdir -p public && cp -p node_modules/@mapbox/mapbox-gl-rtl-text/dist/mapbox-gl-rtl-text.js public/",
|
||||||
"build": "tsc && vite build --mode=production",
|
"start": "npm run copy-rtl-text-plugin && vite",
|
||||||
"build-desktop": "tsc && vite build --mode=desktop && cd desktop && make",
|
"build": "npm run copy-rtl-text-plugin && tsc && vite build --mode=production",
|
||||||
"build-linux": "tsc && vite build --mode=desktop && cd desktop && make bin/linux/maputnik",
|
"build-desktop": "npm run copy-rtl-text-plugin && tsc && vite build --mode=desktop && cd desktop && make",
|
||||||
|
"build-linux": "npm run copy-rtl-text-plugin && tsc && vite build --mode=desktop && cd desktop && make bin/linux/maputnik",
|
||||||
"i18n:extract": "npx i18next-cli extract",
|
"i18n:extract": "npx i18next-cli extract",
|
||||||
"lint": "eslint",
|
"lint": "eslint",
|
||||||
"test": "playwright test",
|
"test": "playwright test",
|
||||||
@@ -30,7 +31,7 @@
|
|||||||
"@codemirror/lint": "^6.9.7",
|
"@codemirror/lint": "^6.9.7",
|
||||||
"@codemirror/state": "^6.7.1",
|
"@codemirror/state": "^6.7.1",
|
||||||
"@codemirror/theme-one-dark": "^6.1.3",
|
"@codemirror/theme-one-dark": "^6.1.3",
|
||||||
"@codemirror/view": "^6.43.8",
|
"@codemirror/view": "^6.43.9",
|
||||||
"@dnd-kit/core": "^6.3.1",
|
"@dnd-kit/core": "^6.3.1",
|
||||||
"@dnd-kit/sortable": "^10.0.0",
|
"@dnd-kit/sortable": "^10.0.0",
|
||||||
"@dnd-kit/utilities": "^3.2.2",
|
"@dnd-kit/utilities": "^3.2.2",
|
||||||
@@ -59,20 +60,20 @@
|
|||||||
"lodash.get": "^4.4.2",
|
"lodash.get": "^4.4.2",
|
||||||
"lodash.isequal": "^4.5.0",
|
"lodash.isequal": "^4.5.0",
|
||||||
"lodash.throttle": "^4.1.1",
|
"lodash.throttle": "^4.1.1",
|
||||||
"maplibre-gl": "^5.24.0",
|
"maplibre-gl": "^6.4.1",
|
||||||
"maputnik-design": "github:maputnik/design#172b06c",
|
"maputnik-design": "github:maputnik/design#172b06c",
|
||||||
"ol": "^10.10.0",
|
"ol": "^10.10.0",
|
||||||
"ol-mapbox-style": "^13.4.2",
|
"ol-mapbox-style": "^13.4.2",
|
||||||
"pmtiles": "^4.5.0",
|
"pmtiles": "^4.5.0",
|
||||||
"prop-types": "^15.8.1",
|
"prop-types": "^15.8.1",
|
||||||
"react": "^19.2.7",
|
"react": "^19.2.8",
|
||||||
"react-accessible-accordion": "^5.0.1",
|
"react-accessible-accordion": "^5.0.1",
|
||||||
"react-aria-menubutton": "^8.0.0",
|
"react-aria-menubutton": "^8.0.0",
|
||||||
"react-aria-modal": "^5.0.2",
|
"react-aria-modal": "^5.0.2",
|
||||||
"react-collapse": "^5.1.1",
|
"react-collapse": "^5.1.1",
|
||||||
"react-color": "^2.19.3",
|
"react-color": "^2.19.3",
|
||||||
"react-dom": "^19.2.7",
|
"react-dom": "^19.2.8",
|
||||||
"react-i18next": "^17.0.8",
|
"react-i18next": "^17.0.11",
|
||||||
"react-icons": "^5.7.0",
|
"react-icons": "^5.7.0",
|
||||||
"react-markdown": "^10.1.0",
|
"react-markdown": "^10.1.0",
|
||||||
"reconnecting-websocket": "^4.4.0",
|
"reconnecting-websocket": "^4.4.0",
|
||||||
@@ -115,22 +116,22 @@
|
|||||||
"@types/lodash.isequal": "^4.5.8",
|
"@types/lodash.isequal": "^4.5.8",
|
||||||
"@types/lodash.throttle": "^4.1.9",
|
"@types/lodash.throttle": "^4.1.9",
|
||||||
"@types/randomcolor": "^0.5.9",
|
"@types/randomcolor": "^0.5.9",
|
||||||
"@types/react": "^19.2.17",
|
"@types/react": "^19.2.18",
|
||||||
"@types/react-aria-menubutton": "^6.2.14",
|
"@types/react-aria-menubutton": "^6.2.14",
|
||||||
"@types/react-aria-modal": "^5.0.0",
|
"@types/react-aria-modal": "^5.0.0",
|
||||||
"@types/react-collapse": "^5.0.4",
|
"@types/react-collapse": "^5.0.4",
|
||||||
"@types/react-color": "^3.0.13",
|
"@types/react-color": "^3.0.13",
|
||||||
"@types/react-dom": "^19.2.3",
|
"@types/react-dom": "^19.2.4",
|
||||||
"@types/string-hash": "^1.1.3",
|
"@types/string-hash": "^1.1.3",
|
||||||
"@types/wicg-file-system-access": "^2023.10.7",
|
"@types/wicg-file-system-access": "^2023.10.7",
|
||||||
"@vitejs/plugin-react": "5.2",
|
"@vitejs/plugin-react": "^6.0.5",
|
||||||
"@vitest/coverage-v8": "^4.1.10",
|
"@vitest/coverage-v8": "^4.1.11",
|
||||||
"cors": "^2.8.6",
|
"cors": "^2.8.6",
|
||||||
"eslint": "^10.8.1",
|
"eslint": "^10.8.1",
|
||||||
"eslint-plugin-react": "^7.37.5",
|
"eslint-plugin-react": "^7.37.5",
|
||||||
"eslint-plugin-react-hooks": "^7.1.1",
|
"eslint-plugin-react-hooks": "^7.1.1",
|
||||||
"eslint-plugin-react-refresh": "^0.5.3",
|
"eslint-plugin-react-refresh": "^0.5.4",
|
||||||
"i18next-cli": "^1.69.0",
|
"i18next-cli": "^1.71.0",
|
||||||
"istanbul": "^0.4.5",
|
"istanbul": "^0.4.5",
|
||||||
"istanbul-lib-coverage": "^3.2.2",
|
"istanbul-lib-coverage": "^3.2.2",
|
||||||
"nyc": "^18.0.0",
|
"nyc": "^18.0.0",
|
||||||
@@ -142,9 +143,9 @@
|
|||||||
"stylelint-scss": "^7.2.0",
|
"stylelint-scss": "^7.2.0",
|
||||||
"typescript": "^6.0.3",
|
"typescript": "^6.0.3",
|
||||||
"typescript-eslint": "^8.67.0",
|
"typescript-eslint": "^8.67.0",
|
||||||
"uuid": "^14.0.1",
|
"uuid": "^14.0.2",
|
||||||
"vite": "^7.3.2",
|
"vite": "^8.2.1",
|
||||||
"vite-plugin-istanbul": "^9.0.1",
|
"vite-plugin-istanbul": "^9.0.1",
|
||||||
"vitest": "^4.1.10"
|
"vitest": "^4.1.11"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import Color from "color";
|
import Color from "color";
|
||||||
import ChromePicker from "react-color/lib/components/chrome/Chrome";
|
import {ChromePicker, type ColorResult} from "react-color";
|
||||||
import {type ColorResult} from "react-color";
|
|
||||||
import lodash from "lodash";
|
import lodash from "lodash";
|
||||||
|
|
||||||
function formatColor(color: ColorResult): string {
|
function formatColor(color: ColorResult): string {
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import {createRoot} from "react-dom/client";
|
import {createRoot} from "react-dom/client";
|
||||||
import MapLibreGl, {type LayerSpecification, type LngLat, type Map, type MapOptions, type SourceSpecification, type StyleSpecification} from "maplibre-gl";
|
import * as MapLibreGl from "maplibre-gl";
|
||||||
|
import {type LayerSpecification, type LngLat, type Map, type MapOptions, type SourceSpecification, type StyleSpecification} from "maplibre-gl";
|
||||||
import MaplibreInspect from "@maplibre/maplibre-gl-inspect";
|
import MaplibreInspect from "@maplibre/maplibre-gl-inspect";
|
||||||
import colors from "@maplibre/maplibre-gl-inspect/lib/colors";
|
import colors from "@maplibre/maplibre-gl-inspect/lib/colors";
|
||||||
import { FeatureLayerPopup as MapMaplibreGlLayerPopup } from "./MapMaplibreGlLayerPopup";
|
import { FeatureLayerPopup as MapMaplibreGlLayerPopup } from "./MapMaplibreGlLayerPopup";
|
||||||
@@ -10,7 +11,7 @@ import { ZoomControl } from "../libs/zoomcontrol";
|
|||||||
import { type HighlightedLayer, colorHighlightedLayer } from "../libs/highlight";
|
import { type HighlightedLayer, colorHighlightedLayer } from "../libs/highlight";
|
||||||
import "maplibre-gl/dist/maplibre-gl.css";
|
import "maplibre-gl/dist/maplibre-gl.css";
|
||||||
import "../maplibregl.css";
|
import "../maplibregl.css";
|
||||||
import "../libs/maplibre-rtl";
|
import "../libs/maplibre-init";
|
||||||
import MaplibreGeocoder, { type MaplibreGeocoderApi, type MaplibreGeocoderApiConfig } from "@maplibre/maplibre-gl-geocoder";
|
import MaplibreGeocoder, { type MaplibreGeocoderApi, type MaplibreGeocoderApiConfig } from "@maplibre/maplibre-gl-geocoder";
|
||||||
import "@maplibre/maplibre-gl-geocoder/dist/maplibre-gl-geocoder.css";
|
import "@maplibre/maplibre-gl-geocoder/dist/maplibre-gl-geocoder.css";
|
||||||
import { withTranslation, type WithTranslation } from "react-i18next";
|
import { withTranslation, type WithTranslation } from "react-i18next";
|
||||||
@@ -238,7 +239,7 @@ class MapMaplibreGlInternal extends React.Component<MapMaplibreGlInternalProps,
|
|||||||
});
|
});
|
||||||
|
|
||||||
map.on("data", e => {
|
map.on("data", e => {
|
||||||
if(e.dataType !== "tile") return;
|
if(e.dataType !== "source" || !e.tile) return;
|
||||||
this.props.onDataChange!({
|
this.props.onDataChange!({
|
||||||
map: this.state.map
|
map: this.state.map
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -59,7 +59,6 @@ class ModalExportInternal extends React.Component<ModalExportInternalProps> {
|
|||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<title>${htmlTitle}</title>
|
<title>${htmlTitle}</title>
|
||||||
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
|
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
|
||||||
<script src="https://unpkg.com/maplibre-gl@${MAPLIBRE_GL_VERSION}/dist/maplibre-gl.js"></script>
|
|
||||||
<link href="https://unpkg.com/maplibre-gl@${MAPLIBRE_GL_VERSION}/dist/maplibre-gl.css" rel="stylesheet" />
|
<link href="https://unpkg.com/maplibre-gl@${MAPLIBRE_GL_VERSION}/dist/maplibre-gl.css" rel="stylesheet" />
|
||||||
<style>
|
<style>
|
||||||
body { margin: 0; padding: 0; }
|
body { margin: 0; padding: 0; }
|
||||||
@@ -68,8 +67,9 @@ class ModalExportInternal extends React.Component<ModalExportInternalProps> {
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="map"></div>
|
<div id="map"></div>
|
||||||
<script>
|
<script type="module">
|
||||||
const map = new maplibregl.Map({
|
import {Map} from 'https://unpkg.com/maplibre-gl@${MAPLIBRE_GL_VERSION}/dist/maplibre-gl.mjs';
|
||||||
|
const map = new Map({
|
||||||
container: 'map',
|
container: 'map',
|
||||||
style: ${tokenStyle},
|
style: ${tokenStyle},
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -0,0 +1,5 @@
|
|||||||
|
import { setRTLTextPlugin, setWorkerUrl } from "maplibre-gl";
|
||||||
|
import workerUrl from "maplibre-gl/dist/maplibre-gl-worker.mjs?worker&url";
|
||||||
|
|
||||||
|
setWorkerUrl(workerUrl);
|
||||||
|
setRTLTextPlugin(`${import.meta.env.BASE_URL}mapbox-gl-rtl-text.js`, false);
|
||||||
@@ -1,3 +0,0 @@
|
|||||||
import MapLibreGl from "maplibre-gl";
|
|
||||||
|
|
||||||
MapLibreGl.setRTLTextPlugin("https://unpkg.com/@mapbox/mapbox-gl-rtl-text@0.2.3/mapbox-gl-rtl-text.min.js", false);
|
|
||||||
@@ -32,8 +32,6 @@ export class ZoomControl {
|
|||||||
|
|
||||||
addEventListeners (){
|
addEventListeners (){
|
||||||
this._map!.on("render", () => this.updateZoomLevel());
|
this._map!.on("render", () => this.updateZoomLevel());
|
||||||
this._map!.on("zoomIn", () => this.updateZoomLevel());
|
|
||||||
this._map!.on("zoomOut", () => this.updateZoomLevel());
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onRemove() {
|
onRemove() {
|
||||||
|
|||||||
@@ -214,7 +214,7 @@
|
|||||||
|
|
||||||
// SPACE HELPER
|
// SPACE HELPER
|
||||||
.maputnik-space {
|
.maputnik-space {
|
||||||
@include mixins.vendor-prefix(flex-grow, 1);
|
flex-grow: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
// MESSAGE PANEL
|
// MESSAGE PANEL
|
||||||
|
|||||||
@@ -101,8 +101,7 @@
|
|||||||
.maputnik-select {
|
.maputnik-select {
|
||||||
@extend .maputnik-input !optional; /* stylelint-disable-line */
|
@extend .maputnik-input !optional; /* stylelint-disable-line */
|
||||||
|
|
||||||
-moz-appearance: none;
|
appearance: none;
|
||||||
-webkit-appearance: none;
|
|
||||||
background: vars.$color-gray url("#{vars.$icon-down-arrow}") right center no-repeat;
|
background: vars.$color-gray url("#{vars.$icon-down-arrow}") right center no-repeat;
|
||||||
color: vars.$color-white;
|
color: vars.$color-white;
|
||||||
background-position: calc(100% - 2px) center;
|
background-position: calc(100% - 2px) center;
|
||||||
|
|||||||
@@ -74,7 +74,6 @@
|
|||||||
line-height: 1.3;
|
line-height: 1.3;
|
||||||
max-height: 50px;
|
max-height: 50px;
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
-webkit-transition: opacity 600ms, visibility 600ms;
|
|
||||||
transition: opacity 600ms, visibility 600ms;
|
transition: opacity 600ms, visibility 600ms;
|
||||||
|
|
||||||
&:focus-within {
|
&:focus-within {
|
||||||
|
|||||||
+2
-14
@@ -1,21 +1,9 @@
|
|||||||
@mixin vendor-prefix($name, $argument) {
|
|
||||||
-webkit-#{$name}: #{$argument};
|
|
||||||
-ms-#{$name}: #{$argument};
|
|
||||||
-moz-#{$name}: #{$argument};
|
|
||||||
-o-#{$name}: #{$argument};
|
|
||||||
#{$name}: #{$argument};
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin flex-row {
|
@mixin flex-row {
|
||||||
display: flex;
|
display: flex;
|
||||||
display: -ms-flexbox;
|
flex-direction: row;
|
||||||
|
|
||||||
@include vendor-prefix(flex-direction, row);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin flex-column {
|
@mixin flex-column {
|
||||||
display: flex;
|
display: flex;
|
||||||
display: -ms-flexbox;
|
flex-direction: column;
|
||||||
|
|
||||||
@include vendor-prefix(flex-direction, column);
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,7 +7,7 @@
|
|||||||
|
|
||||||
&::-webkit-scrollbar-thumb {
|
&::-webkit-scrollbar-thumb {
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
|
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
|
||||||
background-color: #666;
|
background-color: #666;
|
||||||
padding-left: 2px;
|
padding-left: 2px;
|
||||||
padding-right: 2px;
|
padding-right: 2px;
|
||||||
|
|||||||
+1
-1
@@ -3,7 +3,7 @@
|
|||||||
"target": "ES2020",
|
"target": "ES2020",
|
||||||
"useDefineForClassFields": true,
|
"useDefineForClassFields": true,
|
||||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||||
"types": ["geojson", "@types/wicg-file-system-access", "node"],
|
"types": ["geojson", "@types/wicg-file-system-access", "node", "vite/client"],
|
||||||
"module": "ESNext",
|
"module": "ESNext",
|
||||||
"skipLibCheck": true,
|
"skipLibCheck": true,
|
||||||
|
|
||||||
|
|||||||
+8
-2
@@ -7,7 +7,10 @@ export default defineConfig(({ mode }) => ({
|
|||||||
port: 8888,
|
port: 8888,
|
||||||
},
|
},
|
||||||
build: {
|
build: {
|
||||||
sourcemap: true
|
sourcemap: true,
|
||||||
|
rolldownOptions: {
|
||||||
|
checks: { invalidAnnotation: false },
|
||||||
|
},
|
||||||
},
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
react(),
|
react(),
|
||||||
@@ -17,8 +20,11 @@ export default defineConfig(({ mode }) => ({
|
|||||||
forceBuildInstrument: true, // Instrument the source so e2e runs can collect coverage
|
forceBuildInstrument: true, // Instrument the source so e2e runs can collect coverage
|
||||||
}),
|
}),
|
||||||
],
|
],
|
||||||
|
optimizeDeps: {
|
||||||
|
exclude: ["maplibre-gl/dist/maplibre-gl-worker.mjs"],
|
||||||
|
},
|
||||||
base: mode === "desktop" ? "/" : "/maputnik/",
|
base: mode === "desktop" ? "/" : "/maputnik/",
|
||||||
define: {
|
define: {
|
||||||
global: "window"
|
global: "globalThis"
|
||||||
},
|
},
|
||||||
}));
|
}));
|
||||||
|
|||||||
Reference in New Issue
Block a user