@mapcomponents/react-maplibre 1.3.3 → 1.5.0-2

package/package.json

@@ -1,225 +1,194 @@
 {
-	"name": "@mapcomponents/react-maplibre",
-	"version": "1.3.3",
-	"main": "dist/index.cjs.js",
-	"license": "MIT",
-	"module": "dist/index.esm.js",
-	"source": "src/index.ts",
-	"types": "dist/src/index.d.ts",
-	"scripts": {
-		"build": "rollup -c",
-		"start": "storybook dev",
-		"cypress-test": "npx cypress run --component",
-		"cypress": "npx cypress open",
-		"test": "node scripts/test.cjs --watchAll=false --coverage",
-		"test:noninteractive": "node scripts/test.cjs --verbose --watchAll=false --coverage",
-		"test:generate-output": "node scripts/test.cjs --watchAll=false --json --outputFile=./src/.jest-test-results.json || true",
-		"build-storybook": "storybook build -o docs-build",
-		"storybook-docs": "storybook dev --docs --no-manager-cache",
-		"build-catalogue-meta": "node scripts/build-catalogue-meta.js",
-		"create-component": "./scripts/create-map-component.sh"
-	},
-	"dependencies": {
-		"@cypress/react": "^9.0.1",
-		"@dnd-kit/core": "^6.3.1",
-		"@dnd-kit/modifiers": "^9.0.0",
-		"@dnd-kit/sortable": "^10.0.0",
-		"@dnd-kit/utilities": "^3.2.2",
-		"@emotion/css": "^11.13.5",
-		"@emotion/react": "^11.14.0",
-		"@emotion/styled": "^11.14.1",
-		"@eslint/eslintrc": "^3.3.1",
-		"@eslint/js": "^9.30.0",
-		"@mapbox/mapbox-gl-draw": "1.4.3",
-		"@mapbox/mapbox-gl-sync-move": "^0.3.1",
-		"@mui/icons-material": "^7.2.0",
-		"@mui/material": "^7.2.0",
-		"@mui/system": "^7.2.0",
-		"@reduxjs/toolkit": "^2.6.1",
-		"@rollup/plugin-json": "^6.1.0",
-		"@testing-library/dom": "^10.4.0",
-		"@tmcw/togeojson": "^7.0.0",
-		"@turf/helpers": "^7.2.0",
-		"@turf/turf": "^7.2.0",
-		"@types/d3": "^7.4.3",
-		"@types/geojson": "^7946.0.16",
-		"@types/react-color": "^3.0.13",
-		"@types/topojson-client": "^3.1.5",
-		"@xmldom/xmldom": "^0.9.8",
-		"csv2geojson": "^5.1.2",
-		"d3": "^7.9.0",
-		"globals": "^16.3.0",
-		"jspdf": "^3.0.1",
-		"maplibre-gl": "5.6.0",
-		"osm2geojson-lite": "^1.0.3",
-		"pako": "^2.1.0",
-		"react-color": "^2.19.3",
-		"react-moveable": "^0.56.0",
-		"react-redux": "^9.2.0",
-		"redux": "^5.0.1",
-		"redux-thunk": "^3.1.0",
-		"three": "^0.178.0",
-		"topojson-client": "^3.1.0",
-		"uuid": "^11.1.0",
-		"wms-capabilities": "^0.6.0"
-	},
-	"devDependencies": {
-		"@babel/plugin-proposal-private-property-in-object": "^7.21.11",
-		"@babel/preset-react": "^7.26.3",
-		"@bahmutov/cy-rollup": "^2.0.0",
-		"@rollup/plugin-babel": "^6.0.4",
-		"@rollup/plugin-commonjs": "^28.0.6",
-		"@rollup/plugin-url": "^8.0.2",
-		"@storybook/addon-docs": "^9.0.15",
-		"@storybook/addon-links": "^9.0.15",
-		"@storybook/addons": "^7.6.17",
-		"@storybook/react-webpack5": "^9.0.15",
-		"@storybook/testing-react": "^2.0.1",
-		"@testing-library/react": "^16.3.0",
-		"@types/chai": "^5.2.1",
-		"@types/elasticlunr": "^0.9.5",
-		"@types/enzyme": "^3.10.18",
-		"@types/expect": "^24.3.2",
-		"@types/jest": "^30.0.0",
-		"@types/mapbox__mapbox-gl-draw": "^1.4.9",
-		"@types/mapbox__point-geometry": "^0.1.4",
-		"@types/mapbox__vector-tile": "^2.0.0",
-		"@types/mocha": "^10.0.10",
-		"@types/pako": "^2.0.3",
-		"@types/react": "^19.1.0",
-		"@types/react-dom": "^19.1.1",
-		"@types/sql.js": "^1.4.9",
-		"@types/three": "^0.177.0",
-		"@types/uuid": "^10.0.0",
-		"@typescript-eslint/eslint-plugin": "^8.35.1",
-		"@typescript-eslint/parser": "^8.35.1",
-		"avj": "^0.0.0",
-		"babel-jest": "^30.0.2",
-		"babel-loader": "^10.0.0",
-		"babel-plugin-inline-react-svg": "^2.0.2",
-		"babel-plugin-styled-components": "^2.1.4",
-		"babel-preset-react-app": "^10.1.0",
-		"chai": "^5.2.0",
-		"cypress": "^14.5.0",
-		"elasticlunr": "^0.9.5",
-		"eslint": "^9.30.0",
-		"eslint-config-prettier": "^10.1.1",
-		"eslint-plugin-react": "^7.37.5",
-		"eslint-plugin-storybook": "^9.0.15",
-		"glob": "^11.0.1",
-		"jest": "30.0.3",
-		"jest-circus": "30.0.3",
-		"jest-environment-jsdom": "^30.0.2",
-		"jest-enzyme": "^7.1.2",
-		"jest-resolve": "30.0.2",
-		"jest-watch-typeahead": "3.0.1",
-		"mocha": "^11.7.1",
-		"node-fetch": "^3.3.2",
-		"path-browserify": "^1.0.1",
-		"postcss": "^8.5.6",
-		"prettier": "3.6.2",
-		"react": "^19.1.0",
-		"react-app-polyfill": "^3.0.0",
-		"react-dev-utils": "^12.0.1",
-		"react-dom": "^19.1.0",
-		"react-draggable": "^4.5.0",
-		"react-i18next": "^15.4.1",
-		"rollup": "^4.44.1",
-		"rollup-plugin-delete": "^3.0.1",
-		"rollup-plugin-import-css": "^4.0.1",
-		"rollup-plugin-node-externals": "^8.0.1",
-		"rollup-plugin-typescript2": "^0.36.0",
-		"showdown": "^2.1.0",
-		"sql.js": "^1.13.0",
-		"storybook": "^9.0.15",
-		"ts-jest": "^29.3.1",
-		"ts-loader": "^9.5.2",
-		"ts-node": "^10.9.2",
-		"typescript": "^5.8.3"
-	},
-	"jest": {
-		"roots": [
-			"<rootDir>/src"
-		],
-		"collectCoverageFrom": [
-			"src/**/*.{js,jsx,ts,tsx}",
-			"!src/**/*.d.ts"
-		],
-		"setupFiles": [
-			"react-app-polyfill/jsdom"
-		],
-		"setupFilesAfterEnv": [
-			"<rootDir>/src/setupTests.js"
-		],
-		"testMatch": [
-			"<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}",
-			"<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}"
-		],
-		"testEnvironment": "jsdom",
-		"transform": {
-			"^.+\\.(js|jsx|mjs|cjs|ts|tsx)$": "<rootDir>/config/jest/babelTransform.js",
-			"^.+\\.css$": "<rootDir>/config/jest/cssTransform.js",
-			"^(?!.*\\.(js|jsx|mjs|cjs|ts|tsx|css|json)$)": "<rootDir>/config/jest/fileTransform.js",
-			"^.+\\.svg$": "<rootDir>/config/jest/fileTransform.js"
-		},
-		"transformIgnorePatterns": [
-			"[/\\\\]node_modules[/\\\\](?!three/examples/jsm/).+\\.(js|jsx|mjs|cjs|ts|tsx)$",
-			"^.+\\.module\\.(css|sass|scss)$"
-		],
-		"modulePaths": [],
-		"moduleNameMapper": {
-			"^react-native$": "react-native-web",
-			"^.+\\.module\\.(css|sass|scss)$": "identity-obj-proxy",
-			"^maplibre-gl/dist/maplibre-gl$": "<rootDir>/node_modules/maplibre-gl",
-			"d3": "<rootDir>/node_modules/d3/dist/d3.min.js"
-		},
-		"moduleFileExtensions": [
-			"web.js",
-			"js",
-			"web.ts",
-			"ts",
-			"web.tsx",
-			"tsx",
-			"json",
-			"web.jsx",
-			"jsx",
-			"node"
-		],
-		"watchPlugins": [
-			"jest-watch-typeahead/filename",
-			"jest-watch-typeahead/testname"
-		],
-		"resetMocks": true,
-		"coveragePathIgnorePatterns": [
-			"/node_modules/",
-			"/src/decorators/",
-			"/src/lab/",
-			"/src/stories/",
-			"/src/ui_components/",
-			"/src/deckgl_components/",
-			"/src/components/MlBasicComponent",
-			"/src/components/MlMapDrawTools",
-			"/src/components/MlComponentTemplate/",
-			"/src/components/MlAerialPhotograph/",
-			"/src/components/MapLibreMapDebug/",
-			"/src/components/MlDemoDashboard/",
-			"/src/components/MlLaufwettbewerbApp/",
-			"/src/components/MlLaermkarte/",
-			"/src/components/MlMobilerImker/",
-			"/src/components/MlWanderApp/",
-			"(.test)\\.(ts|tsx|js)$",
-			"index\\.js$",
-			".*/lib/.*",
-			".*/utils/.*",
-			".*/util/.*",
-			".*/assets/.*",
-			".*/custom.d.tsx",
-			"custom\\-.*\\-mode\\.js$",
-			"(.stories)\\.(ts|tsx|js)$",
-			"/distribution/.*\\.(ts|js)$"
-		]
-	},
-	"resolutions": {
-		"jackspeak": "4.1.0"
-	}
-}
+  "name": "@mapcomponents/react-maplibre",
+  "version": "1.5.0-2",
+  "main": "dist/index.cjs.js",
+  "license": "MIT",
+  "module": "dist/index.esm.js",
+  "source": "src/index.ts",
+  "types": "dist/src/index.d.ts",
+  "dependencies": {
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
+    "@emotion/css": "^11.13.5",
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.1",
+    "@mapbox/mapbox-gl-draw": "1.4.3",
+    "@mapbox/mapbox-gl-sync-move": "^0.3.1",
+    "@mui/icons-material": "^7.3.2",
+    "@mui/material": "^7.3.2",
+    "@mui/system": "^7.3.2",
+    "@reduxjs/toolkit": "^2.9.0",
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/jest-dom": "^6.8.0",
+    "@testing-library/user-event": "^14.6.1",
+    "@tmcw/togeojson": "^7.1.2",
+    "@turf/helpers": "^7.2.0",
+    "@turf/turf": "^7.2.0",
+    "@types/d3": "^7.4.3",
+    "@types/geojson": "^7946.0.16",
+    "@types/react-color": "^3.0.13",
+    "@types/topojson-client": "^3.1.5",
+    "@types/topojson-specification": "^1.0.5",
+    "@xmldom/xmldom": "^0.9.8",
+    "camelcase": "^8.0.0",
+    "csv2geojson": "^5.1.2",
+    "d3": "^7.9.0",
+    "jspdf": "^3.0.2",
+    "maplibre-gl": "5.6.0",
+    "osm2geojson-lite": "^1.1.2",
+    "pako": "^2.1.0",
+    "react-color": "^2.19.3",
+    "react-moveable": "^0.56.0",
+    "react-redux": "^9.2.0",
+    "redux": "^5.0.1",
+    "redux-thunk": "^3.1.0",
+    "three": "^0.179.1",
+    "topojson-client": "^3.1.0",
+    "uuid": "^11.1.0",
+    "wms-capabilities": "^0.6.0"
+  },
+  "devDependencies": {
+    "@testing-library/react": "^16.3.0",
+    "@types/chai": "^5.2.2",
+    "@types/elasticlunr": "^0.9.9",
+    "@types/enzyme": "^3.10.19",
+    "@types/expect": "^24.3.2",
+    "@types/jest": "^30.0.0",
+    "@types/mapbox__mapbox-gl-draw": "^1.4.9",
+    "@types/mapbox__point-geometry": "^0.1.4",
+    "@types/mapbox__vector-tile": "^2.0.0",
+    "@types/mocha": "^10.0.10",
+    "@types/pako": "^2.0.4",
+    "@types/react": "^19.1.12",
+    "@types/react-dom": "^19.1.9",
+    "@types/sql.js": "^1.4.9",
+    "@types/three": "^0.179.0",
+    "@types/uuid": "^10.0.0",
+    "@typescript-eslint/eslint-plugin": "^8.42.0",
+    "@typescript-eslint/parser": "^8.42.0",
+    "avj": "^0.0.0",
+    "babel-jest": "^30.1.2",
+    "babel-loader": "^10.0.0",
+    "babel-plugin-inline-react-svg": "^2.0.2",
+    "babel-plugin-styled-components": "^2.1.4",
+    "babel-preset-react-app": "^10.1.0",
+    "chai": "^6.0.1",
+    "elasticlunr": "^0.9.5",
+    "eslint-plugin-storybook": "^9.1.4",
+    "glob": "^11.0.3",
+    "jest": "30.0.5",
+    "jest-circus": "30.0.5",
+    "jest-environment-jsdom": "^30.1.2",
+    "jest-enzyme": "^7.1.2",
+    "jest-resolve": "30.0.5",
+    "jest-watch-typeahead": "3.0.1",
+    "mocha": "^11.7.2",
+    "node-fetch": "^3.3.2",
+    "path-browserify": "^1.0.1",
+    "postcss": "^8.5.6",
+    "react-app-polyfill": "^3.0.0",
+    "react-dev-utils": "^12.0.1",
+    "react-draggable": "^4.5.0",
+    "react-i18next": "^15.7.3",
+    "showdown": "^2.1.0",
+    "sql.js": "^1.13.0",
+    "ts-jest": "^29.4.1",
+    "ts-loader": "^9.5.4"
+  },
+  "jest": {
+    "roots": [
+      "<rootDir>/src"
+    ],
+    "collectCoverageFrom": [
+      "src/**/*.{js,jsx,ts,tsx}",
+      "!src/**/*.d.ts"
+    ],
+    "setupFiles": [
+      "react-app-polyfill/jsdom"
+    ],
+    "setupFilesAfterEnv": [
+      "<rootDir>/src/setupTests.js"
+    ],
+    "testMatch": [
+      "<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}",
+      "<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}"
+    ],
+    "testEnvironment": "jsdom",
+    "transform": {
+      "^.+\\.(js|jsx|mjs|cjs|ts|tsx)$": "<rootDir>/config/jest/babelTransform.js",
+      "^.+\\.css$": "<rootDir>/config/jest/cssTransform.js",
+      "^(?!.*\\.(js|jsx|mjs|cjs|ts|tsx|css|json)$)": "<rootDir>/config/jest/fileTransform.js",
+      "^.+\\.svg$": "<rootDir>/config/jest/fileTransform.js"
+    },
+    "transformIgnorePatterns": [
+      "[/\\\\]node_modules[/\\\\](?!three/examples/jsm/).+\\.(js|jsx|mjs|cjs|ts|tsx)$",
+      "^.+\\.module\\.(css|sass|scss)$"
+    ],
+    "modulePaths": [],
+    "moduleNameMapper": {
+      "^react-native$": "react-native-web",
+      "^.+\\.module\\.(css|sass|scss)$": "identity-obj-proxy",
+      "^maplibre-gl/dist/maplibre-gl$": "<rootDir>/node_modules/maplibre-gl",
+      "d3": "<rootDir>/node_modules/d3/dist/d3.min.js"
+    },
+    "moduleFileExtensions": [
+      "web.js",
+      "js",
+      "web.ts",
+      "ts",
+      "web.tsx",
+      "tsx",
+      "json",
+      "web.jsx",
+      "jsx",
+      "node"
+    ],
+    "watchPlugins": [
+      "jest-watch-typeahead/filename",
+      "jest-watch-typeahead/testname"
+    ],
+    "resetMocks": true,
+    "coveragePathIgnorePatterns": [
+      "/node_modules/",
+      "/src/decorators/",
+      "/src/lab/",
+      "/src/stories/",
+      "/src/ui_components/",
+      "/src/deckgl_components/",
+      "/src/components/MlBasicComponent",
+      "/src/components/MlMapDrawTools",
+      "/src/components/MlComponentTemplate/",
+      "/src/components/MlAerialPhotograph/",
+      "/src/components/MapLibreMapDebug/",
+      "/src/components/MlDemoDashboard/",
+      "/src/components/MlLaufwettbewerbApp/",
+      "/src/components/MlLaermkarte/",
+      "/src/components/MlMobilerImker/",
+      "/src/components/MlWanderApp/",
+      "(.test)\\.(ts|tsx|js)$",
+      "index\\.js$",
+      ".*/lib/.*",
+      ".*/utils/.*",
+      ".*/util/.*",
+      ".*/assets/.*",
+      ".*/custom.d.tsx",
+      "custom\\-.*\\-mode\\.js$",
+      "(.stories)\\.(ts|tsx|js)$",
+      "/distribution/.*\\.(ts|js)$"
+    ]
+  },
+  "resolutions": {
+    "jackspeak": "4.1.0"
+  },
+  "scripts": {
+    "test": "node scripts/test.cjs --watchAll=false --coverage",
+    "test:noninteractive": "node scripts/test.cjs --verbose --watchAll=false --coverage",
+    "test:generate-output": "node scripts/test.cjs --watchAll=false --json --outputFile=./src/.jest-test-results.json || true",
+    "build-storybook": "storybook build -o docs-build",
+    "storybook-docs": "storybook dev --docs --no-manager-cache",
+    "build-catalogue-meta": "node scripts/build-catalogue-meta.js",
+    "create-component": "./scripts/create-map-component.sh"
+  }
+}

