@mapcomponents/deck-gl 1.5.5 → 1.5.7-2

package/package.json

@@ -1,22 +1,23 @@
 {
   "name": "@mapcomponents/deck-gl",
-  "version": "1.5.5",
+  "version": "1.5.7-2",
   "description": "",
   "main": "src/index.ts",
+  "module": "dist/index.mjs",
   "dependencies": {
     "@deck.gl/aggregation-layers": "^9.1.14",
     "@deck.gl/core": "^9.1.14",
     "@deck.gl/mapbox": "^9.1.14",
-    "@mapcomponents/react-maplibre": "^1.3.3",
-    "@mui/icons-material": "^7.2.0",
-    "@mui/material": "^7.2.0",
-    "maplibre-gl": "^5.6.1"
+    "@mui/icons-material": "^7.3.2",
+    "@mui/material": "^7.3.2",
+    "@storybook/react": "^9.1.4",
+    "maplibre-gl": "^5.7.0",
+    "@mapcomponents/react-maplibre": "^1.5.7-2"
   },
   "devDependencies": {
     "@types/geojson": "^7946.0.16"
   },
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "tsc --p ./tsconfig.lib.json && vite build"
+    "test": "echo \"Error: no test specified\" && exit 1"
   }
 }

package/project.json

@@ -1,7 +1,13 @@
 {
 	"name": "deck-gl",
 	"projectType": "library",
-	"root": "libs/deck-gl",
-	"sourceRoot": "libs/deck-gl/src",
-	"targets": {}
+	"root": "packages/deck-gl",
+	"sourceRoot": "packages/deck-gl/src",
+	"targets": {
+		"storybook": {
+			"options": {
+				"port": 4401
+			}
+		}
+	}
 }

package/src/components/MlHexagonMap/MlHexagonMap.cy.tsx

@@ -9,12 +9,12 @@ describe('MlHexagonMap Test', () => {
 		cy.mount(<NoiseMap />);
 		cy.window()
 			.should((win) => expect((win as any)._map).to.exist)
-			.then(win => {
+			.then((win) => {
 				const map = (win as any)._map;
 				cy.wrap(map._controls)
 					.should('have.length.at.least', 2)
 					.then((controls) => {
-						expect(controls[1]._props.id).to.equal("deckgl-layer");
+						expect(controls[1]._props.id).to.equal('deckgl-layer');
 					});
 			});
 	});

package/src/components/MlHexagonMap/MlHexagonMap.tsx

@@ -138,7 +138,4 @@ const MlHexagonMap = (props: MlHexagonMapProps) => {
 	return <></>;
 };
 
-MlHexagonMap.defaultProps = {
-	mapId: undefined,
-};
 export default MlHexagonMap;

package/src/index.ts

@@ -1,2 +1,3 @@
 export { default as DeckGlContext, DeckGlContextProvider } from './contexts/DeckGlContext';
 export { default as useDeckGl } from './hooks/useDeckGl';
+export { default as MlHexagonLayer } from './components/MlHexagonMap/MlHexagonMap';

package/tsconfig.lib.json

@@ -9,7 +9,7 @@
 			"vite/client"
 		]
 	},
