From e64946dae47d831ed52cc1b623cdbadd90ea1d87 Mon Sep 17 00:00:00 2001 From: matthew44-mappable <155086725+matthew44-mappable@users.noreply.github.com> Date: Thu, 4 Apr 2024 11:29:28 +0300 Subject: [PATCH] Refactoring examples and changing the structure of the main page (#3) * convert example from vanilla to typescript * fix * fix imports * fix test * add case template --- example/case-template/common.css | 0 example/case-template/common.ts | 8 + example/case-template/react/index.html | 37 +++ example/case-template/react/index.tsx | 40 +++ example/case-template/vanilla/index.html | 35 ++ example/case-template/vanilla/index.ts | 22 ++ example/case-template/vue/index.html | 36 ++ example/case-template/vue/index.ts | 43 +++ example/{common.css => index.css} | 0 example/index.html | 6 +- example/{common.js => index.ts} | 13 +- example/react.html | 64 ---- example/tsconfig.json | 9 + example/types.d.ts | 14 + example/vanilla.html | 38 --- package-lock.json | 309 +++++++++++++++++- package.json | 7 +- .../MMapButtonExample.test.ts.snap | 8 +- tsconfig.json | 7 +- types/index.d.ts | 7 + 20 files changed, 565 insertions(+), 138 deletions(-) create mode 100644 example/case-template/common.css create mode 100644 example/case-template/common.ts create mode 100644 example/case-template/react/index.html create mode 100644 example/case-template/react/index.tsx create mode 100644 example/case-template/vanilla/index.html create mode 100644 example/case-template/vanilla/index.ts create mode 100644 example/case-template/vue/index.html create mode 100644 example/case-template/vue/index.ts rename example/{common.css => index.css} (100%) rename example/{common.js => index.ts} (70%) delete mode 100644 example/react.html create mode 100644 example/tsconfig.json create mode 100644 example/types.d.ts delete mode 100644 example/vanilla.html create mode 100644 types/index.d.ts diff --git a/example/case-template/common.css b/example/case-template/common.css new file mode 100644 index 0000000..e69de29 diff --git a/example/case-template/common.ts b/example/case-template/common.ts new file mode 100644 index 0000000..ca06e2f --- /dev/null +++ b/example/case-template/common.ts @@ -0,0 +1,8 @@ +import type {MMapLocationRequest, LngLatBounds} from '@mappable-world/mappable-types'; + +const BOUNDS: LngLatBounds = [ + [54.58311, 25.9985], + [56.30248, 24.47889] +]; + +export const LOCATION: MMapLocationRequest = {bounds: BOUNDS}; diff --git a/example/case-template/react/index.html b/example/case-template/react/index.html new file mode 100644 index 0000000..4183912 --- /dev/null +++ b/example/case-template/react/index.html @@ -0,0 +1,37 @@ + + + + React example mappable-default-ui-theme + + + + + + + + + + + + + + + +
+ + diff --git a/example/case-template/react/index.tsx b/example/case-template/react/index.tsx new file mode 100644 index 0000000..25cf5e7 --- /dev/null +++ b/example/case-template/react/index.tsx @@ -0,0 +1,40 @@ +import {LOCATION} from '../common'; + +window.map = null; + +main(); +async function main() { + const [mappableReact] = await Promise.all([mappable.import('@mappable-world/mappable-reactify'), mappable.ready]); + const reactify = mappableReact.reactify.bindTo(React, ReactDOM); + + const {MMap, MMapDefaultSchemeLayer, MMapDefaultFeaturesLayer, MMapControls} = reactify.module(mappable); + + const {useState, useCallback} = React; + + const {MMapZoomControl} = reactify.module(await mappable.import('@mappable-world/mappable-controls@0.0.1')); + + const {MMapButtonExample} = reactify.module(await mappable.import('@mappable-world/mappable-default-ui-theme')); + + ReactDOM.render( + + + , + document.getElementById('app') + ); + + function App() { + const [location, setLocation] = useState(LOCATION); + const onClick = useCallback(() => alert('Click!'), []); + + return ( + (map = x)}> + + + + + + + + ); + } +} diff --git a/example/case-template/vanilla/index.html b/example/case-template/vanilla/index.html new file mode 100644 index 0000000..730390e --- /dev/null +++ b/example/case-template/vanilla/index.html @@ -0,0 +1,35 @@ + + + + Vanilla example mappable-default-ui-theme + + + + + + + + + + + + + +
+ + diff --git a/example/case-template/vanilla/index.ts b/example/case-template/vanilla/index.ts new file mode 100644 index 0000000..3ad406b --- /dev/null +++ b/example/case-template/vanilla/index.ts @@ -0,0 +1,22 @@ +import {LOCATION} from '../common'; +window.map = null; + +main(); +async function main() { + await mappable.ready; + const {MMap, MMapDefaultSchemeLayer, MMapDefaultFeaturesLayer, MMapControls} = mappable; + + const {MMapZoomControl} = await mappable.import('@mappable-world/mappable-controls@0.0.1'); + const {MMapButtonExample} = await mappable.import('@mappable-world/mappable-default-ui-theme'); + + map = new MMap(document.getElementById('app'), {location: LOCATION}); + + map.addChild(new MMapDefaultSchemeLayer({})); + map.addChild(new MMapDefaultFeaturesLayer({})); + + map.addChild( + new MMapControls({position: 'right'}) + .addChild(new MMapZoomControl({})) + .addChild(new MMapButtonExample({text: 'My button', onClick: () => alert('Click!')})) + ); +} diff --git a/example/case-template/vue/index.html b/example/case-template/vue/index.html new file mode 100644 index 0000000..85eeebd --- /dev/null +++ b/example/case-template/vue/index.html @@ -0,0 +1,36 @@ + + + + Vue example mappable-default-ui-theme + + + + + + + + + + + + + + +
+ + diff --git a/example/case-template/vue/index.ts b/example/case-template/vue/index.ts new file mode 100644 index 0000000..4ec8bed --- /dev/null +++ b/example/case-template/vue/index.ts @@ -0,0 +1,43 @@ +import {LOCATION} from '../common'; + +window.map = null; + +main(); +async function main() { + const [mappableVue] = await Promise.all([mappable.import('@mappable-world/mappable-vuefy'), mappable.ready]); + const vuefy = mappableVue.vuefy.bindTo(Vue); + + const {MMap, MMapDefaultSchemeLayer, MMapDefaultFeaturesLayer, MMapControls} = vuefy.module(mappable); + + const {MMapZoomControl} = vuefy.module(await mappable.import('@mappable-world/mappable-controls@0.0.1')); + + const {MMapButtonExample} = vuefy.module(await mappable.import('@mappable-world/mappable-default-ui-theme')); + + const app = Vue.createApp({ + components: { + MMap, + MMapDefaultSchemeLayer, + MMapDefaultFeaturesLayer, + MMapControls, + MMapZoomControl, + MMapButtonExample + }, + setup() { + const refMap = (ref) => { + window.map = ref?.entity; + }; + const onClick = () => alert('Click!'); + return {LOCATION, refMap, onClick}; + }, + template: ` + + + + + + + + ` + }); + app.mount('#app'); +} diff --git a/example/common.css b/example/index.css similarity index 100% rename from example/common.css rename to example/index.css diff --git a/example/index.html b/example/index.html index d6c8cdd..e98a585 100644 --- a/example/index.html +++ b/example/index.html @@ -1,4 +1,4 @@ - + Example @mappable-world/mappable-default-ui-theme @@ -8,10 +8,10 @@ content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" /> - + - +
%VERSION%
%README% diff --git a/example/common.js b/example/index.ts similarity index 70% rename from example/common.js rename to example/index.ts index 0eae80f..3514bd4 100644 --- a/example/common.js +++ b/example/index.ts @@ -8,15 +8,6 @@ mappable.import.loaders.unshift(async (pkg) => { } else { await mappable.import.script(`https://unpkg.com/${pkg}/dist/index.js`); } - + // @ts-ignore return window['@mappable-world/mappable-default-ui-theme']; -}) - - -const BOUNDS = [ - [54.58311, 25.99850], - [56.30248, 24.47889] -]; - -// eslint-disable-next-line @typescript-eslint/no-unused-vars -const LOCATION = {bounds: BOUNDS}; +}); diff --git a/example/react.html b/example/react.html deleted file mode 100644 index d54b851..0000000 --- a/example/react.html +++ /dev/null @@ -1,64 +0,0 @@ - - - - React example @mappable-world/mappable-default-ui-theme - - - - - - - - - - - - - -
- - diff --git a/example/tsconfig.json b/example/tsconfig.json new file mode 100644 index 0000000..2a6357c --- /dev/null +++ b/example/tsconfig.json @@ -0,0 +1,9 @@ +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "strict": false, + "rootDirs": ["./", "../"], + "types": ["./types.d.ts", "../types/index.d.ts"] + }, + "include": ["./**/*.ts", "./**/*.tsx"] +} \ No newline at end of file diff --git a/example/types.d.ts b/example/types.d.ts new file mode 100644 index 0000000..088fa10 --- /dev/null +++ b/example/types.d.ts @@ -0,0 +1,14 @@ +import {MMap} from '@mappable-world/mappable-types'; + +declare global { + const React: typeof import('react'); + const ReactDOM: typeof import('react-dom'); + const Vue: typeof import('@vue/runtime-dom'); + let map: MMap; + + interface Window { + map: MMap; + } +} + +export {}; \ No newline at end of file diff --git a/example/vanilla.html b/example/vanilla.html deleted file mode 100644 index f5fb989..0000000 --- a/example/vanilla.html +++ /dev/null @@ -1,38 +0,0 @@ - - - - Vanilla example @mappable-world/mappable-default-ui-theme - - - - - - - - - -
- - diff --git a/package-lock.json b/package-lock.json index 7ab9ae1..5f758a8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,8 +9,8 @@ "version": "0.0.1-beta.1", "license": "Apache-2", "devDependencies": { - "@mappable-world/mappable-cli": "^0.0.28", - "@mappable-world/mappable-types": "^0.0.4", + "@mappable-world/mappable-cli": "^0.0.32", + "@mappable-world/mappable-types": "^0.0.15", "@types/got": "9.6.12", "@types/jest": "29.5.3", "@types/jsdom": "21.1.1", @@ -35,6 +35,7 @@ "ts-jest": "29.1.1", "ts-loader": "9.4.4", "typescript": "5.1.6", + "vue": "^3.4.21", "webpack": "5.88.1", "webpack-cli": "5.1.4", "webpack-dev-server": "4.15.1" @@ -1260,9 +1261,9 @@ "dev": true }, "node_modules/@mappable-world/mappable-cli": { - "version": "0.0.28", - "resolved": "https://registry.npmjs.org/@mappable-world/mappable-cli/-/mappable-cli-0.0.28.tgz", - "integrity": "sha512-HTJodX20rDC33PSypGvohBnwOK3qCM2FHTyWeBjB66RL9GucZ5kbsjduXsDfWO2jR560R88aRYm7pKTJ3nqkXw==", + "version": "0.0.32", + "resolved": "https://registry.npmjs.org/@mappable-world/mappable-cli/-/mappable-cli-0.0.32.tgz", + "integrity": "sha512-XJOguVPU9ske2JpvdHv5PGFIcFkabdWbkGM+JmDQQRR61JV+tcQtYsZegk9AUYgdL8X79osWQD6Z1OOk329Ksw==", "dev": true, "dependencies": { "dotenv": "16.3.1", @@ -1274,10 +1275,26 @@ } }, "node_modules/@mappable-world/mappable-types": { - "version": "0.0.4", - "resolved": "https://registry.npmjs.org/@mappable-world/mappable-types/-/mappable-types-0.0.4.tgz", - "integrity": "sha512-rAVeM7+MIzNz+JAFJA58AQJn/XWidxlNNgLqR3vXlUn5iNR5Vm/0iY3dGf95yhV85jmE8E/egAUGrEwvkzlJtw==", - "dev": true + "version": "0.0.15", + "resolved": "https://registry.npmjs.org/@mappable-world/mappable-types/-/mappable-types-0.0.15.tgz", + "integrity": "sha512-mcFDPGUdmzABEpnsnTmgSoU0YCLgAyqf4l/TvgZk1yXGOh14ESpwA9iHfzrRECl8eIK3i0jsuXsxY2+idkIepA==", + "dev": true, + "peerDependencies": { + "@types/react": "16-18", + "@types/react-dom": "16-18", + "@vue/runtime-core": "3" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + }, + "@vue/runtime-core": { + "optional": true + } + } }, "node_modules/@nodelib/fs.scandir": { "version": "2.1.5", @@ -1975,6 +1992,105 @@ "url": "https://opencollective.com/typescript-eslint" } }, + "node_modules/@vue/compiler-core": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.21.tgz", + "integrity": "sha512-MjXawxZf2SbZszLPYxaFCjxfibYrzr3eYbKxwpLR9EQN+oaziSu3qKVbwBERj1IFIB8OLUewxB5m/BFzi613og==", + "dev": true, + "dependencies": { + "@babel/parser": "^7.23.9", + "@vue/shared": "3.4.21", + "entities": "^4.5.0", + "estree-walker": "^2.0.2", + "source-map-js": "^1.0.2" + } + }, + "node_modules/@vue/compiler-dom": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.21.tgz", + "integrity": "sha512-IZC6FKowtT1sl0CR5DpXSiEB5ayw75oT2bma1BEhV7RRR1+cfwLrxc2Z8Zq/RGFzJ8w5r9QtCOvTjQgdn0IKmA==", + "dev": true, + "dependencies": { + "@vue/compiler-core": "3.4.21", + "@vue/shared": "3.4.21" + } + }, + "node_modules/@vue/compiler-sfc": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.21.tgz", + "integrity": "sha512-me7epoTxYlY+2CUM7hy9PCDdpMPfIwrOvAXud2Upk10g4YLv9UBW7kL798TvMeDhPthkZ0CONNrK2GoeI1ODiQ==", + "dev": true, + "dependencies": { + "@babel/parser": "^7.23.9", + "@vue/compiler-core": "3.4.21", + "@vue/compiler-dom": "3.4.21", + "@vue/compiler-ssr": "3.4.21", + "@vue/shared": "3.4.21", + "estree-walker": "^2.0.2", + "magic-string": "^0.30.7", + "postcss": "^8.4.35", + "source-map-js": "^1.0.2" + } + }, + "node_modules/@vue/compiler-ssr": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.21.tgz", + "integrity": "sha512-M5+9nI2lPpAsgXOGQobnIueVqc9sisBFexh5yMIMRAPYLa7+5wEJs8iqOZc1WAa9WQbx9GR2twgznU8LTIiZ4Q==", + "dev": true, + "dependencies": { + "@vue/compiler-dom": "3.4.21", + "@vue/shared": "3.4.21" + } + }, + "node_modules/@vue/reactivity": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.21.tgz", + "integrity": "sha512-UhenImdc0L0/4ahGCyEzc/pZNwVgcglGy9HVzJ1Bq2Mm9qXOpP8RyNTjookw/gOCUlXSEtuZ2fUg5nrHcoqJcw==", + "dev": true, + "dependencies": { + "@vue/shared": "3.4.21" + } + }, + "node_modules/@vue/runtime-core": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.21.tgz", + "integrity": "sha512-pQthsuYzE1XcGZznTKn73G0s14eCJcjaLvp3/DKeYWoFacD9glJoqlNBxt3W2c5S40t6CCcpPf+jG01N3ULyrA==", + "dev": true, + "dependencies": { + "@vue/reactivity": "3.4.21", + "@vue/shared": "3.4.21" + } + }, + "node_modules/@vue/runtime-dom": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.21.tgz", + "integrity": "sha512-gvf+C9cFpevsQxbkRBS1NpU8CqxKw0ebqMvLwcGQrNpx6gqRDodqKqA+A2VZZpQ9RpK2f9yfg8VbW/EpdFUOJw==", + "dev": true, + "dependencies": { + "@vue/runtime-core": "3.4.21", + "@vue/shared": "3.4.21", + "csstype": "^3.1.3" + } + }, + "node_modules/@vue/server-renderer": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.21.tgz", + "integrity": "sha512-aV1gXyKSN6Rz+6kZ6kr5+Ll14YzmIbeuWe7ryJl5muJ4uwSwY/aStXTixx76TwkZFJLm1aAlA/HSWEJ4EyiMkg==", + "dev": true, + "dependencies": { + "@vue/compiler-ssr": "3.4.21", + "@vue/shared": "3.4.21" + }, + "peerDependencies": { + "vue": "3.4.21" + } + }, + "node_modules/@vue/shared": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.21.tgz", + "integrity": "sha512-PuJe7vDIi6VYSinuEbUIQgMIRZGgM8e4R+G+/dQTk0X1NEdvgvvgv7m+rfmDH1gZzyA1OjjoWskvHlfRNfQf3g==", + "dev": true + }, "node_modules/@webassemblyjs/ast": { "version": "1.11.6", "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.6.tgz", @@ -3941,6 +4057,12 @@ "node": ">=4.0" } }, + "node_modules/estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true + }, "node_modules/esutils": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz", @@ -6093,6 +6215,18 @@ "yallist": "^3.0.2" } }, + "node_modules/magic-string": { + "version": "0.30.8", + "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.8.tgz", + "integrity": "sha512-ISQTe55T2ao7XtlAStud6qwYPZjE4GK1S/BeVPus4jrq6JuOnQ00YKQC581RWhR122W7msZV263KzVeLoqidyQ==", + "dev": true, + "dependencies": { + "@jridgewell/sourcemap-codec": "^1.4.15" + }, + "engines": { + "node": ">=12" + } + }, "node_modules/make-dir": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-4.0.0.tgz", @@ -8451,6 +8585,27 @@ "node": ">= 0.8" } }, + "node_modules/vue": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.21.tgz", + "integrity": "sha512-5hjyV/jLEIKD/jYl4cavMcnzKwjMKohureP8ejn3hhEjwhWIhWeuzL2kJAjzl/WyVsgPY56Sy4Z40C3lVshxXA==", + "dev": true, + "dependencies": { + "@vue/compiler-dom": "3.4.21", + "@vue/compiler-sfc": "3.4.21", + "@vue/runtime-dom": "3.4.21", + "@vue/server-renderer": "3.4.21", + "@vue/shared": "3.4.21" + }, + "peerDependencies": { + "typescript": "*" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, "node_modules/w3c-xmlserializer": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-4.0.0.tgz", @@ -9968,9 +10123,9 @@ "dev": true }, "@mappable-world/mappable-cli": { - "version": "0.0.28", - "resolved": "https://registry.npmjs.org/@mappable-world/mappable-cli/-/mappable-cli-0.0.28.tgz", - "integrity": "sha512-HTJodX20rDC33PSypGvohBnwOK3qCM2FHTyWeBjB66RL9GucZ5kbsjduXsDfWO2jR560R88aRYm7pKTJ3nqkXw==", + "version": "0.0.32", + "resolved": "https://registry.npmjs.org/@mappable-world/mappable-cli/-/mappable-cli-0.0.32.tgz", + "integrity": "sha512-XJOguVPU9ske2JpvdHv5PGFIcFkabdWbkGM+JmDQQRR61JV+tcQtYsZegk9AUYgdL8X79osWQD6Z1OOk329Ksw==", "dev": true, "requires": { "dotenv": "16.3.1", @@ -9979,9 +10134,9 @@ } }, "@mappable-world/mappable-types": { - "version": "0.0.4", - "resolved": "https://registry.npmjs.org/@mappable-world/mappable-types/-/mappable-types-0.0.4.tgz", - "integrity": "sha512-rAVeM7+MIzNz+JAFJA58AQJn/XWidxlNNgLqR3vXlUn5iNR5Vm/0iY3dGf95yhV85jmE8E/egAUGrEwvkzlJtw==", + "version": "0.0.15", + "resolved": "https://registry.npmjs.org/@mappable-world/mappable-types/-/mappable-types-0.0.15.tgz", + "integrity": "sha512-mcFDPGUdmzABEpnsnTmgSoU0YCLgAyqf4l/TvgZk1yXGOh14ESpwA9iHfzrRECl8eIK3i0jsuXsxY2+idkIepA==", "dev": true }, "@nodelib/fs.scandir": { @@ -10570,6 +10725,102 @@ "eslint-visitor-keys": "^3.4.1" } }, + "@vue/compiler-core": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.21.tgz", + "integrity": "sha512-MjXawxZf2SbZszLPYxaFCjxfibYrzr3eYbKxwpLR9EQN+oaziSu3qKVbwBERj1IFIB8OLUewxB5m/BFzi613og==", + "dev": true, + "requires": { + "@babel/parser": "^7.23.9", + "@vue/shared": "3.4.21", + "entities": "^4.5.0", + "estree-walker": "^2.0.2", + "source-map-js": "^1.0.2" + } + }, + "@vue/compiler-dom": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.21.tgz", + "integrity": "sha512-IZC6FKowtT1sl0CR5DpXSiEB5ayw75oT2bma1BEhV7RRR1+cfwLrxc2Z8Zq/RGFzJ8w5r9QtCOvTjQgdn0IKmA==", + "dev": true, + "requires": { + "@vue/compiler-core": "3.4.21", + "@vue/shared": "3.4.21" + } + }, + "@vue/compiler-sfc": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.21.tgz", + "integrity": "sha512-me7epoTxYlY+2CUM7hy9PCDdpMPfIwrOvAXud2Upk10g4YLv9UBW7kL798TvMeDhPthkZ0CONNrK2GoeI1ODiQ==", + "dev": true, + "requires": { + "@babel/parser": "^7.23.9", + "@vue/compiler-core": "3.4.21", + "@vue/compiler-dom": "3.4.21", + "@vue/compiler-ssr": "3.4.21", + "@vue/shared": "3.4.21", + "estree-walker": "^2.0.2", + "magic-string": "^0.30.7", + "postcss": "^8.4.35", + "source-map-js": "^1.0.2" + } + }, + "@vue/compiler-ssr": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.21.tgz", + "integrity": "sha512-M5+9nI2lPpAsgXOGQobnIueVqc9sisBFexh5yMIMRAPYLa7+5wEJs8iqOZc1WAa9WQbx9GR2twgznU8LTIiZ4Q==", + "dev": true, + "requires": { + "@vue/compiler-dom": "3.4.21", + "@vue/shared": "3.4.21" + } + }, + "@vue/reactivity": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.21.tgz", + "integrity": "sha512-UhenImdc0L0/4ahGCyEzc/pZNwVgcglGy9HVzJ1Bq2Mm9qXOpP8RyNTjookw/gOCUlXSEtuZ2fUg5nrHcoqJcw==", + "dev": true, + "requires": { + "@vue/shared": "3.4.21" + } + }, + "@vue/runtime-core": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.21.tgz", + "integrity": "sha512-pQthsuYzE1XcGZznTKn73G0s14eCJcjaLvp3/DKeYWoFacD9glJoqlNBxt3W2c5S40t6CCcpPf+jG01N3ULyrA==", + "dev": true, + "requires": { + "@vue/reactivity": "3.4.21", + "@vue/shared": "3.4.21" + } + }, + "@vue/runtime-dom": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.21.tgz", + "integrity": "sha512-gvf+C9cFpevsQxbkRBS1NpU8CqxKw0ebqMvLwcGQrNpx6gqRDodqKqA+A2VZZpQ9RpK2f9yfg8VbW/EpdFUOJw==", + "dev": true, + "requires": { + "@vue/runtime-core": "3.4.21", + "@vue/shared": "3.4.21", + "csstype": "^3.1.3" + } + }, + "@vue/server-renderer": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.21.tgz", + "integrity": "sha512-aV1gXyKSN6Rz+6kZ6kr5+Ll14YzmIbeuWe7ryJl5muJ4uwSwY/aStXTixx76TwkZFJLm1aAlA/HSWEJ4EyiMkg==", + "dev": true, + "requires": { + "@vue/compiler-ssr": "3.4.21", + "@vue/shared": "3.4.21" + } + }, + "@vue/shared": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.21.tgz", + "integrity": "sha512-PuJe7vDIi6VYSinuEbUIQgMIRZGgM8e4R+G+/dQTk0X1NEdvgvvgv7m+rfmDH1gZzyA1OjjoWskvHlfRNfQf3g==", + "dev": true + }, "@webassemblyjs/ast": { "version": "1.11.6", "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.6.tgz", @@ -12034,6 +12285,12 @@ "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==", "dev": true }, + "estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true + }, "esutils": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz", @@ -13661,6 +13918,15 @@ "yallist": "^3.0.2" } }, + "magic-string": { + "version": "0.30.8", + "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.8.tgz", + "integrity": "sha512-ISQTe55T2ao7XtlAStud6qwYPZjE4GK1S/BeVPus4jrq6JuOnQ00YKQC581RWhR122W7msZV263KzVeLoqidyQ==", + "dev": true, + "requires": { + "@jridgewell/sourcemap-codec": "^1.4.15" + } + }, "make-dir": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-4.0.0.tgz", @@ -15367,6 +15633,19 @@ "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==", "dev": true }, + "vue": { + "version": "3.4.21", + "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.21.tgz", + "integrity": "sha512-5hjyV/jLEIKD/jYl4cavMcnzKwjMKohureP8ejn3hhEjwhWIhWeuzL2kJAjzl/WyVsgPY56Sy4Z40C3lVshxXA==", + "dev": true, + "requires": { + "@vue/compiler-dom": "3.4.21", + "@vue/compiler-sfc": "3.4.21", + "@vue/runtime-dom": "3.4.21", + "@vue/server-renderer": "3.4.21", + "@vue/shared": "3.4.21" + } + }, "w3c-xmlserializer": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-4.0.0.tgz", diff --git a/package.json b/package.json index 6e29cc3..05d4bb9 100644 --- a/package.json +++ b/package.json @@ -18,9 +18,8 @@ "bump:git": "git add --all && git commit -m \"New version $npm_package_version\" && git tag $npm_package_version && git push --tags origin HEAD:main" }, "devDependencies": { - "html-webpack-plugin": "^5.5.3", - "@mappable-world/mappable-cli": "^0.0.28", - "@mappable-world/mappable-types": "^0.0.4", + "@mappable-world/mappable-cli": "^0.0.32", + "@mappable-world/mappable-types": "^0.0.15", "@types/got": "9.6.12", "@types/jest": "29.5.3", "@types/jsdom": "21.1.1", @@ -35,6 +34,7 @@ "eslint-config-prettier": "8.8.0", "eslint-plugin-prettier": "4.2.1", "got": "11.8.6", + "html-webpack-plugin": "^5.5.3", "identity-obj-proxy": "3.0.0", "jest": "29.6.1", "jsdom": "22.1.0", @@ -44,6 +44,7 @@ "ts-jest": "29.1.1", "ts-loader": "9.4.4", "typescript": "5.1.6", + "vue": "^3.4.21", "webpack": "5.88.1", "webpack-cli": "5.1.4", "webpack-dev-server": "4.15.1" diff --git a/src/MMapButtonExample/__snapshots__/MMapButtonExample.test.ts.snap b/src/MMapButtonExample/__snapshots__/MMapButtonExample.test.ts.snap index 61c929a..ca62012 100644 --- a/src/MMapButtonExample/__snapshots__/MMapButtonExample.test.ts.snap +++ b/src/MMapButtonExample/__snapshots__/MMapButtonExample.test.ts.snap @@ -69,7 +69,7 @@ exports[`MMap smoke test should make map 1`] = ` "children": [ { "attributes": { - "class": "mappable--control", + "class": "mappable--control mappable--control__background", }, "children": [ { @@ -124,6 +124,12 @@ exports[`MMap smoke test should make map 1`] = ` }, "nodeName": "span", }, + { + "attributes": { + "class": "mappable--map-copyrights__scale", + }, + "nodeName": "div", + }, ], "nodeName": "div", }, diff --git a/tsconfig.json b/tsconfig.json index eaa153b..d8e1bb1 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,7 +1,8 @@ { - "extends": ["@mappable-world/mappable-cli"], + "extends": "@mappable-world/mappable-cli", "compilerOptions": { - "typeRoots": ["./node_modules/@types", "./node_modules/@mappable-world"] + "lib": ["dom", "dom.iterable", "esnext"], + "typeRoots": ["./node_modules/@types", "./node_modules/@mappable-world", "./types"] }, - "include": ["./src", "./node_modules/@mappable-world/mappable-cli/index.d.ts"] + "include": ["./src", "./node_modules/@mappable-world/mappable-cli/index.d.ts"] } diff --git a/types/index.d.ts b/types/index.d.ts new file mode 100644 index 0000000..92bbbdc --- /dev/null +++ b/types/index.d.ts @@ -0,0 +1,7 @@ +declare module '@mappable-world/mappable-types/import' { + interface Import { + (pkg: '@mappable-world/mappable-default-ui-theme'): Promise; + } +} + +export {};