package/project.json

@@ -0,0 +1,21 @@
+{
+	"name": "react-maplibre",
+	"$schema": "../../node_modules/nx/schemas/project-schema.json",
+	"sourceRoot": "packages/react-maplibre/src",
+	"projectType": "library",
+	"tags": [],
+	"// targets": "to see all targets run: nx show project react-maplibre --web",
+	"targets": {
+		"build": {
+			"executor": "@nx/vite:build",
+			"options": {
+				"outputPath": "dist/libs/react-maplibre"
+			}
+		},
+		"storybook": {
+			"options": {
+				"port": 4400
+			}
+		}
+	}
+}

package/tsconfig.lib.json

@@ -0,0 +1,29 @@
+{
+	"extends": "./tsconfig.json",
+	"compilerOptions": {
+		"outDir": "../../dist/out-tsc",
+		"types": [
+			"node",
+			"@nx/react/typings/cssmodule.d.ts",
+			"@nx/react/typings/image.d.ts",
+			"vite/client"
+		]
+	},
+	"exclude": [
+		"**/*.spec.ts",
+		"**/*.test.ts",
+		"**/*.spec.tsx",
+		"**/*.test.tsx",
+		"**/*.spec.js",
+		"**/*.test.js",
+		"**/*.spec.jsx",
+		"**/*.test.jsx",
+		"cypress/**/*",
+		"cypress.config.ts",
+		"**/*.cy.ts",
+		"**/*.cy.js",
+		"**/*.cy.tsx",
+		"**/*.cy.jsx"
+	],
+	"include": ["src", "src/**/*.json"]
+}