-	"include": ["src/**/*"],
+	"include": ["src/**/*", "../react-maplibre/src/**/*"],
 	"exclude": [
 		"**/*.spec.ts",
 		"**/*.test.ts",

package/vite.config.ts

@@ -8,7 +8,7 @@ import { nxCopyAssetsPlugin } from '@nx/vite/plugins/nx-copy-assets.plugin';
 
 export default defineConfig(() => ({
 	root: __dirname,
-	cacheDir: '../../node_modules/.vite/libs/deck-gl',
+	cacheDir: '../../node_modules/.vite/packages/deck-gl',
 	plugins: [
 		react(),
 		nxViteTsPaths(),
@@ -22,7 +22,7 @@ export default defineConfig(() => ({
 	// Configuration for building your library.
 	// See: https://vitejs.dev/guide/build.html#library-mode
 	build: {
-		outDir: '../../dist/libs/deck-gl',
+		outDir: 'dist',
 		emptyOutDir: true,
 		reportCompressedSize: true,
 		commonjsOptions: {

package/.babelrc

@@ -1,22 +0,0 @@
-{
-	"plugins": [
-		"@babel/plugin-transform-typescript",
-		"babel-plugin-styled-components",
-		[
-			"inline-react-svg",
-			{
-				"svgo": {
-					"plugins": [
-						{
-							"name": "preset-default",
-							"params": {
-								"overrides": { "mergePaths": false }
-							}
-						}
-					]
-				}
-			}
-		]
-	],
-	"presets": ["@babel/preset-env", "@babel/preset-react", "@babel/preset-typescript"]
-}

package/.eslintignore

@@ -1,12 +0,0 @@
-.cache
-.github
-.storybook
-.vscode
-coverage
-dist
-docs
-docs-build
-js-docs
-node_modules
-storybook-static
-scripts

package/.prettierignore

@@ -1,11 +0,0 @@
-.cache
-.github
-.storybook
-.vscode
-coverage
-dist
-docs
-docs-build
-js-docs
-node_modules
-storybook-static

package/.storybook/main.ts

@@ -1,31 +0,0 @@
-import type { StorybookConfig } from '@storybook/react-vite';
-
-const config: StorybookConfig = {
-	stories: ['../src/**/*.@(mdx|stories.@(js|jsx|ts|tsx))'],
-	addons: ['@storybook/addon-docs'],
-	framework: {
-		name: '@storybook/react-vite',
-		options: {
-			builder: {
-				viteConfigPath: 'vite.config.ts',
-			},
-		},
-	},
-	staticDirs: ['../public'],
-
-	typescript: {
-		check: false,
-		reactDocgen: 'react-docgen-typescript',
-		reactDocgenTypescriptOptions: {
-			shouldExtractLiteralValuesFromEnum: true,
-			propFilter: (prop) => (prop.parent ? !/node_modules/.test(prop.parent.fileName) : true),
-		},
-	},
-
-};
-
-export default config;
-
-// To customize your Vite configuration you can use the viteFinal field.
-// Check https://storybook.js.org/docs/react/builders/vite#configuration
-// and https://nx.dev/recipes/storybook/custom-builder-configs

package/.storybook/manager.js

@@ -1,6 +0,0 @@
-import { addons } from "@storybook/addons";
-import wheregroupTheme from "./wheregroupTheme";
-
-addons.setConfig({
-  theme: wheregroupTheme,
-});

package/.storybook/preview.ts

@@ -1,27 +0,0 @@
-import './style.css';
-
-export const parameters = {
-	docs: {
-		inlineStories: false,
-	},
-	actions: { argTypesRegex: '^on[A-Z].*' },
-
-};
-
-export const globalTypes = {
-	theme: {
-		name: 'Theme',
-		title: 'Theme',
-		description: 'Theme for your components',
-		defaultValue: 'light',
-		toolbar: {
-			icon: 'paintbrush',
-			dynamicTitle: true,
-			items: [
-				{ value: 'light', left: '☀️', title: 'Light mode' },
-				{ value: 'dark', left: '🌙', title: 'Dark mode' },
-			],
-		},
-	},
-};
-export const tags = ['autodocs'];

package/.storybook/style.css

@@ -1,20 +0,0 @@
-.docs-story > div:first-child{
-  z-index:0;
-}
-
-.docs-story > div > div:first-child, .innerZoomElementWrapper, .innerZoomElementWrapper > div:first-child, .innerZoomElementWrapper > div:first-child > div:first-child{
-
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-}
-
-.docs-story > div > div:first-child{
-  height: initial;
-}
-
-.innerZoomElementWrapper > div > div > div:first-child{
-  height: 100% !important;
-}

package/.storybook/wheregroupTheme.js

@@ -1,9 +0,0 @@
-import { create } from 'storybook/theming';
-import logo from './mapcomponents_logo.png';
-
-export default create({
-	base: 'light',
-	brandTitle: 'WhereGroup GmbH',
-	brandUrl: 'https://wheregroup.com',
-	brandImage: logo,
-});

package/cypress/support/commands.ts

@@ -1,39 +0,0 @@
-/*
-/// <reference types="cypress" />
-
-// ***********************************************
-// This example commands.ts shows you how to
-// create various custom commands and overwrite
-// existing commands.
-//
-// For more comprehensive examples of custom
-// commands please read more here:
-// https://on.cypress.io/custom-commands
-// ***********************************************
-
-declare global {
-	// eslint-disable-next-line @typescript-eslint/no-namespace
-	namespace Cypress {
-		// eslint-disable-next-line @typescript-eslint/no-unused-vars
-		interface Chainable<Subject> {
-			login(email: string, password: string): void;
-		}
-	}
-}
-
-// -- This is a parent command --
-Cypress.Commands.add('login', (email, password) => {
-	console.log('Custom command example: Login', email, password);
-});
-//
-// -- This is a child command --
-// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
-//
-//
-// -- This is a dual command --
-// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
-//
-//
-// -- This will overwrite an existing command --
-// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
-*/

package/cypress/support/component-index.html

@@ -1,12 +0,0 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
-		<meta name="viewport" content="width=device-width,initial-scale=1.0" />
-		<title>deck-gl Components App</title>
-	</head>
-	<body>
-		<div data-cy-root></div>
-	</body>
-</html>

package/cypress/support/component.ts

@@ -1,31 +0,0 @@
-import { mount } from 'cypress/react';
-// ***********************************************************
-// This example support/component.ts is processed and
-// loaded automatically before your test files.
-//
-// This is a great place to put global configuration and
-// behavior that modifies Cypress.
-//
-// You can change the location of this file or turn off
-// automatically serving support files with the
-// 'supportFile' configuration option.
-//
-// You can read more here:
-// https://on.cypress.io/configuration
-// ***********************************************************
-
-// Import commands.ts using ES2015 syntax:
-import './commands';
-
-// add component testing only related command here, such as mount
-declare global {
-	// eslint-disable-next-line @typescript-eslint/no-namespace
-	namespace Cypress {
-		// eslint-disable-next-line @typescript-eslint/no-unused-vars
-		interface Chainable<Subject> {
-			mount: typeof mount;
-		}
-	}
-}
-
-Cypress.Commands.add('mount', mount);

package/cypress/tsconfig.json

@@ -1,25 +0,0 @@
-{
-	"extends": "../tsconfig.json",
-	"compilerOptions": {
-		"allowJs": true,
-		"outDir": "../../dist/out-tsc",
-		"module": "commonjs",
-		"types": ["cypress", "node"],
-		"sourceMap": false,
-		"rootDir": "../",
-	},
-	"include": [
-		"**/*.ts",
-		"**/*.js",
-		"../src/**/**/*.stories.tsx",
-		"../src/**/**/*.stories.jsx",
-		"../cypress.config.ts",
-		"../**/*.cy.ts",
-		"../**/*.cy.tsx",
-		"../**/*.cy.js",
-		"../**/*.cy.jsx",
-		"../**/*.d.ts",
-		"../src/**/**.tsx",
-		"../src/**/**.jsx"
-	]
-}

package/cypress.config.ts

@@ -1,9 +0,0 @@
-import { nxComponentTestingPreset } from '@nx/react/plugins/component-testing';
-import { defineConfig } from 'cypress';
-
-export default defineConfig({
-	component: nxComponentTestingPreset(__filename, {
-		bundler: 'vite',
-		buildTarget: 'deck-gl:build',
-	}),
-});

package/public/index.html

@@ -1,39 +0,0 @@
-<!doctype html>
-<html lang="en">
-	<head>
-		<meta charset="utf-8" />
-		<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-		<meta name="viewport" content="width=device-width, initial-scale=1" />
-		<meta name="theme-color" content="#000000" />
-		<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
-		<!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-		<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-		<!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-		<title>React App</title>
-	</head>
-	<body>
-		<noscript>You need to enable JavaScript to run this app.</noscript>
-		<div id="root"></div>
-		<!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-	</body>
-</html>

package/scripts/build-catalogue-markdown-docs.js

@@ -1,30 +0,0 @@
-const glob = require('glob');
-const fs = require('fs');
-const showdown = require('showdown');
-
-const options = {};
-
-function getComponentNameFromPath(path) {
-	let tmp = path.split('/');
-	tmp = tmp[tmp.length - 1];
-	tmp = tmp.split('.doc');
-	return tmp[0];
-}
-
-const converter = new showdown.Converter();
-
-glob('src/components/**/*.doc.*.md', options, function (er, files) {
-	console.log(files);
-
-	// eslint-disable-next-line prefer-const
-	let i = 0, len = files.length;
-	for (; i < len; i++) {
-		const language = files[i].slice(-5, -3);
-		const rawdata = fs.readFileSync(files[i]);
-		const html = converter.makeHtml(rawdata + '');
-		fs.writeFileSync(
-			'public/catalogue/' + getComponentNameFromPath(files[i]) + '.' + language + '.html',
-			html
-		);
-	}
-});

package/scripts/build-catalogue-meta.js

@@ -1,44 +0,0 @@
-const glob = require('glob');
-const fetch = (...args) => import('node-fetch').then(({ default: fetch }) => fetch(...args));
-const Ajv = require('ajv');
-const ajv = new Ajv();
-const fs = require('fs');
-
-const options = {};
-const mc_meta = {};
-
-glob('src/**/**/*.meta.json', options, function (er, files) {
-	console.log(files);
-
-	// eslint-disable-next-line prefer-const
-	let i = 0, len = files.length;
-	for (; i < len; i++) {
-		const rawdata = fs.readFileSync(files[i]);
-		const metaObj = JSON.parse(rawdata);
-		mc_meta[metaObj.name] = metaObj;
-	}
-
-	fetch('https://catalogue.mapcomponents.org/schema/metadata.schema.json', {
-		method: 'GET',
-		headers: {
-			Accept: 'application/json',
-			'Content-Type': 'application/json',
-		},
-	})
-		.then((res) => {
-			if (!res.ok) {
-				return false;
-			} else {
-				return res.json();
-			}
-		})
-		.then((schema) => {
-			const validate = ajv.compile(schema);
-			const valid = validate(mc_meta);
-			if (!valid) throw new Error(JSON.stringify(validate.errors));
-			//if (!valid) console.log(validate.errors);
-
-			const data = JSON.stringify(mc_meta);
-			fs.writeFileSync('public/catalogue/mc_meta.json', data);
-		});
-});

package/scripts/create-map-component.sh

@@ -1,36 +0,0 @@
-#!/bin/bash
-
-set -x
-
-if [ $# -eq 0 ]; then
-    echo "Please provide a component name as first argument."
-    exit 1
-fi
-
-component_name="$1"
-target_path="src/components/"
-template_name="MlComponentTemplate"
-template_path="src/components/"
-
-if [ ! -d "$target_path$component_name" ]; then
-
-  cp -r $template_path$template_name $target_path$component_name
-
-  mv $target_path$component_name/$template_name.doc.de.md $target_path$component_name/$component_name.doc.de.md
-
-  mv $target_path$component_name/$template_name.tsx $target_path$component_name/$component_name.tsx
-
-  mv $target_path$component_name/$template_name.meta_.json $target_path$component_name/$component_name.meta_.json
-
-  mv $target_path$component_name/$template_name.stories.js $target_path$component_name/$component_name.stories.js
-
-  sed -i "s/$template_name/$component_name/g" $target_path$component_name/$component_name.doc.de.md
-  sed -i "s/$template_name/$component_name/g" $target_path$component_name/$component_name.tsx
-  sed -i "s/$template_name/$component_name/g" $target_path$component_name/$component_name.meta_.json
-  sed -i "s/$template_name/$component_name/g" $target_path$component_name/$component_name.stories.js
-
-else
-
-  echo "The directory $target_path$component_name already exists. Please use a different name."
-
-fi

package/tsconfig.json

@@ -1,12 +0,0 @@
-{
-	"include": [],
-	"references": [
-		{
-			"path": "./tsconfig.lib.json"
-		},
-		{
-			"path": "./cypress/tsconfig.json"
-		}
-	],
-	"extends": "../../tsconfig.base.json"
-}