package/vite.config.ts

@@ -0,0 +1,61 @@
+/// <reference types='vitest' />
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import dts from 'vite-plugin-dts';
+import * as path from 'path';
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
+import { nxCopyAssetsPlugin } from '@nx/vite/plugins/nx-copy-assets.plugin';
+/*import * as fs from 'node:fs';
+
+const pkg = JSON.parse(fs.readFileSync('package.json', 'utf8'));*/
+
+export default defineConfig(() => ({
+	root: __dirname,
+	cacheDir: '../../node_modules/.vite/packages/react-maplibre',
+	plugins: [
+		react(),
+		nxViteTsPaths(),
+		nxCopyAssetsPlugin(['*.md']),
+		dts({
+			entryRoot: 'src',
+			tsconfigPath: path.join(__dirname, 'tsconfig.lib.json'),
+			pathsToAliases: false,
+		}),
+	],
+	// Uncomment this if you are using workers.
+	// worker: {
+	//  plugins: [ nxViteTsPaths() ],
+	// },
+	// Configuration for building your library.
+	// See: https://vitejs.dev/guide/build.html#library-mode
+	build: {
+		outDir: '../../dist/packages/react-maplibre',
+		emptyOutDir: true,
+		reportCompressedSize: true,
+		commonjsOptions: {
+			transformMixedEsModules: true,
+		},
+		lib: {
+			// Could also be a dictionary or array of multiple entry points.
+			entry: 'src/index.ts',
+			name: 'react-maplibre',
+			fileName: 'index',
+			// Change this to the formats you want to support.
+			// Don't forget to update your package.json as well.
+			formats: ['es' as const, 'cjs' as const],
+		},
+		sourcemap: true,
+		rollupOptions: {
+			// External packages that should not be bundled into your library.
+			external: [
+				'react',
+				'react-dom',
+				'd3',
+				'sql.js',
+				/*				...Object.keys(pkg.dependencies),
+				...Object.keys(pkg.devDependencies),*/
+			],
+			input: [path.join(__dirname, 'src/index.ts')],
+		},
+	},
+}));

package/.eslintrc.cjs

@@ -1,33 +0,0 @@
-module.exports = {
-	env: {
-		browser: true,
-		node: true,
-		es2021: true,
-		jest: true,
-	},
-	extends: [
-        "eslint:recommended",
-        "plugin:react/recommended",
-        "plugin:@typescript-eslint/recommended",
-        "prettier",
-        "plugin:storybook/recommended"
-    ],
-	overrides: [],
-	parser: '@typescript-eslint/parser',
-	parserOptions: {
-		ecmaVersion: 'latest',
-		sourceType: 'module',
-	},
-	plugins: ['react', '@typescript-eslint'],
-	rules: {
-		'react/prop-types': 'off',
-		// empty functions can sometimes be set intentionally. e.g. with useRef/useState, if we want an empty function first
-		'@typescript-eslint/no-empty-function': 'off',
-		"@typescript-eslint/no-explicit-any": "off"
-	},
-	settings: {
-		react: {
-			version: 'detect',
-		},
-	},
-};