From ce4e4284d409e58782f864d4f0fc666dc10ff55c Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Tue, 19 Mar 2024 13:16:48 +0300 Subject: [PATCH 01/43] Added getting information about icons from Figma --- package-lock.json | 290 +++++++++++++++++++++++++++ package.json | 5 +- tools/figma/figma-api.ts | 32 +++ tools/figma/get-components.ts | 23 +++ tools/figma/get-icon-descriptions.ts | 54 +++++ tools/sync-icons.ts | 15 ++ 6 files changed, 418 insertions(+), 1 deletion(-) create mode 100644 tools/figma/figma-api.ts create mode 100644 tools/figma/get-components.ts create mode 100644 tools/figma/get-icon-descriptions.ts create mode 100644 tools/sync-icons.ts diff --git a/package-lock.json b/package-lock.json index 3ff122b..7674b76 100644 --- a/package-lock.json +++ b/package-lock.json @@ -24,6 +24,7 @@ "eslint": "8.44.0", "eslint-config-prettier": "8.8.0", "eslint-plugin-prettier": "4.2.1", + "figma-api": "^1.11.0", "got": "11.8.6", "html-webpack-plugin": "^5.5.3", "identity-obj-proxy": "3.0.0", @@ -35,6 +36,7 @@ "terser-webpack-plugin": "5.3.9", "ts-jest": "29.1.1", "ts-loader": "9.4.4", + "ts-node": "^10.9.2", "typescript": "5.1.6", "vue": "^3.4.21", "webpack": "5.88.1", @@ -713,6 +715,28 @@ "integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==", "dev": true }, + "node_modules/@cspotcode/source-map-support": { + "version": "0.8.1", + "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz", + "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==", + "dev": true, + "dependencies": { + "@jridgewell/trace-mapping": "0.3.9" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@cspotcode/source-map-support/node_modules/@jridgewell/trace-mapping": { + "version": "0.3.9", + "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz", + "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==", + "dev": true, + "dependencies": { + "@jridgewell/resolve-uri": "^3.0.3", + "@jridgewell/sourcemap-codec": "^1.4.10" + } + }, "node_modules/@discoveryjs/json-ext": { "version": "0.5.7", "resolved": "https://registry.npmjs.org/@discoveryjs/json-ext/-/json-ext-0.5.7.tgz", @@ -1398,6 +1422,30 @@ "node": ">=10.13.0" } }, + "node_modules/@tsconfig/node10": { + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.11.tgz", + "integrity": "sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==", + "dev": true + }, + "node_modules/@tsconfig/node12": { + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz", + "integrity": "sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==", + "dev": true + }, + "node_modules/@tsconfig/node14": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz", + "integrity": "sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==", + "dev": true + }, + "node_modules/@tsconfig/node16": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz", + "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==", + "dev": true + }, "node_modules/@types/babel__core": { "version": "7.20.5", "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz", @@ -2353,6 +2401,15 @@ "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0" } }, + "node_modules/acorn-walk": { + "version": "8.3.2", + "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.2.tgz", + "integrity": "sha512-cjkyv4OtNCIeqhHrfS81QWXoCBPExR/J62oyEqepVw8WaQeSqpW2uhuLPh1m9eWhDuOo/jUXVTlifvesOWp/4A==", + "dev": true, + "engines": { + "node": ">=0.4.0" + } + }, "node_modules/agent-base": { "version": "6.0.2", "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz", @@ -2505,6 +2562,12 @@ "node": ">= 8" } }, + "node_modules/arg": { + "version": "4.1.3", + "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz", + "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==", + "dev": true + }, "node_modules/argparse": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", @@ -2532,6 +2595,15 @@ "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==", "dev": true }, + "node_modules/axios": { + "version": "0.21.4", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.4.tgz", + "integrity": "sha512-ut5vewkiu8jjGBdqpM44XxjuCjq9LAKeHVmoVfHVzy8eHgxxq8SbAVQNovDA8mVi05kP0Ea/n/UzcSHcTJQfNg==", + "dev": true, + "dependencies": { + "follow-redirects": "^1.14.0" + } + }, "node_modules/babel-jest": { "version": "29.7.0", "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-29.7.0.tgz", @@ -3256,6 +3328,12 @@ "node": "^14.15.0 || ^16.10.0 || >=18.0.0" } }, + "node_modules/create-require": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz", + "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==", + "dev": true + }, "node_modules/cross-fetch": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-4.0.0.tgz", @@ -3592,6 +3670,15 @@ "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==", "dev": true }, + "node_modules/diff": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz", + "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==", + "dev": true, + "engines": { + "node": ">=0.3.1" + } + }, "node_modules/diff-sequences": { "version": "29.6.3", "resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-29.6.3.tgz", @@ -4360,6 +4447,22 @@ "bser": "2.1.1" } }, + "node_modules/figma-api": { + "version": "1.11.0", + "resolved": "https://registry.npmjs.org/figma-api/-/figma-api-1.11.0.tgz", + "integrity": "sha512-inGRug909pPeLqcCcjMwXGnxcJjMVeAXk/kLLjlo2y/IjYURgX56u7HUqUrmASmSUqQB9BVuz/PlK9KRDWkiPA==", + "dev": true, + "dependencies": { + "@types/node": "12.0.2", + "axios": "^0.21.1" + } + }, + "node_modules/figma-api/node_modules/@types/node": { + "version": "12.0.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-12.0.2.tgz", + "integrity": "sha512-5tabW/i+9mhrfEOUcLDu2xBPsHJ+X5Orqy9FKpale3SjDA17j5AEpYq5vfy3oAeAHGcvANRCO3NV3d2D6q3NiA==", + "dev": true + }, "node_modules/file-entry-cache": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz", @@ -8549,6 +8652,49 @@ "webpack": "^5.0.0" } }, + "node_modules/ts-node": { + "version": "10.9.2", + "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.2.tgz", + "integrity": "sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==", + "dev": true, + "dependencies": { + "@cspotcode/source-map-support": "^0.8.0", + "@tsconfig/node10": "^1.0.7", + "@tsconfig/node12": "^1.0.7", + "@tsconfig/node14": "^1.0.0", + "@tsconfig/node16": "^1.0.2", + "acorn": "^8.4.1", + "acorn-walk": "^8.1.1", + "arg": "^4.1.0", + "create-require": "^1.1.0", + "diff": "^4.0.1", + "make-error": "^1.1.1", + "v8-compile-cache-lib": "^3.0.1", + "yn": "3.1.1" + }, + "bin": { + "ts-node": "dist/bin.js", + "ts-node-cwd": "dist/bin-cwd.js", + "ts-node-esm": "dist/bin-esm.js", + "ts-node-script": "dist/bin-script.js", + "ts-node-transpile-only": "dist/bin-transpile.js", + "ts-script": "dist/bin-script-deprecated.js" + }, + "peerDependencies": { + "@swc/core": ">=1.2.50", + "@swc/wasm": ">=1.2.50", + "@types/node": "*", + "typescript": ">=2.7" + }, + "peerDependenciesMeta": { + "@swc/core": { + "optional": true + }, + "@swc/wasm": { + "optional": true + } + } + }, "node_modules/tslib": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", @@ -8717,6 +8863,12 @@ "uuid": "dist/bin/uuid" } }, + "node_modules/v8-compile-cache-lib": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz", + "integrity": "sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==", + "dev": true + }, "node_modules/v8-to-istanbul": { "version": "9.2.0", "resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.2.0.tgz", @@ -9329,6 +9481,15 @@ "node": ">=12" } }, + "node_modules/yn": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz", + "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==", + "dev": true, + "engines": { + "node": ">=6" + } + }, "node_modules/yocto-queue": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz", @@ -9852,6 +10013,27 @@ "integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==", "dev": true }, + "@cspotcode/source-map-support": { + "version": "0.8.1", + "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz", + "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==", + "dev": true, + "requires": { + "@jridgewell/trace-mapping": "0.3.9" + }, + "dependencies": { + "@jridgewell/trace-mapping": { + "version": "0.3.9", + "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz", + "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==", + "dev": true, + "requires": { + "@jridgewell/resolve-uri": "^3.0.3", + "@jridgewell/sourcemap-codec": "^1.4.10" + } + } + } + }, "@discoveryjs/json-ext": { "version": "0.5.7", "resolved": "https://registry.npmjs.org/@discoveryjs/json-ext/-/json-ext-0.5.7.tgz", @@ -10371,6 +10553,30 @@ "integrity": "sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==", "dev": true }, + "@tsconfig/node10": { + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.11.tgz", + "integrity": "sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==", + "dev": true + }, + "@tsconfig/node12": { + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz", + "integrity": "sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==", + "dev": true + }, + "@tsconfig/node14": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz", + "integrity": "sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==", + "dev": true + }, + "@tsconfig/node16": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz", + "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==", + "dev": true + }, "@types/babel__core": { "version": "7.20.5", "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz", @@ -11192,6 +11398,12 @@ "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==", "dev": true }, + "acorn-walk": { + "version": "8.3.2", + "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.2.tgz", + "integrity": "sha512-cjkyv4OtNCIeqhHrfS81QWXoCBPExR/J62oyEqepVw8WaQeSqpW2uhuLPh1m9eWhDuOo/jUXVTlifvesOWp/4A==", + "dev": true + }, "agent-base": { "version": "6.0.2", "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz", @@ -11296,6 +11508,12 @@ "picomatch": "^2.0.4" } }, + "arg": { + "version": "4.1.3", + "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz", + "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==", + "dev": true + }, "argparse": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", @@ -11320,6 +11538,15 @@ "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==", "dev": true }, + "axios": { + "version": "0.21.4", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.4.tgz", + "integrity": "sha512-ut5vewkiu8jjGBdqpM44XxjuCjq9LAKeHVmoVfHVzy8eHgxxq8SbAVQNovDA8mVi05kP0Ea/n/UzcSHcTJQfNg==", + "dev": true, + "requires": { + "follow-redirects": "^1.14.0" + } + }, "babel-jest": { "version": "29.7.0", "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-29.7.0.tgz", @@ -11873,6 +12100,12 @@ "prompts": "^2.0.1" } }, + "create-require": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz", + "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==", + "dev": true + }, "cross-fetch": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-4.0.0.tgz", @@ -12109,6 +12342,12 @@ "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==", "dev": true }, + "diff": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz", + "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==", + "dev": true + }, "diff-sequences": { "version": "29.6.3", "resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-29.6.3.tgz", @@ -12694,6 +12933,24 @@ "bser": "2.1.1" } }, + "figma-api": { + "version": "1.11.0", + "resolved": "https://registry.npmjs.org/figma-api/-/figma-api-1.11.0.tgz", + "integrity": "sha512-inGRug909pPeLqcCcjMwXGnxcJjMVeAXk/kLLjlo2y/IjYURgX56u7HUqUrmASmSUqQB9BVuz/PlK9KRDWkiPA==", + "dev": true, + "requires": { + "@types/node": "12.0.2", + "axios": "^0.21.1" + }, + "dependencies": { + "@types/node": { + "version": "12.0.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-12.0.2.tgz", + "integrity": "sha512-5tabW/i+9mhrfEOUcLDu2xBPsHJ+X5Orqy9FKpale3SjDA17j5AEpYq5vfy3oAeAHGcvANRCO3NV3d2D6q3NiA==", + "dev": true + } + } + }, "file-entry-cache": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz", @@ -15773,6 +16030,27 @@ "semver": "^7.3.4" } }, + "ts-node": { + "version": "10.9.2", + "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.2.tgz", + "integrity": "sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==", + "dev": true, + "requires": { + "@cspotcode/source-map-support": "^0.8.0", + "@tsconfig/node10": "^1.0.7", + "@tsconfig/node12": "^1.0.7", + "@tsconfig/node14": "^1.0.0", + "@tsconfig/node16": "^1.0.2", + "acorn": "^8.4.1", + "acorn-walk": "^8.1.1", + "arg": "^4.1.0", + "create-require": "^1.1.0", + "diff": "^4.0.1", + "make-error": "^1.1.1", + "v8-compile-cache-lib": "^3.0.1", + "yn": "3.1.1" + } + }, "tslib": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", @@ -15887,6 +16165,12 @@ "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==", "dev": true }, + "v8-compile-cache-lib": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz", + "integrity": "sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==", + "dev": true + }, "v8-to-istanbul": { "version": "9.2.0", "resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.2.0.tgz", @@ -16317,6 +16601,12 @@ "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==", "dev": true }, + "yn": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz", + "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==", + "dev": true + }, "yocto-queue": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz", diff --git a/package.json b/package.json index c1f2ca6..3e75f3f 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,8 @@ "watch": "webpack --watch", "start": "webpack serve", "bump": "npm version prerelease --preid=beta --no-git-tag-version && npm run bump:git", - "bump:git": "git add --all && git commit -m \"New version $npm_package_version\" && git tag $npm_package_version && git push --tags origin HEAD:main" + "bump:git": "git add --all && git commit -m \"New version $npm_package_version\" && git tag $npm_package_version && git push --tags origin HEAD:main", + "sync-icons": "node -r dotenv/config -r ts-node/register ./tools/sync-icons.ts" }, "devDependencies": { "@mappable-world/mappable-cli": "^0.0.32", @@ -33,6 +34,7 @@ "eslint": "8.44.0", "eslint-config-prettier": "8.8.0", "eslint-plugin-prettier": "4.2.1", + "figma-api": "^1.11.0", "got": "11.8.6", "html-webpack-plugin": "^5.5.3", "identity-obj-proxy": "3.0.0", @@ -44,6 +46,7 @@ "terser-webpack-plugin": "5.3.9", "ts-jest": "29.1.1", "ts-loader": "9.4.4", + "ts-node": "^10.9.2", "typescript": "5.1.6", "vue": "^3.4.21", "webpack": "5.88.1", diff --git a/tools/figma/figma-api.ts b/tools/figma/figma-api.ts new file mode 100644 index 0000000..ee20505 --- /dev/null +++ b/tools/figma/figma-api.ts @@ -0,0 +1,32 @@ +import {Api as FigmaApi} from 'figma-api'; +import {getComponents} from './get-components'; +import {getIconDescriptions} from './get-icon-descriptions'; + +/** The name of the canvas in the file from which the icons will be loaded */ +const CANVAS_NAME = 'glyphs'; +const AVAILABLE_SIZES = [14, 24]; + +export async function fetchFigmaIcons() { + const personalAccessToken: string | undefined = process.env.FIGMA_API_TOKEN; + const fileId: string | undefined = process.env.FIGMA_FILE_ID; + + if (!personalAccessToken) { + throw new Error('No Figma access token found in environment variable FIGMA_API_TOKEN'); + } + if (!fileId) { + throw new Error('No Figma file id found in environment variable FIGMA_FILE_ID'); + } + + const api = new FigmaApi({personalAccessToken}); + + const components = await getComponents({fileId, canvasName: CANVAS_NAME}, api); + console.info('Success get components'); + // components.forEach((c) => console.log(c.name)); + const iconDescriptions = getIconDescriptions(components, AVAILABLE_SIZES); + console.info('Success get icon descriptions'); + iconDescriptions.forEach((i) => console.log(i.name)); + + // const images = await getImages(iconDescriptions, fileId, api); + // console.info('Success load icon images'); + // console.log(localeMatchimages); +} diff --git a/tools/figma/get-components.ts b/tools/figma/get-components.ts new file mode 100644 index 0000000..63a397d --- /dev/null +++ b/tools/figma/get-components.ts @@ -0,0 +1,23 @@ +import {Api as FigmaApi, Node, isNodeType} from 'figma-api'; + +type ComponentOptions = { + fileId: string; + canvasName: string; +}; + +export const getComponents = async (options: ComponentOptions, api: FigmaApi): Promise[]> => { + const file = await api.getFile(options.fileId); + + const canvas = file.document.children.find((child) => child.name === options.canvasName) as Node<'CANVAS'>; + if (!canvas) { + throw new Error(`Canvas "${options.canvasName}" not found!`); + } + + return canvas.children.reduce((components, child) => { + if (!isNodeType(child, 'GROUP')) { + return components; + } + const newComponents = child.children.filter((child) => isNodeType(child, 'INSTANCE')) as Node<'COMPONENT'>[]; + return components.concat(newComponents); + }, [] as Node<'COMPONENT'>[]); +}; diff --git a/tools/figma/get-icon-descriptions.ts b/tools/figma/get-icon-descriptions.ts new file mode 100644 index 0000000..40c879a --- /dev/null +++ b/tools/figma/get-icon-descriptions.ts @@ -0,0 +1,54 @@ +import {ImageType, type Node} from 'figma-api'; + +const REGION_CODE_REGEXP = /_([a-z]{2})_/; +const SIZE_REGEXP = /_([0-9]{2})/; +const INTL_REGION_CODES = new Intl.DisplayNames(['en', 'ru'], {type: 'region'}); + +export type IconDescription = { + componentId: string; + name: string; + exportFormat: 'png' | 'svg'; +}; + +export const getIconDescriptions = (components: Node<'COMPONENT'>[], availableSizes: number[]): IconDescription[] => { + return components + .filter((component) => { + // the component should not have a regional code + if (componentNameHasRegionCode(component.name)) { + return false; + } + // the component must be of allowed size and square + if (!componentAvailableSize(component.name, availableSizes)) { + return false; + } + const {height, width} = component.absoluteBoundingBox; + return height === width; + }) + .map((component) => { + const isPng = + component.exportSettings?.length && + component.exportSettings.every(({format}) => format === ImageType.PNG); + const exportFormat = isPng ? 'png' : 'svg'; + return {componentId: component.id, name: component.name, exportFormat}; + }); +}; + +const componentNameHasRegionCode = (componentName: string): boolean => { + const regionMatch = REGION_CODE_REGEXP.exec(componentName); + if (regionMatch === null) { + return false; + } + const [, regionCode] = regionMatch; + const uppercaseCode = regionCode.toUpperCase(); + return INTL_REGION_CODES.of(uppercaseCode) !== uppercaseCode; +}; + +const componentAvailableSize = (componentName: string, availableSizes: number[]): boolean => { + const sizeMatch = SIZE_REGEXP.exec(componentName); + if (sizeMatch === null) { + return false; + } + const [, rawSize] = sizeMatch; + const size = rawSize ? Number(rawSize) : undefined; + return availableSizes.includes(size as number); +}; diff --git a/tools/sync-icons.ts b/tools/sync-icons.ts new file mode 100644 index 0000000..ae238b6 --- /dev/null +++ b/tools/sync-icons.ts @@ -0,0 +1,15 @@ +import {fetchFigmaIcons} from './figma/figma-api'; + +async function main() { + try { + console.info('Start update figma icons'); + await fetchFigmaIcons(); + console.info('Update figma icons succeed!'); + } catch (error) { + console.error(error.message || error.toString()); + } +} + +main().catch(() => { + process.exit(1); +}); From a269e912faf9f525f35ee1a5b1207b2ffe42dea7 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Tue, 19 Mar 2024 14:22:54 +0300 Subject: [PATCH 02/43] Added getting links to icons --- tools/figma/{figma-api.ts => fetch-icons.ts} | 11 ++-- tools/figma/get-icon-descriptions.ts | 4 +- tools/figma/get-image-links.ts | 66 ++++++++++++++++++++ tools/make-chunks.ts | 10 +++ tools/sync-icons.ts | 2 +- 5 files changed, 86 insertions(+), 7 deletions(-) rename tools/figma/{figma-api.ts => fetch-icons.ts} (79%) create mode 100644 tools/figma/get-image-links.ts create mode 100644 tools/make-chunks.ts diff --git a/tools/figma/figma-api.ts b/tools/figma/fetch-icons.ts similarity index 79% rename from tools/figma/figma-api.ts rename to tools/figma/fetch-icons.ts index ee20505..cebac51 100644 --- a/tools/figma/figma-api.ts +++ b/tools/figma/fetch-icons.ts @@ -1,6 +1,7 @@ import {Api as FigmaApi} from 'figma-api'; import {getComponents} from './get-components'; import {getIconDescriptions} from './get-icon-descriptions'; +import {getImageLinks} from './get-image-links'; /** The name of the canvas in the file from which the icons will be loaded */ const CANVAS_NAME = 'glyphs'; @@ -21,12 +22,12 @@ export async function fetchFigmaIcons() { const components = await getComponents({fileId, canvasName: CANVAS_NAME}, api); console.info('Success get components'); - // components.forEach((c) => console.log(c.name)); + const iconDescriptions = getIconDescriptions(components, AVAILABLE_SIZES); console.info('Success get icon descriptions'); - iconDescriptions.forEach((i) => console.log(i.name)); - // const images = await getImages(iconDescriptions, fileId, api); - // console.info('Success load icon images'); - // console.log(localeMatchimages); + const imageLinks = await getImageLinks(iconDescriptions, fileId, api); + console.info('Success load icon images'); + + return imageLinks; } diff --git a/tools/figma/get-icon-descriptions.ts b/tools/figma/get-icon-descriptions.ts index 40c879a..8a8be10 100644 --- a/tools/figma/get-icon-descriptions.ts +++ b/tools/figma/get-icon-descriptions.ts @@ -4,10 +4,12 @@ const REGION_CODE_REGEXP = /_([a-z]{2})_/; const SIZE_REGEXP = /_([0-9]{2})/; const INTL_REGION_CODES = new Intl.DisplayNames(['en', 'ru'], {type: 'region'}); +export type ExportFormat = 'png' | 'svg'; + export type IconDescription = { componentId: string; name: string; - exportFormat: 'png' | 'svg'; + exportFormat: ExportFormat; }; export const getIconDescriptions = (components: Node<'COMPONENT'>[], availableSizes: number[]): IconDescription[] => { diff --git a/tools/figma/get-image-links.ts b/tools/figma/get-image-links.ts new file mode 100644 index 0000000..1283138 --- /dev/null +++ b/tools/figma/get-image-links.ts @@ -0,0 +1,66 @@ +import {Api as FigmaApi} from 'figma-api'; +import {GetImageResult} from 'figma-api/lib/api-types'; +import {ExportFormat, IconDescription} from './get-icon-descriptions'; +import {makeChunks} from '../make-chunks'; + +const IMAGE_SCALE = 1; +const ICONS_PER_CHUNK = 100; + +export type IconDescriptionWithLink = IconDescription & { + link: string; +}; +type SeparatedIcons = { + [key in ExportFormat]: IconDescription[]; +}; + +export const getImageLinks = async ( + descriptions: IconDescription[], + fileId: string, + api: FigmaApi +): Promise => { + const chunks = separateIntoChunks(descriptions); + const linkChunks = await Promise.all( + chunks.map((chunk) => + api.getImage(fileId, { + ids: chunk.map((icon) => icon.componentId).join(','), + scale: IMAGE_SCALE, + format: chunk[0].exportFormat + }) + ) + ); + const links = linkChunks.reduce( + (memo, chunk) => { + if (chunk.err) { + memo.err = chunk.err; + } + if (chunk.images) { + memo.images = {...memo.images, ...chunk.images}; + } + return memo; + }, + {images: {}} + ); + + if (links.err) { + throw new Error(`Error while loading links: ${links.err}`); + } + + return descriptions.reduce((descriptionsWithLink, description) => { + const link = links.images[description.componentId]; + if (link) { + return descriptionsWithLink.concat({...description, link}); + } + return descriptionsWithLink; + }, []); +}; + +const separateIntoChunks = (descriptions: IconDescription[]): IconDescription[][] => { + const separatedIcons = descriptions.reduce( + (result, icon) => { + result[icon.exportFormat].push(icon); + return result; + }, + {svg: [], png: []} + ); + return [...makeChunks(separatedIcons.svg, ICONS_PER_CHUNK), ...makeChunks(separatedIcons.png, ICONS_PER_CHUNK)]; +}; diff --git a/tools/make-chunks.ts b/tools/make-chunks.ts new file mode 100644 index 0000000..5debb13 --- /dev/null +++ b/tools/make-chunks.ts @@ -0,0 +1,10 @@ +export const makeChunks = (input: T[], perChunk: number): T[][] => { + return input.reduce((chunks, item, index) => { + const chunkIndex = Math.floor(index / perChunk); + if (!chunks[chunkIndex]) { + chunks[chunkIndex] = []; + } + chunks[chunkIndex].push(item); + return chunks; + }, []); +}; diff --git a/tools/sync-icons.ts b/tools/sync-icons.ts index ae238b6..8d95dfe 100644 --- a/tools/sync-icons.ts +++ b/tools/sync-icons.ts @@ -1,4 +1,4 @@ -import {fetchFigmaIcons} from './figma/figma-api'; +import {fetchFigmaIcons} from './figma/fetch-icons'; async function main() { try { From 04116912862b290e9ed0c9742916bfddda459c48 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Tue, 19 Mar 2024 14:27:17 +0300 Subject: [PATCH 03/43] restructuring inside the tools folder --- package.json | 2 +- tools/figma/get-image-links.ts | 2 +- tools/{ => scripts}/sync-icons.ts | 2 +- tools/{ => utils}/make-chunks.ts | 0 4 files changed, 3 insertions(+), 3 deletions(-) rename tools/{ => scripts}/sync-icons.ts (85%) rename tools/{ => utils}/make-chunks.ts (100%) diff --git a/package.json b/package.json index 3e75f3f..d8f9851 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,7 @@ "start": "webpack serve", "bump": "npm version prerelease --preid=beta --no-git-tag-version && npm run bump:git", "bump:git": "git add --all && git commit -m \"New version $npm_package_version\" && git tag $npm_package_version && git push --tags origin HEAD:main", - "sync-icons": "node -r dotenv/config -r ts-node/register ./tools/sync-icons.ts" + "sync-icons": "node -r dotenv/config -r ts-node/register ./tools/scripts/sync-icons.ts" }, "devDependencies": { "@mappable-world/mappable-cli": "^0.0.32", diff --git a/tools/figma/get-image-links.ts b/tools/figma/get-image-links.ts index 1283138..3cc2fdd 100644 --- a/tools/figma/get-image-links.ts +++ b/tools/figma/get-image-links.ts @@ -1,7 +1,7 @@ import {Api as FigmaApi} from 'figma-api'; import {GetImageResult} from 'figma-api/lib/api-types'; +import {makeChunks} from '../utils/make-chunks'; import {ExportFormat, IconDescription} from './get-icon-descriptions'; -import {makeChunks} from '../make-chunks'; const IMAGE_SCALE = 1; const ICONS_PER_CHUNK = 100; diff --git a/tools/sync-icons.ts b/tools/scripts/sync-icons.ts similarity index 85% rename from tools/sync-icons.ts rename to tools/scripts/sync-icons.ts index 8d95dfe..ef9174b 100644 --- a/tools/sync-icons.ts +++ b/tools/scripts/sync-icons.ts @@ -1,4 +1,4 @@ -import {fetchFigmaIcons} from './figma/fetch-icons'; +import {fetchFigmaIcons} from '../figma/fetch-icons'; async function main() { try { diff --git a/tools/make-chunks.ts b/tools/utils/make-chunks.ts similarity index 100% rename from tools/make-chunks.ts rename to tools/utils/make-chunks.ts From b970a93ae9a000010f80fecf5aa7b6b89b4b17b7 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Tue, 19 Mar 2024 16:18:16 +0300 Subject: [PATCH 04/43] Fetching components only with export settings --- tools/figma/get-icon-descriptions.ts | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/tools/figma/get-icon-descriptions.ts b/tools/figma/get-icon-descriptions.ts index 8a8be10..850746d 100644 --- a/tools/figma/get-icon-descriptions.ts +++ b/tools/figma/get-icon-descriptions.ts @@ -15,6 +15,10 @@ export type IconDescription = { export const getIconDescriptions = (components: Node<'COMPONENT'>[], availableSizes: number[]): IconDescription[] => { return components .filter((component) => { + // the component must have export settings + if (component.exportSettings === undefined || component.exportSettings.length === 0) { + return false; + } // the component should not have a regional code if (componentNameHasRegionCode(component.name)) { return false; @@ -27,9 +31,7 @@ export const getIconDescriptions = (components: Node<'COMPONENT'>[], availableSi return height === width; }) .map((component) => { - const isPng = - component.exportSettings?.length && - component.exportSettings.every(({format}) => format === ImageType.PNG); + const isPng = component.exportSettings.every(({format}) => format === ImageType.PNG); const exportFormat = isPng ? 'png' : 'svg'; return {componentId: component.id, name: component.name, exportFormat}; }); From 4535ac51cb7b9ab1b4d386c367bb9b084ed7b2c6 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Fri, 29 Mar 2024 15:23:04 +0300 Subject: [PATCH 05/43] install lodash --- package-lock.json | 8 ++++++++ package.json | 2 ++ 2 files changed, 10 insertions(+) diff --git a/package-lock.json b/package-lock.json index 7674b76..19260b2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "@types/got": "9.6.12", "@types/jest": "29.5.3", "@types/jsdom": "21.1.1", + "@types/lodash": "^4.17.0", "@types/react": "18.2.14", "@types/react-dom": "18.2.6", "@typescript-eslint/eslint-plugin": "6.0.0", @@ -30,6 +31,7 @@ "identity-obj-proxy": "3.0.0", "jest": "29.6.1", "jsdom": "22.1.0", + "lodash": "^4.17.21", "prettier": "3.0.0", "style-loader": "3.3.3", "svgo": "^3.2.0", @@ -1694,6 +1696,12 @@ "@types/node": "*" } }, + "node_modules/@types/lodash": { + "version": "4.17.0", + "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.0.tgz", + "integrity": "sha512-t7dhREVv6dbNj0q17X12j7yDG4bD/DHYX7o5/DbDxobP0HnGPgpRz2Ej77aL7TZT3DSw13fqUTj8J4mMnqa7WA==", + "dev": true + }, "node_modules/@types/mime": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.5.tgz", diff --git a/package.json b/package.json index d8f9851..a564ee3 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "@types/got": "9.6.12", "@types/jest": "29.5.3", "@types/jsdom": "21.1.1", + "@types/lodash": "^4.17.0", "@types/react": "18.2.14", "@types/react-dom": "18.2.6", "@typescript-eslint/eslint-plugin": "6.0.0", @@ -40,6 +41,7 @@ "identity-obj-proxy": "3.0.0", "jest": "29.6.1", "jsdom": "22.1.0", + "lodash": "^4.17.21", "prettier": "3.0.0", "style-loader": "3.3.3", "svgo": "^3.2.0", From 44ae08b061b7f01606830daf2aa303a42a36126b Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Fri, 29 Mar 2024 18:42:09 +0300 Subject: [PATCH 06/43] load icon in local folder --- package-lock.json | 2 +- package.json | 2 +- tools/figma/fetch-icons.ts | 11 ++------ tools/figma/get-image-files.ts | 46 ++++++++++++++++++++++++++++++++++ tools/figma/get-image-links.ts | 1 + tools/figma/local.ts | 45 +++++++++++++++++++++++++++++++++ tools/figma/update-files.ts | 17 +++++++++++++ tools/scripts/sync-icons.ts | 6 ++--- 8 files changed, 115 insertions(+), 15 deletions(-) create mode 100644 tools/figma/get-image-files.ts create mode 100644 tools/figma/local.ts create mode 100644 tools/figma/update-files.ts diff --git a/package-lock.json b/package-lock.json index 19260b2..7c2b5f6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -26,7 +26,7 @@ "eslint-config-prettier": "8.8.0", "eslint-plugin-prettier": "4.2.1", "figma-api": "^1.11.0", - "got": "11.8.6", + "got": "^11.8.6", "html-webpack-plugin": "^5.5.3", "identity-obj-proxy": "3.0.0", "jest": "29.6.1", diff --git a/package.json b/package.json index a564ee3..54ff508 100644 --- a/package.json +++ b/package.json @@ -36,7 +36,7 @@ "eslint-config-prettier": "8.8.0", "eslint-plugin-prettier": "4.2.1", "figma-api": "^1.11.0", - "got": "11.8.6", + "got": "^11.8.6", "html-webpack-plugin": "^5.5.3", "identity-obj-proxy": "3.0.0", "jest": "29.6.1", diff --git a/tools/figma/fetch-icons.ts b/tools/figma/fetch-icons.ts index cebac51..f43a67d 100644 --- a/tools/figma/fetch-icons.ts +++ b/tools/figma/fetch-icons.ts @@ -1,13 +1,13 @@ import {Api as FigmaApi} from 'figma-api'; import {getComponents} from './get-components'; import {getIconDescriptions} from './get-icon-descriptions'; -import {getImageLinks} from './get-image-links'; +import {IconDescriptionWithLink, getImageLinks} from './get-image-links'; /** The name of the canvas in the file from which the icons will be loaded */ const CANVAS_NAME = 'glyphs'; const AVAILABLE_SIZES = [14, 24]; -export async function fetchFigmaIcons() { +export async function fetchFigmaIcons(): Promise { const personalAccessToken: string | undefined = process.env.FIGMA_API_TOKEN; const fileId: string | undefined = process.env.FIGMA_FILE_ID; @@ -19,15 +19,8 @@ export async function fetchFigmaIcons() { } const api = new FigmaApi({personalAccessToken}); - const components = await getComponents({fileId, canvasName: CANVAS_NAME}, api); - console.info('Success get components'); - const iconDescriptions = getIconDescriptions(components, AVAILABLE_SIZES); - console.info('Success get icon descriptions'); - const imageLinks = await getImageLinks(iconDescriptions, fileId, api); - console.info('Success load icon images'); - return imageLinks; } diff --git a/tools/figma/get-image-files.ts b/tools/figma/get-image-files.ts new file mode 100644 index 0000000..f95022d --- /dev/null +++ b/tools/figma/get-image-files.ts @@ -0,0 +1,46 @@ +import got from 'got'; +import {IconDescription} from './get-icon-descriptions'; +import {IconDescriptionWithLink} from './get-image-links'; + +const MAX_RETRIES = 20; +/** Our designer marks these icons with this color that do not need to be worked on yet. */ +const ERROR_COLOR_REGEXP = /fill="#C90D0D"/; +/** Default icon color from Figma */ +const FILL_COLOR_REGEXP = /fill="black"/g; + +export type IconDescriptionWithData = IconDescription & { + data: Buffer; +}; + +export const downloadAndTransform = async (icons: IconDescriptionWithLink[]): Promise => { + const iconsWithData = await getImageFiles(icons); + return iconsWithData + .filter((icon) => (icon.exportFormat !== 'svg' ? true : !icon.data.toString().match(ERROR_COLOR_REGEXP))) + .map((icon) => + icon.exportFormat !== 'svg' + ? icon + : {...icon, data: Buffer.from(icon.data.toString().replace(FILL_COLOR_REGEXP, 'fill="currentColor"'))} + ); +}; + +const getImageFiles = async (icons: IconDescriptionWithLink[]): Promise => { + return Promise.all( + icons.map(async (icon) => { + try { + const file = await fetchFile(icon.link); + return {...file, name: icon.name, exportFormat: icon.exportFormat, componentId: icon.componentId}; + } catch (e) { + e.message = `${icon.name}: ${e.message}`; + throw e; + } + }) + ); +}; + +const fetchFile = async (url: string) => { + const response = await got(url, {timeout: 60 * 1000, retry: MAX_RETRIES}); + if (!response.body) { + throw new Error('No response body.'); + } + return {data: response.body}; +}; diff --git a/tools/figma/get-image-links.ts b/tools/figma/get-image-links.ts index 3cc2fdd..cd7373a 100644 --- a/tools/figma/get-image-links.ts +++ b/tools/figma/get-image-links.ts @@ -7,6 +7,7 @@ const IMAGE_SCALE = 1; const ICONS_PER_CHUNK = 100; export type IconDescriptionWithLink = IconDescription & { + componentId: string; link: string; }; type SeparatedIcons = { diff --git a/tools/figma/local.ts b/tools/figma/local.ts new file mode 100644 index 0000000..24ff972 --- /dev/null +++ b/tools/figma/local.ts @@ -0,0 +1,45 @@ +import fs from 'fs/promises'; +import path from 'path'; +import {ExportFormat} from './get-icon-descriptions'; +import {IconDescriptionWithData} from './get-image-files'; + +const BASE_DIR = path.join(__dirname, '../../'); +const ICONS_PATH = path.join(BASE_DIR, 'static/icons'); +const TYPES_PATH = path.join(BASE_DIR, 'src/icons/types'); + +export type FileDescription = { + name: string; + data: Buffer; + exportFormat: ExportFormat; +}; + +export const getFiles = async (): Promise => { + console.info('Getting static resources dir'); + const currentFilenames = await fs.readdir(ICONS_PATH); + const descriptions: FileDescription[] = await Promise.all( + currentFilenames.map(async (filename) => { + const fileExtension = path.parse(filename).ext.slice(1); + if (fileExtension !== 'svg' && fileExtension !== 'png') { + throw new Error('Unknown file extension.'); + } + const cleanFilename = path.parse(filename).name; + const data = await fs.readFile(path.join(ICONS_PATH, filename)); + return { + name: cleanFilename, + data, + exportFormat: fileExtension + }; + }) + ); + console.info(`${descriptions.length} current icons files fetched`); + return descriptions; +}; + +export const updateLocalFiles = async (icons: IconDescriptionWithData[]) => { + await Promise.all( + icons.map((icon) => { + const filePath = path.join(ICONS_PATH, `${icon.name}.${icon.exportFormat}`); + return fs.writeFile(filePath, icon.data, icon.exportFormat === 'svg' ? 'utf-8' : null); + }) + ); +}; diff --git a/tools/figma/update-files.ts b/tools/figma/update-files.ts new file mode 100644 index 0000000..ec2a7ce --- /dev/null +++ b/tools/figma/update-files.ts @@ -0,0 +1,17 @@ +import {differenceBy, intersectionBy} from 'lodash'; +import {fetchFigmaIcons} from '../figma/fetch-icons'; +import {getFiles, updateLocalFiles} from '../figma/local'; +import {downloadAndTransform} from './get-image-files'; + +export const updateFiles = async () => { + const localIcons = await getFiles(); + + const figmaIcons = await fetchFigmaIcons(); + + const existingLocalIcons = intersectionBy(localIcons, figmaIcons, (d) => d.name); + const iconsToDelete = differenceBy(localIcons, existingLocalIcons, (d) => d.name); + + const iconsWithData = await downloadAndTransform(figmaIcons); + + await updateLocalFiles(iconsWithData); +}; diff --git a/tools/scripts/sync-icons.ts b/tools/scripts/sync-icons.ts index ef9174b..65e038e 100644 --- a/tools/scripts/sync-icons.ts +++ b/tools/scripts/sync-icons.ts @@ -1,10 +1,8 @@ -import {fetchFigmaIcons} from '../figma/fetch-icons'; +import {updateFiles} from '../figma/update-files'; async function main() { try { - console.info('Start update figma icons'); - await fetchFigmaIcons(); - console.info('Update figma icons succeed!'); + await updateFiles(); } catch (error) { console.error(error.message || error.toString()); } From 0045793c79846994ead16ea62f882af6498a4717 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 1 Apr 2024 10:52:37 +0300 Subject: [PATCH 07/43] uploading icons from Figma to a local folder --- tools/figma/local.ts | 17 +++++++++++++---- tools/figma/update-files.ts | 17 ----------------- tools/figma/update-icons.ts | 17 +++++++++++++++++ tools/scripts/sync-icons.ts | 4 ++-- 4 files changed, 32 insertions(+), 23 deletions(-) delete mode 100644 tools/figma/update-files.ts create mode 100644 tools/figma/update-icons.ts diff --git a/tools/figma/local.ts b/tools/figma/local.ts index 24ff972..f10e23f 100644 --- a/tools/figma/local.ts +++ b/tools/figma/local.ts @@ -5,18 +5,18 @@ import {IconDescriptionWithData} from './get-image-files'; const BASE_DIR = path.join(__dirname, '../../'); const ICONS_PATH = path.join(BASE_DIR, 'static/icons'); -const TYPES_PATH = path.join(BASE_DIR, 'src/icons/types'); +// const TYPES_PATH = path.join(BASE_DIR, 'src/icons/types'); -export type FileDescription = { +export type LocalIconDescription = { name: string; data: Buffer; exportFormat: ExportFormat; }; -export const getFiles = async (): Promise => { +export const getLocalIcons = async (): Promise => { console.info('Getting static resources dir'); const currentFilenames = await fs.readdir(ICONS_PATH); - const descriptions: FileDescription[] = await Promise.all( + const descriptions: LocalIconDescription[] = await Promise.all( currentFilenames.map(async (filename) => { const fileExtension = path.parse(filename).ext.slice(1); if (fileExtension !== 'svg' && fileExtension !== 'png') { @@ -43,3 +43,12 @@ export const updateLocalFiles = async (icons: IconDescriptionWithData[]) => { }) ); }; + +export const deleteLocalFiles = async (iconsToDelete: LocalIconDescription[]) => { + await Promise.all( + iconsToDelete.map((icon) => { + const filePath = path.join(ICONS_PATH, `${icon.name}.${icon.exportFormat}`); + return fs.rm(filePath); + }) + ); +}; diff --git a/tools/figma/update-files.ts b/tools/figma/update-files.ts deleted file mode 100644 index ec2a7ce..0000000 --- a/tools/figma/update-files.ts +++ /dev/null @@ -1,17 +0,0 @@ -import {differenceBy, intersectionBy} from 'lodash'; -import {fetchFigmaIcons} from '../figma/fetch-icons'; -import {getFiles, updateLocalFiles} from '../figma/local'; -import {downloadAndTransform} from './get-image-files'; - -export const updateFiles = async () => { - const localIcons = await getFiles(); - - const figmaIcons = await fetchFigmaIcons(); - - const existingLocalIcons = intersectionBy(localIcons, figmaIcons, (d) => d.name); - const iconsToDelete = differenceBy(localIcons, existingLocalIcons, (d) => d.name); - - const iconsWithData = await downloadAndTransform(figmaIcons); - - await updateLocalFiles(iconsWithData); -}; diff --git a/tools/figma/update-icons.ts b/tools/figma/update-icons.ts new file mode 100644 index 0000000..5612420 --- /dev/null +++ b/tools/figma/update-icons.ts @@ -0,0 +1,17 @@ +import {differenceBy, intersectionBy} from 'lodash'; +import {fetchFigmaIcons} from './fetch-icons'; +import {deleteLocalFiles, getLocalIcons, updateLocalFiles} from './local'; +import {downloadAndTransform} from './get-image-files'; + +export const updateIcons = async () => { + const [localIcons, figmaIcons] = await Promise.all([getLocalIcons(), fetchFigmaIcons()]); + + const iconsWithData = await downloadAndTransform(figmaIcons); + await updateLocalFiles(iconsWithData); + + const existingLocalIcons = intersectionBy(localIcons, iconsWithData, (d) => d.name); + const iconsToDelete = differenceBy(localIcons, existingLocalIcons, (d) => d.name); + await deleteLocalFiles(iconsToDelete); + + return iconsWithData; +}; diff --git a/tools/scripts/sync-icons.ts b/tools/scripts/sync-icons.ts index 65e038e..6a571ad 100644 --- a/tools/scripts/sync-icons.ts +++ b/tools/scripts/sync-icons.ts @@ -1,8 +1,8 @@ -import {updateFiles} from '../figma/update-files'; +import {updateIcons} from '../figma/update-icons'; async function main() { try { - await updateFiles(); + await updateIcons(); } catch (error) { console.error(error.message || error.toString()); } From d71a25b943b57696f4e928a7e51917cb22e88b98 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 1 Apr 2024 11:49:02 +0300 Subject: [PATCH 08/43] export only svg files --- tools/figma/get-icon-descriptions.ts | 11 ++--------- tools/figma/get-image-files.ts | 13 ++++++------- tools/figma/get-image-links.ts | 20 +++----------------- tools/figma/local.ts | 9 +++------ 4 files changed, 14 insertions(+), 39 deletions(-) diff --git a/tools/figma/get-icon-descriptions.ts b/tools/figma/get-icon-descriptions.ts index 850746d..52ac393 100644 --- a/tools/figma/get-icon-descriptions.ts +++ b/tools/figma/get-icon-descriptions.ts @@ -1,15 +1,12 @@ -import {ImageType, type Node} from 'figma-api'; +import {type Node} from 'figma-api'; const REGION_CODE_REGEXP = /_([a-z]{2})_/; const SIZE_REGEXP = /_([0-9]{2})/; const INTL_REGION_CODES = new Intl.DisplayNames(['en', 'ru'], {type: 'region'}); -export type ExportFormat = 'png' | 'svg'; - export type IconDescription = { componentId: string; name: string; - exportFormat: ExportFormat; }; export const getIconDescriptions = (components: Node<'COMPONENT'>[], availableSizes: number[]): IconDescription[] => { @@ -30,11 +27,7 @@ export const getIconDescriptions = (components: Node<'COMPONENT'>[], availableSi const {height, width} = component.absoluteBoundingBox; return height === width; }) - .map((component) => { - const isPng = component.exportSettings.every(({format}) => format === ImageType.PNG); - const exportFormat = isPng ? 'png' : 'svg'; - return {componentId: component.id, name: component.name, exportFormat}; - }); + .map((component) => ({componentId: component.id, name: component.name})); }; const componentNameHasRegionCode = (componentName: string): boolean => { diff --git a/tools/figma/get-image-files.ts b/tools/figma/get-image-files.ts index f95022d..2e34f6b 100644 --- a/tools/figma/get-image-files.ts +++ b/tools/figma/get-image-files.ts @@ -15,12 +15,11 @@ export type IconDescriptionWithData = IconDescription & { export const downloadAndTransform = async (icons: IconDescriptionWithLink[]): Promise => { const iconsWithData = await getImageFiles(icons); return iconsWithData - .filter((icon) => (icon.exportFormat !== 'svg' ? true : !icon.data.toString().match(ERROR_COLOR_REGEXP))) - .map((icon) => - icon.exportFormat !== 'svg' - ? icon - : {...icon, data: Buffer.from(icon.data.toString().replace(FILL_COLOR_REGEXP, 'fill="currentColor"'))} - ); + .filter((icon) => !icon.data.toString().match(ERROR_COLOR_REGEXP)) + .map((icon) => ({ + ...icon, + data: Buffer.from(icon.data.toString().replace(FILL_COLOR_REGEXP, 'fill="currentColor"')) + })); }; const getImageFiles = async (icons: IconDescriptionWithLink[]): Promise => { @@ -28,7 +27,7 @@ const getImageFiles = async (icons: IconDescriptionWithLink[]): Promise { try { const file = await fetchFile(icon.link); - return {...file, name: icon.name, exportFormat: icon.exportFormat, componentId: icon.componentId}; + return {...file, name: icon.name, componentId: icon.componentId}; } catch (e) { e.message = `${icon.name}: ${e.message}`; throw e; diff --git a/tools/figma/get-image-links.ts b/tools/figma/get-image-links.ts index cd7373a..31d6f64 100644 --- a/tools/figma/get-image-links.ts +++ b/tools/figma/get-image-links.ts @@ -1,7 +1,7 @@ import {Api as FigmaApi} from 'figma-api'; import {GetImageResult} from 'figma-api/lib/api-types'; import {makeChunks} from '../utils/make-chunks'; -import {ExportFormat, IconDescription} from './get-icon-descriptions'; +import {IconDescription} from './get-icon-descriptions'; const IMAGE_SCALE = 1; const ICONS_PER_CHUNK = 100; @@ -10,22 +10,19 @@ export type IconDescriptionWithLink = IconDescription & { componentId: string; link: string; }; -type SeparatedIcons = { - [key in ExportFormat]: IconDescription[]; -}; export const getImageLinks = async ( descriptions: IconDescription[], fileId: string, api: FigmaApi ): Promise => { - const chunks = separateIntoChunks(descriptions); + const chunks = makeChunks(descriptions, ICONS_PER_CHUNK); const linkChunks = await Promise.all( chunks.map((chunk) => api.getImage(fileId, { ids: chunk.map((icon) => icon.componentId).join(','), scale: IMAGE_SCALE, - format: chunk[0].exportFormat + format: 'svg' }) ) ); @@ -54,14 +51,3 @@ export const getImageLinks = async ( return descriptionsWithLink; }, []); }; - -const separateIntoChunks = (descriptions: IconDescription[]): IconDescription[][] => { - const separatedIcons = descriptions.reduce( - (result, icon) => { - result[icon.exportFormat].push(icon); - return result; - }, - {svg: [], png: []} - ); - return [...makeChunks(separatedIcons.svg, ICONS_PER_CHUNK), ...makeChunks(separatedIcons.png, ICONS_PER_CHUNK)]; -}; diff --git a/tools/figma/local.ts b/tools/figma/local.ts index f10e23f..604d836 100644 --- a/tools/figma/local.ts +++ b/tools/figma/local.ts @@ -1,6 +1,5 @@ import fs from 'fs/promises'; import path from 'path'; -import {ExportFormat} from './get-icon-descriptions'; import {IconDescriptionWithData} from './get-image-files'; const BASE_DIR = path.join(__dirname, '../../'); @@ -10,7 +9,6 @@ const ICONS_PATH = path.join(BASE_DIR, 'static/icons'); export type LocalIconDescription = { name: string; data: Buffer; - exportFormat: ExportFormat; }; export const getLocalIcons = async (): Promise => { @@ -31,15 +29,14 @@ export const getLocalIcons = async (): Promise => { }; }) ); - console.info(`${descriptions.length} current icons files fetched`); return descriptions; }; export const updateLocalFiles = async (icons: IconDescriptionWithData[]) => { await Promise.all( icons.map((icon) => { - const filePath = path.join(ICONS_PATH, `${icon.name}.${icon.exportFormat}`); - return fs.writeFile(filePath, icon.data, icon.exportFormat === 'svg' ? 'utf-8' : null); + const filePath = path.join(ICONS_PATH, `${icon.name}.svg`); + return fs.writeFile(filePath, icon.data, 'utf-8'); }) ); }; @@ -47,7 +44,7 @@ export const updateLocalFiles = async (icons: IconDescriptionWithData[]) => { export const deleteLocalFiles = async (iconsToDelete: LocalIconDescription[]) => { await Promise.all( iconsToDelete.map((icon) => { - const filePath = path.join(ICONS_PATH, `${icon.name}.${icon.exportFormat}`); + const filePath = path.join(ICONS_PATH, `${icon.name}.svg`); return fs.rm(filePath); }) ); From f3d5f71a7e86d15869db0a6a0c0553412e7e862f Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 1 Apr 2024 12:38:42 +0300 Subject: [PATCH 09/43] refactor --- tools/figma/fetch-icons.ts | 161 ++++++++++++++++++++++++++- tools/figma/get-components.ts | 23 ---- tools/figma/get-icon-descriptions.ts | 51 --------- tools/figma/get-image-files.ts | 19 +++- tools/figma/get-image-links.ts | 53 --------- 5 files changed, 173 insertions(+), 134 deletions(-) delete mode 100644 tools/figma/get-components.ts delete mode 100644 tools/figma/get-icon-descriptions.ts delete mode 100644 tools/figma/get-image-links.ts diff --git a/tools/figma/fetch-icons.ts b/tools/figma/fetch-icons.ts index f43a67d..aacb60b 100644 --- a/tools/figma/fetch-icons.ts +++ b/tools/figma/fetch-icons.ts @@ -1,12 +1,33 @@ -import {Api as FigmaApi} from 'figma-api'; -import {getComponents} from './get-components'; -import {getIconDescriptions} from './get-icon-descriptions'; -import {IconDescriptionWithLink, getImageLinks} from './get-image-links'; +import {Api as FigmaApi, isNodeType, Node} from 'figma-api'; +import {GetImageResult} from 'figma-api/lib/api-types'; +import {makeChunks} from '../utils/make-chunks'; + +export type IconDescription = { + componentId: string; + name: string; +}; + +export type IconDescriptionWithLink = IconDescription & { + link: string; +}; /** The name of the canvas in the file from which the icons will be loaded */ const CANVAS_NAME = 'glyphs'; +/** Available icon sizes specified in Figma */ const AVAILABLE_SIZES = [14, 24]; +/** RegExp for getting the region code from the component name */ +const REGION_CODE_REGEXP = /_([a-z]{2})_/; +/** RegExp for getting the size from the component name*/ +const SIZE_REGEXP = /_([0-9]{2})/; +const INTL_REGION_CODES = new Intl.DisplayNames(['en', 'ru'], {type: 'region'}); +/** A number between 0.01 and 4, the image scaling factor */ +const IMAGE_SCALE = 1; +const ICONS_PER_CHUNK = 100; +/** + * Gets a description and links to download icons from Figma + * @returns Description of the icons and links to download them, which are located in Figma. + */ export async function fetchFigmaIcons(): Promise { const personalAccessToken: string | undefined = process.env.FIGMA_API_TOKEN; const fileId: string | undefined = process.env.FIGMA_FILE_ID; @@ -19,8 +40,138 @@ export async function fetchFigmaIcons(): Promise { } const api = new FigmaApi({personalAccessToken}); - const components = await getComponents({fileId, canvasName: CANVAS_NAME}, api); + const components = await getComponents(fileId, CANVAS_NAME, api); const iconDescriptions = getIconDescriptions(components, AVAILABLE_SIZES); const imageLinks = await getImageLinks(iconDescriptions, fileId, api); return imageLinks; } + +/** + * Get components that are included in the canvas from Figma + * @param fileId - ID of the document where the canvas is located + * @param canvasName - The name of the canvas from which the components come + * @param api - Object for accessing the Figma API + * @returns Array of component nodes + */ +const getComponents = async (fileId: string, canvasName: string, api: FigmaApi): Promise[]> => { + const file = await api.getFile(fileId); + + const canvas = file.document.children.find((child) => child.name === canvasName) as Node<'CANVAS'>; + if (!canvas) { + throw new Error(`Canvas "${canvasName}" not found!`); + } + + return canvas.children.reduce((components, child) => { + if (!isNodeType(child, 'GROUP')) { + return components; + } + const newComponents = child.children.filter((child) => isNodeType(child, 'INSTANCE')) as Node<'COMPONENT'>[]; + return components.concat(newComponents); + }, [] as Node<'COMPONENT'>[]); +}; + +/** + * Gets a description of icons from the component nodes + * @param components - Array of component nodes + * @param availableSizes - Acceptable icon sizes + * @returns Array of objects with icon descriptions + */ +const getIconDescriptions = (components: Node<'COMPONENT'>[], availableSizes: number[]): IconDescription[] => { + return components + .filter((component) => { + // the component must have export settings + if (component.exportSettings === undefined || component.exportSettings.length === 0) { + return false; + } + // the component should not have a regional code + if (componentNameHasRegionCode(component.name)) { + return false; + } + // the component must be of allowed size and square + if (!componentAvailableSize(component.name, availableSizes)) { + return false; + } + const {height, width} = component.absoluteBoundingBox; + return height === width; + }) + .map((component) => ({componentId: component.id, name: component.name})); +}; + +/** + * Adds download links to the icon descriptions + * @param descriptions - Array of objects with icon descriptions + * @param fileId - ID of the document where the icons are located + * @param api - Object for accessing the Figma API + * @returns Array of objects with descriptions and download links for icons + */ +const getImageLinks = async ( + descriptions: IconDescription[], + fileId: string, + api: FigmaApi +): Promise => { + const chunks = makeChunks(descriptions, ICONS_PER_CHUNK); + const linkChunks = await Promise.all( + chunks.map((chunk) => + api.getImage(fileId, { + ids: chunk.map((icon) => icon.componentId).join(','), + scale: IMAGE_SCALE, + format: 'svg' + }) + ) + ); + const links = linkChunks.reduce( + (memo, chunk) => { + if (chunk.err) { + memo.err = chunk.err; + } + if (chunk.images) { + memo.images = {...memo.images, ...chunk.images}; + } + return memo; + }, + {images: {}} + ); + + if (links.err) { + throw new Error(`Error while loading links: ${links.err}`); + } + + return descriptions.reduce((descriptionsWithLink, description) => { + const link = links.images[description.componentId]; + if (link) { + return descriptionsWithLink.concat({...description, link}); + } + return descriptionsWithLink; + }, []); +}; + +/** + * Checks that the component name has a region code + * @param componentName - Component name + * @returns `true` if the component name contains the region code + */ +const componentNameHasRegionCode = (componentName: string): boolean => { + const regionMatch = REGION_CODE_REGEXP.exec(componentName); + if (regionMatch === null) { + return false; + } + const [, regionCode] = regionMatch; + const uppercaseCode = regionCode.toUpperCase(); + return INTL_REGION_CODES.of(uppercaseCode) !== uppercaseCode; +}; + +/** + * Checks that the allowed size is specified in the component name + * @param componentName - Component name + * @param availableSizes - Array with acceptable icon sizes + * @returns `true` if the component name contains a valid size + */ +const componentAvailableSize = (componentName: string, availableSizes: number[]): boolean => { + const sizeMatch = SIZE_REGEXP.exec(componentName); + if (sizeMatch === null) { + return false; + } + const [, rawSize] = sizeMatch; + const size = rawSize ? Number(rawSize) : undefined; + return availableSizes.includes(size as number); +}; diff --git a/tools/figma/get-components.ts b/tools/figma/get-components.ts deleted file mode 100644 index 63a397d..0000000 --- a/tools/figma/get-components.ts +++ /dev/null @@ -1,23 +0,0 @@ -import {Api as FigmaApi, Node, isNodeType} from 'figma-api'; - -type ComponentOptions = { - fileId: string; - canvasName: string; -}; - -export const getComponents = async (options: ComponentOptions, api: FigmaApi): Promise[]> => { - const file = await api.getFile(options.fileId); - - const canvas = file.document.children.find((child) => child.name === options.canvasName) as Node<'CANVAS'>; - if (!canvas) { - throw new Error(`Canvas "${options.canvasName}" not found!`); - } - - return canvas.children.reduce((components, child) => { - if (!isNodeType(child, 'GROUP')) { - return components; - } - const newComponents = child.children.filter((child) => isNodeType(child, 'INSTANCE')) as Node<'COMPONENT'>[]; - return components.concat(newComponents); - }, [] as Node<'COMPONENT'>[]); -}; diff --git a/tools/figma/get-icon-descriptions.ts b/tools/figma/get-icon-descriptions.ts deleted file mode 100644 index 52ac393..0000000 --- a/tools/figma/get-icon-descriptions.ts +++ /dev/null @@ -1,51 +0,0 @@ -import {type Node} from 'figma-api'; - -const REGION_CODE_REGEXP = /_([a-z]{2})_/; -const SIZE_REGEXP = /_([0-9]{2})/; -const INTL_REGION_CODES = new Intl.DisplayNames(['en', 'ru'], {type: 'region'}); - -export type IconDescription = { - componentId: string; - name: string; -}; - -export const getIconDescriptions = (components: Node<'COMPONENT'>[], availableSizes: number[]): IconDescription[] => { - return components - .filter((component) => { - // the component must have export settings - if (component.exportSettings === undefined || component.exportSettings.length === 0) { - return false; - } - // the component should not have a regional code - if (componentNameHasRegionCode(component.name)) { - return false; - } - // the component must be of allowed size and square - if (!componentAvailableSize(component.name, availableSizes)) { - return false; - } - const {height, width} = component.absoluteBoundingBox; - return height === width; - }) - .map((component) => ({componentId: component.id, name: component.name})); -}; - -const componentNameHasRegionCode = (componentName: string): boolean => { - const regionMatch = REGION_CODE_REGEXP.exec(componentName); - if (regionMatch === null) { - return false; - } - const [, regionCode] = regionMatch; - const uppercaseCode = regionCode.toUpperCase(); - return INTL_REGION_CODES.of(uppercaseCode) !== uppercaseCode; -}; - -const componentAvailableSize = (componentName: string, availableSizes: number[]): boolean => { - const sizeMatch = SIZE_REGEXP.exec(componentName); - if (sizeMatch === null) { - return false; - } - const [, rawSize] = sizeMatch; - const size = rawSize ? Number(rawSize) : undefined; - return availableSizes.includes(size as number); -}; diff --git a/tools/figma/get-image-files.ts b/tools/figma/get-image-files.ts index 2e34f6b..28b1e8a 100644 --- a/tools/figma/get-image-files.ts +++ b/tools/figma/get-image-files.ts @@ -1,7 +1,7 @@ import got from 'got'; -import {IconDescription} from './get-icon-descriptions'; -import {IconDescriptionWithLink} from './get-image-links'; +import {IconDescription, IconDescriptionWithLink} from './fetch-icons'; +/** Maximum number of retries when loading an icon */ const MAX_RETRIES = 20; /** Our designer marks these icons with this color that do not need to be worked on yet. */ const ERROR_COLOR_REGEXP = /fill="#C90D0D"/; @@ -12,6 +12,11 @@ export type IconDescriptionWithData = IconDescription & { data: Buffer; }; +/** + * Downloads icons from Figma using the link from the description and transforms them + * @param icons - Array of objects with icon descriptions + * @returns Array of objects with icon descriptions and transformed downloaded data + */ export const downloadAndTransform = async (icons: IconDescriptionWithLink[]): Promise => { const iconsWithData = await getImageFiles(icons); return iconsWithData @@ -22,6 +27,11 @@ export const downloadAndTransform = async (icons: IconDescriptionWithLink[]): Pr })); }; +/** + * Downloads icons from Figma using the link from the description + * @param icons - Array of objects with icon descriptions + * @returns Array of objects with icon descriptions and downloaded data + */ const getImageFiles = async (icons: IconDescriptionWithLink[]): Promise => { return Promise.all( icons.map(async (icon) => { @@ -36,6 +46,11 @@ const getImageFiles = async (icons: IconDescriptionWithLink[]): Promise { const response = await got(url, {timeout: 60 * 1000, retry: MAX_RETRIES}); if (!response.body) { diff --git a/tools/figma/get-image-links.ts b/tools/figma/get-image-links.ts deleted file mode 100644 index 31d6f64..0000000 --- a/tools/figma/get-image-links.ts +++ /dev/null @@ -1,53 +0,0 @@ -import {Api as FigmaApi} from 'figma-api'; -import {GetImageResult} from 'figma-api/lib/api-types'; -import {makeChunks} from '../utils/make-chunks'; -import {IconDescription} from './get-icon-descriptions'; - -const IMAGE_SCALE = 1; -const ICONS_PER_CHUNK = 100; - -export type IconDescriptionWithLink = IconDescription & { - componentId: string; - link: string; -}; - -export const getImageLinks = async ( - descriptions: IconDescription[], - fileId: string, - api: FigmaApi -): Promise => { - const chunks = makeChunks(descriptions, ICONS_PER_CHUNK); - const linkChunks = await Promise.all( - chunks.map((chunk) => - api.getImage(fileId, { - ids: chunk.map((icon) => icon.componentId).join(','), - scale: IMAGE_SCALE, - format: 'svg' - }) - ) - ); - const links = linkChunks.reduce( - (memo, chunk) => { - if (chunk.err) { - memo.err = chunk.err; - } - if (chunk.images) { - memo.images = {...memo.images, ...chunk.images}; - } - return memo; - }, - {images: {}} - ); - - if (links.err) { - throw new Error(`Error while loading links: ${links.err}`); - } - - return descriptions.reduce((descriptionsWithLink, description) => { - const link = links.images[description.componentId]; - if (link) { - return descriptionsWithLink.concat({...description, link}); - } - return descriptionsWithLink; - }, []); -}; From 67d3ae6add95cfa66166b3a8c8a6dedec635dce0 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 1 Apr 2024 12:55:55 +0300 Subject: [PATCH 10/43] optimize svg and filter fallback icons --- tools/{figma => icons}/fetch-icons.ts | 4 ++++ tools/{figma => icons}/get-image-files.ts | 14 ++++++++++---- tools/{figma => icons}/local.ts | 0 tools/{figma => icons}/update-icons.ts | 0 tools/scripts/sync-icons.ts | 2 +- 5 files changed, 15 insertions(+), 5 deletions(-) rename tools/{figma => icons}/fetch-icons.ts (97%) rename tools/{figma => icons}/get-image-files.ts (82%) rename tools/{figma => icons}/local.ts (100%) rename tools/{figma => icons}/update-icons.ts (100%) diff --git a/tools/figma/fetch-icons.ts b/tools/icons/fetch-icons.ts similarity index 97% rename from tools/figma/fetch-icons.ts rename to tools/icons/fetch-icons.ts index aacb60b..63fae67 100644 --- a/tools/figma/fetch-icons.ts +++ b/tools/icons/fetch-icons.ts @@ -91,6 +91,10 @@ const getIconDescriptions = (components: Node<'COMPONENT'>[], availableSizes: nu if (!componentAvailableSize(component.name, availableSizes)) { return false; } + // without fallback icons + if (component.name.includes('fallback')) { + return false; + } const {height, width} = component.absoluteBoundingBox; return height === width; }) diff --git a/tools/figma/get-image-files.ts b/tools/icons/get-image-files.ts similarity index 82% rename from tools/figma/get-image-files.ts rename to tools/icons/get-image-files.ts index 28b1e8a..1adf8f9 100644 --- a/tools/figma/get-image-files.ts +++ b/tools/icons/get-image-files.ts @@ -1,4 +1,5 @@ import got from 'got'; +import {optimize} from 'svgo'; import {IconDescription, IconDescriptionWithLink} from './fetch-icons'; /** Maximum number of retries when loading an icon */ @@ -21,10 +22,15 @@ export const downloadAndTransform = async (icons: IconDescriptionWithLink[]): Pr const iconsWithData = await getImageFiles(icons); return iconsWithData .filter((icon) => !icon.data.toString().match(ERROR_COLOR_REGEXP)) - .map((icon) => ({ - ...icon, - data: Buffer.from(icon.data.toString().replace(FILL_COLOR_REGEXP, 'fill="currentColor"')) - })); + .map((icon) => { + const iconDataString = icon.data.toString(); + const replacedFillColorIconData = iconDataString.replace(FILL_COLOR_REGEXP, 'fill="currentColor"'); + const optimizedIcon = optimize(replacedFillColorIconData); + return { + ...icon, + data: Buffer.from(optimizedIcon.data) + }; + }); }; /** diff --git a/tools/figma/local.ts b/tools/icons/local.ts similarity index 100% rename from tools/figma/local.ts rename to tools/icons/local.ts diff --git a/tools/figma/update-icons.ts b/tools/icons/update-icons.ts similarity index 100% rename from tools/figma/update-icons.ts rename to tools/icons/update-icons.ts diff --git a/tools/scripts/sync-icons.ts b/tools/scripts/sync-icons.ts index 6a571ad..1dd07da 100644 --- a/tools/scripts/sync-icons.ts +++ b/tools/scripts/sync-icons.ts @@ -1,4 +1,4 @@ -import {updateIcons} from '../figma/update-icons'; +import {updateIcons} from '../icons/update-icons'; async function main() { try { From 8520d5cb69ec5f47a8116ca8234cb9d0438bd5c0 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 1 Apr 2024 14:30:00 +0300 Subject: [PATCH 11/43] generate types for icons --- src/icons/types/rubrics.ts | 126 ++++++++++++++++++++++++++++++++++ tools/icons/fetch-icons.ts | 2 +- tools/icons/generate-types.ts | 24 +++++++ tools/icons/local.ts | 3 +- tools/icons/update-icons.ts | 6 +- tools/scripts/sync-icons.ts | 4 +- 6 files changed, 158 insertions(+), 7 deletions(-) create mode 100644 src/icons/types/rubrics.ts create mode 100644 tools/icons/generate-types.ts diff --git a/src/icons/types/rubrics.ts b/src/icons/types/rubrics.ts new file mode 100644 index 0000000..6cf060e --- /dev/null +++ b/src/icons/types/rubrics.ts @@ -0,0 +1,126 @@ +/** Don't edit manually. Generated by script: ./tools/icons/generate-types.ts */ +type IconName = + | 'post_office' + | 'information' + | 'industrial_enterprise' + | 'science' + | 'police' + | 'police_post' + | 'college' + | 'library' + | 'fire_station' + | 'government' + | 'protestant_church' + | 'orthodox_church' + | 'mosque' + | 'synagogue' + | 'buddhism' + | 'cemetery' + | 'kindergarten' + | 'office' + | 'catholic_church' + | 'drugstores' + | 'hospital' + | 'medicine' + | 'dental' + | 'cinemas' + | 'film_studio' + | 'concert_hall' + | 'attraction' + | 'ticket_office' + | 'driving_school' + | 'racing' + | 'banks' + | 'currency_exchange' + | 'software' + | 'travel_agency' + | 'haulier' + | 'tailor' + | 'hairdressers' + | 'dry_cleaning' + | 'laundry' + | 'printing_services' + | 'bike_rent' + | 'mobile_phones' + | 'photo' + | 'hotels' + | 'gasstation' + | 'tire_fitting' + | 'fitness' + | 'sportcenter' + | 'sport_school' + | 'boat_station' + | 'office_service' + | 'spa' + | 'metro_bus' + | 'metro_light' + | 'railway' + | 'railway_station' + | 'port' + | 'airport' + | 'metro_cable' + | 'metro_funicular' + | 'metro_tram' + | 'metro' + | 'pier' + | 'bus' + | 'tram' + | 'metro_entrance' + | 'metro_monorail' + | 'taxi' + | 'hypermarket' + | 'petshop' + | 'bookstore' + | 'clothes_shop' + | 'furniture_store' + | 'flower_shop' + | 'baby_shop' + | 'auto' + | 'malls' + | 'sport' + | 'supermarket' + | 'skating_rink' + | 'swimming_pool' + | 'waterfall' + | 'spring' + | 'fountain' + | 'theatre' + | 'landmark' + | 'memorable_event' + | 'museum' + | 'beach' + | 'zoo' + | 'garden' + | 'park' + | 'forest' + | 'rezervation' + | 'equestrian' + | 'stadium' + | 'sanatorium' + | 'mountain' + | 'restaurants' + | 'cafe' + | 'fast_food' + | 'sushi' + | 'bars' + | 'confectionary' + | 'wc' + | 'trash' + | 'helicopter' + | 'building' + | 'bench' + | 'aviary' + | 'money_coin' + | 'recycling' + | 'barbeque' + | 'pavilion' + | 'picnic' + | 'monument' + | 'childrens_playground' + | 'pet_playground' + | 'playground' + | 'viewpoint' + | 'bike' + | 'car_park'; + +export {IconName}; diff --git a/tools/icons/fetch-icons.ts b/tools/icons/fetch-icons.ts index 63fae67..deef2a8 100644 --- a/tools/icons/fetch-icons.ts +++ b/tools/icons/fetch-icons.ts @@ -18,7 +18,7 @@ const AVAILABLE_SIZES = [14, 24]; /** RegExp for getting the region code from the component name */ const REGION_CODE_REGEXP = /_([a-z]{2})_/; /** RegExp for getting the size from the component name*/ -const SIZE_REGEXP = /_([0-9]{2})/; +export const SIZE_REGEXP = /_([0-9]{2})/; const INTL_REGION_CODES = new Intl.DisplayNames(['en', 'ru'], {type: 'region'}); /** A number between 0.01 and 4, the image scaling factor */ const IMAGE_SCALE = 1; diff --git a/tools/icons/generate-types.ts b/tools/icons/generate-types.ts new file mode 100644 index 0000000..e1d36d0 --- /dev/null +++ b/tools/icons/generate-types.ts @@ -0,0 +1,24 @@ +import fs from 'fs/promises'; +import {uniq} from 'lodash'; +import path from 'path'; +import prettier from 'prettier'; +import {IconDescription, SIZE_REGEXP} from './fetch-icons'; +import {BASE_DIR} from './local'; + +const TYPES_PATH = path.join(BASE_DIR, 'src/icons/types'); + +export const generateIconsTypes = async (icons: IconDescription[]) => { + const type = 'IconName'; + const iconNames = uniq(icons.map(({name}) => name.replace(SIZE_REGEXP, ''))); + const content = ` +/** Don't edit manually. Generated by script: ./tools/icons/generate-types.ts */ +type ${type} =${iconNames.map((name) => `| '${name}'`).join('\n')}; + +export {${type}}; +`; + + const prettierConfig = await prettier.resolveConfig(process.cwd()); + const formattedContent = await prettier.format(content, {...prettierConfig, parser: 'typescript'}); + + await fs.writeFile(path.join(TYPES_PATH, 'rubrics.ts'), formattedContent); +}; diff --git a/tools/icons/local.ts b/tools/icons/local.ts index 604d836..446cb0b 100644 --- a/tools/icons/local.ts +++ b/tools/icons/local.ts @@ -2,9 +2,8 @@ import fs from 'fs/promises'; import path from 'path'; import {IconDescriptionWithData} from './get-image-files'; -const BASE_DIR = path.join(__dirname, '../../'); +export const BASE_DIR = path.join(__dirname, '../../'); const ICONS_PATH = path.join(BASE_DIR, 'static/icons'); -// const TYPES_PATH = path.join(BASE_DIR, 'src/icons/types'); export type LocalIconDescription = { name: string; diff --git a/tools/icons/update-icons.ts b/tools/icons/update-icons.ts index 5612420..5bd5087 100644 --- a/tools/icons/update-icons.ts +++ b/tools/icons/update-icons.ts @@ -1,9 +1,9 @@ import {differenceBy, intersectionBy} from 'lodash'; -import {fetchFigmaIcons} from './fetch-icons'; +import {IconDescription, fetchFigmaIcons} from './fetch-icons'; import {deleteLocalFiles, getLocalIcons, updateLocalFiles} from './local'; import {downloadAndTransform} from './get-image-files'; -export const updateIcons = async () => { +export const updateIcons = async (): Promise => { const [localIcons, figmaIcons] = await Promise.all([getLocalIcons(), fetchFigmaIcons()]); const iconsWithData = await downloadAndTransform(figmaIcons); @@ -13,5 +13,5 @@ export const updateIcons = async () => { const iconsToDelete = differenceBy(localIcons, existingLocalIcons, (d) => d.name); await deleteLocalFiles(iconsToDelete); - return iconsWithData; + return iconsWithData.map(({componentId, name}) => ({componentId, name})); }; diff --git a/tools/scripts/sync-icons.ts b/tools/scripts/sync-icons.ts index 1dd07da..5f3e51c 100644 --- a/tools/scripts/sync-icons.ts +++ b/tools/scripts/sync-icons.ts @@ -1,8 +1,10 @@ +import {generateIconsTypes} from '../icons/generate-types'; import {updateIcons} from '../icons/update-icons'; async function main() { try { - await updateIcons(); + const icons = await updateIcons(); + await generateIconsTypes(icons); } catch (error) { console.error(error.message || error.toString()); } From 35f27a156fb0453f4c04b7c5475b2711d4fbc722 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 1 Apr 2024 16:00:26 +0300 Subject: [PATCH 12/43] generate icons list in md file --- docs/icons.md | 128 ++++++++++++++ src/icons/types/{rubrics.ts => icons.ts} | 208 +++++++++++------------ tools/icons/generate-docs.ts | 36 ++++ tools/icons/generate-types.ts | 14 +- tools/icons/get-uniq-names.ts | 6 + tools/icons/local.ts | 2 +- tools/scripts/sync-icons.ts | 8 +- tools/utils/prettier-format.ts | 6 + 8 files changed, 291 insertions(+), 117 deletions(-) create mode 100644 docs/icons.md rename src/icons/types/{rubrics.ts => icons.ts} (98%) create mode 100644 tools/icons/generate-docs.ts create mode 100644 tools/icons/get-uniq-names.ts create mode 100644 tools/utils/prettier-format.ts diff --git a/docs/icons.md b/docs/icons.md new file mode 100644 index 0000000..aa37f84 --- /dev/null +++ b/docs/icons.md @@ -0,0 +1,128 @@ + + +# List of supported icons + +| Name | Normal Size | Small Size | +| --------------------- | ------------------------------------------------------------------------- | ------------------------------------------------------------------------- | +| airport | ![airport](../../static/icons/airport_24.svg) | ![airport](../../static/icons/airport_14.svg) | +| attraction | ![attraction](../../static/icons/attraction_24.svg) | ![attraction](../../static/icons/attraction_14.svg) | +| auto | ![auto](../../static/icons/auto_24.svg) | ![auto](../../static/icons/auto_14.svg) | +| aviary | ![aviary](../../static/icons/aviary_24.svg) | none | +| baby_shop | ![baby_shop](../../static/icons/baby_shop_24.svg) | ![baby_shop](../../static/icons/baby_shop_14.svg) | +| banks | ![banks](../../static/icons/banks_24.svg) | ![banks](../../static/icons/banks_14.svg) | +| barbeque | ![barbeque](../../static/icons/barbeque_24.svg) | none | +| bars | ![bars](../../static/icons/bars_24.svg) | ![bars](../../static/icons/bars_14.svg) | +| beach | ![beach](../../static/icons/beach_24.svg) | ![beach](../../static/icons/beach_14.svg) | +| bench | ![bench](../../static/icons/bench_24.svg) | none | +| bike | ![bike](../../static/icons/bike_24.svg) | none | +| bike_rent | ![bike_rent](../../static/icons/bike_rent_24.svg) | ![bike_rent](../../static/icons/bike_rent_14.svg) | +| boat_station | ![boat_station](../../static/icons/boat_station_24.svg) | ![boat_station](../../static/icons/boat_station_14.svg) | +| bookstore | ![bookstore](../../static/icons/bookstore_24.svg) | ![bookstore](../../static/icons/bookstore_14.svg) | +| buddhism | ![buddhism](../../static/icons/buddhism_24.svg) | ![buddhism](../../static/icons/buddhism_14.svg) | +| building | ![building](../../static/icons/building_24.svg) | none | +| bus | ![bus](../../static/icons/bus_24.svg) | none | +| cafe | ![cafe](../../static/icons/cafe_24.svg) | ![cafe](../../static/icons/cafe_14.svg) | +| car_park | ![car_park](../../static/icons/car_park_24.svg) | none | +| catholic_church | ![catholic_church](../../static/icons/catholic_church_24.svg) | ![catholic_church](../../static/icons/catholic_church_14.svg) | +| cemetery | ![cemetery](../../static/icons/cemetery_24.svg) | ![cemetery](../../static/icons/cemetery_14.svg) | +| childrens_playground | ![childrens_playground](../../static/icons/childrens_playground_24.svg) | none | +| cinemas | ![cinemas](../../static/icons/cinemas_24.svg) | ![cinemas](../../static/icons/cinemas_14.svg) | +| clothes_shop | ![clothes_shop](../../static/icons/clothes_shop_24.svg) | ![clothes_shop](../../static/icons/clothes_shop_14.svg) | +| college | ![college](../../static/icons/college_24.svg) | ![college](../../static/icons/college_14.svg) | +| concert_hall | ![concert_hall](../../static/icons/concert_hall_24.svg) | ![concert_hall](../../static/icons/concert_hall_14.svg) | +| confectionary | ![confectionary](../../static/icons/confectionary_24.svg) | ![confectionary](../../static/icons/confectionary_14.svg) | +| currency_exchange | ![currency_exchange](../../static/icons/currency_exchange_24.svg) | ![currency_exchange](../../static/icons/currency_exchange_14.svg) | +| dental | ![dental](../../static/icons/dental_24.svg) | ![dental](../../static/icons/dental_14.svg) | +| driving_school | ![driving_school](../../static/icons/driving_school_24.svg) | ![driving_school](../../static/icons/driving_school_14.svg) | +| drugstores | ![drugstores](../../static/icons/drugstores_24.svg) | ![drugstores](../../static/icons/drugstores_14.svg) | +| dry_cleaning | ![dry_cleaning](../../static/icons/dry_cleaning_24.svg) | ![dry_cleaning](../../static/icons/dry_cleaning_14.svg) | +| equestrian | ![equestrian](../../static/icons/equestrian_24.svg) | ![equestrian](../../static/icons/equestrian_14.svg) | +| fast_food | ![fast_food](../../static/icons/fast_food_24.svg) | ![fast_food](../../static/icons/fast_food_14.svg) | +| film_studio | ![film_studio](../../static/icons/film_studio_24.svg) | ![film_studio](../../static/icons/film_studio_14.svg) | +| fire_station | ![fire_station](../../static/icons/fire_station_24.svg) | ![fire_station](../../static/icons/fire_station_14.svg) | +| fitness | ![fitness](../../static/icons/fitness_24.svg) | ![fitness](../../static/icons/fitness_14.svg) | +| flower_shop | ![flower_shop](../../static/icons/flower_shop_24.svg) | ![flower_shop](../../static/icons/flower_shop_14.svg) | +| forest | ![forest](../../static/icons/forest_24.svg) | ![forest](../../static/icons/forest_14.svg) | +| fountain | ![fountain](../../static/icons/fountain_24.svg) | none | +| furniture_store | ![furniture_store](../../static/icons/furniture_store_24.svg) | ![furniture_store](../../static/icons/furniture_store_14.svg) | +| garden | ![garden](../../static/icons/garden_24.svg) | ![garden](../../static/icons/garden_14.svg) | +| gasstation | ![gasstation](../../static/icons/gasstation_24.svg) | ![gasstation](../../static/icons/gasstation_14.svg) | +| government | ![government](../../static/icons/government_24.svg) | ![government](../../static/icons/government_14.svg) | +| hairdressers | ![hairdressers](../../static/icons/hairdressers_24.svg) | ![hairdressers](../../static/icons/hairdressers_14.svg) | +| haulier | ![haulier](../../static/icons/haulier_24.svg) | ![haulier](../../static/icons/haulier_14.svg) | +| helicopter | ![helicopter](../../static/icons/helicopter_24.svg) | none | +| hospital | ![hospital](../../static/icons/hospital_24.svg) | ![hospital](../../static/icons/hospital_14.svg) | +| hotels | ![hotels](../../static/icons/hotels_24.svg) | ![hotels](../../static/icons/hotels_14.svg) | +| hypermarket | ![hypermarket](../../static/icons/hypermarket_24.svg) | ![hypermarket](../../static/icons/hypermarket_14.svg) | +| industrial_enterprise | ![industrial_enterprise](../../static/icons/industrial_enterprise_24.svg) | ![industrial_enterprise](../../static/icons/industrial_enterprise_14.svg) | +| information | ![information](../../static/icons/information_24.svg) | ![information](../../static/icons/information_14.svg) | +| kindergarten | ![kindergarten](../../static/icons/kindergarten_24.svg) | ![kindergarten](../../static/icons/kindergarten_14.svg) | +| landmark | ![landmark](../../static/icons/landmark_24.svg) | ![landmark](../../static/icons/landmark_14.svg) | +| laundry | ![laundry](../../static/icons/laundry_24.svg) | ![laundry](../../static/icons/laundry_14.svg) | +| library | ![library](../../static/icons/library_24.svg) | ![library](../../static/icons/library_14.svg) | +| malls | ![malls](../../static/icons/malls_24.svg) | ![malls](../../static/icons/malls_14.svg) | +| medicine | ![medicine](../../static/icons/medicine_24.svg) | ![medicine](../../static/icons/medicine_14.svg) | +| memorable_event | ![memorable_event](../../static/icons/memorable_event_24.svg) | ![memorable_event](../../static/icons/memorable_event_14.svg) | +| metro | ![metro](../../static/icons/metro_24.svg) | ![metro](../../static/icons/metro_14.svg) | +| metro_bus | ![metro_bus](../../static/icons/metro_bus_24.svg) | ![metro_bus](../../static/icons/metro_bus_14.svg) | +| metro_cable | ![metro_cable](../../static/icons/metro_cable_24.svg) | ![metro_cable](../../static/icons/metro_cable_14.svg) | +| metro_entrance | ![metro_entrance](../../static/icons/metro_entrance_24.svg) | none | +| metro_funicular | ![metro_funicular](../../static/icons/metro_funicular_24.svg) | ![metro_funicular](../../static/icons/metro_funicular_14.svg) | +| metro_light | ![metro_light](../../static/icons/metro_light_24.svg) | ![metro_light](../../static/icons/metro_light_14.svg) | +| metro_monorail | ![metro_monorail](../../static/icons/metro_monorail_24.svg) | ![metro_monorail](../../static/icons/metro_monorail_14.svg) | +| metro_tram | ![metro_tram](../../static/icons/metro_tram_24.svg) | ![metro_tram](../../static/icons/metro_tram_14.svg) | +| mobile_phones | ![mobile_phones](../../static/icons/mobile_phones_24.svg) | ![mobile_phones](../../static/icons/mobile_phones_14.svg) | +| money_coin | ![money_coin](../../static/icons/money_coin_24.svg) | none | +| monument | ![monument](../../static/icons/monument_24.svg) | none | +| mosque | ![mosque](../../static/icons/mosque_24.svg) | ![mosque](../../static/icons/mosque_14.svg) | +| mountain | ![mountain](../../static/icons/mountain_24.svg) | none | +| museum | ![museum](../../static/icons/museum_24.svg) | ![museum](../../static/icons/museum_14.svg) | +| office | ![office](../../static/icons/office_24.svg) | ![office](../../static/icons/office_14.svg) | +| office_service | ![office_service](../../static/icons/office_service_24.svg) | ![office_service](../../static/icons/office_service_14.svg) | +| orthodox_church | ![orthodox_church](../../static/icons/orthodox_church_24.svg) | ![orthodox_church](../../static/icons/orthodox_church_14.svg) | +| park | ![park](../../static/icons/park_24.svg) | ![park](../../static/icons/park_14.svg) | +| pavilion | ![pavilion](../../static/icons/pavilion_24.svg) | none | +| pet_playground | ![pet_playground](../../static/icons/pet_playground_24.svg) | none | +| petshop | ![petshop](../../static/icons/petshop_24.svg) | ![petshop](../../static/icons/petshop_14.svg) | +| photo | ![photo](../../static/icons/photo_24.svg) | ![photo](../../static/icons/photo_14.svg) | +| picnic | ![picnic](../../static/icons/picnic_24.svg) | none | +| pier | ![pier](../../static/icons/pier_24.svg) | none | +| playground | ![playground](../../static/icons/playground_24.svg) | none | +| police | ![police](../../static/icons/police_24.svg) | ![police](../../static/icons/police_14.svg) | +| police_post | ![police_post](../../static/icons/police_post_24.svg) | ![police_post](../../static/icons/police_post_14.svg) | +| port | ![port](../../static/icons/port_24.svg) | ![port](../../static/icons/port_14.svg) | +| post_office | ![post_office](../../static/icons/post_office_24.svg) | ![post_office](../../static/icons/post_office_14.svg) | +| printing_services | ![printing_services](../../static/icons/printing_services_24.svg) | ![printing_services](../../static/icons/printing_services_14.svg) | +| protestant_church | ![protestant_church](../../static/icons/protestant_church_24.svg) | ![protestant_church](../../static/icons/protestant_church_14.svg) | +| racing | ![racing](../../static/icons/racing_24.svg) | ![racing](../../static/icons/racing_14.svg) | +| railway | ![railway](../../static/icons/railway_24.svg) | ![railway](../../static/icons/railway_14.svg) | +| railway_station | ![railway_station](../../static/icons/railway_station_24.svg) | ![railway_station](../../static/icons/railway_station_14.svg) | +| recycling | ![recycling](../../static/icons/recycling_24.svg) | none | +| restaurants | ![restaurants](../../static/icons/restaurants_24.svg) | ![restaurants](../../static/icons/restaurants_14.svg) | +| rezervation | ![rezervation](../../static/icons/rezervation_24.svg) | ![rezervation](../../static/icons/rezervation_14.svg) | +| sanatorium | ![sanatorium](../../static/icons/sanatorium_24.svg) | ![sanatorium](../../static/icons/sanatorium_14.svg) | +| science | ![science](../../static/icons/science_24.svg) | ![science](../../static/icons/science_14.svg) | +| skating_rink | ![skating_rink](../../static/icons/skating_rink_24.svg) | ![skating_rink](../../static/icons/skating_rink_14.svg) | +| software | ![software](../../static/icons/software_24.svg) | ![software](../../static/icons/software_14.svg) | +| spa | ![spa](../../static/icons/spa_24.svg) | ![spa](../../static/icons/spa_14.svg) | +| sport | ![sport](../../static/icons/sport_24.svg) | none | +| sport_school | ![sport_school](../../static/icons/sport_school_24.svg) | none | +| sportcenter | ![sportcenter](../../static/icons/sportcenter_24.svg) | ![sportcenter](../../static/icons/sportcenter_14.svg) | +| spring | ![spring](../../static/icons/spring_24.svg) | none | +| stadium | ![stadium](../../static/icons/stadium_24.svg) | ![stadium](../../static/icons/stadium_14.svg) | +| supermarket | ![supermarket](../../static/icons/supermarket_24.svg) | ![supermarket](../../static/icons/supermarket_14.svg) | +| sushi | ![sushi](../../static/icons/sushi_24.svg) | ![sushi](../../static/icons/sushi_14.svg) | +| swimming_pool | ![swimming_pool](../../static/icons/swimming_pool_24.svg) | ![swimming_pool](../../static/icons/swimming_pool_14.svg) | +| synagogue | ![synagogue](../../static/icons/synagogue_24.svg) | ![synagogue](../../static/icons/synagogue_14.svg) | +| tailor | ![tailor](../../static/icons/tailor_24.svg) | ![tailor](../../static/icons/tailor_14.svg) | +| taxi | ![taxi](../../static/icons/taxi_24.svg) | ![taxi](../../static/icons/taxi_14.svg) | +| theatre | ![theatre](../../static/icons/theatre_24.svg) | ![theatre](../../static/icons/theatre_14.svg) | +| ticket_office | ![ticket_office](../../static/icons/ticket_office_24.svg) | ![ticket_office](../../static/icons/ticket_office_14.svg) | +| tire_fitting | ![tire_fitting](../../static/icons/tire_fitting_24.svg) | ![tire_fitting](../../static/icons/tire_fitting_14.svg) | +| tram | ![tram](../../static/icons/tram_24.svg) | none | +| trash | ![trash](../../static/icons/trash_24.svg) | none | +| travel_agency | ![travel_agency](../../static/icons/travel_agency_24.svg) | ![travel_agency](../../static/icons/travel_agency_14.svg) | +| viewpoint | ![viewpoint](../../static/icons/viewpoint_24.svg) | none | +| waterfall | ![waterfall](../../static/icons/waterfall_24.svg) | none | +| wc | ![wc](../../static/icons/wc_24.svg) | none | +| zoo | ![zoo](../../static/icons/zoo_24.svg) | ![zoo](../../static/icons/zoo_14.svg) | diff --git a/src/icons/types/rubrics.ts b/src/icons/types/icons.ts similarity index 98% rename from src/icons/types/rubrics.ts rename to src/icons/types/icons.ts index 6cf060e..bb83046 100644 --- a/src/icons/types/rubrics.ts +++ b/src/icons/types/icons.ts @@ -1,126 +1,126 @@ /** Don't edit manually. Generated by script: ./tools/icons/generate-types.ts */ type IconName = - | 'post_office' - | 'information' - | 'industrial_enterprise' - | 'science' - | 'police' - | 'police_post' - | 'college' - | 'library' - | 'fire_station' - | 'government' - | 'protestant_church' - | 'orthodox_church' - | 'mosque' - | 'synagogue' + | 'airport' + | 'attraction' + | 'auto' + | 'aviary' + | 'baby_shop' + | 'banks' + | 'barbeque' + | 'bars' + | 'beach' + | 'bench' + | 'bike' + | 'bike_rent' + | 'boat_station' + | 'bookstore' | 'buddhism' - | 'cemetery' - | 'kindergarten' - | 'office' + | 'building' + | 'bus' + | 'cafe' + | 'car_park' | 'catholic_church' - | 'drugstores' - | 'hospital' - | 'medicine' - | 'dental' + | 'cemetery' + | 'childrens_playground' | 'cinemas' - | 'film_studio' + | 'clothes_shop' + | 'college' | 'concert_hall' - | 'attraction' - | 'ticket_office' - | 'driving_school' - | 'racing' - | 'banks' + | 'confectionary' | 'currency_exchange' - | 'software' - | 'travel_agency' - | 'haulier' - | 'tailor' - | 'hairdressers' + | 'dental' + | 'driving_school' + | 'drugstores' | 'dry_cleaning' - | 'laundry' - | 'printing_services' - | 'bike_rent' - | 'mobile_phones' - | 'photo' - | 'hotels' - | 'gasstation' - | 'tire_fitting' + | 'equestrian' + | 'fast_food' + | 'film_studio' + | 'fire_station' | 'fitness' - | 'sportcenter' - | 'sport_school' - | 'boat_station' - | 'office_service' - | 'spa' - | 'metro_bus' - | 'metro_light' - | 'railway' - | 'railway_station' - | 'port' - | 'airport' - | 'metro_cable' - | 'metro_funicular' - | 'metro_tram' - | 'metro' - | 'pier' - | 'bus' - | 'tram' - | 'metro_entrance' - | 'metro_monorail' - | 'taxi' - | 'hypermarket' - | 'petshop' - | 'bookstore' - | 'clothes_shop' - | 'furniture_store' | 'flower_shop' - | 'baby_shop' - | 'auto' - | 'malls' - | 'sport' - | 'supermarket' - | 'skating_rink' - | 'swimming_pool' - | 'waterfall' - | 'spring' + | 'forest' | 'fountain' - | 'theatre' + | 'furniture_store' + | 'garden' + | 'gasstation' + | 'government' + | 'hairdressers' + | 'haulier' + | 'helicopter' + | 'hospital' + | 'hotels' + | 'hypermarket' + | 'industrial_enterprise' + | 'information' + | 'kindergarten' | 'landmark' + | 'laundry' + | 'library' + | 'malls' + | 'medicine' | 'memorable_event' + | 'metro' + | 'metro_bus' + | 'metro_cable' + | 'metro_entrance' + | 'metro_funicular' + | 'metro_light' + | 'metro_monorail' + | 'metro_tram' + | 'mobile_phones' + | 'money_coin' + | 'monument' + | 'mosque' + | 'mountain' | 'museum' - | 'beach' - | 'zoo' - | 'garden' + | 'office' + | 'office_service' + | 'orthodox_church' | 'park' - | 'forest' + | 'pavilion' + | 'pet_playground' + | 'petshop' + | 'photo' + | 'picnic' + | 'pier' + | 'playground' + | 'police' + | 'police_post' + | 'port' + | 'post_office' + | 'printing_services' + | 'protestant_church' + | 'racing' + | 'railway' + | 'railway_station' + | 'recycling' + | 'restaurants' | 'rezervation' - | 'equestrian' - | 'stadium' | 'sanatorium' - | 'mountain' - | 'restaurants' - | 'cafe' - | 'fast_food' + | 'science' + | 'skating_rink' + | 'software' + | 'spa' + | 'sport' + | 'sport_school' + | 'sportcenter' + | 'spring' + | 'stadium' + | 'supermarket' | 'sushi' - | 'bars' - | 'confectionary' - | 'wc' + | 'swimming_pool' + | 'synagogue' + | 'tailor' + | 'taxi' + | 'theatre' + | 'ticket_office' + | 'tire_fitting' + | 'tram' | 'trash' - | 'helicopter' - | 'building' - | 'bench' - | 'aviary' - | 'money_coin' - | 'recycling' - | 'barbeque' - | 'pavilion' - | 'picnic' - | 'monument' - | 'childrens_playground' - | 'pet_playground' - | 'playground' + | 'travel_agency' | 'viewpoint' - | 'bike' - | 'car_park'; + | 'waterfall' + | 'wc' + | 'zoo'; export {IconName}; diff --git a/tools/icons/generate-docs.ts b/tools/icons/generate-docs.ts new file mode 100644 index 0000000..be6c26d --- /dev/null +++ b/tools/icons/generate-docs.ts @@ -0,0 +1,36 @@ +import {existsSync} from 'fs'; +import fs from 'fs/promises'; +import path from 'path'; +import {prettierFormat} from '../utils/prettier-format'; +import {BASE_DIR, ICONS_PATH} from './local'; + +const DOCS_FILE_PATH = path.join(BASE_DIR, 'docs/icons.md'); +const WARNING = ``; +const TITLE = '# List of supported icons'; +const TABLE_HEADER = ` +| Name | Normal Size | Small Size | +| --- | --- | --- | +`; + +export const generateIconsDocsList = async (iconNames: string[]) => { + let content = `${WARNING}\n\n${TITLE}\n\n${TABLE_HEADER}`; + content += iconNames + .map((name) => { + const normalFileName = `${name}_24.svg`; + const smallFileName = `${name}_14.svg`; + + const normalAbsolutePath = path.join(ICONS_PATH, normalFileName); + const smallAbsolutePath = path.join(ICONS_PATH, smallFileName); + + const normalRelativePath = `../../static/icons/${normalFileName}`; + const smallRelativePath = `../../static/icons/${smallFileName}`; + + const normalIcon = existsSync(normalAbsolutePath) ? `![${name}](${normalRelativePath})` : `none`; + const smallIcon = existsSync(smallAbsolutePath) ? `![${name}](${smallRelativePath})` : `none`; + + return `| ${name} | ${normalIcon} | ${smallIcon} |`; + }) + .join('\n'); + const formattedContent = await prettierFormat(content, 'markdown'); + await fs.writeFile(DOCS_FILE_PATH, formattedContent); +}; diff --git a/tools/icons/generate-types.ts b/tools/icons/generate-types.ts index e1d36d0..aad1ca1 100644 --- a/tools/icons/generate-types.ts +++ b/tools/icons/generate-types.ts @@ -1,24 +1,18 @@ import fs from 'fs/promises'; -import {uniq} from 'lodash'; import path from 'path'; -import prettier from 'prettier'; -import {IconDescription, SIZE_REGEXP} from './fetch-icons'; +import {prettierFormat} from '../utils/prettier-format'; import {BASE_DIR} from './local'; const TYPES_PATH = path.join(BASE_DIR, 'src/icons/types'); -export const generateIconsTypes = async (icons: IconDescription[]) => { +export const generateIconsTypes = async (iconNames: string[]) => { const type = 'IconName'; - const iconNames = uniq(icons.map(({name}) => name.replace(SIZE_REGEXP, ''))); const content = ` /** Don't edit manually. Generated by script: ./tools/icons/generate-types.ts */ type ${type} =${iconNames.map((name) => `| '${name}'`).join('\n')}; export {${type}}; `; - - const prettierConfig = await prettier.resolveConfig(process.cwd()); - const formattedContent = await prettier.format(content, {...prettierConfig, parser: 'typescript'}); - - await fs.writeFile(path.join(TYPES_PATH, 'rubrics.ts'), formattedContent); + const formattedContent = await prettierFormat(content, 'typescript'); + await fs.writeFile(path.join(TYPES_PATH, 'icons.ts'), formattedContent); }; diff --git a/tools/icons/get-uniq-names.ts b/tools/icons/get-uniq-names.ts new file mode 100644 index 0000000..6f0adf4 --- /dev/null +++ b/tools/icons/get-uniq-names.ts @@ -0,0 +1,6 @@ +import {uniq} from 'lodash'; +import {IconDescription, SIZE_REGEXP} from './fetch-icons'; + +export const getUniqNames = (icons: IconDescription[]) => { + return uniq(icons.map(({name}) => name.replace(SIZE_REGEXP, ''))).sort(); +}; diff --git a/tools/icons/local.ts b/tools/icons/local.ts index 446cb0b..caa71fb 100644 --- a/tools/icons/local.ts +++ b/tools/icons/local.ts @@ -3,7 +3,7 @@ import path from 'path'; import {IconDescriptionWithData} from './get-image-files'; export const BASE_DIR = path.join(__dirname, '../../'); -const ICONS_PATH = path.join(BASE_DIR, 'static/icons'); +export const ICONS_PATH = path.join(BASE_DIR, 'static/icons'); export type LocalIconDescription = { name: string; diff --git a/tools/scripts/sync-icons.ts b/tools/scripts/sync-icons.ts index 5f3e51c..4368b7a 100644 --- a/tools/scripts/sync-icons.ts +++ b/tools/scripts/sync-icons.ts @@ -1,10 +1,14 @@ +import {generateIconsDocsList} from '../icons/generate-docs'; import {generateIconsTypes} from '../icons/generate-types'; +import {getUniqNames} from '../icons/get-uniq-names'; import {updateIcons} from '../icons/update-icons'; async function main() { try { - const icons = await updateIcons(); - await generateIconsTypes(icons); + const iconsDescription = await updateIcons(); + const iconNames = getUniqNames(iconsDescription); + await generateIconsTypes(iconNames); + await generateIconsDocsList(iconNames); } catch (error) { console.error(error.message || error.toString()); } diff --git a/tools/utils/prettier-format.ts b/tools/utils/prettier-format.ts new file mode 100644 index 0000000..8afc85a --- /dev/null +++ b/tools/utils/prettier-format.ts @@ -0,0 +1,6 @@ +import prettier from 'prettier'; + +export const prettierFormat = async (rawContent: string, parser: prettier.Options['parser']): Promise => { + const prettierConfig = await prettier.resolveConfig(process.cwd()); + return prettier.format(rawContent, {...prettierConfig, parser}); +}; From 9b2bc955696390d14fdf8ea7501869f3b87324b5 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 1 Apr 2024 16:30:54 +0300 Subject: [PATCH 13/43] filter fill-opacity icons --- docs/icons.md | 246 ++++++++++++++++----------------- src/icons/types/icons.ts | 2 - tools/icons/generate-docs.ts | 4 +- tools/icons/get-image-files.ts | 24 ++-- 4 files changed, 136 insertions(+), 140 deletions(-) diff --git a/docs/icons.md b/docs/icons.md index aa37f84..28f5b74 100644 --- a/docs/icons.md +++ b/docs/icons.md @@ -2,127 +2,125 @@ # List of supported icons -| Name | Normal Size | Small Size | -| --------------------- | ------------------------------------------------------------------------- | ------------------------------------------------------------------------- | -| airport | ![airport](../../static/icons/airport_24.svg) | ![airport](../../static/icons/airport_14.svg) | -| attraction | ![attraction](../../static/icons/attraction_24.svg) | ![attraction](../../static/icons/attraction_14.svg) | -| auto | ![auto](../../static/icons/auto_24.svg) | ![auto](../../static/icons/auto_14.svg) | -| aviary | ![aviary](../../static/icons/aviary_24.svg) | none | -| baby_shop | ![baby_shop](../../static/icons/baby_shop_24.svg) | ![baby_shop](../../static/icons/baby_shop_14.svg) | -| banks | ![banks](../../static/icons/banks_24.svg) | ![banks](../../static/icons/banks_14.svg) | -| barbeque | ![barbeque](../../static/icons/barbeque_24.svg) | none | -| bars | ![bars](../../static/icons/bars_24.svg) | ![bars](../../static/icons/bars_14.svg) | -| beach | ![beach](../../static/icons/beach_24.svg) | ![beach](../../static/icons/beach_14.svg) | -| bench | ![bench](../../static/icons/bench_24.svg) | none | -| bike | ![bike](../../static/icons/bike_24.svg) | none | -| bike_rent | ![bike_rent](../../static/icons/bike_rent_24.svg) | ![bike_rent](../../static/icons/bike_rent_14.svg) | -| boat_station | ![boat_station](../../static/icons/boat_station_24.svg) | ![boat_station](../../static/icons/boat_station_14.svg) | -| bookstore | ![bookstore](../../static/icons/bookstore_24.svg) | ![bookstore](../../static/icons/bookstore_14.svg) | -| buddhism | ![buddhism](../../static/icons/buddhism_24.svg) | ![buddhism](../../static/icons/buddhism_14.svg) | -| building | ![building](../../static/icons/building_24.svg) | none | -| bus | ![bus](../../static/icons/bus_24.svg) | none | -| cafe | ![cafe](../../static/icons/cafe_24.svg) | ![cafe](../../static/icons/cafe_14.svg) | -| car_park | ![car_park](../../static/icons/car_park_24.svg) | none | -| catholic_church | ![catholic_church](../../static/icons/catholic_church_24.svg) | ![catholic_church](../../static/icons/catholic_church_14.svg) | -| cemetery | ![cemetery](../../static/icons/cemetery_24.svg) | ![cemetery](../../static/icons/cemetery_14.svg) | -| childrens_playground | ![childrens_playground](../../static/icons/childrens_playground_24.svg) | none | -| cinemas | ![cinemas](../../static/icons/cinemas_24.svg) | ![cinemas](../../static/icons/cinemas_14.svg) | -| clothes_shop | ![clothes_shop](../../static/icons/clothes_shop_24.svg) | ![clothes_shop](../../static/icons/clothes_shop_14.svg) | -| college | ![college](../../static/icons/college_24.svg) | ![college](../../static/icons/college_14.svg) | -| concert_hall | ![concert_hall](../../static/icons/concert_hall_24.svg) | ![concert_hall](../../static/icons/concert_hall_14.svg) | -| confectionary | ![confectionary](../../static/icons/confectionary_24.svg) | ![confectionary](../../static/icons/confectionary_14.svg) | -| currency_exchange | ![currency_exchange](../../static/icons/currency_exchange_24.svg) | ![currency_exchange](../../static/icons/currency_exchange_14.svg) | -| dental | ![dental](../../static/icons/dental_24.svg) | ![dental](../../static/icons/dental_14.svg) | -| driving_school | ![driving_school](../../static/icons/driving_school_24.svg) | ![driving_school](../../static/icons/driving_school_14.svg) | -| drugstores | ![drugstores](../../static/icons/drugstores_24.svg) | ![drugstores](../../static/icons/drugstores_14.svg) | -| dry_cleaning | ![dry_cleaning](../../static/icons/dry_cleaning_24.svg) | ![dry_cleaning](../../static/icons/dry_cleaning_14.svg) | -| equestrian | ![equestrian](../../static/icons/equestrian_24.svg) | ![equestrian](../../static/icons/equestrian_14.svg) | -| fast_food | ![fast_food](../../static/icons/fast_food_24.svg) | ![fast_food](../../static/icons/fast_food_14.svg) | -| film_studio | ![film_studio](../../static/icons/film_studio_24.svg) | ![film_studio](../../static/icons/film_studio_14.svg) | -| fire_station | ![fire_station](../../static/icons/fire_station_24.svg) | ![fire_station](../../static/icons/fire_station_14.svg) | -| fitness | ![fitness](../../static/icons/fitness_24.svg) | ![fitness](../../static/icons/fitness_14.svg) | -| flower_shop | ![flower_shop](../../static/icons/flower_shop_24.svg) | ![flower_shop](../../static/icons/flower_shop_14.svg) | -| forest | ![forest](../../static/icons/forest_24.svg) | ![forest](../../static/icons/forest_14.svg) | -| fountain | ![fountain](../../static/icons/fountain_24.svg) | none | -| furniture_store | ![furniture_store](../../static/icons/furniture_store_24.svg) | ![furniture_store](../../static/icons/furniture_store_14.svg) | -| garden | ![garden](../../static/icons/garden_24.svg) | ![garden](../../static/icons/garden_14.svg) | -| gasstation | ![gasstation](../../static/icons/gasstation_24.svg) | ![gasstation](../../static/icons/gasstation_14.svg) | -| government | ![government](../../static/icons/government_24.svg) | ![government](../../static/icons/government_14.svg) | -| hairdressers | ![hairdressers](../../static/icons/hairdressers_24.svg) | ![hairdressers](../../static/icons/hairdressers_14.svg) | -| haulier | ![haulier](../../static/icons/haulier_24.svg) | ![haulier](../../static/icons/haulier_14.svg) | -| helicopter | ![helicopter](../../static/icons/helicopter_24.svg) | none | -| hospital | ![hospital](../../static/icons/hospital_24.svg) | ![hospital](../../static/icons/hospital_14.svg) | -| hotels | ![hotels](../../static/icons/hotels_24.svg) | ![hotels](../../static/icons/hotels_14.svg) | -| hypermarket | ![hypermarket](../../static/icons/hypermarket_24.svg) | ![hypermarket](../../static/icons/hypermarket_14.svg) | -| industrial_enterprise | ![industrial_enterprise](../../static/icons/industrial_enterprise_24.svg) | ![industrial_enterprise](../../static/icons/industrial_enterprise_14.svg) | -| information | ![information](../../static/icons/information_24.svg) | ![information](../../static/icons/information_14.svg) | -| kindergarten | ![kindergarten](../../static/icons/kindergarten_24.svg) | ![kindergarten](../../static/icons/kindergarten_14.svg) | -| landmark | ![landmark](../../static/icons/landmark_24.svg) | ![landmark](../../static/icons/landmark_14.svg) | -| laundry | ![laundry](../../static/icons/laundry_24.svg) | ![laundry](../../static/icons/laundry_14.svg) | -| library | ![library](../../static/icons/library_24.svg) | ![library](../../static/icons/library_14.svg) | -| malls | ![malls](../../static/icons/malls_24.svg) | ![malls](../../static/icons/malls_14.svg) | -| medicine | ![medicine](../../static/icons/medicine_24.svg) | ![medicine](../../static/icons/medicine_14.svg) | -| memorable_event | ![memorable_event](../../static/icons/memorable_event_24.svg) | ![memorable_event](../../static/icons/memorable_event_14.svg) | -| metro | ![metro](../../static/icons/metro_24.svg) | ![metro](../../static/icons/metro_14.svg) | -| metro_bus | ![metro_bus](../../static/icons/metro_bus_24.svg) | ![metro_bus](../../static/icons/metro_bus_14.svg) | -| metro_cable | ![metro_cable](../../static/icons/metro_cable_24.svg) | ![metro_cable](../../static/icons/metro_cable_14.svg) | -| metro_entrance | ![metro_entrance](../../static/icons/metro_entrance_24.svg) | none | -| metro_funicular | ![metro_funicular](../../static/icons/metro_funicular_24.svg) | ![metro_funicular](../../static/icons/metro_funicular_14.svg) | -| metro_light | ![metro_light](../../static/icons/metro_light_24.svg) | ![metro_light](../../static/icons/metro_light_14.svg) | -| metro_monorail | ![metro_monorail](../../static/icons/metro_monorail_24.svg) | ![metro_monorail](../../static/icons/metro_monorail_14.svg) | -| metro_tram | ![metro_tram](../../static/icons/metro_tram_24.svg) | ![metro_tram](../../static/icons/metro_tram_14.svg) | -| mobile_phones | ![mobile_phones](../../static/icons/mobile_phones_24.svg) | ![mobile_phones](../../static/icons/mobile_phones_14.svg) | -| money_coin | ![money_coin](../../static/icons/money_coin_24.svg) | none | -| monument | ![monument](../../static/icons/monument_24.svg) | none | -| mosque | ![mosque](../../static/icons/mosque_24.svg) | ![mosque](../../static/icons/mosque_14.svg) | -| mountain | ![mountain](../../static/icons/mountain_24.svg) | none | -| museum | ![museum](../../static/icons/museum_24.svg) | ![museum](../../static/icons/museum_14.svg) | -| office | ![office](../../static/icons/office_24.svg) | ![office](../../static/icons/office_14.svg) | -| office_service | ![office_service](../../static/icons/office_service_24.svg) | ![office_service](../../static/icons/office_service_14.svg) | -| orthodox_church | ![orthodox_church](../../static/icons/orthodox_church_24.svg) | ![orthodox_church](../../static/icons/orthodox_church_14.svg) | -| park | ![park](../../static/icons/park_24.svg) | ![park](../../static/icons/park_14.svg) | -| pavilion | ![pavilion](../../static/icons/pavilion_24.svg) | none | -| pet_playground | ![pet_playground](../../static/icons/pet_playground_24.svg) | none | -| petshop | ![petshop](../../static/icons/petshop_24.svg) | ![petshop](../../static/icons/petshop_14.svg) | -| photo | ![photo](../../static/icons/photo_24.svg) | ![photo](../../static/icons/photo_14.svg) | -| picnic | ![picnic](../../static/icons/picnic_24.svg) | none | -| pier | ![pier](../../static/icons/pier_24.svg) | none | -| playground | ![playground](../../static/icons/playground_24.svg) | none | -| police | ![police](../../static/icons/police_24.svg) | ![police](../../static/icons/police_14.svg) | -| police_post | ![police_post](../../static/icons/police_post_24.svg) | ![police_post](../../static/icons/police_post_14.svg) | -| port | ![port](../../static/icons/port_24.svg) | ![port](../../static/icons/port_14.svg) | -| post_office | ![post_office](../../static/icons/post_office_24.svg) | ![post_office](../../static/icons/post_office_14.svg) | -| printing_services | ![printing_services](../../static/icons/printing_services_24.svg) | ![printing_services](../../static/icons/printing_services_14.svg) | -| protestant_church | ![protestant_church](../../static/icons/protestant_church_24.svg) | ![protestant_church](../../static/icons/protestant_church_14.svg) | -| racing | ![racing](../../static/icons/racing_24.svg) | ![racing](../../static/icons/racing_14.svg) | -| railway | ![railway](../../static/icons/railway_24.svg) | ![railway](../../static/icons/railway_14.svg) | -| railway_station | ![railway_station](../../static/icons/railway_station_24.svg) | ![railway_station](../../static/icons/railway_station_14.svg) | -| recycling | ![recycling](../../static/icons/recycling_24.svg) | none | -| restaurants | ![restaurants](../../static/icons/restaurants_24.svg) | ![restaurants](../../static/icons/restaurants_14.svg) | -| rezervation | ![rezervation](../../static/icons/rezervation_24.svg) | ![rezervation](../../static/icons/rezervation_14.svg) | -| sanatorium | ![sanatorium](../../static/icons/sanatorium_24.svg) | ![sanatorium](../../static/icons/sanatorium_14.svg) | -| science | ![science](../../static/icons/science_24.svg) | ![science](../../static/icons/science_14.svg) | -| skating_rink | ![skating_rink](../../static/icons/skating_rink_24.svg) | ![skating_rink](../../static/icons/skating_rink_14.svg) | -| software | ![software](../../static/icons/software_24.svg) | ![software](../../static/icons/software_14.svg) | -| spa | ![spa](../../static/icons/spa_24.svg) | ![spa](../../static/icons/spa_14.svg) | -| sport | ![sport](../../static/icons/sport_24.svg) | none | -| sport_school | ![sport_school](../../static/icons/sport_school_24.svg) | none | -| sportcenter | ![sportcenter](../../static/icons/sportcenter_24.svg) | ![sportcenter](../../static/icons/sportcenter_14.svg) | -| spring | ![spring](../../static/icons/spring_24.svg) | none | -| stadium | ![stadium](../../static/icons/stadium_24.svg) | ![stadium](../../static/icons/stadium_14.svg) | -| supermarket | ![supermarket](../../static/icons/supermarket_24.svg) | ![supermarket](../../static/icons/supermarket_14.svg) | -| sushi | ![sushi](../../static/icons/sushi_24.svg) | ![sushi](../../static/icons/sushi_14.svg) | -| swimming_pool | ![swimming_pool](../../static/icons/swimming_pool_24.svg) | ![swimming_pool](../../static/icons/swimming_pool_14.svg) | -| synagogue | ![synagogue](../../static/icons/synagogue_24.svg) | ![synagogue](../../static/icons/synagogue_14.svg) | -| tailor | ![tailor](../../static/icons/tailor_24.svg) | ![tailor](../../static/icons/tailor_14.svg) | -| taxi | ![taxi](../../static/icons/taxi_24.svg) | ![taxi](../../static/icons/taxi_14.svg) | -| theatre | ![theatre](../../static/icons/theatre_24.svg) | ![theatre](../../static/icons/theatre_14.svg) | -| ticket_office | ![ticket_office](../../static/icons/ticket_office_24.svg) | ![ticket_office](../../static/icons/ticket_office_14.svg) | -| tire_fitting | ![tire_fitting](../../static/icons/tire_fitting_24.svg) | ![tire_fitting](../../static/icons/tire_fitting_14.svg) | -| tram | ![tram](../../static/icons/tram_24.svg) | none | -| trash | ![trash](../../static/icons/trash_24.svg) | none | -| travel_agency | ![travel_agency](../../static/icons/travel_agency_24.svg) | ![travel_agency](../../static/icons/travel_agency_14.svg) | -| viewpoint | ![viewpoint](../../static/icons/viewpoint_24.svg) | none | -| waterfall | ![waterfall](../../static/icons/waterfall_24.svg) | none | -| wc | ![wc](../../static/icons/wc_24.svg) | none | -| zoo | ![zoo](../../static/icons/zoo_24.svg) | ![zoo](../../static/icons/zoo_14.svg) | +| Name | Normal Size | Small Size | +| --------------------- | ---------------------------------------------------------------------- | ---------------------------------------------------------------------- | +| airport | ![airport](../static/icons/airport_24.svg) | ![airport](../static/icons/airport_14.svg) | +| attraction | ![attraction](../static/icons/attraction_24.svg) | ![attraction](../static/icons/attraction_14.svg) | +| auto | ![auto](../static/icons/auto_24.svg) | ![auto](../static/icons/auto_14.svg) | +| aviary | ![aviary](../static/icons/aviary_24.svg) | none | +| baby_shop | ![baby_shop](../static/icons/baby_shop_24.svg) | ![baby_shop](../static/icons/baby_shop_14.svg) | +| banks | ![banks](../static/icons/banks_24.svg) | ![banks](../static/icons/banks_14.svg) | +| barbeque | ![barbeque](../static/icons/barbeque_24.svg) | none | +| bars | ![bars](../static/icons/bars_24.svg) | ![bars](../static/icons/bars_14.svg) | +| beach | ![beach](../static/icons/beach_24.svg) | ![beach](../static/icons/beach_14.svg) | +| bench | ![bench](../static/icons/bench_24.svg) | none | +| bike | ![bike](../static/icons/bike_24.svg) | none | +| bike_rent | ![bike_rent](../static/icons/bike_rent_24.svg) | ![bike_rent](../static/icons/bike_rent_14.svg) | +| boat_station | ![boat_station](../static/icons/boat_station_24.svg) | ![boat_station](../static/icons/boat_station_14.svg) | +| bookstore | ![bookstore](../static/icons/bookstore_24.svg) | ![bookstore](../static/icons/bookstore_14.svg) | +| buddhism | ![buddhism](../static/icons/buddhism_24.svg) | ![buddhism](../static/icons/buddhism_14.svg) | +| building | ![building](../static/icons/building_24.svg) | none | +| bus | ![bus](../static/icons/bus_24.svg) | none | +| cafe | ![cafe](../static/icons/cafe_24.svg) | ![cafe](../static/icons/cafe_14.svg) | +| car_park | ![car_park](../static/icons/car_park_24.svg) | none | +| catholic_church | ![catholic_church](../static/icons/catholic_church_24.svg) | ![catholic_church](../static/icons/catholic_church_14.svg) | +| cemetery | ![cemetery](../static/icons/cemetery_24.svg) | ![cemetery](../static/icons/cemetery_14.svg) | +| childrens_playground | ![childrens_playground](../static/icons/childrens_playground_24.svg) | none | +| cinemas | ![cinemas](../static/icons/cinemas_24.svg) | ![cinemas](../static/icons/cinemas_14.svg) | +| clothes_shop | ![clothes_shop](../static/icons/clothes_shop_24.svg) | ![clothes_shop](../static/icons/clothes_shop_14.svg) | +| college | ![college](../static/icons/college_24.svg) | ![college](../static/icons/college_14.svg) | +| concert_hall | ![concert_hall](../static/icons/concert_hall_24.svg) | ![concert_hall](../static/icons/concert_hall_14.svg) | +| confectionary | ![confectionary](../static/icons/confectionary_24.svg) | ![confectionary](../static/icons/confectionary_14.svg) | +| currency_exchange | ![currency_exchange](../static/icons/currency_exchange_24.svg) | ![currency_exchange](../static/icons/currency_exchange_14.svg) | +| dental | ![dental](../static/icons/dental_24.svg) | ![dental](../static/icons/dental_14.svg) | +| driving_school | ![driving_school](../static/icons/driving_school_24.svg) | ![driving_school](../static/icons/driving_school_14.svg) | +| drugstores | ![drugstores](../static/icons/drugstores_24.svg) | ![drugstores](../static/icons/drugstores_14.svg) | +| dry_cleaning | ![dry_cleaning](../static/icons/dry_cleaning_24.svg) | ![dry_cleaning](../static/icons/dry_cleaning_14.svg) | +| equestrian | ![equestrian](../static/icons/equestrian_24.svg) | ![equestrian](../static/icons/equestrian_14.svg) | +| fast_food | ![fast_food](../static/icons/fast_food_24.svg) | ![fast_food](../static/icons/fast_food_14.svg) | +| film_studio | ![film_studio](../static/icons/film_studio_24.svg) | ![film_studio](../static/icons/film_studio_14.svg) | +| fire_station | ![fire_station](../static/icons/fire_station_24.svg) | ![fire_station](../static/icons/fire_station_14.svg) | +| fitness | ![fitness](../static/icons/fitness_24.svg) | ![fitness](../static/icons/fitness_14.svg) | +| flower_shop | ![flower_shop](../static/icons/flower_shop_24.svg) | ![flower_shop](../static/icons/flower_shop_14.svg) | +| forest | ![forest](../static/icons/forest_24.svg) | ![forest](../static/icons/forest_14.svg) | +| fountain | ![fountain](../static/icons/fountain_24.svg) | none | +| furniture_store | ![furniture_store](../static/icons/furniture_store_24.svg) | ![furniture_store](../static/icons/furniture_store_14.svg) | +| garden | ![garden](../static/icons/garden_24.svg) | ![garden](../static/icons/garden_14.svg) | +| gasstation | ![gasstation](../static/icons/gasstation_24.svg) | ![gasstation](../static/icons/gasstation_14.svg) | +| government | ![government](../static/icons/government_24.svg) | ![government](../static/icons/government_14.svg) | +| hairdressers | ![hairdressers](../static/icons/hairdressers_24.svg) | ![hairdressers](../static/icons/hairdressers_14.svg) | +| haulier | ![haulier](../static/icons/haulier_24.svg) | ![haulier](../static/icons/haulier_14.svg) | +| helicopter | ![helicopter](../static/icons/helicopter_24.svg) | none | +| hospital | ![hospital](../static/icons/hospital_24.svg) | ![hospital](../static/icons/hospital_14.svg) | +| hotels | ![hotels](../static/icons/hotels_24.svg) | ![hotels](../static/icons/hotels_14.svg) | +| hypermarket | ![hypermarket](../static/icons/hypermarket_24.svg) | ![hypermarket](../static/icons/hypermarket_14.svg) | +| industrial_enterprise | ![industrial_enterprise](../static/icons/industrial_enterprise_24.svg) | ![industrial_enterprise](../static/icons/industrial_enterprise_14.svg) | +| information | ![information](../static/icons/information_24.svg) | ![information](../static/icons/information_14.svg) | +| kindergarten | ![kindergarten](../static/icons/kindergarten_24.svg) | ![kindergarten](../static/icons/kindergarten_14.svg) | +| landmark | ![landmark](../static/icons/landmark_24.svg) | ![landmark](../static/icons/landmark_14.svg) | +| laundry | ![laundry](../static/icons/laundry_24.svg) | ![laundry](../static/icons/laundry_14.svg) | +| library | ![library](../static/icons/library_24.svg) | ![library](../static/icons/library_14.svg) | +| malls | ![malls](../static/icons/malls_24.svg) | ![malls](../static/icons/malls_14.svg) | +| medicine | ![medicine](../static/icons/medicine_24.svg) | ![medicine](../static/icons/medicine_14.svg) | +| memorable_event | ![memorable_event](../static/icons/memorable_event_24.svg) | ![memorable_event](../static/icons/memorable_event_14.svg) | +| metro | ![metro](../static/icons/metro_24.svg) | ![metro](../static/icons/metro_14.svg) | +| metro_bus | ![metro_bus](../static/icons/metro_bus_24.svg) | ![metro_bus](../static/icons/metro_bus_14.svg) | +| metro_cable | ![metro_cable](../static/icons/metro_cable_24.svg) | ![metro_cable](../static/icons/metro_cable_14.svg) | +| metro_entrance | ![metro_entrance](../static/icons/metro_entrance_24.svg) | none | +| metro_funicular | ![metro_funicular](../static/icons/metro_funicular_24.svg) | ![metro_funicular](../static/icons/metro_funicular_14.svg) | +| metro_light | ![metro_light](../static/icons/metro_light_24.svg) | ![metro_light](../static/icons/metro_light_14.svg) | +| metro_monorail | ![metro_monorail](../static/icons/metro_monorail_24.svg) | ![metro_monorail](../static/icons/metro_monorail_14.svg) | +| metro_tram | ![metro_tram](../static/icons/metro_tram_24.svg) | ![metro_tram](../static/icons/metro_tram_14.svg) | +| mobile_phones | ![mobile_phones](../static/icons/mobile_phones_24.svg) | ![mobile_phones](../static/icons/mobile_phones_14.svg) | +| money_coin | ![money_coin](../static/icons/money_coin_24.svg) | none | +| monument | ![monument](../static/icons/monument_24.svg) | none | +| mosque | ![mosque](../static/icons/mosque_24.svg) | ![mosque](../static/icons/mosque_14.svg) | +| mountain | ![mountain](../static/icons/mountain_24.svg) | none | +| museum | ![museum](../static/icons/museum_24.svg) | ![museum](../static/icons/museum_14.svg) | +| office | ![office](../static/icons/office_24.svg) | ![office](../static/icons/office_14.svg) | +| office_service | ![office_service](../static/icons/office_service_24.svg) | ![office_service](../static/icons/office_service_14.svg) | +| orthodox_church | ![orthodox_church](../static/icons/orthodox_church_24.svg) | ![orthodox_church](../static/icons/orthodox_church_14.svg) | +| park | ![park](../static/icons/park_24.svg) | ![park](../static/icons/park_14.svg) | +| pavilion | ![pavilion](../static/icons/pavilion_24.svg) | none | +| pet_playground | ![pet_playground](../static/icons/pet_playground_24.svg) | none | +| petshop | ![petshop](../static/icons/petshop_24.svg) | ![petshop](../static/icons/petshop_14.svg) | +| photo | ![photo](../static/icons/photo_24.svg) | ![photo](../static/icons/photo_14.svg) | +| picnic | ![picnic](../static/icons/picnic_24.svg) | none | +| pier | ![pier](../static/icons/pier_24.svg) | none | +| playground | ![playground](../static/icons/playground_24.svg) | none | +| police | ![police](../static/icons/police_24.svg) | ![police](../static/icons/police_14.svg) | +| police_post | ![police_post](../static/icons/police_post_24.svg) | ![police_post](../static/icons/police_post_14.svg) | +| port | ![port](../static/icons/port_24.svg) | ![port](../static/icons/port_14.svg) | +| post_office | ![post_office](../static/icons/post_office_24.svg) | ![post_office](../static/icons/post_office_14.svg) | +| printing_services | ![printing_services](../static/icons/printing_services_24.svg) | ![printing_services](../static/icons/printing_services_14.svg) | +| protestant_church | ![protestant_church](../static/icons/protestant_church_24.svg) | ![protestant_church](../static/icons/protestant_church_14.svg) | +| racing | ![racing](../static/icons/racing_24.svg) | ![racing](../static/icons/racing_14.svg) | +| railway | ![railway](../static/icons/railway_24.svg) | ![railway](../static/icons/railway_14.svg) | +| railway_station | ![railway_station](../static/icons/railway_station_24.svg) | ![railway_station](../static/icons/railway_station_14.svg) | +| recycling | ![recycling](../static/icons/recycling_24.svg) | none | +| restaurants | ![restaurants](../static/icons/restaurants_24.svg) | ![restaurants](../static/icons/restaurants_14.svg) | +| rezervation | ![rezervation](../static/icons/rezervation_24.svg) | ![rezervation](../static/icons/rezervation_14.svg) | +| sanatorium | ![sanatorium](../static/icons/sanatorium_24.svg) | ![sanatorium](../static/icons/sanatorium_14.svg) | +| science | ![science](../static/icons/science_24.svg) | ![science](../static/icons/science_14.svg) | +| skating_rink | ![skating_rink](../static/icons/skating_rink_24.svg) | ![skating_rink](../static/icons/skating_rink_14.svg) | +| software | ![software](../static/icons/software_24.svg) | ![software](../static/icons/software_14.svg) | +| spa | ![spa](../static/icons/spa_24.svg) | ![spa](../static/icons/spa_14.svg) | +| sportcenter | ![sportcenter](../static/icons/sportcenter_24.svg) | ![sportcenter](../static/icons/sportcenter_14.svg) | +| spring | ![spring](../static/icons/spring_24.svg) | none | +| stadium | ![stadium](../static/icons/stadium_24.svg) | ![stadium](../static/icons/stadium_14.svg) | +| supermarket | ![supermarket](../static/icons/supermarket_24.svg) | ![supermarket](../static/icons/supermarket_14.svg) | +| sushi | ![sushi](../static/icons/sushi_24.svg) | ![sushi](../static/icons/sushi_14.svg) | +| swimming_pool | ![swimming_pool](../static/icons/swimming_pool_24.svg) | ![swimming_pool](../static/icons/swimming_pool_14.svg) | +| synagogue | ![synagogue](../static/icons/synagogue_24.svg) | ![synagogue](../static/icons/synagogue_14.svg) | +| tailor | ![tailor](../static/icons/tailor_24.svg) | ![tailor](../static/icons/tailor_14.svg) | +| taxi | ![taxi](../static/icons/taxi_24.svg) | ![taxi](../static/icons/taxi_14.svg) | +| theatre | ![theatre](../static/icons/theatre_24.svg) | ![theatre](../static/icons/theatre_14.svg) | +| ticket_office | ![ticket_office](../static/icons/ticket_office_24.svg) | ![ticket_office](../static/icons/ticket_office_14.svg) | +| tire_fitting | ![tire_fitting](../static/icons/tire_fitting_24.svg) | ![tire_fitting](../static/icons/tire_fitting_14.svg) | +| tram | ![tram](../static/icons/tram_24.svg) | none | +| trash | ![trash](../static/icons/trash_24.svg) | none | +| travel_agency | ![travel_agency](../static/icons/travel_agency_24.svg) | ![travel_agency](../static/icons/travel_agency_14.svg) | +| viewpoint | ![viewpoint](../static/icons/viewpoint_24.svg) | none | +| waterfall | ![waterfall](../static/icons/waterfall_24.svg) | none | +| wc | ![wc](../static/icons/wc_24.svg) | none | +| zoo | ![zoo](../static/icons/zoo_24.svg) | ![zoo](../static/icons/zoo_14.svg) | diff --git a/src/icons/types/icons.ts b/src/icons/types/icons.ts index bb83046..2ceb08d 100644 --- a/src/icons/types/icons.ts +++ b/src/icons/types/icons.ts @@ -101,8 +101,6 @@ type IconName = | 'skating_rink' | 'software' | 'spa' - | 'sport' - | 'sport_school' | 'sportcenter' | 'spring' | 'stadium' diff --git a/tools/icons/generate-docs.ts b/tools/icons/generate-docs.ts index be6c26d..a7b1319 100644 --- a/tools/icons/generate-docs.ts +++ b/tools/icons/generate-docs.ts @@ -22,8 +22,8 @@ export const generateIconsDocsList = async (iconNames: string[]) => { const normalAbsolutePath = path.join(ICONS_PATH, normalFileName); const smallAbsolutePath = path.join(ICONS_PATH, smallFileName); - const normalRelativePath = `../../static/icons/${normalFileName}`; - const smallRelativePath = `../../static/icons/${smallFileName}`; + const normalRelativePath = `../static/icons/${normalFileName}`; + const smallRelativePath = `../static/icons/${smallFileName}`; const normalIcon = existsSync(normalAbsolutePath) ? `![${name}](${normalRelativePath})` : `none`; const smallIcon = existsSync(smallAbsolutePath) ? `![${name}](${smallRelativePath})` : `none`; diff --git a/tools/icons/get-image-files.ts b/tools/icons/get-image-files.ts index 1adf8f9..54955a0 100644 --- a/tools/icons/get-image-files.ts +++ b/tools/icons/get-image-files.ts @@ -4,8 +4,10 @@ import {IconDescription, IconDescriptionWithLink} from './fetch-icons'; /** Maximum number of retries when loading an icon */ const MAX_RETRIES = 20; -/** Our designer marks these icons with this color that do not need to be worked on yet. */ +/** Our designer marks these icons with this color that do not need to be worked on yet */ const ERROR_COLOR_REGEXP = /fill="#C90D0D"/; +/** Our designer marks icons with `fill-opacity="0.1"` that don't need to be worked on yet */ +const FILL_OPACITY_REGEXP = /fill-opacity="0.1"/; /** Default icon color from Figma */ const FILL_COLOR_REGEXP = /fill="black"/g; @@ -20,17 +22,15 @@ export type IconDescriptionWithData = IconDescription & { */ export const downloadAndTransform = async (icons: IconDescriptionWithLink[]): Promise => { const iconsWithData = await getImageFiles(icons); - return iconsWithData - .filter((icon) => !icon.data.toString().match(ERROR_COLOR_REGEXP)) - .map((icon) => { - const iconDataString = icon.data.toString(); - const replacedFillColorIconData = iconDataString.replace(FILL_COLOR_REGEXP, 'fill="currentColor"'); - const optimizedIcon = optimize(replacedFillColorIconData); - return { - ...icon, - data: Buffer.from(optimizedIcon.data) - }; - }); + return iconsWithData.reduce((icons, currentIcon) => { + const iconDataString = currentIcon.data.toString(); + if (iconDataString.match(ERROR_COLOR_REGEXP) || iconDataString.match(FILL_OPACITY_REGEXP)) { + return icons; + } + const replacedFillColorIconData = iconDataString.replace(FILL_COLOR_REGEXP, 'fill="currentColor"'); + const optimizedIcon = optimize(replacedFillColorIconData); + return icons.concat({...currentIcon, data: Buffer.from(optimizedIcon.data)}); + }, [] as IconDescriptionWithData[]); }; /** From 73533e45b6416904d7a920434aef0ea605e310aa Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 1 Apr 2024 18:33:18 +0300 Subject: [PATCH 14/43] default marker --- src/MMapDefaultMarker/index.css | 13 ++++++++++++ src/MMapDefaultMarker/index.ts | 36 +++++++++++++++++++++++++++++++++ src/MMapDefaultMarker/pin.svg | 1 + src/index.ts | 1 + src/internal/internal.d.ts | 4 ++++ 5 files changed, 55 insertions(+) create mode 100644 src/MMapDefaultMarker/index.css create mode 100644 src/MMapDefaultMarker/index.ts create mode 100644 src/MMapDefaultMarker/pin.svg create mode 100644 src/internal/internal.d.ts diff --git a/src/MMapDefaultMarker/index.css b/src/MMapDefaultMarker/index.css new file mode 100644 index 0000000..6e64195 --- /dev/null +++ b/src/MMapDefaultMarker/index.css @@ -0,0 +1,13 @@ +.mappable--point { + box-sizing: border-box; + height: 8px; + width: 8px; + border: 2px solid #f8f8f8; + position: absolute; + transform: translate(-50%, -50%); + border-radius: 50%; +} + +.mappable--point svg { + transform: translate(calc(-50% + 2px), calc(-100% + 2px)); +} diff --git a/src/MMapDefaultMarker/index.ts b/src/MMapDefaultMarker/index.ts new file mode 100644 index 0000000..e76a1ea --- /dev/null +++ b/src/MMapDefaultMarker/index.ts @@ -0,0 +1,36 @@ +import {MMapMarker, MMapMarkerProps} from '@mappable-world/mappable-types'; +import {IconName} from '../icons/types/icons'; +import pin from './pin.svg'; +import './index.css'; + +export type MMapDefaultMarkerProps = MMapMarkerProps & { + name: IconName; + color: string; +}; + +export class MMapDefaultMarker extends mappable.MMapComplexEntity { + private _marker: MMapMarker; + private _markerElement: HTMLElement; + + constructor(props: MMapDefaultMarkerProps) { + super(props); + } + + protected _onAttach(): void { + this._markerElement = document.createElement('mappable'); + this._markerElement.classList.add('mappable--point'); + this._markerElement.innerHTML = pin; + this._markerElement.style.color = this._props.color; + this._markerElement.style.backgroundColor = this._props.color; + + this._marker = new mappable.MMapMarker(this._props, this._markerElement); + this.addChild(this._marker); + } + + protected _onUpdate(propsDiff: Partial): void { + if (propsDiff.color !== undefined) { + this._markerElement.style.color = this._props.color; + } + this._marker.update(this._props); + } +} diff --git a/src/MMapDefaultMarker/pin.svg b/src/MMapDefaultMarker/pin.svg new file mode 100644 index 0000000..db159ac --- /dev/null +++ b/src/MMapDefaultMarker/pin.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index 995436d..27d9aec 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1 +1,2 @@ export * from './controls'; +export * from './MMapDefaultMarker'; diff --git a/src/internal/internal.d.ts b/src/internal/internal.d.ts new file mode 100644 index 0000000..44350b3 --- /dev/null +++ b/src/internal/internal.d.ts @@ -0,0 +1,4 @@ +declare module '*.svg' { + const content: string; + export default content; +} From 885eab4c00cacd4f20d587c64ac1371b9384efc7 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 1 Apr 2024 19:18:28 +0300 Subject: [PATCH 15/43] add nanospinner in cli tool --- package-lock.json | 10 ++++++++++ package.json | 1 + tools/icons/local.ts | 1 - tools/icons/update-icons.ts | 14 ++++++++++++-- tools/scripts/sync-icons.ts | 12 +++++++++++- 5 files changed, 34 insertions(+), 4 deletions(-) diff --git a/package-lock.json b/package-lock.json index 7c2b5f6..998e9c6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -32,6 +32,7 @@ "jest": "29.6.1", "jsdom": "22.1.0", "lodash": "^4.17.21", + "nanospinner": "^1.1.0", "prettier": "3.0.0", "style-loader": "3.3.3", "svgo": "^3.2.0", @@ -6612,6 +6613,15 @@ "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" } }, + "node_modules/nanospinner": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/nanospinner/-/nanospinner-1.1.0.tgz", + "integrity": "sha512-yFvNYMig4AthKYfHFl1sLj7B2nkHL4lzdig4osvl9/LdGbXwrdFRoqBS98gsEsOakr0yH+r5NZ/1Y9gdVB8trA==", + "dev": true, + "dependencies": { + "picocolors": "^1.0.0" + } + }, "node_modules/natural-compare": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz", diff --git a/package.json b/package.json index 54ff508..4af3d6c 100644 --- a/package.json +++ b/package.json @@ -42,6 +42,7 @@ "jest": "29.6.1", "jsdom": "22.1.0", "lodash": "^4.17.21", + "nanospinner": "^1.1.0", "prettier": "3.0.0", "style-loader": "3.3.3", "svgo": "^3.2.0", diff --git a/tools/icons/local.ts b/tools/icons/local.ts index caa71fb..2936ca7 100644 --- a/tools/icons/local.ts +++ b/tools/icons/local.ts @@ -11,7 +11,6 @@ export type LocalIconDescription = { }; export const getLocalIcons = async (): Promise => { - console.info('Getting static resources dir'); const currentFilenames = await fs.readdir(ICONS_PATH); const descriptions: LocalIconDescription[] = await Promise.all( currentFilenames.map(async (filename) => { diff --git a/tools/icons/update-icons.ts b/tools/icons/update-icons.ts index 5bd5087..8fd8013 100644 --- a/tools/icons/update-icons.ts +++ b/tools/icons/update-icons.ts @@ -2,15 +2,25 @@ import {differenceBy, intersectionBy} from 'lodash'; import {IconDescription, fetchFigmaIcons} from './fetch-icons'; import {deleteLocalFiles, getLocalIcons, updateLocalFiles} from './local'; import {downloadAndTransform} from './get-image-files'; +import {Spinner} from 'nanospinner'; -export const updateIcons = async (): Promise => { - const [localIcons, figmaIcons] = await Promise.all([getLocalIcons(), fetchFigmaIcons()]); +export const updateIcons = async (spinner: Spinner): Promise => { + spinner.update({text: 'Getting information about icons from Figma'}); + const figmaIcons = await fetchFigmaIcons(); + spinner.update({text: 'Getting information about current local icons'}); + const localIcons = await getLocalIcons(); + + spinner.update({text: 'Downloading and transforming icons from Figma'}); const iconsWithData = await downloadAndTransform(figmaIcons); + + spinner.update({text: 'Updating local icons'}); await updateLocalFiles(iconsWithData); const existingLocalIcons = intersectionBy(localIcons, iconsWithData, (d) => d.name); const iconsToDelete = differenceBy(localIcons, existingLocalIcons, (d) => d.name); + + spinner.update({text: 'Removing unnecessary old local icons'}); await deleteLocalFiles(iconsToDelete); return iconsWithData.map(({componentId, name}) => ({componentId, name})); diff --git a/tools/scripts/sync-icons.ts b/tools/scripts/sync-icons.ts index 4368b7a..77ffc6a 100644 --- a/tools/scripts/sync-icons.ts +++ b/tools/scripts/sync-icons.ts @@ -2,13 +2,23 @@ import {generateIconsDocsList} from '../icons/generate-docs'; import {generateIconsTypes} from '../icons/generate-types'; import {getUniqNames} from '../icons/get-uniq-names'; import {updateIcons} from '../icons/update-icons'; +import {createSpinner} from 'nanospinner'; async function main() { try { - const iconsDescription = await updateIcons(); + const spinner = createSpinner(); + spinner.start({text: 'Start sync icons'}); + + const iconsDescription = await updateIcons(spinner); const iconNames = getUniqNames(iconsDescription); + + spinner.update({text: 'Generating a file with typescript icon types'}); await generateIconsTypes(iconNames); + + spinner.update({text: 'Generating a markdown file with a list of available icons'}); await generateIconsDocsList(iconNames); + + spinner.success({text: 'Icons are successfully synchronized'}); } catch (error) { console.error(error.message || error.toString()); } From 57c0e2a39b14bf44e2a4ad79136223c623ec1d7f Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Tue, 2 Apr 2024 12:37:18 +0300 Subject: [PATCH 16/43] path as common constants, nanospinner error in catch --- .gitignore | 2 ++ src/icons/{types/icons.ts => icon-name.ts} | 0 tools/icons/generate-docs.ts | 7 +++---- tools/icons/generate-imports.ts | 3 +++ tools/icons/generate-types.ts | 6 ++---- tools/icons/local.ts | 16 +++++----------- tools/icons/paths.ts | 6 ++++++ tools/icons/update-icons.ts | 4 +++- tools/scripts/sync-icons.ts | 10 +++++++--- 9 files changed, 31 insertions(+), 23 deletions(-) rename src/icons/{types/icons.ts => icon-name.ts} (100%) create mode 100644 tools/icons/generate-imports.ts create mode 100644 tools/icons/paths.ts diff --git a/.gitignore b/.gitignore index 3ba0c2c..7f96c5b 100644 --- a/.gitignore +++ b/.gitignore @@ -4,3 +4,5 @@ dist node_modules .env .DS_Store +# FIXME: ignore static folder for a while +static \ No newline at end of file diff --git a/src/icons/types/icons.ts b/src/icons/icon-name.ts similarity index 100% rename from src/icons/types/icons.ts rename to src/icons/icon-name.ts diff --git a/tools/icons/generate-docs.ts b/tools/icons/generate-docs.ts index a7b1319..2690a88 100644 --- a/tools/icons/generate-docs.ts +++ b/tools/icons/generate-docs.ts @@ -2,9 +2,8 @@ import {existsSync} from 'fs'; import fs from 'fs/promises'; import path from 'path'; import {prettierFormat} from '../utils/prettier-format'; -import {BASE_DIR, ICONS_PATH} from './local'; +import {DOCS_FILE_PATH, STATIC_ICONS_PATH} from './paths'; -const DOCS_FILE_PATH = path.join(BASE_DIR, 'docs/icons.md'); const WARNING = ``; const TITLE = '# List of supported icons'; const TABLE_HEADER = ` @@ -19,8 +18,8 @@ export const generateIconsDocsList = async (iconNames: string[]) => { const normalFileName = `${name}_24.svg`; const smallFileName = `${name}_14.svg`; - const normalAbsolutePath = path.join(ICONS_PATH, normalFileName); - const smallAbsolutePath = path.join(ICONS_PATH, smallFileName); + const normalAbsolutePath = path.join(STATIC_ICONS_PATH, normalFileName); + const smallAbsolutePath = path.join(STATIC_ICONS_PATH, smallFileName); const normalRelativePath = `../static/icons/${normalFileName}`; const smallRelativePath = `../static/icons/${smallFileName}`; diff --git a/tools/icons/generate-imports.ts b/tools/icons/generate-imports.ts new file mode 100644 index 0000000..0ab748f --- /dev/null +++ b/tools/icons/generate-imports.ts @@ -0,0 +1,3 @@ +import {SRC_ICONS_PATH} from './paths'; + +export const generateImports = (iconsDescription: IconDescription[]) => {}; diff --git a/tools/icons/generate-types.ts b/tools/icons/generate-types.ts index aad1ca1..b86d5f3 100644 --- a/tools/icons/generate-types.ts +++ b/tools/icons/generate-types.ts @@ -1,9 +1,7 @@ import fs from 'fs/promises'; import path from 'path'; import {prettierFormat} from '../utils/prettier-format'; -import {BASE_DIR} from './local'; - -const TYPES_PATH = path.join(BASE_DIR, 'src/icons/types'); +import {SRC_ICONS_PATH} from './paths'; export const generateIconsTypes = async (iconNames: string[]) => { const type = 'IconName'; @@ -14,5 +12,5 @@ type ${type} =${iconNames.map((name) => `| '${name}'`).join('\n')}; export {${type}}; `; const formattedContent = await prettierFormat(content, 'typescript'); - await fs.writeFile(path.join(TYPES_PATH, 'icons.ts'), formattedContent); + await fs.writeFile(path.join(SRC_ICONS_PATH, 'icon-name.ts'), formattedContent); }; diff --git a/tools/icons/local.ts b/tools/icons/local.ts index 2936ca7..09e3481 100644 --- a/tools/icons/local.ts +++ b/tools/icons/local.ts @@ -1,17 +1,14 @@ import fs from 'fs/promises'; import path from 'path'; import {IconDescriptionWithData} from './get-image-files'; - -export const BASE_DIR = path.join(__dirname, '../../'); -export const ICONS_PATH = path.join(BASE_DIR, 'static/icons'); +import {STATIC_ICONS_PATH} from './paths'; export type LocalIconDescription = { name: string; - data: Buffer; }; export const getLocalIcons = async (): Promise => { - const currentFilenames = await fs.readdir(ICONS_PATH); + const currentFilenames = await fs.readdir(STATIC_ICONS_PATH); const descriptions: LocalIconDescription[] = await Promise.all( currentFilenames.map(async (filename) => { const fileExtension = path.parse(filename).ext.slice(1); @@ -19,11 +16,8 @@ export const getLocalIcons = async (): Promise => { throw new Error('Unknown file extension.'); } const cleanFilename = path.parse(filename).name; - const data = await fs.readFile(path.join(ICONS_PATH, filename)); return { - name: cleanFilename, - data, - exportFormat: fileExtension + name: cleanFilename }; }) ); @@ -33,7 +27,7 @@ export const getLocalIcons = async (): Promise => { export const updateLocalFiles = async (icons: IconDescriptionWithData[]) => { await Promise.all( icons.map((icon) => { - const filePath = path.join(ICONS_PATH, `${icon.name}.svg`); + const filePath = path.join(STATIC_ICONS_PATH, `${icon.name}.svg`); return fs.writeFile(filePath, icon.data, 'utf-8'); }) ); @@ -42,7 +36,7 @@ export const updateLocalFiles = async (icons: IconDescriptionWithData[]) => { export const deleteLocalFiles = async (iconsToDelete: LocalIconDescription[]) => { await Promise.all( iconsToDelete.map((icon) => { - const filePath = path.join(ICONS_PATH, `${icon.name}.svg`); + const filePath = path.join(STATIC_ICONS_PATH, `${icon.name}.svg`); return fs.rm(filePath); }) ); diff --git a/tools/icons/paths.ts b/tools/icons/paths.ts new file mode 100644 index 0000000..e24d337 --- /dev/null +++ b/tools/icons/paths.ts @@ -0,0 +1,6 @@ +import path from 'path'; + +export const BASE_DIR = path.join(__dirname, '../../'); +export const STATIC_ICONS_PATH = path.join(BASE_DIR, 'static/icons'); +export const SRC_ICONS_PATH = path.join(BASE_DIR, 'src/icons'); +export const DOCS_FILE_PATH = path.join(BASE_DIR, 'docs/icons.md'); diff --git a/tools/icons/update-icons.ts b/tools/icons/update-icons.ts index 8fd8013..4ab6b2b 100644 --- a/tools/icons/update-icons.ts +++ b/tools/icons/update-icons.ts @@ -23,5 +23,7 @@ export const updateIcons = async (spinner: Spinner): Promise spinner.update({text: 'Removing unnecessary old local icons'}); await deleteLocalFiles(iconsToDelete); - return iconsWithData.map(({componentId, name}) => ({componentId, name})); + return iconsWithData + .map(({componentId, name}) => ({componentId, name})) + .sort((a, b) => a.name.localeCompare(b.name)); }; diff --git a/tools/scripts/sync-icons.ts b/tools/scripts/sync-icons.ts index 77ffc6a..816a5e3 100644 --- a/tools/scripts/sync-icons.ts +++ b/tools/scripts/sync-icons.ts @@ -1,12 +1,13 @@ +import {createSpinner} from 'nanospinner'; import {generateIconsDocsList} from '../icons/generate-docs'; +import {generateImports} from '../icons/generate-imports'; import {generateIconsTypes} from '../icons/generate-types'; import {getUniqNames} from '../icons/get-uniq-names'; import {updateIcons} from '../icons/update-icons'; -import {createSpinner} from 'nanospinner'; async function main() { + const spinner = createSpinner(); try { - const spinner = createSpinner(); spinner.start({text: 'Start sync icons'}); const iconsDescription = await updateIcons(spinner); @@ -15,12 +16,15 @@ async function main() { spinner.update({text: 'Generating a file with typescript icon types'}); await generateIconsTypes(iconNames); + spinner.update({text: 'Generating a file with import icons svg'}); + await generateImports(iconsDescription); + spinner.update({text: 'Generating a markdown file with a list of available icons'}); await generateIconsDocsList(iconNames); spinner.success({text: 'Icons are successfully synchronized'}); } catch (error) { - console.error(error.message || error.toString()); + spinner.error({text: error.message || error.toString()}); } } From 290abd7dc04e18e0e9f391eae4b2494ad7d1d4bc Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Tue, 2 Apr 2024 15:33:15 +0300 Subject: [PATCH 17/43] show pin with icon --- src/MMapDefaultMarker/index.css | 11 +- src/MMapDefaultMarker/index.ts | 22 ++- src/MMapDefaultMarker/pin.svg | 2 +- src/icons/icon-name.ts | 4 +- src/icons/icon-size.ts | 1 + src/icons/index.ts | 339 ++++++++++++++++++++++++++++++++ src/icons/types.ts | 8 + tools/icons/generate-imports.ts | 31 ++- tools/icons/generate-types.ts | 4 +- tools/scripts/sync-icons.ts | 2 +- 10 files changed, 411 insertions(+), 13 deletions(-) create mode 100644 src/icons/icon-size.ts create mode 100644 src/icons/index.ts create mode 100644 src/icons/types.ts diff --git a/src/MMapDefaultMarker/index.css b/src/MMapDefaultMarker/index.css index 6e64195..510c02e 100644 --- a/src/MMapDefaultMarker/index.css +++ b/src/MMapDefaultMarker/index.css @@ -8,6 +8,13 @@ border-radius: 50%; } -.mappable--point svg { - transform: translate(calc(-50% + 2px), calc(-100% + 2px)); +.mappable--pin { + position: absolute; + transform: translate(calc(-50% + 2px), calc(-100%)); +} + +.mappable--icon { + color: #fffffffc; + position: absolute; + transform: translate(calc(-24px - 10px),10px); } diff --git a/src/MMapDefaultMarker/index.ts b/src/MMapDefaultMarker/index.ts index e76a1ea..b20bae8 100644 --- a/src/MMapDefaultMarker/index.ts +++ b/src/MMapDefaultMarker/index.ts @@ -1,5 +1,6 @@ import {MMapMarker, MMapMarkerProps} from '@mappable-world/mappable-types'; -import {IconName} from '../icons/types/icons'; +import {IconName} from '../icons/icon-name'; +import {icons} from '../icons'; import pin from './pin.svg'; import './index.css'; @@ -11,6 +12,8 @@ export type MMapDefaultMarkerProps = MMapMarkerProps & { export class MMapDefaultMarker extends mappable.MMapComplexEntity { private _marker: MMapMarker; private _markerElement: HTMLElement; + private _pin: HTMLElement; + private _icon: HTMLElement; constructor(props: MMapDefaultMarkerProps) { super(props); @@ -18,11 +21,22 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity): void { if (propsDiff.color !== undefined) { this._markerElement.style.color = this._props.color; + this._markerElement.style.backgroundColor = this._props.color; + } + if (propsDiff.name !== undefined) { + this._icon.innerHTML = icons[propsDiff.name].normal; } this._marker.update(this._props); } diff --git a/src/MMapDefaultMarker/pin.svg b/src/MMapDefaultMarker/pin.svg index db159ac..5d9a1b1 100644 --- a/src/MMapDefaultMarker/pin.svg +++ b/src/MMapDefaultMarker/pin.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/icon-name.ts b/src/icons/icon-name.ts index 2ceb08d..2e1e72a 100644 --- a/src/icons/icon-name.ts +++ b/src/icons/icon-name.ts @@ -1,5 +1,5 @@ /** Don't edit manually. Generated by script: ./tools/icons/generate-types.ts */ -type IconName = +export type IconName = | 'airport' | 'attraction' | 'auto' @@ -120,5 +120,3 @@ type IconName = | 'waterfall' | 'wc' | 'zoo'; - -export {IconName}; diff --git a/src/icons/icon-size.ts b/src/icons/icon-size.ts new file mode 100644 index 0000000..4189049 --- /dev/null +++ b/src/icons/icon-size.ts @@ -0,0 +1 @@ +export type IconSize = 'normal' | 'small'; diff --git a/src/icons/index.ts b/src/icons/index.ts new file mode 100644 index 0000000..1de3256 --- /dev/null +++ b/src/icons/index.ts @@ -0,0 +1,339 @@ +/** Don't edit manually. Generated by script: ./tools/icons/generate-imports.ts */ +import airport_14 from '../../static/icons/airport_14.svg'; +import airport_24 from '../../static/icons/airport_24.svg'; +import attraction_14 from '../../static/icons/attraction_14.svg'; +import attraction_24 from '../../static/icons/attraction_24.svg'; +import auto_14 from '../../static/icons/auto_14.svg'; +import auto_24 from '../../static/icons/auto_24.svg'; +import aviary_24 from '../../static/icons/aviary_24.svg'; +import baby_shop_14 from '../../static/icons/baby_shop_14.svg'; +import baby_shop_24 from '../../static/icons/baby_shop_24.svg'; +import banks_14 from '../../static/icons/banks_14.svg'; +import banks_24 from '../../static/icons/banks_24.svg'; +import barbeque_24 from '../../static/icons/barbeque_24.svg'; +import bars_14 from '../../static/icons/bars_14.svg'; +import bars_24 from '../../static/icons/bars_24.svg'; +import beach_14 from '../../static/icons/beach_14.svg'; +import beach_24 from '../../static/icons/beach_24.svg'; +import bench_24 from '../../static/icons/bench_24.svg'; +import bike_24 from '../../static/icons/bike_24.svg'; +import bike_rent_14 from '../../static/icons/bike_rent_14.svg'; +import bike_rent_24 from '../../static/icons/bike_rent_24.svg'; +import boat_station_14 from '../../static/icons/boat_station_14.svg'; +import boat_station_24 from '../../static/icons/boat_station_24.svg'; +import bookstore_14 from '../../static/icons/bookstore_14.svg'; +import bookstore_24 from '../../static/icons/bookstore_24.svg'; +import buddhism_14 from '../../static/icons/buddhism_14.svg'; +import buddhism_24 from '../../static/icons/buddhism_24.svg'; +import building_24 from '../../static/icons/building_24.svg'; +import bus_24 from '../../static/icons/bus_24.svg'; +import cafe_14 from '../../static/icons/cafe_14.svg'; +import cafe_24 from '../../static/icons/cafe_24.svg'; +import car_park_24 from '../../static/icons/car_park_24.svg'; +import catholic_church_14 from '../../static/icons/catholic_church_14.svg'; +import catholic_church_24 from '../../static/icons/catholic_church_24.svg'; +import cemetery_14 from '../../static/icons/cemetery_14.svg'; +import cemetery_24 from '../../static/icons/cemetery_24.svg'; +import childrens_playground_24 from '../../static/icons/childrens_playground_24.svg'; +import cinemas_14 from '../../static/icons/cinemas_14.svg'; +import cinemas_24 from '../../static/icons/cinemas_24.svg'; +import clothes_shop_14 from '../../static/icons/clothes_shop_14.svg'; +import clothes_shop_24 from '../../static/icons/clothes_shop_24.svg'; +import college_14 from '../../static/icons/college_14.svg'; +import college_24 from '../../static/icons/college_24.svg'; +import concert_hall_14 from '../../static/icons/concert_hall_14.svg'; +import concert_hall_24 from '../../static/icons/concert_hall_24.svg'; +import confectionary_14 from '../../static/icons/confectionary_14.svg'; +import confectionary_24 from '../../static/icons/confectionary_24.svg'; +import currency_exchange_14 from '../../static/icons/currency_exchange_14.svg'; +import currency_exchange_24 from '../../static/icons/currency_exchange_24.svg'; +import dental_14 from '../../static/icons/dental_14.svg'; +import dental_24 from '../../static/icons/dental_24.svg'; +import driving_school_14 from '../../static/icons/driving_school_14.svg'; +import driving_school_24 from '../../static/icons/driving_school_24.svg'; +import drugstores_14 from '../../static/icons/drugstores_14.svg'; +import drugstores_24 from '../../static/icons/drugstores_24.svg'; +import dry_cleaning_14 from '../../static/icons/dry_cleaning_14.svg'; +import dry_cleaning_24 from '../../static/icons/dry_cleaning_24.svg'; +import equestrian_14 from '../../static/icons/equestrian_14.svg'; +import equestrian_24 from '../../static/icons/equestrian_24.svg'; +import fast_food_14 from '../../static/icons/fast_food_14.svg'; +import fast_food_24 from '../../static/icons/fast_food_24.svg'; +import film_studio_14 from '../../static/icons/film_studio_14.svg'; +import film_studio_24 from '../../static/icons/film_studio_24.svg'; +import fire_station_14 from '../../static/icons/fire_station_14.svg'; +import fire_station_24 from '../../static/icons/fire_station_24.svg'; +import fitness_14 from '../../static/icons/fitness_14.svg'; +import fitness_24 from '../../static/icons/fitness_24.svg'; +import flower_shop_14 from '../../static/icons/flower_shop_14.svg'; +import flower_shop_24 from '../../static/icons/flower_shop_24.svg'; +import forest_14 from '../../static/icons/forest_14.svg'; +import forest_24 from '../../static/icons/forest_24.svg'; +import fountain_24 from '../../static/icons/fountain_24.svg'; +import furniture_store_14 from '../../static/icons/furniture_store_14.svg'; +import furniture_store_24 from '../../static/icons/furniture_store_24.svg'; +import garden_14 from '../../static/icons/garden_14.svg'; +import garden_24 from '../../static/icons/garden_24.svg'; +import gasstation_14 from '../../static/icons/gasstation_14.svg'; +import gasstation_24 from '../../static/icons/gasstation_24.svg'; +import government_14 from '../../static/icons/government_14.svg'; +import government_24 from '../../static/icons/government_24.svg'; +import hairdressers_14 from '../../static/icons/hairdressers_14.svg'; +import hairdressers_24 from '../../static/icons/hairdressers_24.svg'; +import haulier_14 from '../../static/icons/haulier_14.svg'; +import haulier_24 from '../../static/icons/haulier_24.svg'; +import helicopter_24 from '../../static/icons/helicopter_24.svg'; +import hospital_14 from '../../static/icons/hospital_14.svg'; +import hospital_24 from '../../static/icons/hospital_24.svg'; +import hotels_14 from '../../static/icons/hotels_14.svg'; +import hotels_24 from '../../static/icons/hotels_24.svg'; +import hypermarket_14 from '../../static/icons/hypermarket_14.svg'; +import hypermarket_24 from '../../static/icons/hypermarket_24.svg'; +import industrial_enterprise_14 from '../../static/icons/industrial_enterprise_14.svg'; +import industrial_enterprise_24 from '../../static/icons/industrial_enterprise_24.svg'; +import information_14 from '../../static/icons/information_14.svg'; +import information_24 from '../../static/icons/information_24.svg'; +import kindergarten_14 from '../../static/icons/kindergarten_14.svg'; +import kindergarten_24 from '../../static/icons/kindergarten_24.svg'; +import landmark_14 from '../../static/icons/landmark_14.svg'; +import landmark_24 from '../../static/icons/landmark_24.svg'; +import laundry_14 from '../../static/icons/laundry_14.svg'; +import laundry_24 from '../../static/icons/laundry_24.svg'; +import library_14 from '../../static/icons/library_14.svg'; +import library_24 from '../../static/icons/library_24.svg'; +import malls_14 from '../../static/icons/malls_14.svg'; +import malls_24 from '../../static/icons/malls_24.svg'; +import medicine_14 from '../../static/icons/medicine_14.svg'; +import medicine_24 from '../../static/icons/medicine_24.svg'; +import memorable_event_14 from '../../static/icons/memorable_event_14.svg'; +import memorable_event_24 from '../../static/icons/memorable_event_24.svg'; +import metro_14 from '../../static/icons/metro_14.svg'; +import metro_24 from '../../static/icons/metro_24.svg'; +import metro_bus_14 from '../../static/icons/metro_bus_14.svg'; +import metro_bus_24 from '../../static/icons/metro_bus_24.svg'; +import metro_cable_14 from '../../static/icons/metro_cable_14.svg'; +import metro_cable_24 from '../../static/icons/metro_cable_24.svg'; +import metro_entrance_24 from '../../static/icons/metro_entrance_24.svg'; +import metro_funicular_14 from '../../static/icons/metro_funicular_14.svg'; +import metro_funicular_24 from '../../static/icons/metro_funicular_24.svg'; +import metro_light_14 from '../../static/icons/metro_light_14.svg'; +import metro_light_24 from '../../static/icons/metro_light_24.svg'; +import metro_monorail_14 from '../../static/icons/metro_monorail_14.svg'; +import metro_monorail_24 from '../../static/icons/metro_monorail_24.svg'; +import metro_tram_14 from '../../static/icons/metro_tram_14.svg'; +import metro_tram_24 from '../../static/icons/metro_tram_24.svg'; +import mobile_phones_14 from '../../static/icons/mobile_phones_14.svg'; +import mobile_phones_24 from '../../static/icons/mobile_phones_24.svg'; +import money_coin_24 from '../../static/icons/money_coin_24.svg'; +import monument_24 from '../../static/icons/monument_24.svg'; +import mosque_14 from '../../static/icons/mosque_14.svg'; +import mosque_24 from '../../static/icons/mosque_24.svg'; +import mountain_24 from '../../static/icons/mountain_24.svg'; +import museum_14 from '../../static/icons/museum_14.svg'; +import museum_24 from '../../static/icons/museum_24.svg'; +import office_14 from '../../static/icons/office_14.svg'; +import office_24 from '../../static/icons/office_24.svg'; +import office_service_14 from '../../static/icons/office_service_14.svg'; +import office_service_24 from '../../static/icons/office_service_24.svg'; +import orthodox_church_14 from '../../static/icons/orthodox_church_14.svg'; +import orthodox_church_24 from '../../static/icons/orthodox_church_24.svg'; +import park_14 from '../../static/icons/park_14.svg'; +import park_24 from '../../static/icons/park_24.svg'; +import pavilion_24 from '../../static/icons/pavilion_24.svg'; +import pet_playground_24 from '../../static/icons/pet_playground_24.svg'; +import petshop_14 from '../../static/icons/petshop_14.svg'; +import petshop_24 from '../../static/icons/petshop_24.svg'; +import photo_14 from '../../static/icons/photo_14.svg'; +import photo_24 from '../../static/icons/photo_24.svg'; +import picnic_24 from '../../static/icons/picnic_24.svg'; +import pier_24 from '../../static/icons/pier_24.svg'; +import playground_24 from '../../static/icons/playground_24.svg'; +import police_14 from '../../static/icons/police_14.svg'; +import police_24 from '../../static/icons/police_24.svg'; +import police_post_14 from '../../static/icons/police_post_14.svg'; +import police_post_24 from '../../static/icons/police_post_24.svg'; +import port_14 from '../../static/icons/port_14.svg'; +import port_24 from '../../static/icons/port_24.svg'; +import post_office_14 from '../../static/icons/post_office_14.svg'; +import post_office_24 from '../../static/icons/post_office_24.svg'; +import printing_services_14 from '../../static/icons/printing_services_14.svg'; +import printing_services_24 from '../../static/icons/printing_services_24.svg'; +import protestant_church_14 from '../../static/icons/protestant_church_14.svg'; +import protestant_church_24 from '../../static/icons/protestant_church_24.svg'; +import racing_14 from '../../static/icons/racing_14.svg'; +import racing_24 from '../../static/icons/racing_24.svg'; +import railway_14 from '../../static/icons/railway_14.svg'; +import railway_24 from '../../static/icons/railway_24.svg'; +import railway_station_14 from '../../static/icons/railway_station_14.svg'; +import railway_station_24 from '../../static/icons/railway_station_24.svg'; +import recycling_24 from '../../static/icons/recycling_24.svg'; +import restaurants_14 from '../../static/icons/restaurants_14.svg'; +import restaurants_24 from '../../static/icons/restaurants_24.svg'; +import rezervation_14 from '../../static/icons/rezervation_14.svg'; +import rezervation_24 from '../../static/icons/rezervation_24.svg'; +import sanatorium_14 from '../../static/icons/sanatorium_14.svg'; +import sanatorium_24 from '../../static/icons/sanatorium_24.svg'; +import science_14 from '../../static/icons/science_14.svg'; +import science_24 from '../../static/icons/science_24.svg'; +import skating_rink_14 from '../../static/icons/skating_rink_14.svg'; +import skating_rink_24 from '../../static/icons/skating_rink_24.svg'; +import software_14 from '../../static/icons/software_14.svg'; +import software_24 from '../../static/icons/software_24.svg'; +import spa_14 from '../../static/icons/spa_14.svg'; +import spa_24 from '../../static/icons/spa_24.svg'; +import sportcenter_14 from '../../static/icons/sportcenter_14.svg'; +import sportcenter_24 from '../../static/icons/sportcenter_24.svg'; +import spring_24 from '../../static/icons/spring_24.svg'; +import stadium_14 from '../../static/icons/stadium_14.svg'; +import stadium_24 from '../../static/icons/stadium_24.svg'; +import supermarket_14 from '../../static/icons/supermarket_14.svg'; +import supermarket_24 from '../../static/icons/supermarket_24.svg'; +import sushi_14 from '../../static/icons/sushi_14.svg'; +import sushi_24 from '../../static/icons/sushi_24.svg'; +import swimming_pool_14 from '../../static/icons/swimming_pool_14.svg'; +import swimming_pool_24 from '../../static/icons/swimming_pool_24.svg'; +import synagogue_14 from '../../static/icons/synagogue_14.svg'; +import synagogue_24 from '../../static/icons/synagogue_24.svg'; +import tailor_14 from '../../static/icons/tailor_14.svg'; +import tailor_24 from '../../static/icons/tailor_24.svg'; +import taxi_14 from '../../static/icons/taxi_14.svg'; +import taxi_24 from '../../static/icons/taxi_24.svg'; +import theatre_14 from '../../static/icons/theatre_14.svg'; +import theatre_24 from '../../static/icons/theatre_24.svg'; +import ticket_office_14 from '../../static/icons/ticket_office_14.svg'; +import ticket_office_24 from '../../static/icons/ticket_office_24.svg'; +import tire_fitting_14 from '../../static/icons/tire_fitting_14.svg'; +import tire_fitting_24 from '../../static/icons/tire_fitting_24.svg'; +import tram_24 from '../../static/icons/tram_24.svg'; +import trash_24 from '../../static/icons/trash_24.svg'; +import travel_agency_14 from '../../static/icons/travel_agency_14.svg'; +import travel_agency_24 from '../../static/icons/travel_agency_24.svg'; +import viewpoint_24 from '../../static/icons/viewpoint_24.svg'; +import waterfall_24 from '../../static/icons/waterfall_24.svg'; +import wc_24 from '../../static/icons/wc_24.svg'; +import zoo_14 from '../../static/icons/zoo_14.svg'; +import zoo_24 from '../../static/icons/zoo_24.svg'; + +import type {Icons} from './types'; +export const icons: Icons = { + airport: {normal: airport_24, small: airport_14}, + attraction: {normal: attraction_24, small: attraction_14}, + auto: {normal: auto_24, small: auto_14}, + aviary: {normal: aviary_24, small: null}, + baby_shop: {normal: baby_shop_24, small: baby_shop_14}, + banks: {normal: banks_24, small: banks_14}, + barbeque: {normal: barbeque_24, small: null}, + bars: {normal: bars_24, small: bars_14}, + beach: {normal: beach_24, small: beach_14}, + bench: {normal: bench_24, small: null}, + bike: {normal: bike_24, small: null}, + bike_rent: {normal: bike_rent_24, small: bike_rent_14}, + boat_station: {normal: boat_station_24, small: boat_station_14}, + bookstore: {normal: bookstore_24, small: bookstore_14}, + buddhism: {normal: buddhism_24, small: buddhism_14}, + building: {normal: building_24, small: null}, + bus: {normal: bus_24, small: null}, + cafe: {normal: cafe_24, small: cafe_14}, + car_park: {normal: car_park_24, small: null}, + catholic_church: {normal: catholic_church_24, small: catholic_church_14}, + cemetery: {normal: cemetery_24, small: cemetery_14}, + childrens_playground: {normal: childrens_playground_24, small: null}, + cinemas: {normal: cinemas_24, small: cinemas_14}, + clothes_shop: {normal: clothes_shop_24, small: clothes_shop_14}, + college: {normal: college_24, small: college_14}, + concert_hall: {normal: concert_hall_24, small: concert_hall_14}, + confectionary: {normal: confectionary_24, small: confectionary_14}, + currency_exchange: {normal: currency_exchange_24, small: currency_exchange_14}, + dental: {normal: dental_24, small: dental_14}, + driving_school: {normal: driving_school_24, small: driving_school_14}, + drugstores: {normal: drugstores_24, small: drugstores_14}, + dry_cleaning: {normal: dry_cleaning_24, small: dry_cleaning_14}, + equestrian: {normal: equestrian_24, small: equestrian_14}, + fast_food: {normal: fast_food_24, small: fast_food_14}, + film_studio: {normal: film_studio_24, small: film_studio_14}, + fire_station: {normal: fire_station_24, small: fire_station_14}, + fitness: {normal: fitness_24, small: fitness_14}, + flower_shop: {normal: flower_shop_24, small: flower_shop_14}, + forest: {normal: forest_24, small: forest_14}, + fountain: {normal: fountain_24, small: null}, + furniture_store: {normal: furniture_store_24, small: furniture_store_14}, + garden: {normal: garden_24, small: garden_14}, + gasstation: {normal: gasstation_24, small: gasstation_14}, + government: {normal: government_24, small: government_14}, + hairdressers: {normal: hairdressers_24, small: hairdressers_14}, + haulier: {normal: haulier_24, small: haulier_14}, + helicopter: {normal: helicopter_24, small: null}, + hospital: {normal: hospital_24, small: hospital_14}, + hotels: {normal: hotels_24, small: hotels_14}, + hypermarket: {normal: hypermarket_24, small: hypermarket_14}, + industrial_enterprise: {normal: industrial_enterprise_24, small: industrial_enterprise_14}, + information: {normal: information_24, small: information_14}, + kindergarten: {normal: kindergarten_24, small: kindergarten_14}, + landmark: {normal: landmark_24, small: landmark_14}, + laundry: {normal: laundry_24, small: laundry_14}, + library: {normal: library_24, small: library_14}, + malls: {normal: malls_24, small: malls_14}, + medicine: {normal: medicine_24, small: medicine_14}, + memorable_event: {normal: memorable_event_24, small: memorable_event_14}, + metro: {normal: metro_24, small: metro_14}, + metro_bus: {normal: metro_bus_24, small: metro_bus_14}, + metro_cable: {normal: metro_cable_24, small: metro_cable_14}, + metro_entrance: {normal: metro_entrance_24, small: null}, + metro_funicular: {normal: metro_funicular_24, small: metro_funicular_14}, + metro_light: {normal: metro_light_24, small: metro_light_14}, + metro_monorail: {normal: metro_monorail_24, small: metro_monorail_14}, + metro_tram: {normal: metro_tram_24, small: metro_tram_14}, + mobile_phones: {normal: mobile_phones_24, small: mobile_phones_14}, + money_coin: {normal: money_coin_24, small: null}, + monument: {normal: monument_24, small: null}, + mosque: {normal: mosque_24, small: mosque_14}, + mountain: {normal: mountain_24, small: null}, + museum: {normal: museum_24, small: museum_14}, + office: {normal: office_24, small: office_14}, + office_service: {normal: office_service_24, small: office_service_14}, + orthodox_church: {normal: orthodox_church_24, small: orthodox_church_14}, + park: {normal: park_24, small: park_14}, + pavilion: {normal: pavilion_24, small: null}, + pet_playground: {normal: pet_playground_24, small: null}, + petshop: {normal: petshop_24, small: petshop_14}, + photo: {normal: photo_24, small: photo_14}, + picnic: {normal: picnic_24, small: null}, + pier: {normal: pier_24, small: null}, + playground: {normal: playground_24, small: null}, + police: {normal: police_24, small: police_14}, + police_post: {normal: police_post_24, small: police_post_14}, + port: {normal: port_24, small: port_14}, + post_office: {normal: post_office_24, small: post_office_14}, + printing_services: {normal: printing_services_24, small: printing_services_14}, + protestant_church: {normal: protestant_church_24, small: protestant_church_14}, + racing: {normal: racing_24, small: racing_14}, + railway: {normal: railway_24, small: railway_14}, + railway_station: {normal: railway_station_24, small: railway_station_14}, + recycling: {normal: recycling_24, small: null}, + restaurants: {normal: restaurants_24, small: restaurants_14}, + rezervation: {normal: rezervation_24, small: rezervation_14}, + sanatorium: {normal: sanatorium_24, small: sanatorium_14}, + science: {normal: science_24, small: science_14}, + skating_rink: {normal: skating_rink_24, small: skating_rink_14}, + software: {normal: software_24, small: software_14}, + spa: {normal: spa_24, small: spa_14}, + sportcenter: {normal: sportcenter_24, small: sportcenter_14}, + spring: {normal: spring_24, small: null}, + stadium: {normal: stadium_24, small: stadium_14}, + supermarket: {normal: supermarket_24, small: supermarket_14}, + sushi: {normal: sushi_24, small: sushi_14}, + swimming_pool: {normal: swimming_pool_24, small: swimming_pool_14}, + synagogue: {normal: synagogue_24, small: synagogue_14}, + tailor: {normal: tailor_24, small: tailor_14}, + taxi: {normal: taxi_24, small: taxi_14}, + theatre: {normal: theatre_24, small: theatre_14}, + ticket_office: {normal: ticket_office_24, small: ticket_office_14}, + tire_fitting: {normal: tire_fitting_24, small: tire_fitting_14}, + tram: {normal: tram_24, small: null}, + trash: {normal: trash_24, small: null}, + travel_agency: {normal: travel_agency_24, small: travel_agency_14}, + viewpoint: {normal: viewpoint_24, small: null}, + waterfall: {normal: waterfall_24, small: null}, + wc: {normal: wc_24, small: null}, + zoo: {normal: zoo_24, small: zoo_14} +}; diff --git a/src/icons/types.ts b/src/icons/types.ts new file mode 100644 index 0000000..6c7ce3f --- /dev/null +++ b/src/icons/types.ts @@ -0,0 +1,8 @@ +import {IconName} from './icon-name'; +import {IconSize} from './icon-size'; + +export type Icons = { + [key in IconName]: { + [key in IconSize]: string | null; + }; +}; diff --git a/tools/icons/generate-imports.ts b/tools/icons/generate-imports.ts index 0ab748f..43680b6 100644 --- a/tools/icons/generate-imports.ts +++ b/tools/icons/generate-imports.ts @@ -1,3 +1,32 @@ +import fs from 'fs/promises'; +import path from 'path'; +import {prettierFormat} from '../utils/prettier-format'; +import {IconDescription} from './fetch-icons'; import {SRC_ICONS_PATH} from './paths'; -export const generateImports = (iconsDescription: IconDescription[]) => {}; +const WARNING = `/** Don't edit manually. Generated by script: ./tools/icons/generate-imports.ts */`; + +export const generateImports = async (iconsDescription: IconDescription[], iconNames: string[]) => { + const importList = iconsDescription + .map((description) => `import ${description.name} from '../../static/icons/${description.name}.svg'`) + .join('\n'); + + const iconNamesObject = iconNames + .map((iconName) => { + const normalIcon = iconsDescription.find((description) => description.name === `${iconName}_24`); + const smallIcon = iconsDescription.find((description) => description.name === `${iconName}_14`); + return `${iconName}:{normal:${normalIcon?.name ?? 'null'},small:${smallIcon?.name ?? 'null'}},`; + }) + .join('\n'); + + const fileContent = ` + ${WARNING} + ${importList} + + import type {Icons} from './types'; + export const icons: Icons = { + ${iconNamesObject} + }`; + const formattedContent = await prettierFormat(fileContent, 'typescript'); + await fs.writeFile(path.join(SRC_ICONS_PATH, 'index.ts'), formattedContent); +}; diff --git a/tools/icons/generate-types.ts b/tools/icons/generate-types.ts index b86d5f3..da8758c 100644 --- a/tools/icons/generate-types.ts +++ b/tools/icons/generate-types.ts @@ -7,9 +7,7 @@ export const generateIconsTypes = async (iconNames: string[]) => { const type = 'IconName'; const content = ` /** Don't edit manually. Generated by script: ./tools/icons/generate-types.ts */ -type ${type} =${iconNames.map((name) => `| '${name}'`).join('\n')}; - -export {${type}}; +export type ${type} =${iconNames.map((name) => `| '${name}'`).join('\n')}; `; const formattedContent = await prettierFormat(content, 'typescript'); await fs.writeFile(path.join(SRC_ICONS_PATH, 'icon-name.ts'), formattedContent); diff --git a/tools/scripts/sync-icons.ts b/tools/scripts/sync-icons.ts index 816a5e3..def309d 100644 --- a/tools/scripts/sync-icons.ts +++ b/tools/scripts/sync-icons.ts @@ -17,7 +17,7 @@ async function main() { await generateIconsTypes(iconNames); spinner.update({text: 'Generating a file with import icons svg'}); - await generateImports(iconsDescription); + await generateImports(iconsDescription, iconNames); spinner.update({text: 'Generating a markdown file with a list of available icons'}); await generateIconsDocsList(iconNames); From bd2ddf3a27c40dd76bf3dc415d75bb685335515a Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Wed, 3 Apr 2024 14:28:53 +0300 Subject: [PATCH 18/43] fetch colors from Figma --- .eslintrc.js | 5 +- package.json | 3 +- src/MMapDefaultMarker/pin.svg | 2 +- src/icons/icon-colors.ts | 14 ++ src/icons/icons.ts | 339 +++++++++++++++++++++++++++++++ src/icons/index.ts | 342 +------------------------------- tools/icons/fetch-colors.ts | 90 +++++++++ tools/icons/generate-colors.ts | 24 +++ tools/icons/generate-docs.ts | 2 +- tools/icons/generate-imports.ts | 2 +- tools/icons/paths.ts | 2 +- tools/scripts/sync-colors.ts | 24 +++ 12 files changed, 504 insertions(+), 345 deletions(-) create mode 100644 src/icons/icon-colors.ts create mode 100644 src/icons/icons.ts create mode 100644 tools/icons/fetch-colors.ts create mode 100644 tools/icons/generate-colors.ts create mode 100644 tools/scripts/sync-colors.ts diff --git a/.eslintrc.js b/.eslintrc.js index eaac5c2..e5b7f6f 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -1,3 +1,6 @@ module.exports = { - extends: ['./node_modules/@mappable-world/mappable-cli/.eslintrc.js'] + extends: ['./node_modules/@mappable-world/mappable-cli/.eslintrc.js'], + rules: { + 'no-console': 'error' + } }; diff --git a/package.json b/package.json index 4af3d6c..b9beab8 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,8 @@ "start": "webpack serve", "bump": "npm version prerelease --preid=beta --no-git-tag-version && npm run bump:git", "bump:git": "git add --all && git commit -m \"New version $npm_package_version\" && git tag $npm_package_version && git push --tags origin HEAD:main", - "sync-icons": "node -r dotenv/config -r ts-node/register ./tools/scripts/sync-icons.ts" + "sync-icons": "node -r dotenv/config -r ts-node/register ./tools/scripts/sync-icons.ts", + "sync-colors": "node -r dotenv/config -r ts-node/register ./tools/scripts/sync-colors.ts" }, "devDependencies": { "@mappable-world/mappable-cli": "^0.0.32", diff --git a/src/MMapDefaultMarker/pin.svg b/src/MMapDefaultMarker/pin.svg index 5d9a1b1..f0dcd75 100644 --- a/src/MMapDefaultMarker/pin.svg +++ b/src/MMapDefaultMarker/pin.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/icon-colors.ts b/src/icons/icon-colors.ts new file mode 100644 index 0000000..5338910 --- /dev/null +++ b/src/icons/icon-colors.ts @@ -0,0 +1,14 @@ +/** Don't edit manually only color names. Generated by script: ./tools/icons/generate-colors.ts */ +export const iconColors = { + darkgray: {day: '#ada9a6ff', night: '#6f737aff'}, + pink: {day: '#ff8f96ff', night: '#b96066ff'}, + seawave: {day: '#62c0c6ff', night: '#468286ff'}, + orchid: {day: '#e096d0ff', night: '#916187ff'}, + steelblue: {day: '#498ea5ff', night: '#57a8c2ff'}, + bluebell: {day: '#9d9dc4ff', night: '#6767a3ff'}, + ceil: {day: '#88aecfff', night: '#537695ff'}, + green: {day: '#5ebd8cff', night: '#468c68ff'}, + darksalmon: {day: '#f09a75ff', night: '#ab6f55ff'} +} as const; +export const glyphColors = {day: '#ffffffff', night: '#303741ff'} as const; +export type IconColor = keyof typeof iconColors; diff --git a/src/icons/icons.ts b/src/icons/icons.ts new file mode 100644 index 0000000..1de3256 --- /dev/null +++ b/src/icons/icons.ts @@ -0,0 +1,339 @@ +/** Don't edit manually. Generated by script: ./tools/icons/generate-imports.ts */ +import airport_14 from '../../static/icons/airport_14.svg'; +import airport_24 from '../../static/icons/airport_24.svg'; +import attraction_14 from '../../static/icons/attraction_14.svg'; +import attraction_24 from '../../static/icons/attraction_24.svg'; +import auto_14 from '../../static/icons/auto_14.svg'; +import auto_24 from '../../static/icons/auto_24.svg'; +import aviary_24 from '../../static/icons/aviary_24.svg'; +import baby_shop_14 from '../../static/icons/baby_shop_14.svg'; +import baby_shop_24 from '../../static/icons/baby_shop_24.svg'; +import banks_14 from '../../static/icons/banks_14.svg'; +import banks_24 from '../../static/icons/banks_24.svg'; +import barbeque_24 from '../../static/icons/barbeque_24.svg'; +import bars_14 from '../../static/icons/bars_14.svg'; +import bars_24 from '../../static/icons/bars_24.svg'; +import beach_14 from '../../static/icons/beach_14.svg'; +import beach_24 from '../../static/icons/beach_24.svg'; +import bench_24 from '../../static/icons/bench_24.svg'; +import bike_24 from '../../static/icons/bike_24.svg'; +import bike_rent_14 from '../../static/icons/bike_rent_14.svg'; +import bike_rent_24 from '../../static/icons/bike_rent_24.svg'; +import boat_station_14 from '../../static/icons/boat_station_14.svg'; +import boat_station_24 from '../../static/icons/boat_station_24.svg'; +import bookstore_14 from '../../static/icons/bookstore_14.svg'; +import bookstore_24 from '../../static/icons/bookstore_24.svg'; +import buddhism_14 from '../../static/icons/buddhism_14.svg'; +import buddhism_24 from '../../static/icons/buddhism_24.svg'; +import building_24 from '../../static/icons/building_24.svg'; +import bus_24 from '../../static/icons/bus_24.svg'; +import cafe_14 from '../../static/icons/cafe_14.svg'; +import cafe_24 from '../../static/icons/cafe_24.svg'; +import car_park_24 from '../../static/icons/car_park_24.svg'; +import catholic_church_14 from '../../static/icons/catholic_church_14.svg'; +import catholic_church_24 from '../../static/icons/catholic_church_24.svg'; +import cemetery_14 from '../../static/icons/cemetery_14.svg'; +import cemetery_24 from '../../static/icons/cemetery_24.svg'; +import childrens_playground_24 from '../../static/icons/childrens_playground_24.svg'; +import cinemas_14 from '../../static/icons/cinemas_14.svg'; +import cinemas_24 from '../../static/icons/cinemas_24.svg'; +import clothes_shop_14 from '../../static/icons/clothes_shop_14.svg'; +import clothes_shop_24 from '../../static/icons/clothes_shop_24.svg'; +import college_14 from '../../static/icons/college_14.svg'; +import college_24 from '../../static/icons/college_24.svg'; +import concert_hall_14 from '../../static/icons/concert_hall_14.svg'; +import concert_hall_24 from '../../static/icons/concert_hall_24.svg'; +import confectionary_14 from '../../static/icons/confectionary_14.svg'; +import confectionary_24 from '../../static/icons/confectionary_24.svg'; +import currency_exchange_14 from '../../static/icons/currency_exchange_14.svg'; +import currency_exchange_24 from '../../static/icons/currency_exchange_24.svg'; +import dental_14 from '../../static/icons/dental_14.svg'; +import dental_24 from '../../static/icons/dental_24.svg'; +import driving_school_14 from '../../static/icons/driving_school_14.svg'; +import driving_school_24 from '../../static/icons/driving_school_24.svg'; +import drugstores_14 from '../../static/icons/drugstores_14.svg'; +import drugstores_24 from '../../static/icons/drugstores_24.svg'; +import dry_cleaning_14 from '../../static/icons/dry_cleaning_14.svg'; +import dry_cleaning_24 from '../../static/icons/dry_cleaning_24.svg'; +import equestrian_14 from '../../static/icons/equestrian_14.svg'; +import equestrian_24 from '../../static/icons/equestrian_24.svg'; +import fast_food_14 from '../../static/icons/fast_food_14.svg'; +import fast_food_24 from '../../static/icons/fast_food_24.svg'; +import film_studio_14 from '../../static/icons/film_studio_14.svg'; +import film_studio_24 from '../../static/icons/film_studio_24.svg'; +import fire_station_14 from '../../static/icons/fire_station_14.svg'; +import fire_station_24 from '../../static/icons/fire_station_24.svg'; +import fitness_14 from '../../static/icons/fitness_14.svg'; +import fitness_24 from '../../static/icons/fitness_24.svg'; +import flower_shop_14 from '../../static/icons/flower_shop_14.svg'; +import flower_shop_24 from '../../static/icons/flower_shop_24.svg'; +import forest_14 from '../../static/icons/forest_14.svg'; +import forest_24 from '../../static/icons/forest_24.svg'; +import fountain_24 from '../../static/icons/fountain_24.svg'; +import furniture_store_14 from '../../static/icons/furniture_store_14.svg'; +import furniture_store_24 from '../../static/icons/furniture_store_24.svg'; +import garden_14 from '../../static/icons/garden_14.svg'; +import garden_24 from '../../static/icons/garden_24.svg'; +import gasstation_14 from '../../static/icons/gasstation_14.svg'; +import gasstation_24 from '../../static/icons/gasstation_24.svg'; +import government_14 from '../../static/icons/government_14.svg'; +import government_24 from '../../static/icons/government_24.svg'; +import hairdressers_14 from '../../static/icons/hairdressers_14.svg'; +import hairdressers_24 from '../../static/icons/hairdressers_24.svg'; +import haulier_14 from '../../static/icons/haulier_14.svg'; +import haulier_24 from '../../static/icons/haulier_24.svg'; +import helicopter_24 from '../../static/icons/helicopter_24.svg'; +import hospital_14 from '../../static/icons/hospital_14.svg'; +import hospital_24 from '../../static/icons/hospital_24.svg'; +import hotels_14 from '../../static/icons/hotels_14.svg'; +import hotels_24 from '../../static/icons/hotels_24.svg'; +import hypermarket_14 from '../../static/icons/hypermarket_14.svg'; +import hypermarket_24 from '../../static/icons/hypermarket_24.svg'; +import industrial_enterprise_14 from '../../static/icons/industrial_enterprise_14.svg'; +import industrial_enterprise_24 from '../../static/icons/industrial_enterprise_24.svg'; +import information_14 from '../../static/icons/information_14.svg'; +import information_24 from '../../static/icons/information_24.svg'; +import kindergarten_14 from '../../static/icons/kindergarten_14.svg'; +import kindergarten_24 from '../../static/icons/kindergarten_24.svg'; +import landmark_14 from '../../static/icons/landmark_14.svg'; +import landmark_24 from '../../static/icons/landmark_24.svg'; +import laundry_14 from '../../static/icons/laundry_14.svg'; +import laundry_24 from '../../static/icons/laundry_24.svg'; +import library_14 from '../../static/icons/library_14.svg'; +import library_24 from '../../static/icons/library_24.svg'; +import malls_14 from '../../static/icons/malls_14.svg'; +import malls_24 from '../../static/icons/malls_24.svg'; +import medicine_14 from '../../static/icons/medicine_14.svg'; +import medicine_24 from '../../static/icons/medicine_24.svg'; +import memorable_event_14 from '../../static/icons/memorable_event_14.svg'; +import memorable_event_24 from '../../static/icons/memorable_event_24.svg'; +import metro_14 from '../../static/icons/metro_14.svg'; +import metro_24 from '../../static/icons/metro_24.svg'; +import metro_bus_14 from '../../static/icons/metro_bus_14.svg'; +import metro_bus_24 from '../../static/icons/metro_bus_24.svg'; +import metro_cable_14 from '../../static/icons/metro_cable_14.svg'; +import metro_cable_24 from '../../static/icons/metro_cable_24.svg'; +import metro_entrance_24 from '../../static/icons/metro_entrance_24.svg'; +import metro_funicular_14 from '../../static/icons/metro_funicular_14.svg'; +import metro_funicular_24 from '../../static/icons/metro_funicular_24.svg'; +import metro_light_14 from '../../static/icons/metro_light_14.svg'; +import metro_light_24 from '../../static/icons/metro_light_24.svg'; +import metro_monorail_14 from '../../static/icons/metro_monorail_14.svg'; +import metro_monorail_24 from '../../static/icons/metro_monorail_24.svg'; +import metro_tram_14 from '../../static/icons/metro_tram_14.svg'; +import metro_tram_24 from '../../static/icons/metro_tram_24.svg'; +import mobile_phones_14 from '../../static/icons/mobile_phones_14.svg'; +import mobile_phones_24 from '../../static/icons/mobile_phones_24.svg'; +import money_coin_24 from '../../static/icons/money_coin_24.svg'; +import monument_24 from '../../static/icons/monument_24.svg'; +import mosque_14 from '../../static/icons/mosque_14.svg'; +import mosque_24 from '../../static/icons/mosque_24.svg'; +import mountain_24 from '../../static/icons/mountain_24.svg'; +import museum_14 from '../../static/icons/museum_14.svg'; +import museum_24 from '../../static/icons/museum_24.svg'; +import office_14 from '../../static/icons/office_14.svg'; +import office_24 from '../../static/icons/office_24.svg'; +import office_service_14 from '../../static/icons/office_service_14.svg'; +import office_service_24 from '../../static/icons/office_service_24.svg'; +import orthodox_church_14 from '../../static/icons/orthodox_church_14.svg'; +import orthodox_church_24 from '../../static/icons/orthodox_church_24.svg'; +import park_14 from '../../static/icons/park_14.svg'; +import park_24 from '../../static/icons/park_24.svg'; +import pavilion_24 from '../../static/icons/pavilion_24.svg'; +import pet_playground_24 from '../../static/icons/pet_playground_24.svg'; +import petshop_14 from '../../static/icons/petshop_14.svg'; +import petshop_24 from '../../static/icons/petshop_24.svg'; +import photo_14 from '../../static/icons/photo_14.svg'; +import photo_24 from '../../static/icons/photo_24.svg'; +import picnic_24 from '../../static/icons/picnic_24.svg'; +import pier_24 from '../../static/icons/pier_24.svg'; +import playground_24 from '../../static/icons/playground_24.svg'; +import police_14 from '../../static/icons/police_14.svg'; +import police_24 from '../../static/icons/police_24.svg'; +import police_post_14 from '../../static/icons/police_post_14.svg'; +import police_post_24 from '../../static/icons/police_post_24.svg'; +import port_14 from '../../static/icons/port_14.svg'; +import port_24 from '../../static/icons/port_24.svg'; +import post_office_14 from '../../static/icons/post_office_14.svg'; +import post_office_24 from '../../static/icons/post_office_24.svg'; +import printing_services_14 from '../../static/icons/printing_services_14.svg'; +import printing_services_24 from '../../static/icons/printing_services_24.svg'; +import protestant_church_14 from '../../static/icons/protestant_church_14.svg'; +import protestant_church_24 from '../../static/icons/protestant_church_24.svg'; +import racing_14 from '../../static/icons/racing_14.svg'; +import racing_24 from '../../static/icons/racing_24.svg'; +import railway_14 from '../../static/icons/railway_14.svg'; +import railway_24 from '../../static/icons/railway_24.svg'; +import railway_station_14 from '../../static/icons/railway_station_14.svg'; +import railway_station_24 from '../../static/icons/railway_station_24.svg'; +import recycling_24 from '../../static/icons/recycling_24.svg'; +import restaurants_14 from '../../static/icons/restaurants_14.svg'; +import restaurants_24 from '../../static/icons/restaurants_24.svg'; +import rezervation_14 from '../../static/icons/rezervation_14.svg'; +import rezervation_24 from '../../static/icons/rezervation_24.svg'; +import sanatorium_14 from '../../static/icons/sanatorium_14.svg'; +import sanatorium_24 from '../../static/icons/sanatorium_24.svg'; +import science_14 from '../../static/icons/science_14.svg'; +import science_24 from '../../static/icons/science_24.svg'; +import skating_rink_14 from '../../static/icons/skating_rink_14.svg'; +import skating_rink_24 from '../../static/icons/skating_rink_24.svg'; +import software_14 from '../../static/icons/software_14.svg'; +import software_24 from '../../static/icons/software_24.svg'; +import spa_14 from '../../static/icons/spa_14.svg'; +import spa_24 from '../../static/icons/spa_24.svg'; +import sportcenter_14 from '../../static/icons/sportcenter_14.svg'; +import sportcenter_24 from '../../static/icons/sportcenter_24.svg'; +import spring_24 from '../../static/icons/spring_24.svg'; +import stadium_14 from '../../static/icons/stadium_14.svg'; +import stadium_24 from '../../static/icons/stadium_24.svg'; +import supermarket_14 from '../../static/icons/supermarket_14.svg'; +import supermarket_24 from '../../static/icons/supermarket_24.svg'; +import sushi_14 from '../../static/icons/sushi_14.svg'; +import sushi_24 from '../../static/icons/sushi_24.svg'; +import swimming_pool_14 from '../../static/icons/swimming_pool_14.svg'; +import swimming_pool_24 from '../../static/icons/swimming_pool_24.svg'; +import synagogue_14 from '../../static/icons/synagogue_14.svg'; +import synagogue_24 from '../../static/icons/synagogue_24.svg'; +import tailor_14 from '../../static/icons/tailor_14.svg'; +import tailor_24 from '../../static/icons/tailor_24.svg'; +import taxi_14 from '../../static/icons/taxi_14.svg'; +import taxi_24 from '../../static/icons/taxi_24.svg'; +import theatre_14 from '../../static/icons/theatre_14.svg'; +import theatre_24 from '../../static/icons/theatre_24.svg'; +import ticket_office_14 from '../../static/icons/ticket_office_14.svg'; +import ticket_office_24 from '../../static/icons/ticket_office_24.svg'; +import tire_fitting_14 from '../../static/icons/tire_fitting_14.svg'; +import tire_fitting_24 from '../../static/icons/tire_fitting_24.svg'; +import tram_24 from '../../static/icons/tram_24.svg'; +import trash_24 from '../../static/icons/trash_24.svg'; +import travel_agency_14 from '../../static/icons/travel_agency_14.svg'; +import travel_agency_24 from '../../static/icons/travel_agency_24.svg'; +import viewpoint_24 from '../../static/icons/viewpoint_24.svg'; +import waterfall_24 from '../../static/icons/waterfall_24.svg'; +import wc_24 from '../../static/icons/wc_24.svg'; +import zoo_14 from '../../static/icons/zoo_14.svg'; +import zoo_24 from '../../static/icons/zoo_24.svg'; + +import type {Icons} from './types'; +export const icons: Icons = { + airport: {normal: airport_24, small: airport_14}, + attraction: {normal: attraction_24, small: attraction_14}, + auto: {normal: auto_24, small: auto_14}, + aviary: {normal: aviary_24, small: null}, + baby_shop: {normal: baby_shop_24, small: baby_shop_14}, + banks: {normal: banks_24, small: banks_14}, + barbeque: {normal: barbeque_24, small: null}, + bars: {normal: bars_24, small: bars_14}, + beach: {normal: beach_24, small: beach_14}, + bench: {normal: bench_24, small: null}, + bike: {normal: bike_24, small: null}, + bike_rent: {normal: bike_rent_24, small: bike_rent_14}, + boat_station: {normal: boat_station_24, small: boat_station_14}, + bookstore: {normal: bookstore_24, small: bookstore_14}, + buddhism: {normal: buddhism_24, small: buddhism_14}, + building: {normal: building_24, small: null}, + bus: {normal: bus_24, small: null}, + cafe: {normal: cafe_24, small: cafe_14}, + car_park: {normal: car_park_24, small: null}, + catholic_church: {normal: catholic_church_24, small: catholic_church_14}, + cemetery: {normal: cemetery_24, small: cemetery_14}, + childrens_playground: {normal: childrens_playground_24, small: null}, + cinemas: {normal: cinemas_24, small: cinemas_14}, + clothes_shop: {normal: clothes_shop_24, small: clothes_shop_14}, + college: {normal: college_24, small: college_14}, + concert_hall: {normal: concert_hall_24, small: concert_hall_14}, + confectionary: {normal: confectionary_24, small: confectionary_14}, + currency_exchange: {normal: currency_exchange_24, small: currency_exchange_14}, + dental: {normal: dental_24, small: dental_14}, + driving_school: {normal: driving_school_24, small: driving_school_14}, + drugstores: {normal: drugstores_24, small: drugstores_14}, + dry_cleaning: {normal: dry_cleaning_24, small: dry_cleaning_14}, + equestrian: {normal: equestrian_24, small: equestrian_14}, + fast_food: {normal: fast_food_24, small: fast_food_14}, + film_studio: {normal: film_studio_24, small: film_studio_14}, + fire_station: {normal: fire_station_24, small: fire_station_14}, + fitness: {normal: fitness_24, small: fitness_14}, + flower_shop: {normal: flower_shop_24, small: flower_shop_14}, + forest: {normal: forest_24, small: forest_14}, + fountain: {normal: fountain_24, small: null}, + furniture_store: {normal: furniture_store_24, small: furniture_store_14}, + garden: {normal: garden_24, small: garden_14}, + gasstation: {normal: gasstation_24, small: gasstation_14}, + government: {normal: government_24, small: government_14}, + hairdressers: {normal: hairdressers_24, small: hairdressers_14}, + haulier: {normal: haulier_24, small: haulier_14}, + helicopter: {normal: helicopter_24, small: null}, + hospital: {normal: hospital_24, small: hospital_14}, + hotels: {normal: hotels_24, small: hotels_14}, + hypermarket: {normal: hypermarket_24, small: hypermarket_14}, + industrial_enterprise: {normal: industrial_enterprise_24, small: industrial_enterprise_14}, + information: {normal: information_24, small: information_14}, + kindergarten: {normal: kindergarten_24, small: kindergarten_14}, + landmark: {normal: landmark_24, small: landmark_14}, + laundry: {normal: laundry_24, small: laundry_14}, + library: {normal: library_24, small: library_14}, + malls: {normal: malls_24, small: malls_14}, + medicine: {normal: medicine_24, small: medicine_14}, + memorable_event: {normal: memorable_event_24, small: memorable_event_14}, + metro: {normal: metro_24, small: metro_14}, + metro_bus: {normal: metro_bus_24, small: metro_bus_14}, + metro_cable: {normal: metro_cable_24, small: metro_cable_14}, + metro_entrance: {normal: metro_entrance_24, small: null}, + metro_funicular: {normal: metro_funicular_24, small: metro_funicular_14}, + metro_light: {normal: metro_light_24, small: metro_light_14}, + metro_monorail: {normal: metro_monorail_24, small: metro_monorail_14}, + metro_tram: {normal: metro_tram_24, small: metro_tram_14}, + mobile_phones: {normal: mobile_phones_24, small: mobile_phones_14}, + money_coin: {normal: money_coin_24, small: null}, + monument: {normal: monument_24, small: null}, + mosque: {normal: mosque_24, small: mosque_14}, + mountain: {normal: mountain_24, small: null}, + museum: {normal: museum_24, small: museum_14}, + office: {normal: office_24, small: office_14}, + office_service: {normal: office_service_24, small: office_service_14}, + orthodox_church: {normal: orthodox_church_24, small: orthodox_church_14}, + park: {normal: park_24, small: park_14}, + pavilion: {normal: pavilion_24, small: null}, + pet_playground: {normal: pet_playground_24, small: null}, + petshop: {normal: petshop_24, small: petshop_14}, + photo: {normal: photo_24, small: photo_14}, + picnic: {normal: picnic_24, small: null}, + pier: {normal: pier_24, small: null}, + playground: {normal: playground_24, small: null}, + police: {normal: police_24, small: police_14}, + police_post: {normal: police_post_24, small: police_post_14}, + port: {normal: port_24, small: port_14}, + post_office: {normal: post_office_24, small: post_office_14}, + printing_services: {normal: printing_services_24, small: printing_services_14}, + protestant_church: {normal: protestant_church_24, small: protestant_church_14}, + racing: {normal: racing_24, small: racing_14}, + railway: {normal: railway_24, small: railway_14}, + railway_station: {normal: railway_station_24, small: railway_station_14}, + recycling: {normal: recycling_24, small: null}, + restaurants: {normal: restaurants_24, small: restaurants_14}, + rezervation: {normal: rezervation_24, small: rezervation_14}, + sanatorium: {normal: sanatorium_24, small: sanatorium_14}, + science: {normal: science_24, small: science_14}, + skating_rink: {normal: skating_rink_24, small: skating_rink_14}, + software: {normal: software_24, small: software_14}, + spa: {normal: spa_24, small: spa_14}, + sportcenter: {normal: sportcenter_24, small: sportcenter_14}, + spring: {normal: spring_24, small: null}, + stadium: {normal: stadium_24, small: stadium_14}, + supermarket: {normal: supermarket_24, small: supermarket_14}, + sushi: {normal: sushi_24, small: sushi_14}, + swimming_pool: {normal: swimming_pool_24, small: swimming_pool_14}, + synagogue: {normal: synagogue_24, small: synagogue_14}, + tailor: {normal: tailor_24, small: tailor_14}, + taxi: {normal: taxi_24, small: taxi_14}, + theatre: {normal: theatre_24, small: theatre_14}, + ticket_office: {normal: ticket_office_24, small: ticket_office_14}, + tire_fitting: {normal: tire_fitting_24, small: tire_fitting_14}, + tram: {normal: tram_24, small: null}, + trash: {normal: trash_24, small: null}, + travel_agency: {normal: travel_agency_24, small: travel_agency_14}, + viewpoint: {normal: viewpoint_24, small: null}, + waterfall: {normal: waterfall_24, small: null}, + wc: {normal: wc_24, small: null}, + zoo: {normal: zoo_24, small: zoo_14} +}; diff --git a/src/icons/index.ts b/src/icons/index.ts index 1de3256..6cb8ce8 100644 --- a/src/icons/index.ts +++ b/src/icons/index.ts @@ -1,339 +1,3 @@ -/** Don't edit manually. Generated by script: ./tools/icons/generate-imports.ts */ -import airport_14 from '../../static/icons/airport_14.svg'; -import airport_24 from '../../static/icons/airport_24.svg'; -import attraction_14 from '../../static/icons/attraction_14.svg'; -import attraction_24 from '../../static/icons/attraction_24.svg'; -import auto_14 from '../../static/icons/auto_14.svg'; -import auto_24 from '../../static/icons/auto_24.svg'; -import aviary_24 from '../../static/icons/aviary_24.svg'; -import baby_shop_14 from '../../static/icons/baby_shop_14.svg'; -import baby_shop_24 from '../../static/icons/baby_shop_24.svg'; -import banks_14 from '../../static/icons/banks_14.svg'; -import banks_24 from '../../static/icons/banks_24.svg'; -import barbeque_24 from '../../static/icons/barbeque_24.svg'; -import bars_14 from '../../static/icons/bars_14.svg'; -import bars_24 from '../../static/icons/bars_24.svg'; -import beach_14 from '../../static/icons/beach_14.svg'; -import beach_24 from '../../static/icons/beach_24.svg'; -import bench_24 from '../../static/icons/bench_24.svg'; -import bike_24 from '../../static/icons/bike_24.svg'; -import bike_rent_14 from '../../static/icons/bike_rent_14.svg'; -import bike_rent_24 from '../../static/icons/bike_rent_24.svg'; -import boat_station_14 from '../../static/icons/boat_station_14.svg'; -import boat_station_24 from '../../static/icons/boat_station_24.svg'; -import bookstore_14 from '../../static/icons/bookstore_14.svg'; -import bookstore_24 from '../../static/icons/bookstore_24.svg'; -import buddhism_14 from '../../static/icons/buddhism_14.svg'; -import buddhism_24 from '../../static/icons/buddhism_24.svg'; -import building_24 from '../../static/icons/building_24.svg'; -import bus_24 from '../../static/icons/bus_24.svg'; -import cafe_14 from '../../static/icons/cafe_14.svg'; -import cafe_24 from '../../static/icons/cafe_24.svg'; -import car_park_24 from '../../static/icons/car_park_24.svg'; -import catholic_church_14 from '../../static/icons/catholic_church_14.svg'; -import catholic_church_24 from '../../static/icons/catholic_church_24.svg'; -import cemetery_14 from '../../static/icons/cemetery_14.svg'; -import cemetery_24 from '../../static/icons/cemetery_24.svg'; -import childrens_playground_24 from '../../static/icons/childrens_playground_24.svg'; -import cinemas_14 from '../../static/icons/cinemas_14.svg'; -import cinemas_24 from '../../static/icons/cinemas_24.svg'; -import clothes_shop_14 from '../../static/icons/clothes_shop_14.svg'; -import clothes_shop_24 from '../../static/icons/clothes_shop_24.svg'; -import college_14 from '../../static/icons/college_14.svg'; -import college_24 from '../../static/icons/college_24.svg'; -import concert_hall_14 from '../../static/icons/concert_hall_14.svg'; -import concert_hall_24 from '../../static/icons/concert_hall_24.svg'; -import confectionary_14 from '../../static/icons/confectionary_14.svg'; -import confectionary_24 from '../../static/icons/confectionary_24.svg'; -import currency_exchange_14 from '../../static/icons/currency_exchange_14.svg'; -import currency_exchange_24 from '../../static/icons/currency_exchange_24.svg'; -import dental_14 from '../../static/icons/dental_14.svg'; -import dental_24 from '../../static/icons/dental_24.svg'; -import driving_school_14 from '../../static/icons/driving_school_14.svg'; -import driving_school_24 from '../../static/icons/driving_school_24.svg'; -import drugstores_14 from '../../static/icons/drugstores_14.svg'; -import drugstores_24 from '../../static/icons/drugstores_24.svg'; -import dry_cleaning_14 from '../../static/icons/dry_cleaning_14.svg'; -import dry_cleaning_24 from '../../static/icons/dry_cleaning_24.svg'; -import equestrian_14 from '../../static/icons/equestrian_14.svg'; -import equestrian_24 from '../../static/icons/equestrian_24.svg'; -import fast_food_14 from '../../static/icons/fast_food_14.svg'; -import fast_food_24 from '../../static/icons/fast_food_24.svg'; -import film_studio_14 from '../../static/icons/film_studio_14.svg'; -import film_studio_24 from '../../static/icons/film_studio_24.svg'; -import fire_station_14 from '../../static/icons/fire_station_14.svg'; -import fire_station_24 from '../../static/icons/fire_station_24.svg'; -import fitness_14 from '../../static/icons/fitness_14.svg'; -import fitness_24 from '../../static/icons/fitness_24.svg'; -import flower_shop_14 from '../../static/icons/flower_shop_14.svg'; -import flower_shop_24 from '../../static/icons/flower_shop_24.svg'; -import forest_14 from '../../static/icons/forest_14.svg'; -import forest_24 from '../../static/icons/forest_24.svg'; -import fountain_24 from '../../static/icons/fountain_24.svg'; -import furniture_store_14 from '../../static/icons/furniture_store_14.svg'; -import furniture_store_24 from '../../static/icons/furniture_store_24.svg'; -import garden_14 from '../../static/icons/garden_14.svg'; -import garden_24 from '../../static/icons/garden_24.svg'; -import gasstation_14 from '../../static/icons/gasstation_14.svg'; -import gasstation_24 from '../../static/icons/gasstation_24.svg'; -import government_14 from '../../static/icons/government_14.svg'; -import government_24 from '../../static/icons/government_24.svg'; -import hairdressers_14 from '../../static/icons/hairdressers_14.svg'; -import hairdressers_24 from '../../static/icons/hairdressers_24.svg'; -import haulier_14 from '../../static/icons/haulier_14.svg'; -import haulier_24 from '../../static/icons/haulier_24.svg'; -import helicopter_24 from '../../static/icons/helicopter_24.svg'; -import hospital_14 from '../../static/icons/hospital_14.svg'; -import hospital_24 from '../../static/icons/hospital_24.svg'; -import hotels_14 from '../../static/icons/hotels_14.svg'; -import hotels_24 from '../../static/icons/hotels_24.svg'; -import hypermarket_14 from '../../static/icons/hypermarket_14.svg'; -import hypermarket_24 from '../../static/icons/hypermarket_24.svg'; -import industrial_enterprise_14 from '../../static/icons/industrial_enterprise_14.svg'; -import industrial_enterprise_24 from '../../static/icons/industrial_enterprise_24.svg'; -import information_14 from '../../static/icons/information_14.svg'; -import information_24 from '../../static/icons/information_24.svg'; -import kindergarten_14 from '../../static/icons/kindergarten_14.svg'; -import kindergarten_24 from '../../static/icons/kindergarten_24.svg'; -import landmark_14 from '../../static/icons/landmark_14.svg'; -import landmark_24 from '../../static/icons/landmark_24.svg'; -import laundry_14 from '../../static/icons/laundry_14.svg'; -import laundry_24 from '../../static/icons/laundry_24.svg'; -import library_14 from '../../static/icons/library_14.svg'; -import library_24 from '../../static/icons/library_24.svg'; -import malls_14 from '../../static/icons/malls_14.svg'; -import malls_24 from '../../static/icons/malls_24.svg'; -import medicine_14 from '../../static/icons/medicine_14.svg'; -import medicine_24 from '../../static/icons/medicine_24.svg'; -import memorable_event_14 from '../../static/icons/memorable_event_14.svg'; -import memorable_event_24 from '../../static/icons/memorable_event_24.svg'; -import metro_14 from '../../static/icons/metro_14.svg'; -import metro_24 from '../../static/icons/metro_24.svg'; -import metro_bus_14 from '../../static/icons/metro_bus_14.svg'; -import metro_bus_24 from '../../static/icons/metro_bus_24.svg'; -import metro_cable_14 from '../../static/icons/metro_cable_14.svg'; -import metro_cable_24 from '../../static/icons/metro_cable_24.svg'; -import metro_entrance_24 from '../../static/icons/metro_entrance_24.svg'; -import metro_funicular_14 from '../../static/icons/metro_funicular_14.svg'; -import metro_funicular_24 from '../../static/icons/metro_funicular_24.svg'; -import metro_light_14 from '../../static/icons/metro_light_14.svg'; -import metro_light_24 from '../../static/icons/metro_light_24.svg'; -import metro_monorail_14 from '../../static/icons/metro_monorail_14.svg'; -import metro_monorail_24 from '../../static/icons/metro_monorail_24.svg'; -import metro_tram_14 from '../../static/icons/metro_tram_14.svg'; -import metro_tram_24 from '../../static/icons/metro_tram_24.svg'; -import mobile_phones_14 from '../../static/icons/mobile_phones_14.svg'; -import mobile_phones_24 from '../../static/icons/mobile_phones_24.svg'; -import money_coin_24 from '../../static/icons/money_coin_24.svg'; -import monument_24 from '../../static/icons/monument_24.svg'; -import mosque_14 from '../../static/icons/mosque_14.svg'; -import mosque_24 from '../../static/icons/mosque_24.svg'; -import mountain_24 from '../../static/icons/mountain_24.svg'; -import museum_14 from '../../static/icons/museum_14.svg'; -import museum_24 from '../../static/icons/museum_24.svg'; -import office_14 from '../../static/icons/office_14.svg'; -import office_24 from '../../static/icons/office_24.svg'; -import office_service_14 from '../../static/icons/office_service_14.svg'; -import office_service_24 from '../../static/icons/office_service_24.svg'; -import orthodox_church_14 from '../../static/icons/orthodox_church_14.svg'; -import orthodox_church_24 from '../../static/icons/orthodox_church_24.svg'; -import park_14 from '../../static/icons/park_14.svg'; -import park_24 from '../../static/icons/park_24.svg'; -import pavilion_24 from '../../static/icons/pavilion_24.svg'; -import pet_playground_24 from '../../static/icons/pet_playground_24.svg'; -import petshop_14 from '../../static/icons/petshop_14.svg'; -import petshop_24 from '../../static/icons/petshop_24.svg'; -import photo_14 from '../../static/icons/photo_14.svg'; -import photo_24 from '../../static/icons/photo_24.svg'; -import picnic_24 from '../../static/icons/picnic_24.svg'; -import pier_24 from '../../static/icons/pier_24.svg'; -import playground_24 from '../../static/icons/playground_24.svg'; -import police_14 from '../../static/icons/police_14.svg'; -import police_24 from '../../static/icons/police_24.svg'; -import police_post_14 from '../../static/icons/police_post_14.svg'; -import police_post_24 from '../../static/icons/police_post_24.svg'; -import port_14 from '../../static/icons/port_14.svg'; -import port_24 from '../../static/icons/port_24.svg'; -import post_office_14 from '../../static/icons/post_office_14.svg'; -import post_office_24 from '../../static/icons/post_office_24.svg'; -import printing_services_14 from '../../static/icons/printing_services_14.svg'; -import printing_services_24 from '../../static/icons/printing_services_24.svg'; -import protestant_church_14 from '../../static/icons/protestant_church_14.svg'; -import protestant_church_24 from '../../static/icons/protestant_church_24.svg'; -import racing_14 from '../../static/icons/racing_14.svg'; -import racing_24 from '../../static/icons/racing_24.svg'; -import railway_14 from '../../static/icons/railway_14.svg'; -import railway_24 from '../../static/icons/railway_24.svg'; -import railway_station_14 from '../../static/icons/railway_station_14.svg'; -import railway_station_24 from '../../static/icons/railway_station_24.svg'; -import recycling_24 from '../../static/icons/recycling_24.svg'; -import restaurants_14 from '../../static/icons/restaurants_14.svg'; -import restaurants_24 from '../../static/icons/restaurants_24.svg'; -import rezervation_14 from '../../static/icons/rezervation_14.svg'; -import rezervation_24 from '../../static/icons/rezervation_24.svg'; -import sanatorium_14 from '../../static/icons/sanatorium_14.svg'; -import sanatorium_24 from '../../static/icons/sanatorium_24.svg'; -import science_14 from '../../static/icons/science_14.svg'; -import science_24 from '../../static/icons/science_24.svg'; -import skating_rink_14 from '../../static/icons/skating_rink_14.svg'; -import skating_rink_24 from '../../static/icons/skating_rink_24.svg'; -import software_14 from '../../static/icons/software_14.svg'; -import software_24 from '../../static/icons/software_24.svg'; -import spa_14 from '../../static/icons/spa_14.svg'; -import spa_24 from '../../static/icons/spa_24.svg'; -import sportcenter_14 from '../../static/icons/sportcenter_14.svg'; -import sportcenter_24 from '../../static/icons/sportcenter_24.svg'; -import spring_24 from '../../static/icons/spring_24.svg'; -import stadium_14 from '../../static/icons/stadium_14.svg'; -import stadium_24 from '../../static/icons/stadium_24.svg'; -import supermarket_14 from '../../static/icons/supermarket_14.svg'; -import supermarket_24 from '../../static/icons/supermarket_24.svg'; -import sushi_14 from '../../static/icons/sushi_14.svg'; -import sushi_24 from '../../static/icons/sushi_24.svg'; -import swimming_pool_14 from '../../static/icons/swimming_pool_14.svg'; -import swimming_pool_24 from '../../static/icons/swimming_pool_24.svg'; -import synagogue_14 from '../../static/icons/synagogue_14.svg'; -import synagogue_24 from '../../static/icons/synagogue_24.svg'; -import tailor_14 from '../../static/icons/tailor_14.svg'; -import tailor_24 from '../../static/icons/tailor_24.svg'; -import taxi_14 from '../../static/icons/taxi_14.svg'; -import taxi_24 from '../../static/icons/taxi_24.svg'; -import theatre_14 from '../../static/icons/theatre_14.svg'; -import theatre_24 from '../../static/icons/theatre_24.svg'; -import ticket_office_14 from '../../static/icons/ticket_office_14.svg'; -import ticket_office_24 from '../../static/icons/ticket_office_24.svg'; -import tire_fitting_14 from '../../static/icons/tire_fitting_14.svg'; -import tire_fitting_24 from '../../static/icons/tire_fitting_24.svg'; -import tram_24 from '../../static/icons/tram_24.svg'; -import trash_24 from '../../static/icons/trash_24.svg'; -import travel_agency_14 from '../../static/icons/travel_agency_14.svg'; -import travel_agency_24 from '../../static/icons/travel_agency_24.svg'; -import viewpoint_24 from '../../static/icons/viewpoint_24.svg'; -import waterfall_24 from '../../static/icons/waterfall_24.svg'; -import wc_24 from '../../static/icons/wc_24.svg'; -import zoo_14 from '../../static/icons/zoo_14.svg'; -import zoo_24 from '../../static/icons/zoo_24.svg'; - -import type {Icons} from './types'; -export const icons: Icons = { - airport: {normal: airport_24, small: airport_14}, - attraction: {normal: attraction_24, small: attraction_14}, - auto: {normal: auto_24, small: auto_14}, - aviary: {normal: aviary_24, small: null}, - baby_shop: {normal: baby_shop_24, small: baby_shop_14}, - banks: {normal: banks_24, small: banks_14}, - barbeque: {normal: barbeque_24, small: null}, - bars: {normal: bars_24, small: bars_14}, - beach: {normal: beach_24, small: beach_14}, - bench: {normal: bench_24, small: null}, - bike: {normal: bike_24, small: null}, - bike_rent: {normal: bike_rent_24, small: bike_rent_14}, - boat_station: {normal: boat_station_24, small: boat_station_14}, - bookstore: {normal: bookstore_24, small: bookstore_14}, - buddhism: {normal: buddhism_24, small: buddhism_14}, - building: {normal: building_24, small: null}, - bus: {normal: bus_24, small: null}, - cafe: {normal: cafe_24, small: cafe_14}, - car_park: {normal: car_park_24, small: null}, - catholic_church: {normal: catholic_church_24, small: catholic_church_14}, - cemetery: {normal: cemetery_24, small: cemetery_14}, - childrens_playground: {normal: childrens_playground_24, small: null}, - cinemas: {normal: cinemas_24, small: cinemas_14}, - clothes_shop: {normal: clothes_shop_24, small: clothes_shop_14}, - college: {normal: college_24, small: college_14}, - concert_hall: {normal: concert_hall_24, small: concert_hall_14}, - confectionary: {normal: confectionary_24, small: confectionary_14}, - currency_exchange: {normal: currency_exchange_24, small: currency_exchange_14}, - dental: {normal: dental_24, small: dental_14}, - driving_school: {normal: driving_school_24, small: driving_school_14}, - drugstores: {normal: drugstores_24, small: drugstores_14}, - dry_cleaning: {normal: dry_cleaning_24, small: dry_cleaning_14}, - equestrian: {normal: equestrian_24, small: equestrian_14}, - fast_food: {normal: fast_food_24, small: fast_food_14}, - film_studio: {normal: film_studio_24, small: film_studio_14}, - fire_station: {normal: fire_station_24, small: fire_station_14}, - fitness: {normal: fitness_24, small: fitness_14}, - flower_shop: {normal: flower_shop_24, small: flower_shop_14}, - forest: {normal: forest_24, small: forest_14}, - fountain: {normal: fountain_24, small: null}, - furniture_store: {normal: furniture_store_24, small: furniture_store_14}, - garden: {normal: garden_24, small: garden_14}, - gasstation: {normal: gasstation_24, small: gasstation_14}, - government: {normal: government_24, small: government_14}, - hairdressers: {normal: hairdressers_24, small: hairdressers_14}, - haulier: {normal: haulier_24, small: haulier_14}, - helicopter: {normal: helicopter_24, small: null}, - hospital: {normal: hospital_24, small: hospital_14}, - hotels: {normal: hotels_24, small: hotels_14}, - hypermarket: {normal: hypermarket_24, small: hypermarket_14}, - industrial_enterprise: {normal: industrial_enterprise_24, small: industrial_enterprise_14}, - information: {normal: information_24, small: information_14}, - kindergarten: {normal: kindergarten_24, small: kindergarten_14}, - landmark: {normal: landmark_24, small: landmark_14}, - laundry: {normal: laundry_24, small: laundry_14}, - library: {normal: library_24, small: library_14}, - malls: {normal: malls_24, small: malls_14}, - medicine: {normal: medicine_24, small: medicine_14}, - memorable_event: {normal: memorable_event_24, small: memorable_event_14}, - metro: {normal: metro_24, small: metro_14}, - metro_bus: {normal: metro_bus_24, small: metro_bus_14}, - metro_cable: {normal: metro_cable_24, small: metro_cable_14}, - metro_entrance: {normal: metro_entrance_24, small: null}, - metro_funicular: {normal: metro_funicular_24, small: metro_funicular_14}, - metro_light: {normal: metro_light_24, small: metro_light_14}, - metro_monorail: {normal: metro_monorail_24, small: metro_monorail_14}, - metro_tram: {normal: metro_tram_24, small: metro_tram_14}, - mobile_phones: {normal: mobile_phones_24, small: mobile_phones_14}, - money_coin: {normal: money_coin_24, small: null}, - monument: {normal: monument_24, small: null}, - mosque: {normal: mosque_24, small: mosque_14}, - mountain: {normal: mountain_24, small: null}, - museum: {normal: museum_24, small: museum_14}, - office: {normal: office_24, small: office_14}, - office_service: {normal: office_service_24, small: office_service_14}, - orthodox_church: {normal: orthodox_church_24, small: orthodox_church_14}, - park: {normal: park_24, small: park_14}, - pavilion: {normal: pavilion_24, small: null}, - pet_playground: {normal: pet_playground_24, small: null}, - petshop: {normal: petshop_24, small: petshop_14}, - photo: {normal: photo_24, small: photo_14}, - picnic: {normal: picnic_24, small: null}, - pier: {normal: pier_24, small: null}, - playground: {normal: playground_24, small: null}, - police: {normal: police_24, small: police_14}, - police_post: {normal: police_post_24, small: police_post_14}, - port: {normal: port_24, small: port_14}, - post_office: {normal: post_office_24, small: post_office_14}, - printing_services: {normal: printing_services_24, small: printing_services_14}, - protestant_church: {normal: protestant_church_24, small: protestant_church_14}, - racing: {normal: racing_24, small: racing_14}, - railway: {normal: railway_24, small: railway_14}, - railway_station: {normal: railway_station_24, small: railway_station_14}, - recycling: {normal: recycling_24, small: null}, - restaurants: {normal: restaurants_24, small: restaurants_14}, - rezervation: {normal: rezervation_24, small: rezervation_14}, - sanatorium: {normal: sanatorium_24, small: sanatorium_14}, - science: {normal: science_24, small: science_14}, - skating_rink: {normal: skating_rink_24, small: skating_rink_14}, - software: {normal: software_24, small: software_14}, - spa: {normal: spa_24, small: spa_14}, - sportcenter: {normal: sportcenter_24, small: sportcenter_14}, - spring: {normal: spring_24, small: null}, - stadium: {normal: stadium_24, small: stadium_14}, - supermarket: {normal: supermarket_24, small: supermarket_14}, - sushi: {normal: sushi_24, small: sushi_14}, - swimming_pool: {normal: swimming_pool_24, small: swimming_pool_14}, - synagogue: {normal: synagogue_24, small: synagogue_14}, - tailor: {normal: tailor_24, small: tailor_14}, - taxi: {normal: taxi_24, small: taxi_14}, - theatre: {normal: theatre_24, small: theatre_14}, - ticket_office: {normal: ticket_office_24, small: ticket_office_14}, - tire_fitting: {normal: tire_fitting_24, small: tire_fitting_14}, - tram: {normal: tram_24, small: null}, - trash: {normal: trash_24, small: null}, - travel_agency: {normal: travel_agency_24, small: travel_agency_14}, - viewpoint: {normal: viewpoint_24, small: null}, - waterfall: {normal: waterfall_24, small: null}, - wc: {normal: wc_24, small: null}, - zoo: {normal: zoo_24, small: zoo_14} -}; +export {IconColor, iconColors} from './icon-colors'; +export {IconName} from './icon-name'; +export {icons} from './icons'; diff --git a/tools/icons/fetch-colors.ts b/tools/icons/fetch-colors.ts new file mode 100644 index 0000000..9357f2f --- /dev/null +++ b/tools/icons/fetch-colors.ts @@ -0,0 +1,90 @@ +import {Color, Api as FigmaApi, Node} from 'figma-api'; + +/** The name of the canvas in the file from which the colors will be loaded */ +const CANVAS_NAME = 'colors'; +const PALETTE_NAME = 'rubrics'; + +const PRIMARY_DAY = 'maps_pin_primary_day'; +const PRIMARY_NIGHT = 'maps_pin_primary_night'; +const GLYPH_DAY = 'maps_pin_secondary_day'; +const GLYPH_NIGHT = 'maps_pin_secondary_night'; + +type RubricColors = { + rubricName: string; + primaryDay: string; + primaryNight: string; +}; + +export type MarkerColors = { + day: string; + night: string; +}; + +export type FetchedColors = { + colors: MarkerColors[]; + glyphDay: string; + glyphNight: string; +}; + +export const fetchFigmaColors = async (): Promise => { + const personalAccessToken: string | undefined = process.env.FIGMA_API_TOKEN; + const fileId: string | undefined = process.env.FIGMA_FILE_ID; + + if (!personalAccessToken) { + throw new Error('No Figma access token found in environment variable FIGMA_API_TOKEN'); + } + if (!fileId) { + throw new Error('No Figma file id found in environment variable FIGMA_FILE_ID'); + } + + const api = new FigmaApi({personalAccessToken}); + const file = await api.getFile(fileId); + const canvas = file.document.children.find((child) => child.name === CANVAS_NAME) as Node<'CANVAS'>; + const rubricsPalette = canvas.children.find((child) => child.name === PALETTE_NAME) as Node<'GROUP'>; + const rubrics = rubricsPalette.children.filter(({name}) => !name.includes('fallback')) as Node<'GROUP'>[]; + let glyphDay: string = ''; + let glyphNight: string = ''; + const rubricColors = rubrics.reduce((rubricColors, {name, children}) => { + const colors = children as Node<'RECTANGLE'>[]; + + const primaryDay = colors.find((color) => color.name === PRIMARY_DAY)?.fills[0].color; + const primaryNight = colors.find((color) => color.name === PRIMARY_NIGHT)?.fills[0].color; + + if (glyphDay.length === 0) { + const glyphDayColor = colors.find((color) => color.name === GLYPH_DAY)?.fills[0].color; + glyphDay = glyphDayColor ? rgbaToHex(glyphDayColor) : glyphDay; + } + if (glyphNight.length === 0) { + const glyphNightColor = colors.find((color) => color.name === GLYPH_NIGHT)?.fills[0].color; + glyphNight = glyphNightColor ? rgbaToHex(glyphNightColor) : glyphNight; + } + + if (primaryDay === undefined || primaryNight === undefined) { + return rubricColors; + } + + return rubricColors.concat({ + rubricName: name, + primaryDay: rgbaToHex(primaryDay), + primaryNight: rgbaToHex(primaryNight) + }); + }, [] as RubricColors[]); + + const dayNightColorsMap = rubricColors.reduce((colorsMap, {primaryDay, primaryNight}) => { + colorsMap.set(primaryDay, primaryNight); + return colorsMap; + }, new Map()); + + const colors = Array.from(dayNightColorsMap.entries()).map(([day, night]) => ({day, night})); + return {colors, glyphDay, glyphNight}; +}; + +const rgbaToHex = (rgba: Color): string => { + const r255 = Math.floor(rgba.r * 255); + const g255 = Math.floor(rgba.g * 255); + const b255 = Math.floor(rgba.b * 255); + const a255 = Math.floor(rgba.a * 255); + return '#' + componentToHex(r255) + componentToHex(g255) + componentToHex(b255) + componentToHex(a255); +}; + +const componentToHex = (c: number): string => c.toString(16).padStart(2, '0'); diff --git a/tools/icons/generate-colors.ts b/tools/icons/generate-colors.ts new file mode 100644 index 0000000..0f7cd8f --- /dev/null +++ b/tools/icons/generate-colors.ts @@ -0,0 +1,24 @@ +import fs from 'fs/promises'; +import path from 'path'; +import {prettierFormat} from '../utils/prettier-format'; +import {FetchedColors} from './fetch-colors'; +import {SRC_ICONS_PATH} from './paths'; + +/** Human-readable names for colors. They are selected manually */ +const colorNames = ['darkgray', 'pink', 'seawave', 'orchid', 'steelblue', 'bluebell', 'ceil', 'green', 'darksalmon']; + +export const generateColorsFile = async (fetchedColors: FetchedColors) => { + const colorsObjectValues = fetchedColors.colors.map(({day, night}, i) => { + return `${colorNames[i]}:{day:'${day}',night:'${night}'},`; + }); + const content = ` + /** Don't edit manually only color names. Generated by script: ./tools/icons/generate-colors.ts */ + export const iconColors = { + ${colorsObjectValues.join('\n')} + } as const; + export const glyphColors = {day:'${fetchedColors.glyphDay}',night:'${fetchedColors.glyphNight}'} as const; + export type IconColor = keyof typeof iconColors`; + + const formattedContent = await prettierFormat(content, 'typescript'); + await fs.writeFile(path.join(SRC_ICONS_PATH, 'icon-colors.ts'), formattedContent); +}; diff --git a/tools/icons/generate-docs.ts b/tools/icons/generate-docs.ts index 2690a88..5cd8286 100644 --- a/tools/icons/generate-docs.ts +++ b/tools/icons/generate-docs.ts @@ -31,5 +31,5 @@ export const generateIconsDocsList = async (iconNames: string[]) => { }) .join('\n'); const formattedContent = await prettierFormat(content, 'markdown'); - await fs.writeFile(DOCS_FILE_PATH, formattedContent); + await fs.writeFile(path.join(DOCS_FILE_PATH, 'icons.md'), formattedContent); }; diff --git a/tools/icons/generate-imports.ts b/tools/icons/generate-imports.ts index 43680b6..78934b2 100644 --- a/tools/icons/generate-imports.ts +++ b/tools/icons/generate-imports.ts @@ -28,5 +28,5 @@ export const generateImports = async (iconsDescription: IconDescription[], iconN ${iconNamesObject} }`; const formattedContent = await prettierFormat(fileContent, 'typescript'); - await fs.writeFile(path.join(SRC_ICONS_PATH, 'index.ts'), formattedContent); + await fs.writeFile(path.join(SRC_ICONS_PATH, 'icons.ts'), formattedContent); }; diff --git a/tools/icons/paths.ts b/tools/icons/paths.ts index e24d337..8a7d4b6 100644 --- a/tools/icons/paths.ts +++ b/tools/icons/paths.ts @@ -3,4 +3,4 @@ import path from 'path'; export const BASE_DIR = path.join(__dirname, '../../'); export const STATIC_ICONS_PATH = path.join(BASE_DIR, 'static/icons'); export const SRC_ICONS_PATH = path.join(BASE_DIR, 'src/icons'); -export const DOCS_FILE_PATH = path.join(BASE_DIR, 'docs/icons.md'); +export const DOCS_FILE_PATH = path.join(BASE_DIR, 'docs'); diff --git a/tools/scripts/sync-colors.ts b/tools/scripts/sync-colors.ts new file mode 100644 index 0000000..63b8530 --- /dev/null +++ b/tools/scripts/sync-colors.ts @@ -0,0 +1,24 @@ +import {createSpinner} from 'nanospinner'; +import {fetchFigmaColors} from '../icons/fetch-colors'; +import {generateColorsFile} from '../icons/generate-colors'; + +async function main() { + const spinner = createSpinner(); + try { + spinner.start({text: 'Start sync colors'}); + + spinner.update({text: 'Getting information about colors from Figma'}); + const fetchedColors = await fetchFigmaColors(); + + spinner.update({text: 'Updating the file with colors'}); + await generateColorsFile(fetchedColors); + + spinner.success({text: 'Colors are successfully synchronized'}); + } catch (error) { + spinner.error({text: error.message || error.toString()}); + } +} + +main().catch(() => { + process.exit(1); +}); From 21d42ddd07b3d74b168b512530dd5562d5593c8f Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Wed, 3 Apr 2024 14:41:23 +0300 Subject: [PATCH 19/43] add sync script --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index b9beab8..5e63dbc 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "start": "webpack serve", "bump": "npm version prerelease --preid=beta --no-git-tag-version && npm run bump:git", "bump:git": "git add --all && git commit -m \"New version $npm_package_version\" && git tag $npm_package_version && git push --tags origin HEAD:main", + "sync-figma":"npm run sync-icons && npm run sync-colors", "sync-icons": "node -r dotenv/config -r ts-node/register ./tools/scripts/sync-icons.ts", "sync-colors": "node -r dotenv/config -r ts-node/register ./tools/scripts/sync-colors.ts" }, From 4ca5d98d3c61bcadef44a2492b621e839647bbe1 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Wed, 3 Apr 2024 16:21:11 +0300 Subject: [PATCH 20/43] color props --- package.json | 2 +- src/MMapDefaultMarker/index.css | 5 ++--- src/MMapDefaultMarker/index.ts | 25 ++++++++++++++++--------- src/MMapDefaultMarker/pin.svg | 2 +- src/icons/index.ts | 2 +- 5 files changed, 21 insertions(+), 15 deletions(-) diff --git a/package.json b/package.json index 5e63dbc..4e3c9db 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,7 @@ "start": "webpack serve", "bump": "npm version prerelease --preid=beta --no-git-tag-version && npm run bump:git", "bump:git": "git add --all && git commit -m \"New version $npm_package_version\" && git tag $npm_package_version && git push --tags origin HEAD:main", - "sync-figma":"npm run sync-icons && npm run sync-colors", + "sync-figma": "npm run sync-icons && npm run sync-colors", "sync-icons": "node -r dotenv/config -r ts-node/register ./tools/scripts/sync-icons.ts", "sync-colors": "node -r dotenv/config -r ts-node/register ./tools/scripts/sync-colors.ts" }, diff --git a/src/MMapDefaultMarker/index.css b/src/MMapDefaultMarker/index.css index 510c02e..915ada3 100644 --- a/src/MMapDefaultMarker/index.css +++ b/src/MMapDefaultMarker/index.css @@ -2,7 +2,7 @@ box-sizing: border-box; height: 8px; width: 8px; - border: 2px solid #f8f8f8; + border: 2px solid; position: absolute; transform: translate(-50%, -50%); border-radius: 50%; @@ -14,7 +14,6 @@ } .mappable--icon { - color: #fffffffc; position: absolute; - transform: translate(calc(-24px - 10px),10px); + transform: translate(calc(-24px - 10px), 10px); } diff --git a/src/MMapDefaultMarker/index.ts b/src/MMapDefaultMarker/index.ts index b20bae8..c4f0e80 100644 --- a/src/MMapDefaultMarker/index.ts +++ b/src/MMapDefaultMarker/index.ts @@ -1,12 +1,11 @@ import {MMapMarker, MMapMarkerProps} from '@mappable-world/mappable-types'; -import {IconName} from '../icons/icon-name'; -import {icons} from '../icons'; -import pin from './pin.svg'; +import {IconColor, IconName, iconColors, icons, glyphColors} from '../icons'; import './index.css'; +import pin from './pin.svg'; export type MMapDefaultMarkerProps = MMapMarkerProps & { name: IconName; - color: string; + color: IconColor; }; export class MMapDefaultMarker extends mappable.MMapComplexEntity { @@ -14,19 +13,19 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity): void { if (propsDiff.color !== undefined) { - this._markerElement.style.color = this._props.color; - this._markerElement.style.backgroundColor = this._props.color; + this._color = iconColors[this._props.color]; + this._updateTheme(); } if (propsDiff.name !== undefined) { this._icon.innerHTML = icons[propsDiff.name].normal; } this._marker.update(this._props); } + + private _updateTheme() { + this._markerElement.style.color = this._color.day; + this._markerElement.style.backgroundColor = this._color.day; + this._markerElement.style.borderColor = '#f8f8f8'; + this._icon.style.color = glyphColors.day; + } } diff --git a/src/MMapDefaultMarker/pin.svg b/src/MMapDefaultMarker/pin.svg index f0dcd75..5d9a1b1 100644 --- a/src/MMapDefaultMarker/pin.svg +++ b/src/MMapDefaultMarker/pin.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/index.ts b/src/icons/index.ts index 6cb8ce8..874aabd 100644 --- a/src/icons/index.ts +++ b/src/icons/index.ts @@ -1,3 +1,3 @@ -export {IconColor, iconColors} from './icon-colors'; +export {IconColor, iconColors, glyphColors} from './icon-colors'; export {IconName} from './icon-name'; export {icons} from './icons'; From f8444595f594aa387602bcd8daf49d9d08f5c2d6 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Thu, 4 Apr 2024 12:25:48 +0300 Subject: [PATCH 21/43] fix examples tsconfig --- example/tsconfig.json | 5 +++-- tsconfig.json | 1 + 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/example/tsconfig.json b/example/tsconfig.json index 2a6357c..28b0012 100644 --- a/example/tsconfig.json +++ b/example/tsconfig.json @@ -2,8 +2,9 @@ "extends": "../tsconfig.json", "compilerOptions": { "strict": false, + "moduleResolution": "Node16", "rootDirs": ["./", "../"], - "types": ["./types.d.ts", "../types/index.d.ts"] + "types": ["../types/index.d.ts"] }, "include": ["./**/*.ts", "./**/*.tsx"] -} \ No newline at end of file +} diff --git a/tsconfig.json b/tsconfig.json index c9fd3e0..93b76eb 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,6 +1,7 @@ { "extends": "@mappable-world/mappable-cli", "compilerOptions": { + "moduleResolution": "Node16", "lib": ["dom", "dom.iterable", "esnext"], "moduleResolution": "Node16", "typeRoots": ["./node_modules/@types", "./node_modules/@mappable-world", "./types"] From b92d1c5863f6ef803fdd13c7723dd2e7506d9285 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Thu, 4 Apr 2024 12:36:26 +0300 Subject: [PATCH 22/43] marker example --- example/default-markers/common.css | 0 example/default-markers/common.ts | 9 ++++++ example/default-markers/react/index.html | 37 ++++++++++++++++++++++ example/default-markers/react/index.tsx | 34 ++++++++++++++++++++ example/default-markers/vanilla/index.html | 35 ++++++++++++++++++++ example/default-markers/vanilla/index.ts | 18 +++++++++++ example/default-markers/vue/index.html | 36 +++++++++++++++++++++ example/default-markers/vue/index.ts | 35 ++++++++++++++++++++ 8 files changed, 204 insertions(+) create mode 100644 example/default-markers/common.css create mode 100644 example/default-markers/common.ts create mode 100644 example/default-markers/react/index.html create mode 100644 example/default-markers/react/index.tsx create mode 100644 example/default-markers/vanilla/index.html create mode 100644 example/default-markers/vanilla/index.ts create mode 100644 example/default-markers/vue/index.html create mode 100644 example/default-markers/vue/index.ts diff --git a/example/default-markers/common.css b/example/default-markers/common.css new file mode 100644 index 0000000..e69de29 diff --git a/example/default-markers/common.ts b/example/default-markers/common.ts new file mode 100644 index 0000000..c7b47d2 --- /dev/null +++ b/example/default-markers/common.ts @@ -0,0 +1,9 @@ +import type {MMapLocationRequest, LngLatBounds, LngLat} from '@mappable-world/mappable-types'; + +const BOUNDS: LngLatBounds = [ + [54.58311, 25.9985], + [56.30248, 24.47889] +]; + +export const LOCATION: MMapLocationRequest = {bounds: BOUNDS}; +export const MARKER_LOCATION: LngLat = [(BOUNDS[0][0] + BOUNDS[1][0]) / 2, (BOUNDS[0][1] + BOUNDS[1][1]) / 2]; diff --git a/example/default-markers/react/index.html b/example/default-markers/react/index.html new file mode 100644 index 0000000..4183912 --- /dev/null +++ b/example/default-markers/react/index.html @@ -0,0 +1,37 @@ + + + + React example mappable-default-ui-theme + + + + + + + + + + + + + + + +
+ + diff --git a/example/default-markers/react/index.tsx b/example/default-markers/react/index.tsx new file mode 100644 index 0000000..5466820 --- /dev/null +++ b/example/default-markers/react/index.tsx @@ -0,0 +1,34 @@ +import {LOCATION, MARKER_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} = reactify.module(mappable); + + const {useState} = React; + + const {MMapDefaultMarker} = reactify.module(await mappable.import('@mappable-world/mappable-default-ui-theme')); + + ReactDOM.render( + + + , + document.getElementById('app') + ); + + function App() { + const [location] = useState(LOCATION); + + return ( + (map = x)}> + + + + + ); + } +} diff --git a/example/default-markers/vanilla/index.html b/example/default-markers/vanilla/index.html new file mode 100644 index 0000000..730390e --- /dev/null +++ b/example/default-markers/vanilla/index.html @@ -0,0 +1,35 @@ + + + + Vanilla example mappable-default-ui-theme + + + + + + + + + + + + + +
+ + diff --git a/example/default-markers/vanilla/index.ts b/example/default-markers/vanilla/index.ts new file mode 100644 index 0000000..ea4b0d6 --- /dev/null +++ b/example/default-markers/vanilla/index.ts @@ -0,0 +1,18 @@ +import {LOCATION, MARKER_LOCATION} from '../common'; +window.map = null; + +main(); +async function main() { + await mappable.ready; + const {MMap, MMapDefaultSchemeLayer, MMapDefaultFeaturesLayer} = mappable; + + const {MMapDefaultMarker} = 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({})); + + const defaultMarker = new MMapDefaultMarker({name: 'building', color: 'bluebell', coordinates: MARKER_LOCATION}); + map.addChild(defaultMarker); +} diff --git a/example/default-markers/vue/index.html b/example/default-markers/vue/index.html new file mode 100644 index 0000000..85eeebd --- /dev/null +++ b/example/default-markers/vue/index.html @@ -0,0 +1,36 @@ + + + + Vue example mappable-default-ui-theme + + + + + + + + + + + + + + +
+ + diff --git a/example/default-markers/vue/index.ts b/example/default-markers/vue/index.ts new file mode 100644 index 0000000..df10acd --- /dev/null +++ b/example/default-markers/vue/index.ts @@ -0,0 +1,35 @@ +import {LOCATION, MARKER_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} = vuefy.module(mappable); + + const {MMapDefaultMarker} = vuefy.module(await mappable.import('@mappable-world/mappable-default-ui-theme')); + + const app = Vue.createApp({ + components: { + MMap, + MMapDefaultSchemeLayer, + MMapDefaultFeaturesLayer, + MMapDefaultMarker + }, + setup() { + const refMap = (ref) => { + window.map = ref?.entity; + }; + return {LOCATION, refMap, MARKER_LOCATION}; + }, + template: ` + + + + + ` + }); + app.mount('#app'); +} From fa54cee8070e42e1598e2f961a4f53e64ee5de8d Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Thu, 4 Apr 2024 12:50:50 +0300 Subject: [PATCH 23/43] optional props --- example/default-markers/react/index.tsx | 2 +- example/default-markers/vanilla/index.ts | 6 +++++- example/default-markers/vue/index.ts | 2 +- src/MMapDefaultMarker/index.ts | 25 +++++++++++++++++------- 4 files changed, 25 insertions(+), 10 deletions(-) diff --git a/example/default-markers/react/index.tsx b/example/default-markers/react/index.tsx index 5466820..e4df753 100644 --- a/example/default-markers/react/index.tsx +++ b/example/default-markers/react/index.tsx @@ -27,7 +27,7 @@ async function main() { (map = x)}> - + ); } diff --git a/example/default-markers/vanilla/index.ts b/example/default-markers/vanilla/index.ts index ea4b0d6..9c2c602 100644 --- a/example/default-markers/vanilla/index.ts +++ b/example/default-markers/vanilla/index.ts @@ -13,6 +13,10 @@ async function main() { map.addChild(new MMapDefaultSchemeLayer({})); map.addChild(new MMapDefaultFeaturesLayer({})); - const defaultMarker = new MMapDefaultMarker({name: 'building', color: 'bluebell', coordinates: MARKER_LOCATION}); + const defaultMarker = new MMapDefaultMarker({ + iconName: 'building', + color: 'bluebell', + coordinates: MARKER_LOCATION + }); map.addChild(defaultMarker); } diff --git a/example/default-markers/vue/index.ts b/example/default-markers/vue/index.ts index df10acd..63eece1 100644 --- a/example/default-markers/vue/index.ts +++ b/example/default-markers/vue/index.ts @@ -28,7 +28,7 @@ async function main() { - + ` }); app.mount('#app'); diff --git a/src/MMapDefaultMarker/index.ts b/src/MMapDefaultMarker/index.ts index c4f0e80..713f0fd 100644 --- a/src/MMapDefaultMarker/index.ts +++ b/src/MMapDefaultMarker/index.ts @@ -4,11 +4,16 @@ import './index.css'; import pin from './pin.svg'; export type MMapDefaultMarkerProps = MMapMarkerProps & { - name: IconName; - color: IconColor; + iconName?: IconName; + color?: IconColor; }; -export class MMapDefaultMarker extends mappable.MMapComplexEntity { +const defaultProps = Object.freeze({color: 'darkgray'}); +type DefaultProps = typeof defaultProps; + +export class MMapDefaultMarker extends mappable.MMapComplexEntity { + static defaultProps = defaultProps; + private _marker: MMapMarker; private _markerElement: HTMLElement; private _pin: HTMLElement; @@ -19,6 +24,10 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity Date: Thu, 4 Apr 2024 15:51:44 +0300 Subject: [PATCH 24/43] custom color --- src/MMapDefaultMarker/index.ts | 36 ++++++++++++++++++++++++++-------- 1 file changed, 28 insertions(+), 8 deletions(-) diff --git a/src/MMapDefaultMarker/index.ts b/src/MMapDefaultMarker/index.ts index 713f0fd..9a4273c 100644 --- a/src/MMapDefaultMarker/index.ts +++ b/src/MMapDefaultMarker/index.ts @@ -3,9 +3,12 @@ import {IconColor, IconName, iconColors, icons, glyphColors} from '../icons'; import './index.css'; import pin from './pin.svg'; +export type ThemesColor = {day: string; night: string}; +export type MarkerColorProps = IconColor | ThemesColor; + export type MMapDefaultMarkerProps = MMapMarkerProps & { iconName?: IconName; - color?: IconColor; + color?: MarkerColorProps; }; const defaultProps = Object.freeze({color: 'darkgray'}); @@ -18,7 +21,7 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity): void { if (propsDiff.color !== undefined) { - this._color = iconColors[this._props.color]; + this._color = this._getColor(); this._updateTheme(); } - this._icon.innerHTML = this._props.iconName !== undefined ? icons[this._props.iconName].normal : ''; + this._icon.innerHTML = this._getIcon(); this._marker.update(this._props); } @@ -69,4 +70,23 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity Date: Thu, 4 Apr 2024 15:59:20 +0300 Subject: [PATCH 25/43] add fallback icon --- docs/icons.md | 1 + example/default-markers/react/index.tsx | 2 +- example/default-markers/vanilla/index.ts | 2 +- example/default-markers/vue/index.ts | 2 +- src/icons/icon-name.ts | 1 + src/icons/icons.ts | 3 +++ tools/icons/fetch-icons.ts | 4 +++- 7 files changed, 11 insertions(+), 4 deletions(-) diff --git a/docs/icons.md b/docs/icons.md index 28f5b74..5bfafd7 100644 --- a/docs/icons.md +++ b/docs/icons.md @@ -37,6 +37,7 @@ | drugstores | ![drugstores](../static/icons/drugstores_24.svg) | ![drugstores](../static/icons/drugstores_14.svg) | | dry_cleaning | ![dry_cleaning](../static/icons/dry_cleaning_24.svg) | ![dry_cleaning](../static/icons/dry_cleaning_14.svg) | | equestrian | ![equestrian](../static/icons/equestrian_24.svg) | ![equestrian](../static/icons/equestrian_14.svg) | +| fallback | ![fallback](../static/icons/fallback_24.svg) | ![fallback](../static/icons/fallback_14.svg) | | fast_food | ![fast_food](../static/icons/fast_food_24.svg) | ![fast_food](../static/icons/fast_food_14.svg) | | film_studio | ![film_studio](../static/icons/film_studio_24.svg) | ![film_studio](../static/icons/film_studio_14.svg) | | fire_station | ![fire_station](../static/icons/fire_station_24.svg) | ![fire_station](../static/icons/fire_station_14.svg) | diff --git a/example/default-markers/react/index.tsx b/example/default-markers/react/index.tsx index e4df753..dd888f5 100644 --- a/example/default-markers/react/index.tsx +++ b/example/default-markers/react/index.tsx @@ -27,7 +27,7 @@ async function main() { (map = x)}> - + ); } diff --git a/example/default-markers/vanilla/index.ts b/example/default-markers/vanilla/index.ts index 9c2c602..47e0678 100644 --- a/example/default-markers/vanilla/index.ts +++ b/example/default-markers/vanilla/index.ts @@ -14,7 +14,7 @@ async function main() { map.addChild(new MMapDefaultFeaturesLayer({})); const defaultMarker = new MMapDefaultMarker({ - iconName: 'building', + iconName: 'fallback', color: 'bluebell', coordinates: MARKER_LOCATION }); diff --git a/example/default-markers/vue/index.ts b/example/default-markers/vue/index.ts index 63eece1..70b6cab 100644 --- a/example/default-markers/vue/index.ts +++ b/example/default-markers/vue/index.ts @@ -28,7 +28,7 @@ async function main() { - + ` }); app.mount('#app'); diff --git a/src/icons/icon-name.ts b/src/icons/icon-name.ts index 2e1e72a..a69b724 100644 --- a/src/icons/icon-name.ts +++ b/src/icons/icon-name.ts @@ -33,6 +33,7 @@ export type IconName = | 'drugstores' | 'dry_cleaning' | 'equestrian' + | 'fallback' | 'fast_food' | 'film_studio' | 'fire_station' diff --git a/src/icons/icons.ts b/src/icons/icons.ts index 1de3256..510abe2 100644 --- a/src/icons/icons.ts +++ b/src/icons/icons.ts @@ -57,6 +57,8 @@ import dry_cleaning_14 from '../../static/icons/dry_cleaning_14.svg'; import dry_cleaning_24 from '../../static/icons/dry_cleaning_24.svg'; import equestrian_14 from '../../static/icons/equestrian_14.svg'; import equestrian_24 from '../../static/icons/equestrian_24.svg'; +import fallback_14 from '../../static/icons/fallback_14.svg'; +import fallback_24 from '../../static/icons/fallback_24.svg'; import fast_food_14 from '../../static/icons/fast_food_14.svg'; import fast_food_24 from '../../static/icons/fast_food_24.svg'; import film_studio_14 from '../../static/icons/film_studio_14.svg'; @@ -249,6 +251,7 @@ export const icons: Icons = { drugstores: {normal: drugstores_24, small: drugstores_14}, dry_cleaning: {normal: dry_cleaning_24, small: dry_cleaning_14}, equestrian: {normal: equestrian_24, small: equestrian_14}, + fallback: {normal: fallback_24, small: fallback_14}, fast_food: {normal: fast_food_24, small: fast_food_14}, film_studio: {normal: film_studio_24, small: film_studio_14}, fire_station: {normal: fire_station_24, small: fire_station_14}, diff --git a/tools/icons/fetch-icons.ts b/tools/icons/fetch-icons.ts index deef2a8..f823ba3 100644 --- a/tools/icons/fetch-icons.ts +++ b/tools/icons/fetch-icons.ts @@ -19,6 +19,8 @@ const AVAILABLE_SIZES = [14, 24]; const REGION_CODE_REGEXP = /_([a-z]{2})_/; /** RegExp for getting the size from the component name*/ export const SIZE_REGEXP = /_([0-9]{2})/; +/** RegExp to discard rubrics fallbacks */ +const RUBRIC_FALLBACK_REGEXP = /fallback_.+\d{2}$/; const INTL_REGION_CODES = new Intl.DisplayNames(['en', 'ru'], {type: 'region'}); /** A number between 0.01 and 4, the image scaling factor */ const IMAGE_SCALE = 1; @@ -92,7 +94,7 @@ const getIconDescriptions = (components: Node<'COMPONENT'>[], availableSizes: nu return false; } // without fallback icons - if (component.name.includes('fallback')) { + if (RUBRIC_FALLBACK_REGEXP.test(component.name)) { return false; } const {height, width} = component.absoluteBoundingBox; From 5a15b46756e7fbbf234a3f44adf899bf9c949d73 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 8 Apr 2024 15:37:47 +0300 Subject: [PATCH 26/43] size props in marker --- example/default-markers/common.ts | 22 ++- example/default-markers/vanilla/index.ts | 9 +- .../backgrounds/micro-poi-stroke.svg | 1 + .../backgrounds/micro-poi.svg | 1 + .../{pin.svg => backgrounds/normal-pin.svg} | 2 +- .../backgrounds/small-poi-stroke.svg | 1 + .../backgrounds/small-poi.svg | 1 + src/MMapDefaultMarker/index.css | 63 ++++++-- src/MMapDefaultMarker/index.ts | 135 +++++++++++++++--- src/icons/index.ts | 3 +- 10 files changed, 194 insertions(+), 44 deletions(-) create mode 100644 src/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg create mode 100644 src/MMapDefaultMarker/backgrounds/micro-poi.svg rename src/MMapDefaultMarker/{pin.svg => backgrounds/normal-pin.svg} (89%) create mode 100644 src/MMapDefaultMarker/backgrounds/small-poi-stroke.svg create mode 100644 src/MMapDefaultMarker/backgrounds/small-poi.svg diff --git a/example/default-markers/common.ts b/example/default-markers/common.ts index c7b47d2..bea117b 100644 --- a/example/default-markers/common.ts +++ b/example/default-markers/common.ts @@ -1,4 +1,5 @@ -import type {MMapLocationRequest, LngLatBounds, LngLat} from '@mappable-world/mappable-types'; +import type {LngLat, LngLatBounds, MMapLocationRequest} from '@mappable-world/mappable-types'; +import {MMapDefaultMarkerProps} from '../../src'; const BOUNDS: LngLatBounds = [ [54.58311, 25.9985], @@ -6,4 +7,21 @@ const BOUNDS: LngLatBounds = [ ]; export const LOCATION: MMapLocationRequest = {bounds: BOUNDS}; -export const MARKER_LOCATION: LngLat = [(BOUNDS[0][0] + BOUNDS[1][0]) / 2, (BOUNDS[0][1] + BOUNDS[1][1]) / 2]; + +const CENTER: LngLat = [(BOUNDS[0][0] + BOUNDS[1][0]) / 2, (BOUNDS[0][1] + BOUNDS[1][1]) / 2]; +const STEP = 0.3; + +export const MARKER_LOCATIONS: MMapDefaultMarkerProps[] = [ + // no icon markers + {coordinates: [CENTER[0] - STEP, CENTER[1]], size: 'normal'}, + {coordinates: CENTER}, + {coordinates: [CENTER[0] + STEP, CENTER[1]], size: 'micro'}, + // airport icon + {iconName: 'airport', coordinates: [CENTER[0] - STEP, CENTER[1] + STEP], size: 'normal'}, + {iconName: 'airport', coordinates: [CENTER[0], CENTER[1] + STEP]}, + {iconName: 'airport', coordinates: [CENTER[0] + STEP, CENTER[1] + STEP], size: 'micro'}, + // color icon + {color: 'steelblue', coordinates: [CENTER[0] - STEP, CENTER[1] - STEP], size: 'normal'}, + {color: 'steelblue', coordinates: [CENTER[0], CENTER[1] - STEP]}, + {color: 'steelblue', coordinates: [CENTER[0] + STEP, CENTER[1] - STEP], size: 'micro'} +]; diff --git a/example/default-markers/vanilla/index.ts b/example/default-markers/vanilla/index.ts index 47e0678..b26863e 100644 --- a/example/default-markers/vanilla/index.ts +++ b/example/default-markers/vanilla/index.ts @@ -1,4 +1,4 @@ -import {LOCATION, MARKER_LOCATION} from '../common'; +import {LOCATION, MARKER_LOCATIONS} from '../common'; window.map = null; main(); @@ -13,10 +13,5 @@ async function main() { map.addChild(new MMapDefaultSchemeLayer({})); map.addChild(new MMapDefaultFeaturesLayer({})); - const defaultMarker = new MMapDefaultMarker({ - iconName: 'fallback', - color: 'bluebell', - coordinates: MARKER_LOCATION - }); - map.addChild(defaultMarker); + MARKER_LOCATIONS.forEach((props) => map.addChild(new MMapDefaultMarker(props))); } diff --git a/src/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg b/src/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg new file mode 100644 index 0000000..4d62815 --- /dev/null +++ b/src/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/MMapDefaultMarker/backgrounds/micro-poi.svg b/src/MMapDefaultMarker/backgrounds/micro-poi.svg new file mode 100644 index 0000000..da465bb --- /dev/null +++ b/src/MMapDefaultMarker/backgrounds/micro-poi.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/MMapDefaultMarker/pin.svg b/src/MMapDefaultMarker/backgrounds/normal-pin.svg similarity index 89% rename from src/MMapDefaultMarker/pin.svg rename to src/MMapDefaultMarker/backgrounds/normal-pin.svg index 5d9a1b1..4fe7f68 100644 --- a/src/MMapDefaultMarker/pin.svg +++ b/src/MMapDefaultMarker/backgrounds/normal-pin.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/MMapDefaultMarker/backgrounds/small-poi-stroke.svg b/src/MMapDefaultMarker/backgrounds/small-poi-stroke.svg new file mode 100644 index 0000000..4a6bb40 --- /dev/null +++ b/src/MMapDefaultMarker/backgrounds/small-poi-stroke.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/MMapDefaultMarker/backgrounds/small-poi.svg b/src/MMapDefaultMarker/backgrounds/small-poi.svg new file mode 100644 index 0000000..3a1c7d7 --- /dev/null +++ b/src/MMapDefaultMarker/backgrounds/small-poi.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/MMapDefaultMarker/index.css b/src/MMapDefaultMarker/index.css index 915ada3..d26740a 100644 --- a/src/MMapDefaultMarker/index.css +++ b/src/MMapDefaultMarker/index.css @@ -1,19 +1,62 @@ -.mappable--point { - box-sizing: border-box; - height: 8px; - width: 8px; - border: 2px solid; +.mappable--default-marker-point { position: absolute; - transform: translate(-50%, -50%); + cursor: pointer; +} +.mappable--default-marker-point svg { + display: block; +} + +/* normal size */ +.mappable--normal-pin { + display: flex; + flex-direction: column; + align-items: center; + row-gap: 2px; + position: absolute; + transform: translate(-50%, calc(-100% + 4px)); + filter: drop-shadow(0px 2px 6px rgba(24, 27, 34, 0.4)); +} +.mappable--normal-icon { + position: absolute; + transform: translate(-50%, calc(-4px - 2px - 51px + 10px)); /* 51px - pin height, 10px - offset */ +} +.mappable--normal-pin_circle { + display: block; + width: 4px; + height: 4px; + border-width: 2px; + border-style: solid; border-radius: 50%; + box-shadow: 0px 1px 4px 0px rgba(24, 27, 34, 0.3); } -.mappable--pin { +/* small size */ +.mappable--small-poi { position: absolute; - transform: translate(calc(-50% + 2px), calc(-100%)); + transform: translate(-50%, -50%); +} +.mappable--small-poi_stroke { + position: absolute; + transform: translate(-50%, -50%); + z-index: -1; + -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.1)); + filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.1)); +} +.mappable--small-icon { + position: absolute; + z-index: 1; + transform: translate(-50%, -50%); } -.mappable--icon { +/* micro size */ +.mappable--micro-poi { position: absolute; - transform: translate(calc(-24px - 10px), 10px); + transform: translate(-50%, -50%); +} +.mappable--micro-poi_stroke { + position: absolute; + transform: translate(-50%, -50%); + z-index: -1; + -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.1)); + filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.1)); } diff --git a/src/MMapDefaultMarker/index.ts b/src/MMapDefaultMarker/index.ts index 9a4273c..8942be9 100644 --- a/src/MMapDefaultMarker/index.ts +++ b/src/MMapDefaultMarker/index.ts @@ -1,27 +1,36 @@ import {MMapMarker, MMapMarkerProps} from '@mappable-world/mappable-types'; -import {IconColor, IconName, iconColors, icons, glyphColors} from '../icons'; +import {IconColor, IconName, IconSize, glyphColors, iconColors, icons} from '../icons'; +import microPoiStrokeSVG from './backgrounds/micro-poi-stroke.svg'; +import microPoiSVG from './backgrounds/micro-poi.svg'; +import normalPinSVG from './backgrounds/normal-pin.svg'; +import smallPoiStrokeSVG from './backgrounds/small-poi-stroke.svg'; +import smallPoiSVG from './backgrounds/small-poi.svg'; import './index.css'; -import pin from './pin.svg'; export type ThemesColor = {day: string; night: string}; export type MarkerColorProps = IconColor | ThemesColor; +export type MarkerSizeProps = IconSize | 'micro'; export type MMapDefaultMarkerProps = MMapMarkerProps & { iconName?: IconName; color?: MarkerColorProps; + size?: MarkerSizeProps; }; -const defaultProps = Object.freeze({color: 'darkgray'}); +const defaultProps = Object.freeze({color: 'darkgray', size: 'small'}); type DefaultProps = typeof defaultProps; +type BackgroundAndIcon = {background: HTMLElement; stroke?: HTMLElement; icon?: HTMLElement}; + export class MMapDefaultMarker extends mappable.MMapComplexEntity { static defaultProps = defaultProps; private _marker: MMapMarker; private _markerElement: HTMLElement; - private _pin: HTMLElement; - private _icon: HTMLElement; private _color: ThemesColor; + private _background: HTMLElement; + private _stroke?: HTMLElement; + private _icon?: HTMLElement; constructor(props: MMapDefaultMarkerProps) { super(props); @@ -33,20 +42,38 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity('.mappable--normal-pin_circle'); + this._background.style.color = this._color.day; + circle.style.backgroundColor = this._color.day; + this._icon.style.color = glyphColors.day; + circle.style.borderColor = glyphColors.day; + break; + case 'small': + this._background.style.color = this._color.day; + this._stroke.style.color = glyphColors.day; + this._icon.style.color = glyphColors.day; + break; + case 'micro': + this._background.style.color = this._color.day; + this._stroke.style.color = glyphColors.day; + break; + } } private _getIcon(): string { - return this._props.iconName !== undefined ? icons[this._props.iconName].normal : ''; + if (this._props.size === 'micro') { + return ''; + } + return this._props.iconName !== undefined ? icons[this._props.iconName][this._props.size] : ''; } private _getColor(): ThemesColor { @@ -89,4 +131,51 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity Date: Mon, 8 Apr 2024 15:45:25 +0300 Subject: [PATCH 27/43] change examples --- example/default-markers/common.ts | 24 ++++++++++++++---------- example/default-markers/react/index.tsx | 6 ++++-- example/default-markers/vue/index.ts | 6 +++--- 3 files changed, 21 insertions(+), 15 deletions(-) diff --git a/example/default-markers/common.ts b/example/default-markers/common.ts index bea117b..7478ace 100644 --- a/example/default-markers/common.ts +++ b/example/default-markers/common.ts @@ -13,15 +13,19 @@ const STEP = 0.3; export const MARKER_LOCATIONS: MMapDefaultMarkerProps[] = [ // no icon markers - {coordinates: [CENTER[0] - STEP, CENTER[1]], size: 'normal'}, - {coordinates: CENTER}, - {coordinates: [CENTER[0] + STEP, CENTER[1]], size: 'micro'}, + {coordinates: [CENTER[0] - STEP, CENTER[1] + STEP / 2], size: 'normal'}, + {coordinates: [CENTER[0], CENTER[1] + STEP / 2]}, + {coordinates: [CENTER[0] + STEP, CENTER[1] + STEP / 2], size: 'micro'}, // airport icon - {iconName: 'airport', coordinates: [CENTER[0] - STEP, CENTER[1] + STEP], size: 'normal'}, - {iconName: 'airport', coordinates: [CENTER[0], CENTER[1] + STEP]}, - {iconName: 'airport', coordinates: [CENTER[0] + STEP, CENTER[1] + STEP], size: 'micro'}, - // color icon - {color: 'steelblue', coordinates: [CENTER[0] - STEP, CENTER[1] - STEP], size: 'normal'}, - {color: 'steelblue', coordinates: [CENTER[0], CENTER[1] - STEP]}, - {color: 'steelblue', coordinates: [CENTER[0] + STEP, CENTER[1] - STEP], size: 'micro'} + {iconName: 'airport', coordinates: [CENTER[0] - STEP, CENTER[1] - STEP / 2], size: 'normal'}, + {iconName: 'airport', coordinates: [CENTER[0], CENTER[1] - STEP / 2]}, + {iconName: 'airport', coordinates: [CENTER[0] + STEP, CENTER[1] - STEP / 2], size: 'micro'}, + // color + {color: 'steelblue', coordinates: [CENTER[0] - STEP, CENTER[1] + STEP], size: 'normal'}, + {color: 'steelblue', coordinates: [CENTER[0], CENTER[1] + STEP]}, + {color: 'steelblue', coordinates: [CENTER[0] + STEP, CENTER[1] + STEP], size: 'micro'}, + // color and icon + {color: 'pink', iconName: 'attraction', coordinates: [CENTER[0] - STEP, CENTER[1] - STEP], size: 'normal'}, + {color: 'pink', iconName: 'attraction', coordinates: [CENTER[0], CENTER[1] - STEP]}, + {color: 'pink', iconName: 'attraction', coordinates: [CENTER[0] + STEP, CENTER[1] - STEP], size: 'micro'} ]; diff --git a/example/default-markers/react/index.tsx b/example/default-markers/react/index.tsx index dd888f5..1eb967f 100644 --- a/example/default-markers/react/index.tsx +++ b/example/default-markers/react/index.tsx @@ -1,4 +1,4 @@ -import {LOCATION, MARKER_LOCATION} from '../common'; +import {LOCATION, MARKER_LOCATIONS} from '../common'; window.map = null; @@ -27,7 +27,9 @@ async function main() { (map = x)}> - + {MARKER_LOCATIONS.map((props, i) => ( + + ))} ); } diff --git a/example/default-markers/vue/index.ts b/example/default-markers/vue/index.ts index 70b6cab..8a56d6a 100644 --- a/example/default-markers/vue/index.ts +++ b/example/default-markers/vue/index.ts @@ -1,4 +1,4 @@ -import {LOCATION, MARKER_LOCATION} from '../common'; +import {LOCATION, MARKER_LOCATIONS} from '../common'; window.map = null; @@ -22,13 +22,13 @@ async function main() { const refMap = (ref) => { window.map = ref?.entity; }; - return {LOCATION, refMap, MARKER_LOCATION}; + return {LOCATION, refMap, MARKER_LOCATIONS}; }, template: ` - + ` }); app.mount('#app'); From 768cbafb98095af0bdf6f7e7ac9428e014f91a35 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 8 Apr 2024 16:00:55 +0300 Subject: [PATCH 28/43] Downscale if no small icon --- example/default-markers/common.ts | 6 +++--- src/MMapDefaultMarker/index.ts | 7 +++++-- 2 files changed, 8 insertions(+), 5 deletions(-) diff --git a/example/default-markers/common.ts b/example/default-markers/common.ts index 7478ace..4baa6f2 100644 --- a/example/default-markers/common.ts +++ b/example/default-markers/common.ts @@ -17,9 +17,9 @@ export const MARKER_LOCATIONS: MMapDefaultMarkerProps[] = [ {coordinates: [CENTER[0], CENTER[1] + STEP / 2]}, {coordinates: [CENTER[0] + STEP, CENTER[1] + STEP / 2], size: 'micro'}, // airport icon - {iconName: 'airport', coordinates: [CENTER[0] - STEP, CENTER[1] - STEP / 2], size: 'normal'}, - {iconName: 'airport', coordinates: [CENTER[0], CENTER[1] - STEP / 2]}, - {iconName: 'airport', coordinates: [CENTER[0] + STEP, CENTER[1] - STEP / 2], size: 'micro'}, + {iconName: 'viewpoint', coordinates: [CENTER[0] - STEP, CENTER[1] - STEP / 2], size: 'normal'}, + {iconName: 'viewpoint', coordinates: [CENTER[0], CENTER[1] - STEP / 2]}, + {iconName: 'viewpoint', coordinates: [CENTER[0] + STEP, CENTER[1] - STEP / 2], size: 'micro'}, // color {color: 'steelblue', coordinates: [CENTER[0] - STEP, CENTER[1] + STEP], size: 'normal'}, {color: 'steelblue', coordinates: [CENTER[0], CENTER[1] + STEP]}, diff --git a/src/MMapDefaultMarker/index.ts b/src/MMapDefaultMarker/index.ts index 8942be9..b267052 100644 --- a/src/MMapDefaultMarker/index.ts +++ b/src/MMapDefaultMarker/index.ts @@ -111,10 +111,13 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity Date: Wed, 10 Apr 2024 19:37:14 +0300 Subject: [PATCH 29/43] upgrade markers --- docs/icons.md | 246 ++++++------- example/default-markers/vanilla/index.ts | 14 +- .../backgrounds/micro-poi-stroke.svg | 1 - .../backgrounds/micro-poi.svg | 1 - .../backgrounds/small-poi-stroke.svg | 1 - .../backgrounds/small-poi.svg | 1 - src/icons/icon-colors.ts | 1 - src/icons/icon-size.ts | 1 - src/icons/icons.ts | 337 +++++++----------- src/icons/index.ts | 3 +- src/icons/types.ts | 5 +- src/index.ts | 2 +- .../backgrounds/micro-poi-stroke.svg | 1 + .../backgrounds/micro-poi.svg | 1 + .../backgrounds/normal-pin-stroke.svg | 1 + .../backgrounds/normal-pin.svg | 2 +- .../backgrounds/small-poi-stroke.svg | 1 + .../backgrounds/small-poi.svg | 1 + src/{ => markers}/MMapDefaultMarker/index.css | 23 +- src/{ => markers}/MMapDefaultMarker/index.ts | 57 +-- src/markers/index.ts | 1 + tools/icons/fetch-colors.ts | 18 +- tools/icons/fetch-icons.ts | 2 +- tools/icons/generate-colors.ts | 1 - tools/icons/generate-docs.ts | 10 +- tools/icons/generate-imports.ts | 3 +- 26 files changed, 318 insertions(+), 417 deletions(-) delete mode 100644 src/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg delete mode 100644 src/MMapDefaultMarker/backgrounds/micro-poi.svg delete mode 100644 src/MMapDefaultMarker/backgrounds/small-poi-stroke.svg delete mode 100644 src/MMapDefaultMarker/backgrounds/small-poi.svg delete mode 100644 src/icons/icon-size.ts create mode 100644 src/markers/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg create mode 100644 src/markers/MMapDefaultMarker/backgrounds/micro-poi.svg create mode 100644 src/markers/MMapDefaultMarker/backgrounds/normal-pin-stroke.svg rename src/{ => markers}/MMapDefaultMarker/backgrounds/normal-pin.svg (70%) create mode 100644 src/markers/MMapDefaultMarker/backgrounds/small-poi-stroke.svg create mode 100644 src/markers/MMapDefaultMarker/backgrounds/small-poi.svg rename src/{ => markers}/MMapDefaultMarker/index.css (70%) rename src/{ => markers}/MMapDefaultMarker/index.ts (74%) create mode 100644 src/markers/index.ts diff --git a/docs/icons.md b/docs/icons.md index 5bfafd7..fb76816 100644 --- a/docs/icons.md +++ b/docs/icons.md @@ -2,126 +2,126 @@ # List of supported icons -| Name | Normal Size | Small Size | -| --------------------- | ---------------------------------------------------------------------- | ---------------------------------------------------------------------- | -| airport | ![airport](../static/icons/airport_24.svg) | ![airport](../static/icons/airport_14.svg) | -| attraction | ![attraction](../static/icons/attraction_24.svg) | ![attraction](../static/icons/attraction_14.svg) | -| auto | ![auto](../static/icons/auto_24.svg) | ![auto](../static/icons/auto_14.svg) | -| aviary | ![aviary](../static/icons/aviary_24.svg) | none | -| baby_shop | ![baby_shop](../static/icons/baby_shop_24.svg) | ![baby_shop](../static/icons/baby_shop_14.svg) | -| banks | ![banks](../static/icons/banks_24.svg) | ![banks](../static/icons/banks_14.svg) | -| barbeque | ![barbeque](../static/icons/barbeque_24.svg) | none | -| bars | ![bars](../static/icons/bars_24.svg) | ![bars](../static/icons/bars_14.svg) | -| beach | ![beach](../static/icons/beach_24.svg) | ![beach](../static/icons/beach_14.svg) | -| bench | ![bench](../static/icons/bench_24.svg) | none | -| bike | ![bike](../static/icons/bike_24.svg) | none | -| bike_rent | ![bike_rent](../static/icons/bike_rent_24.svg) | ![bike_rent](../static/icons/bike_rent_14.svg) | -| boat_station | ![boat_station](../static/icons/boat_station_24.svg) | ![boat_station](../static/icons/boat_station_14.svg) | -| bookstore | ![bookstore](../static/icons/bookstore_24.svg) | ![bookstore](../static/icons/bookstore_14.svg) | -| buddhism | ![buddhism](../static/icons/buddhism_24.svg) | ![buddhism](../static/icons/buddhism_14.svg) | -| building | ![building](../static/icons/building_24.svg) | none | -| bus | ![bus](../static/icons/bus_24.svg) | none | -| cafe | ![cafe](../static/icons/cafe_24.svg) | ![cafe](../static/icons/cafe_14.svg) | -| car_park | ![car_park](../static/icons/car_park_24.svg) | none | -| catholic_church | ![catholic_church](../static/icons/catholic_church_24.svg) | ![catholic_church](../static/icons/catholic_church_14.svg) | -| cemetery | ![cemetery](../static/icons/cemetery_24.svg) | ![cemetery](../static/icons/cemetery_14.svg) | -| childrens_playground | ![childrens_playground](../static/icons/childrens_playground_24.svg) | none | -| cinemas | ![cinemas](../static/icons/cinemas_24.svg) | ![cinemas](../static/icons/cinemas_14.svg) | -| clothes_shop | ![clothes_shop](../static/icons/clothes_shop_24.svg) | ![clothes_shop](../static/icons/clothes_shop_14.svg) | -| college | ![college](../static/icons/college_24.svg) | ![college](../static/icons/college_14.svg) | -| concert_hall | ![concert_hall](../static/icons/concert_hall_24.svg) | ![concert_hall](../static/icons/concert_hall_14.svg) | -| confectionary | ![confectionary](../static/icons/confectionary_24.svg) | ![confectionary](../static/icons/confectionary_14.svg) | -| currency_exchange | ![currency_exchange](../static/icons/currency_exchange_24.svg) | ![currency_exchange](../static/icons/currency_exchange_14.svg) | -| dental | ![dental](../static/icons/dental_24.svg) | ![dental](../static/icons/dental_14.svg) | -| driving_school | ![driving_school](../static/icons/driving_school_24.svg) | ![driving_school](../static/icons/driving_school_14.svg) | -| drugstores | ![drugstores](../static/icons/drugstores_24.svg) | ![drugstores](../static/icons/drugstores_14.svg) | -| dry_cleaning | ![dry_cleaning](../static/icons/dry_cleaning_24.svg) | ![dry_cleaning](../static/icons/dry_cleaning_14.svg) | -| equestrian | ![equestrian](../static/icons/equestrian_24.svg) | ![equestrian](../static/icons/equestrian_14.svg) | -| fallback | ![fallback](../static/icons/fallback_24.svg) | ![fallback](../static/icons/fallback_14.svg) | -| fast_food | ![fast_food](../static/icons/fast_food_24.svg) | ![fast_food](../static/icons/fast_food_14.svg) | -| film_studio | ![film_studio](../static/icons/film_studio_24.svg) | ![film_studio](../static/icons/film_studio_14.svg) | -| fire_station | ![fire_station](../static/icons/fire_station_24.svg) | ![fire_station](../static/icons/fire_station_14.svg) | -| fitness | ![fitness](../static/icons/fitness_24.svg) | ![fitness](../static/icons/fitness_14.svg) | -| flower_shop | ![flower_shop](../static/icons/flower_shop_24.svg) | ![flower_shop](../static/icons/flower_shop_14.svg) | -| forest | ![forest](../static/icons/forest_24.svg) | ![forest](../static/icons/forest_14.svg) | -| fountain | ![fountain](../static/icons/fountain_24.svg) | none | -| furniture_store | ![furniture_store](../static/icons/furniture_store_24.svg) | ![furniture_store](../static/icons/furniture_store_14.svg) | -| garden | ![garden](../static/icons/garden_24.svg) | ![garden](../static/icons/garden_14.svg) | -| gasstation | ![gasstation](../static/icons/gasstation_24.svg) | ![gasstation](../static/icons/gasstation_14.svg) | -| government | ![government](../static/icons/government_24.svg) | ![government](../static/icons/government_14.svg) | -| hairdressers | ![hairdressers](../static/icons/hairdressers_24.svg) | ![hairdressers](../static/icons/hairdressers_14.svg) | -| haulier | ![haulier](../static/icons/haulier_24.svg) | ![haulier](../static/icons/haulier_14.svg) | -| helicopter | ![helicopter](../static/icons/helicopter_24.svg) | none | -| hospital | ![hospital](../static/icons/hospital_24.svg) | ![hospital](../static/icons/hospital_14.svg) | -| hotels | ![hotels](../static/icons/hotels_24.svg) | ![hotels](../static/icons/hotels_14.svg) | -| hypermarket | ![hypermarket](../static/icons/hypermarket_24.svg) | ![hypermarket](../static/icons/hypermarket_14.svg) | -| industrial_enterprise | ![industrial_enterprise](../static/icons/industrial_enterprise_24.svg) | ![industrial_enterprise](../static/icons/industrial_enterprise_14.svg) | -| information | ![information](../static/icons/information_24.svg) | ![information](../static/icons/information_14.svg) | -| kindergarten | ![kindergarten](../static/icons/kindergarten_24.svg) | ![kindergarten](../static/icons/kindergarten_14.svg) | -| landmark | ![landmark](../static/icons/landmark_24.svg) | ![landmark](../static/icons/landmark_14.svg) | -| laundry | ![laundry](../static/icons/laundry_24.svg) | ![laundry](../static/icons/laundry_14.svg) | -| library | ![library](../static/icons/library_24.svg) | ![library](../static/icons/library_14.svg) | -| malls | ![malls](../static/icons/malls_24.svg) | ![malls](../static/icons/malls_14.svg) | -| medicine | ![medicine](../static/icons/medicine_24.svg) | ![medicine](../static/icons/medicine_14.svg) | -| memorable_event | ![memorable_event](../static/icons/memorable_event_24.svg) | ![memorable_event](../static/icons/memorable_event_14.svg) | -| metro | ![metro](../static/icons/metro_24.svg) | ![metro](../static/icons/metro_14.svg) | -| metro_bus | ![metro_bus](../static/icons/metro_bus_24.svg) | ![metro_bus](../static/icons/metro_bus_14.svg) | -| metro_cable | ![metro_cable](../static/icons/metro_cable_24.svg) | ![metro_cable](../static/icons/metro_cable_14.svg) | -| metro_entrance | ![metro_entrance](../static/icons/metro_entrance_24.svg) | none | -| metro_funicular | ![metro_funicular](../static/icons/metro_funicular_24.svg) | ![metro_funicular](../static/icons/metro_funicular_14.svg) | -| metro_light | ![metro_light](../static/icons/metro_light_24.svg) | ![metro_light](../static/icons/metro_light_14.svg) | -| metro_monorail | ![metro_monorail](../static/icons/metro_monorail_24.svg) | ![metro_monorail](../static/icons/metro_monorail_14.svg) | -| metro_tram | ![metro_tram](../static/icons/metro_tram_24.svg) | ![metro_tram](../static/icons/metro_tram_14.svg) | -| mobile_phones | ![mobile_phones](../static/icons/mobile_phones_24.svg) | ![mobile_phones](../static/icons/mobile_phones_14.svg) | -| money_coin | ![money_coin](../static/icons/money_coin_24.svg) | none | -| monument | ![monument](../static/icons/monument_24.svg) | none | -| mosque | ![mosque](../static/icons/mosque_24.svg) | ![mosque](../static/icons/mosque_14.svg) | -| mountain | ![mountain](../static/icons/mountain_24.svg) | none | -| museum | ![museum](../static/icons/museum_24.svg) | ![museum](../static/icons/museum_14.svg) | -| office | ![office](../static/icons/office_24.svg) | ![office](../static/icons/office_14.svg) | -| office_service | ![office_service](../static/icons/office_service_24.svg) | ![office_service](../static/icons/office_service_14.svg) | -| orthodox_church | ![orthodox_church](../static/icons/orthodox_church_24.svg) | ![orthodox_church](../static/icons/orthodox_church_14.svg) | -| park | ![park](../static/icons/park_24.svg) | ![park](../static/icons/park_14.svg) | -| pavilion | ![pavilion](../static/icons/pavilion_24.svg) | none | -| pet_playground | ![pet_playground](../static/icons/pet_playground_24.svg) | none | -| petshop | ![petshop](../static/icons/petshop_24.svg) | ![petshop](../static/icons/petshop_14.svg) | -| photo | ![photo](../static/icons/photo_24.svg) | ![photo](../static/icons/photo_14.svg) | -| picnic | ![picnic](../static/icons/picnic_24.svg) | none | -| pier | ![pier](../static/icons/pier_24.svg) | none | -| playground | ![playground](../static/icons/playground_24.svg) | none | -| police | ![police](../static/icons/police_24.svg) | ![police](../static/icons/police_14.svg) | -| police_post | ![police_post](../static/icons/police_post_24.svg) | ![police_post](../static/icons/police_post_14.svg) | -| port | ![port](../static/icons/port_24.svg) | ![port](../static/icons/port_14.svg) | -| post_office | ![post_office](../static/icons/post_office_24.svg) | ![post_office](../static/icons/post_office_14.svg) | -| printing_services | ![printing_services](../static/icons/printing_services_24.svg) | ![printing_services](../static/icons/printing_services_14.svg) | -| protestant_church | ![protestant_church](../static/icons/protestant_church_24.svg) | ![protestant_church](../static/icons/protestant_church_14.svg) | -| racing | ![racing](../static/icons/racing_24.svg) | ![racing](../static/icons/racing_14.svg) | -| railway | ![railway](../static/icons/railway_24.svg) | ![railway](../static/icons/railway_14.svg) | -| railway_station | ![railway_station](../static/icons/railway_station_24.svg) | ![railway_station](../static/icons/railway_station_14.svg) | -| recycling | ![recycling](../static/icons/recycling_24.svg) | none | -| restaurants | ![restaurants](../static/icons/restaurants_24.svg) | ![restaurants](../static/icons/restaurants_14.svg) | -| rezervation | ![rezervation](../static/icons/rezervation_24.svg) | ![rezervation](../static/icons/rezervation_14.svg) | -| sanatorium | ![sanatorium](../static/icons/sanatorium_24.svg) | ![sanatorium](../static/icons/sanatorium_14.svg) | -| science | ![science](../static/icons/science_24.svg) | ![science](../static/icons/science_14.svg) | -| skating_rink | ![skating_rink](../static/icons/skating_rink_24.svg) | ![skating_rink](../static/icons/skating_rink_14.svg) | -| software | ![software](../static/icons/software_24.svg) | ![software](../static/icons/software_14.svg) | -| spa | ![spa](../static/icons/spa_24.svg) | ![spa](../static/icons/spa_14.svg) | -| sportcenter | ![sportcenter](../static/icons/sportcenter_24.svg) | ![sportcenter](../static/icons/sportcenter_14.svg) | -| spring | ![spring](../static/icons/spring_24.svg) | none | -| stadium | ![stadium](../static/icons/stadium_24.svg) | ![stadium](../static/icons/stadium_14.svg) | -| supermarket | ![supermarket](../static/icons/supermarket_24.svg) | ![supermarket](../static/icons/supermarket_14.svg) | -| sushi | ![sushi](../static/icons/sushi_24.svg) | ![sushi](../static/icons/sushi_14.svg) | -| swimming_pool | ![swimming_pool](../static/icons/swimming_pool_24.svg) | ![swimming_pool](../static/icons/swimming_pool_14.svg) | -| synagogue | ![synagogue](../static/icons/synagogue_24.svg) | ![synagogue](../static/icons/synagogue_14.svg) | -| tailor | ![tailor](../static/icons/tailor_24.svg) | ![tailor](../static/icons/tailor_14.svg) | -| taxi | ![taxi](../static/icons/taxi_24.svg) | ![taxi](../static/icons/taxi_14.svg) | -| theatre | ![theatre](../static/icons/theatre_24.svg) | ![theatre](../static/icons/theatre_14.svg) | -| ticket_office | ![ticket_office](../static/icons/ticket_office_24.svg) | ![ticket_office](../static/icons/ticket_office_14.svg) | -| tire_fitting | ![tire_fitting](../static/icons/tire_fitting_24.svg) | ![tire_fitting](../static/icons/tire_fitting_14.svg) | -| tram | ![tram](../static/icons/tram_24.svg) | none | -| trash | ![trash](../static/icons/trash_24.svg) | none | -| travel_agency | ![travel_agency](../static/icons/travel_agency_24.svg) | ![travel_agency](../static/icons/travel_agency_14.svg) | -| viewpoint | ![viewpoint](../static/icons/viewpoint_24.svg) | none | -| waterfall | ![waterfall](../static/icons/waterfall_24.svg) | none | -| wc | ![wc](../static/icons/wc_24.svg) | none | -| zoo | ![zoo](../static/icons/zoo_24.svg) | ![zoo](../static/icons/zoo_14.svg) | +| Name | Normal Size | +| --------------------- | ---------------------------------------------------------------------- | +| airport | ![airport](../static/icons/airport_24.svg) | +| attraction | ![attraction](../static/icons/attraction_24.svg) | +| auto | ![auto](../static/icons/auto_24.svg) | +| aviary | ![aviary](../static/icons/aviary_24.svg) | +| baby_shop | ![baby_shop](../static/icons/baby_shop_24.svg) | +| banks | ![banks](../static/icons/banks_24.svg) | +| barbeque | ![barbeque](../static/icons/barbeque_24.svg) | +| bars | ![bars](../static/icons/bars_24.svg) | +| beach | ![beach](../static/icons/beach_24.svg) | +| bench | ![bench](../static/icons/bench_24.svg) | +| bike | ![bike](../static/icons/bike_24.svg) | +| bike_rent | ![bike_rent](../static/icons/bike_rent_24.svg) | +| boat_station | ![boat_station](../static/icons/boat_station_24.svg) | +| bookstore | ![bookstore](../static/icons/bookstore_24.svg) | +| buddhism | ![buddhism](../static/icons/buddhism_24.svg) | +| building | ![building](../static/icons/building_24.svg) | +| bus | ![bus](../static/icons/bus_24.svg) | +| cafe | ![cafe](../static/icons/cafe_24.svg) | +| car_park | ![car_park](../static/icons/car_park_24.svg) | +| catholic_church | ![catholic_church](../static/icons/catholic_church_24.svg) | +| cemetery | ![cemetery](../static/icons/cemetery_24.svg) | +| childrens_playground | ![childrens_playground](../static/icons/childrens_playground_24.svg) | +| cinemas | ![cinemas](../static/icons/cinemas_24.svg) | +| clothes_shop | ![clothes_shop](../static/icons/clothes_shop_24.svg) | +| college | ![college](../static/icons/college_24.svg) | +| concert_hall | ![concert_hall](../static/icons/concert_hall_24.svg) | +| confectionary | ![confectionary](../static/icons/confectionary_24.svg) | +| currency_exchange | ![currency_exchange](../static/icons/currency_exchange_24.svg) | +| dental | ![dental](../static/icons/dental_24.svg) | +| driving_school | ![driving_school](../static/icons/driving_school_24.svg) | +| drugstores | ![drugstores](../static/icons/drugstores_24.svg) | +| dry_cleaning | ![dry_cleaning](../static/icons/dry_cleaning_24.svg) | +| equestrian | ![equestrian](../static/icons/equestrian_24.svg) | +| fallback | ![fallback](../static/icons/fallback_24.svg) | +| fast_food | ![fast_food](../static/icons/fast_food_24.svg) | +| film_studio | ![film_studio](../static/icons/film_studio_24.svg) | +| fire_station | ![fire_station](../static/icons/fire_station_24.svg) | +| fitness | ![fitness](../static/icons/fitness_24.svg) | +| flower_shop | ![flower_shop](../static/icons/flower_shop_24.svg) | +| forest | ![forest](../static/icons/forest_24.svg) | +| fountain | ![fountain](../static/icons/fountain_24.svg) | +| furniture_store | ![furniture_store](../static/icons/furniture_store_24.svg) | +| garden | ![garden](../static/icons/garden_24.svg) | +| gasstation | ![gasstation](../static/icons/gasstation_24.svg) | +| government | ![government](../static/icons/government_24.svg) | +| hairdressers | ![hairdressers](../static/icons/hairdressers_24.svg) | +| haulier | ![haulier](../static/icons/haulier_24.svg) | +| helicopter | ![helicopter](../static/icons/helicopter_24.svg) | +| hospital | ![hospital](../static/icons/hospital_24.svg) | +| hotels | ![hotels](../static/icons/hotels_24.svg) | +| hypermarket | ![hypermarket](../static/icons/hypermarket_24.svg) | +| industrial_enterprise | ![industrial_enterprise](../static/icons/industrial_enterprise_24.svg) | +| information | ![information](../static/icons/information_24.svg) | +| kindergarten | ![kindergarten](../static/icons/kindergarten_24.svg) | +| landmark | ![landmark](../static/icons/landmark_24.svg) | +| laundry | ![laundry](../static/icons/laundry_24.svg) | +| library | ![library](../static/icons/library_24.svg) | +| malls | ![malls](../static/icons/malls_24.svg) | +| medicine | ![medicine](../static/icons/medicine_24.svg) | +| memorable_event | ![memorable_event](../static/icons/memorable_event_24.svg) | +| metro | ![metro](../static/icons/metro_24.svg) | +| metro_bus | ![metro_bus](../static/icons/metro_bus_24.svg) | +| metro_cable | ![metro_cable](../static/icons/metro_cable_24.svg) | +| metro_entrance | ![metro_entrance](../static/icons/metro_entrance_24.svg) | +| metro_funicular | ![metro_funicular](../static/icons/metro_funicular_24.svg) | +| metro_light | ![metro_light](../static/icons/metro_light_24.svg) | +| metro_monorail | ![metro_monorail](../static/icons/metro_monorail_24.svg) | +| metro_tram | ![metro_tram](../static/icons/metro_tram_24.svg) | +| mobile_phones | ![mobile_phones](../static/icons/mobile_phones_24.svg) | +| money_coin | ![money_coin](../static/icons/money_coin_24.svg) | +| monument | ![monument](../static/icons/monument_24.svg) | +| mosque | ![mosque](../static/icons/mosque_24.svg) | +| mountain | ![mountain](../static/icons/mountain_24.svg) | +| museum | ![museum](../static/icons/museum_24.svg) | +| office | ![office](../static/icons/office_24.svg) | +| office_service | ![office_service](../static/icons/office_service_24.svg) | +| orthodox_church | ![orthodox_church](../static/icons/orthodox_church_24.svg) | +| park | ![park](../static/icons/park_24.svg) | +| pavilion | ![pavilion](../static/icons/pavilion_24.svg) | +| pet_playground | ![pet_playground](../static/icons/pet_playground_24.svg) | +| petshop | ![petshop](../static/icons/petshop_24.svg) | +| photo | ![photo](../static/icons/photo_24.svg) | +| picnic | ![picnic](../static/icons/picnic_24.svg) | +| pier | ![pier](../static/icons/pier_24.svg) | +| playground | ![playground](../static/icons/playground_24.svg) | +| police | ![police](../static/icons/police_24.svg) | +| police_post | ![police_post](../static/icons/police_post_24.svg) | +| port | ![port](../static/icons/port_24.svg) | +| post_office | ![post_office](../static/icons/post_office_24.svg) | +| printing_services | ![printing_services](../static/icons/printing_services_24.svg) | +| protestant_church | ![protestant_church](../static/icons/protestant_church_24.svg) | +| racing | ![racing](../static/icons/racing_24.svg) | +| railway | ![railway](../static/icons/railway_24.svg) | +| railway_station | ![railway_station](../static/icons/railway_station_24.svg) | +| recycling | ![recycling](../static/icons/recycling_24.svg) | +| restaurants | ![restaurants](../static/icons/restaurants_24.svg) | +| rezervation | ![rezervation](../static/icons/rezervation_24.svg) | +| sanatorium | ![sanatorium](../static/icons/sanatorium_24.svg) | +| science | ![science](../static/icons/science_24.svg) | +| skating_rink | ![skating_rink](../static/icons/skating_rink_24.svg) | +| software | ![software](../static/icons/software_24.svg) | +| spa | ![spa](../static/icons/spa_24.svg) | +| sportcenter | ![sportcenter](../static/icons/sportcenter_24.svg) | +| spring | ![spring](../static/icons/spring_24.svg) | +| stadium | ![stadium](../static/icons/stadium_24.svg) | +| supermarket | ![supermarket](../static/icons/supermarket_24.svg) | +| sushi | ![sushi](../static/icons/sushi_24.svg) | +| swimming_pool | ![swimming_pool](../static/icons/swimming_pool_24.svg) | +| synagogue | ![synagogue](../static/icons/synagogue_24.svg) | +| tailor | ![tailor](../static/icons/tailor_24.svg) | +| taxi | ![taxi](../static/icons/taxi_24.svg) | +| theatre | ![theatre](../static/icons/theatre_24.svg) | +| ticket_office | ![ticket_office](../static/icons/ticket_office_24.svg) | +| tire_fitting | ![tire_fitting](../static/icons/tire_fitting_24.svg) | +| tram | ![tram](../static/icons/tram_24.svg) | +| trash | ![trash](../static/icons/trash_24.svg) | +| travel_agency | ![travel_agency](../static/icons/travel_agency_24.svg) | +| viewpoint | ![viewpoint](../static/icons/viewpoint_24.svg) | +| waterfall | ![waterfall](../static/icons/waterfall_24.svg) | +| wc | ![wc](../static/icons/wc_24.svg) | +| zoo | ![zoo](../static/icons/zoo_24.svg) | diff --git a/example/default-markers/vanilla/index.ts b/example/default-markers/vanilla/index.ts index b26863e..e74c136 100644 --- a/example/default-markers/vanilla/index.ts +++ b/example/default-markers/vanilla/index.ts @@ -4,7 +4,7 @@ window.map = null; main(); async function main() { await mappable.ready; - const {MMap, MMapDefaultSchemeLayer, MMapDefaultFeaturesLayer} = mappable; + const {MMap, MMapDefaultSchemeLayer, MMapDefaultFeaturesLayer, MMapControls, MMapControlButton} = mappable; const {MMapDefaultMarker} = await mappable.import('@mappable-world/mappable-default-ui-theme'); @@ -13,5 +13,17 @@ async function main() { map.addChild(new MMapDefaultSchemeLayer({})); map.addChild(new MMapDefaultFeaturesLayer({})); + map.addChild( + new MMapControls({position: 'top right'}).addChild( + new MMapControlButton({ + text: 'Switch theme', + onClick: () => { + const {theme} = map; + map.update({theme: theme === 'light' ? 'dark' : 'light'}); + } + }) + ) + ); + MARKER_LOCATIONS.forEach((props) => map.addChild(new MMapDefaultMarker(props))); } diff --git a/src/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg b/src/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg deleted file mode 100644 index 4d62815..0000000 --- a/src/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/MMapDefaultMarker/backgrounds/micro-poi.svg b/src/MMapDefaultMarker/backgrounds/micro-poi.svg deleted file mode 100644 index da465bb..0000000 --- a/src/MMapDefaultMarker/backgrounds/micro-poi.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/MMapDefaultMarker/backgrounds/small-poi-stroke.svg b/src/MMapDefaultMarker/backgrounds/small-poi-stroke.svg deleted file mode 100644 index 4a6bb40..0000000 --- a/src/MMapDefaultMarker/backgrounds/small-poi-stroke.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/MMapDefaultMarker/backgrounds/small-poi.svg b/src/MMapDefaultMarker/backgrounds/small-poi.svg deleted file mode 100644 index 3a1c7d7..0000000 --- a/src/MMapDefaultMarker/backgrounds/small-poi.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/icon-colors.ts b/src/icons/icon-colors.ts index 5338910..b2b9e33 100644 --- a/src/icons/icon-colors.ts +++ b/src/icons/icon-colors.ts @@ -10,5 +10,4 @@ export const iconColors = { green: {day: '#5ebd8cff', night: '#468c68ff'}, darksalmon: {day: '#f09a75ff', night: '#ab6f55ff'} } as const; -export const glyphColors = {day: '#ffffffff', night: '#303741ff'} as const; export type IconColor = keyof typeof iconColors; diff --git a/src/icons/icon-size.ts b/src/icons/icon-size.ts deleted file mode 100644 index 4189049..0000000 --- a/src/icons/icon-size.ts +++ /dev/null @@ -1 +0,0 @@ -export type IconSize = 'normal' | 'small'; diff --git a/src/icons/icons.ts b/src/icons/icons.ts index 510abe2..ae767aa 100644 --- a/src/icons/icons.ts +++ b/src/icons/icons.ts @@ -1,342 +1,247 @@ /** Don't edit manually. Generated by script: ./tools/icons/generate-imports.ts */ -import airport_14 from '../../static/icons/airport_14.svg'; import airport_24 from '../../static/icons/airport_24.svg'; -import attraction_14 from '../../static/icons/attraction_14.svg'; import attraction_24 from '../../static/icons/attraction_24.svg'; -import auto_14 from '../../static/icons/auto_14.svg'; import auto_24 from '../../static/icons/auto_24.svg'; import aviary_24 from '../../static/icons/aviary_24.svg'; -import baby_shop_14 from '../../static/icons/baby_shop_14.svg'; import baby_shop_24 from '../../static/icons/baby_shop_24.svg'; -import banks_14 from '../../static/icons/banks_14.svg'; import banks_24 from '../../static/icons/banks_24.svg'; import barbeque_24 from '../../static/icons/barbeque_24.svg'; -import bars_14 from '../../static/icons/bars_14.svg'; import bars_24 from '../../static/icons/bars_24.svg'; -import beach_14 from '../../static/icons/beach_14.svg'; import beach_24 from '../../static/icons/beach_24.svg'; import bench_24 from '../../static/icons/bench_24.svg'; import bike_24 from '../../static/icons/bike_24.svg'; -import bike_rent_14 from '../../static/icons/bike_rent_14.svg'; import bike_rent_24 from '../../static/icons/bike_rent_24.svg'; -import boat_station_14 from '../../static/icons/boat_station_14.svg'; import boat_station_24 from '../../static/icons/boat_station_24.svg'; -import bookstore_14 from '../../static/icons/bookstore_14.svg'; import bookstore_24 from '../../static/icons/bookstore_24.svg'; -import buddhism_14 from '../../static/icons/buddhism_14.svg'; import buddhism_24 from '../../static/icons/buddhism_24.svg'; import building_24 from '../../static/icons/building_24.svg'; import bus_24 from '../../static/icons/bus_24.svg'; -import cafe_14 from '../../static/icons/cafe_14.svg'; import cafe_24 from '../../static/icons/cafe_24.svg'; import car_park_24 from '../../static/icons/car_park_24.svg'; -import catholic_church_14 from '../../static/icons/catholic_church_14.svg'; import catholic_church_24 from '../../static/icons/catholic_church_24.svg'; -import cemetery_14 from '../../static/icons/cemetery_14.svg'; import cemetery_24 from '../../static/icons/cemetery_24.svg'; import childrens_playground_24 from '../../static/icons/childrens_playground_24.svg'; -import cinemas_14 from '../../static/icons/cinemas_14.svg'; import cinemas_24 from '../../static/icons/cinemas_24.svg'; -import clothes_shop_14 from '../../static/icons/clothes_shop_14.svg'; import clothes_shop_24 from '../../static/icons/clothes_shop_24.svg'; -import college_14 from '../../static/icons/college_14.svg'; import college_24 from '../../static/icons/college_24.svg'; -import concert_hall_14 from '../../static/icons/concert_hall_14.svg'; import concert_hall_24 from '../../static/icons/concert_hall_24.svg'; -import confectionary_14 from '../../static/icons/confectionary_14.svg'; import confectionary_24 from '../../static/icons/confectionary_24.svg'; -import currency_exchange_14 from '../../static/icons/currency_exchange_14.svg'; import currency_exchange_24 from '../../static/icons/currency_exchange_24.svg'; -import dental_14 from '../../static/icons/dental_14.svg'; import dental_24 from '../../static/icons/dental_24.svg'; -import driving_school_14 from '../../static/icons/driving_school_14.svg'; import driving_school_24 from '../../static/icons/driving_school_24.svg'; -import drugstores_14 from '../../static/icons/drugstores_14.svg'; import drugstores_24 from '../../static/icons/drugstores_24.svg'; -import dry_cleaning_14 from '../../static/icons/dry_cleaning_14.svg'; import dry_cleaning_24 from '../../static/icons/dry_cleaning_24.svg'; -import equestrian_14 from '../../static/icons/equestrian_14.svg'; import equestrian_24 from '../../static/icons/equestrian_24.svg'; -import fallback_14 from '../../static/icons/fallback_14.svg'; import fallback_24 from '../../static/icons/fallback_24.svg'; -import fast_food_14 from '../../static/icons/fast_food_14.svg'; import fast_food_24 from '../../static/icons/fast_food_24.svg'; -import film_studio_14 from '../../static/icons/film_studio_14.svg'; import film_studio_24 from '../../static/icons/film_studio_24.svg'; -import fire_station_14 from '../../static/icons/fire_station_14.svg'; import fire_station_24 from '../../static/icons/fire_station_24.svg'; -import fitness_14 from '../../static/icons/fitness_14.svg'; import fitness_24 from '../../static/icons/fitness_24.svg'; -import flower_shop_14 from '../../static/icons/flower_shop_14.svg'; import flower_shop_24 from '../../static/icons/flower_shop_24.svg'; -import forest_14 from '../../static/icons/forest_14.svg'; import forest_24 from '../../static/icons/forest_24.svg'; import fountain_24 from '../../static/icons/fountain_24.svg'; -import furniture_store_14 from '../../static/icons/furniture_store_14.svg'; import furniture_store_24 from '../../static/icons/furniture_store_24.svg'; -import garden_14 from '../../static/icons/garden_14.svg'; import garden_24 from '../../static/icons/garden_24.svg'; -import gasstation_14 from '../../static/icons/gasstation_14.svg'; import gasstation_24 from '../../static/icons/gasstation_24.svg'; -import government_14 from '../../static/icons/government_14.svg'; import government_24 from '../../static/icons/government_24.svg'; -import hairdressers_14 from '../../static/icons/hairdressers_14.svg'; import hairdressers_24 from '../../static/icons/hairdressers_24.svg'; -import haulier_14 from '../../static/icons/haulier_14.svg'; import haulier_24 from '../../static/icons/haulier_24.svg'; import helicopter_24 from '../../static/icons/helicopter_24.svg'; -import hospital_14 from '../../static/icons/hospital_14.svg'; import hospital_24 from '../../static/icons/hospital_24.svg'; -import hotels_14 from '../../static/icons/hotels_14.svg'; import hotels_24 from '../../static/icons/hotels_24.svg'; -import hypermarket_14 from '../../static/icons/hypermarket_14.svg'; import hypermarket_24 from '../../static/icons/hypermarket_24.svg'; -import industrial_enterprise_14 from '../../static/icons/industrial_enterprise_14.svg'; import industrial_enterprise_24 from '../../static/icons/industrial_enterprise_24.svg'; -import information_14 from '../../static/icons/information_14.svg'; import information_24 from '../../static/icons/information_24.svg'; -import kindergarten_14 from '../../static/icons/kindergarten_14.svg'; import kindergarten_24 from '../../static/icons/kindergarten_24.svg'; -import landmark_14 from '../../static/icons/landmark_14.svg'; import landmark_24 from '../../static/icons/landmark_24.svg'; -import laundry_14 from '../../static/icons/laundry_14.svg'; import laundry_24 from '../../static/icons/laundry_24.svg'; -import library_14 from '../../static/icons/library_14.svg'; import library_24 from '../../static/icons/library_24.svg'; -import malls_14 from '../../static/icons/malls_14.svg'; import malls_24 from '../../static/icons/malls_24.svg'; -import medicine_14 from '../../static/icons/medicine_14.svg'; import medicine_24 from '../../static/icons/medicine_24.svg'; -import memorable_event_14 from '../../static/icons/memorable_event_14.svg'; import memorable_event_24 from '../../static/icons/memorable_event_24.svg'; -import metro_14 from '../../static/icons/metro_14.svg'; import metro_24 from '../../static/icons/metro_24.svg'; -import metro_bus_14 from '../../static/icons/metro_bus_14.svg'; import metro_bus_24 from '../../static/icons/metro_bus_24.svg'; -import metro_cable_14 from '../../static/icons/metro_cable_14.svg'; import metro_cable_24 from '../../static/icons/metro_cable_24.svg'; import metro_entrance_24 from '../../static/icons/metro_entrance_24.svg'; -import metro_funicular_14 from '../../static/icons/metro_funicular_14.svg'; import metro_funicular_24 from '../../static/icons/metro_funicular_24.svg'; -import metro_light_14 from '../../static/icons/metro_light_14.svg'; import metro_light_24 from '../../static/icons/metro_light_24.svg'; -import metro_monorail_14 from '../../static/icons/metro_monorail_14.svg'; import metro_monorail_24 from '../../static/icons/metro_monorail_24.svg'; -import metro_tram_14 from '../../static/icons/metro_tram_14.svg'; import metro_tram_24 from '../../static/icons/metro_tram_24.svg'; -import mobile_phones_14 from '../../static/icons/mobile_phones_14.svg'; import mobile_phones_24 from '../../static/icons/mobile_phones_24.svg'; import money_coin_24 from '../../static/icons/money_coin_24.svg'; import monument_24 from '../../static/icons/monument_24.svg'; -import mosque_14 from '../../static/icons/mosque_14.svg'; import mosque_24 from '../../static/icons/mosque_24.svg'; import mountain_24 from '../../static/icons/mountain_24.svg'; -import museum_14 from '../../static/icons/museum_14.svg'; import museum_24 from '../../static/icons/museum_24.svg'; -import office_14 from '../../static/icons/office_14.svg'; import office_24 from '../../static/icons/office_24.svg'; -import office_service_14 from '../../static/icons/office_service_14.svg'; import office_service_24 from '../../static/icons/office_service_24.svg'; -import orthodox_church_14 from '../../static/icons/orthodox_church_14.svg'; import orthodox_church_24 from '../../static/icons/orthodox_church_24.svg'; -import park_14 from '../../static/icons/park_14.svg'; import park_24 from '../../static/icons/park_24.svg'; import pavilion_24 from '../../static/icons/pavilion_24.svg'; import pet_playground_24 from '../../static/icons/pet_playground_24.svg'; -import petshop_14 from '../../static/icons/petshop_14.svg'; import petshop_24 from '../../static/icons/petshop_24.svg'; -import photo_14 from '../../static/icons/photo_14.svg'; import photo_24 from '../../static/icons/photo_24.svg'; import picnic_24 from '../../static/icons/picnic_24.svg'; import pier_24 from '../../static/icons/pier_24.svg'; import playground_24 from '../../static/icons/playground_24.svg'; -import police_14 from '../../static/icons/police_14.svg'; import police_24 from '../../static/icons/police_24.svg'; -import police_post_14 from '../../static/icons/police_post_14.svg'; import police_post_24 from '../../static/icons/police_post_24.svg'; -import port_14 from '../../static/icons/port_14.svg'; import port_24 from '../../static/icons/port_24.svg'; -import post_office_14 from '../../static/icons/post_office_14.svg'; import post_office_24 from '../../static/icons/post_office_24.svg'; -import printing_services_14 from '../../static/icons/printing_services_14.svg'; import printing_services_24 from '../../static/icons/printing_services_24.svg'; -import protestant_church_14 from '../../static/icons/protestant_church_14.svg'; import protestant_church_24 from '../../static/icons/protestant_church_24.svg'; -import racing_14 from '../../static/icons/racing_14.svg'; import racing_24 from '../../static/icons/racing_24.svg'; -import railway_14 from '../../static/icons/railway_14.svg'; import railway_24 from '../../static/icons/railway_24.svg'; -import railway_station_14 from '../../static/icons/railway_station_14.svg'; import railway_station_24 from '../../static/icons/railway_station_24.svg'; import recycling_24 from '../../static/icons/recycling_24.svg'; -import restaurants_14 from '../../static/icons/restaurants_14.svg'; import restaurants_24 from '../../static/icons/restaurants_24.svg'; -import rezervation_14 from '../../static/icons/rezervation_14.svg'; import rezervation_24 from '../../static/icons/rezervation_24.svg'; -import sanatorium_14 from '../../static/icons/sanatorium_14.svg'; import sanatorium_24 from '../../static/icons/sanatorium_24.svg'; -import science_14 from '../../static/icons/science_14.svg'; import science_24 from '../../static/icons/science_24.svg'; -import skating_rink_14 from '../../static/icons/skating_rink_14.svg'; import skating_rink_24 from '../../static/icons/skating_rink_24.svg'; -import software_14 from '../../static/icons/software_14.svg'; import software_24 from '../../static/icons/software_24.svg'; -import spa_14 from '../../static/icons/spa_14.svg'; import spa_24 from '../../static/icons/spa_24.svg'; -import sportcenter_14 from '../../static/icons/sportcenter_14.svg'; import sportcenter_24 from '../../static/icons/sportcenter_24.svg'; import spring_24 from '../../static/icons/spring_24.svg'; -import stadium_14 from '../../static/icons/stadium_14.svg'; import stadium_24 from '../../static/icons/stadium_24.svg'; -import supermarket_14 from '../../static/icons/supermarket_14.svg'; import supermarket_24 from '../../static/icons/supermarket_24.svg'; -import sushi_14 from '../../static/icons/sushi_14.svg'; import sushi_24 from '../../static/icons/sushi_24.svg'; -import swimming_pool_14 from '../../static/icons/swimming_pool_14.svg'; import swimming_pool_24 from '../../static/icons/swimming_pool_24.svg'; -import synagogue_14 from '../../static/icons/synagogue_14.svg'; import synagogue_24 from '../../static/icons/synagogue_24.svg'; -import tailor_14 from '../../static/icons/tailor_14.svg'; import tailor_24 from '../../static/icons/tailor_24.svg'; -import taxi_14 from '../../static/icons/taxi_14.svg'; import taxi_24 from '../../static/icons/taxi_24.svg'; -import theatre_14 from '../../static/icons/theatre_14.svg'; import theatre_24 from '../../static/icons/theatre_24.svg'; -import ticket_office_14 from '../../static/icons/ticket_office_14.svg'; import ticket_office_24 from '../../static/icons/ticket_office_24.svg'; -import tire_fitting_14 from '../../static/icons/tire_fitting_14.svg'; import tire_fitting_24 from '../../static/icons/tire_fitting_24.svg'; import tram_24 from '../../static/icons/tram_24.svg'; import trash_24 from '../../static/icons/trash_24.svg'; -import travel_agency_14 from '../../static/icons/travel_agency_14.svg'; import travel_agency_24 from '../../static/icons/travel_agency_24.svg'; import viewpoint_24 from '../../static/icons/viewpoint_24.svg'; import waterfall_24 from '../../static/icons/waterfall_24.svg'; import wc_24 from '../../static/icons/wc_24.svg'; -import zoo_14 from '../../static/icons/zoo_14.svg'; import zoo_24 from '../../static/icons/zoo_24.svg'; import type {Icons} from './types'; export const icons: Icons = { - airport: {normal: airport_24, small: airport_14}, - attraction: {normal: attraction_24, small: attraction_14}, - auto: {normal: auto_24, small: auto_14}, - aviary: {normal: aviary_24, small: null}, - baby_shop: {normal: baby_shop_24, small: baby_shop_14}, - banks: {normal: banks_24, small: banks_14}, - barbeque: {normal: barbeque_24, small: null}, - bars: {normal: bars_24, small: bars_14}, - beach: {normal: beach_24, small: beach_14}, - bench: {normal: bench_24, small: null}, - bike: {normal: bike_24, small: null}, - bike_rent: {normal: bike_rent_24, small: bike_rent_14}, - boat_station: {normal: boat_station_24, small: boat_station_14}, - bookstore: {normal: bookstore_24, small: bookstore_14}, - buddhism: {normal: buddhism_24, small: buddhism_14}, - building: {normal: building_24, small: null}, - bus: {normal: bus_24, small: null}, - cafe: {normal: cafe_24, small: cafe_14}, - car_park: {normal: car_park_24, small: null}, - catholic_church: {normal: catholic_church_24, small: catholic_church_14}, - cemetery: {normal: cemetery_24, small: cemetery_14}, - childrens_playground: {normal: childrens_playground_24, small: null}, - cinemas: {normal: cinemas_24, small: cinemas_14}, - clothes_shop: {normal: clothes_shop_24, small: clothes_shop_14}, - college: {normal: college_24, small: college_14}, - concert_hall: {normal: concert_hall_24, small: concert_hall_14}, - confectionary: {normal: confectionary_24, small: confectionary_14}, - currency_exchange: {normal: currency_exchange_24, small: currency_exchange_14}, - dental: {normal: dental_24, small: dental_14}, - driving_school: {normal: driving_school_24, small: driving_school_14}, - drugstores: {normal: drugstores_24, small: drugstores_14}, - dry_cleaning: {normal: dry_cleaning_24, small: dry_cleaning_14}, - equestrian: {normal: equestrian_24, small: equestrian_14}, - fallback: {normal: fallback_24, small: fallback_14}, - fast_food: {normal: fast_food_24, small: fast_food_14}, - film_studio: {normal: film_studio_24, small: film_studio_14}, - fire_station: {normal: fire_station_24, small: fire_station_14}, - fitness: {normal: fitness_24, small: fitness_14}, - flower_shop: {normal: flower_shop_24, small: flower_shop_14}, - forest: {normal: forest_24, small: forest_14}, - fountain: {normal: fountain_24, small: null}, - furniture_store: {normal: furniture_store_24, small: furniture_store_14}, - garden: {normal: garden_24, small: garden_14}, - gasstation: {normal: gasstation_24, small: gasstation_14}, - government: {normal: government_24, small: government_14}, - hairdressers: {normal: hairdressers_24, small: hairdressers_14}, - haulier: {normal: haulier_24, small: haulier_14}, - helicopter: {normal: helicopter_24, small: null}, - hospital: {normal: hospital_24, small: hospital_14}, - hotels: {normal: hotels_24, small: hotels_14}, - hypermarket: {normal: hypermarket_24, small: hypermarket_14}, - industrial_enterprise: {normal: industrial_enterprise_24, small: industrial_enterprise_14}, - information: {normal: information_24, small: information_14}, - kindergarten: {normal: kindergarten_24, small: kindergarten_14}, - landmark: {normal: landmark_24, small: landmark_14}, - laundry: {normal: laundry_24, small: laundry_14}, - library: {normal: library_24, small: library_14}, - malls: {normal: malls_24, small: malls_14}, - medicine: {normal: medicine_24, small: medicine_14}, - memorable_event: {normal: memorable_event_24, small: memorable_event_14}, - metro: {normal: metro_24, small: metro_14}, - metro_bus: {normal: metro_bus_24, small: metro_bus_14}, - metro_cable: {normal: metro_cable_24, small: metro_cable_14}, - metro_entrance: {normal: metro_entrance_24, small: null}, - metro_funicular: {normal: metro_funicular_24, small: metro_funicular_14}, - metro_light: {normal: metro_light_24, small: metro_light_14}, - metro_monorail: {normal: metro_monorail_24, small: metro_monorail_14}, - metro_tram: {normal: metro_tram_24, small: metro_tram_14}, - mobile_phones: {normal: mobile_phones_24, small: mobile_phones_14}, - money_coin: {normal: money_coin_24, small: null}, - monument: {normal: monument_24, small: null}, - mosque: {normal: mosque_24, small: mosque_14}, - mountain: {normal: mountain_24, small: null}, - museum: {normal: museum_24, small: museum_14}, - office: {normal: office_24, small: office_14}, - office_service: {normal: office_service_24, small: office_service_14}, - orthodox_church: {normal: orthodox_church_24, small: orthodox_church_14}, - park: {normal: park_24, small: park_14}, - pavilion: {normal: pavilion_24, small: null}, - pet_playground: {normal: pet_playground_24, small: null}, - petshop: {normal: petshop_24, small: petshop_14}, - photo: {normal: photo_24, small: photo_14}, - picnic: {normal: picnic_24, small: null}, - pier: {normal: pier_24, small: null}, - playground: {normal: playground_24, small: null}, - police: {normal: police_24, small: police_14}, - police_post: {normal: police_post_24, small: police_post_14}, - port: {normal: port_24, small: port_14}, - post_office: {normal: post_office_24, small: post_office_14}, - printing_services: {normal: printing_services_24, small: printing_services_14}, - protestant_church: {normal: protestant_church_24, small: protestant_church_14}, - racing: {normal: racing_24, small: racing_14}, - railway: {normal: railway_24, small: railway_14}, - railway_station: {normal: railway_station_24, small: railway_station_14}, - recycling: {normal: recycling_24, small: null}, - restaurants: {normal: restaurants_24, small: restaurants_14}, - rezervation: {normal: rezervation_24, small: rezervation_14}, - sanatorium: {normal: sanatorium_24, small: sanatorium_14}, - science: {normal: science_24, small: science_14}, - skating_rink: {normal: skating_rink_24, small: skating_rink_14}, - software: {normal: software_24, small: software_14}, - spa: {normal: spa_24, small: spa_14}, - sportcenter: {normal: sportcenter_24, small: sportcenter_14}, - spring: {normal: spring_24, small: null}, - stadium: {normal: stadium_24, small: stadium_14}, - supermarket: {normal: supermarket_24, small: supermarket_14}, - sushi: {normal: sushi_24, small: sushi_14}, - swimming_pool: {normal: swimming_pool_24, small: swimming_pool_14}, - synagogue: {normal: synagogue_24, small: synagogue_14}, - tailor: {normal: tailor_24, small: tailor_14}, - taxi: {normal: taxi_24, small: taxi_14}, - theatre: {normal: theatre_24, small: theatre_14}, - ticket_office: {normal: ticket_office_24, small: ticket_office_14}, - tire_fitting: {normal: tire_fitting_24, small: tire_fitting_14}, - tram: {normal: tram_24, small: null}, - trash: {normal: trash_24, small: null}, - travel_agency: {normal: travel_agency_24, small: travel_agency_14}, - viewpoint: {normal: viewpoint_24, small: null}, - waterfall: {normal: waterfall_24, small: null}, - wc: {normal: wc_24, small: null}, - zoo: {normal: zoo_24, small: zoo_14} + airport: airport_24, + attraction: attraction_24, + auto: auto_24, + aviary: aviary_24, + baby_shop: baby_shop_24, + banks: banks_24, + barbeque: barbeque_24, + bars: bars_24, + beach: beach_24, + bench: bench_24, + bike: bike_24, + bike_rent: bike_rent_24, + boat_station: boat_station_24, + bookstore: bookstore_24, + buddhism: buddhism_24, + building: building_24, + bus: bus_24, + cafe: cafe_24, + car_park: car_park_24, + catholic_church: catholic_church_24, + cemetery: cemetery_24, + childrens_playground: childrens_playground_24, + cinemas: cinemas_24, + clothes_shop: clothes_shop_24, + college: college_24, + concert_hall: concert_hall_24, + confectionary: confectionary_24, + currency_exchange: currency_exchange_24, + dental: dental_24, + driving_school: driving_school_24, + drugstores: drugstores_24, + dry_cleaning: dry_cleaning_24, + equestrian: equestrian_24, + fallback: fallback_24, + fast_food: fast_food_24, + film_studio: film_studio_24, + fire_station: fire_station_24, + fitness: fitness_24, + flower_shop: flower_shop_24, + forest: forest_24, + fountain: fountain_24, + furniture_store: furniture_store_24, + garden: garden_24, + gasstation: gasstation_24, + government: government_24, + hairdressers: hairdressers_24, + haulier: haulier_24, + helicopter: helicopter_24, + hospital: hospital_24, + hotels: hotels_24, + hypermarket: hypermarket_24, + industrial_enterprise: industrial_enterprise_24, + information: information_24, + kindergarten: kindergarten_24, + landmark: landmark_24, + laundry: laundry_24, + library: library_24, + malls: malls_24, + medicine: medicine_24, + memorable_event: memorable_event_24, + metro: metro_24, + metro_bus: metro_bus_24, + metro_cable: metro_cable_24, + metro_entrance: metro_entrance_24, + metro_funicular: metro_funicular_24, + metro_light: metro_light_24, + metro_monorail: metro_monorail_24, + metro_tram: metro_tram_24, + mobile_phones: mobile_phones_24, + money_coin: money_coin_24, + monument: monument_24, + mosque: mosque_24, + mountain: mountain_24, + museum: museum_24, + office: office_24, + office_service: office_service_24, + orthodox_church: orthodox_church_24, + park: park_24, + pavilion: pavilion_24, + pet_playground: pet_playground_24, + petshop: petshop_24, + photo: photo_24, + picnic: picnic_24, + pier: pier_24, + playground: playground_24, + police: police_24, + police_post: police_post_24, + port: port_24, + post_office: post_office_24, + printing_services: printing_services_24, + protestant_church: protestant_church_24, + racing: racing_24, + railway: railway_24, + railway_station: railway_station_24, + recycling: recycling_24, + restaurants: restaurants_24, + rezervation: rezervation_24, + sanatorium: sanatorium_24, + science: science_24, + skating_rink: skating_rink_24, + software: software_24, + spa: spa_24, + sportcenter: sportcenter_24, + spring: spring_24, + stadium: stadium_24, + supermarket: supermarket_24, + sushi: sushi_24, + swimming_pool: swimming_pool_24, + synagogue: synagogue_24, + tailor: tailor_24, + taxi: taxi_24, + theatre: theatre_24, + ticket_office: ticket_office_24, + tire_fitting: tire_fitting_24, + tram: tram_24, + trash: trash_24, + travel_agency: travel_agency_24, + viewpoint: viewpoint_24, + waterfall: waterfall_24, + wc: wc_24, + zoo: zoo_24 }; diff --git a/src/icons/index.ts b/src/icons/index.ts index bbe30f1..6cb8ce8 100644 --- a/src/icons/index.ts +++ b/src/icons/index.ts @@ -1,4 +1,3 @@ -export {IconColor, glyphColors, iconColors} from './icon-colors'; +export {IconColor, iconColors} from './icon-colors'; export {IconName} from './icon-name'; -export {IconSize} from './icon-size'; export {icons} from './icons'; diff --git a/src/icons/types.ts b/src/icons/types.ts index 6c7ce3f..3e3063b 100644 --- a/src/icons/types.ts +++ b/src/icons/types.ts @@ -1,8 +1,5 @@ import {IconName} from './icon-name'; -import {IconSize} from './icon-size'; export type Icons = { - [key in IconName]: { - [key in IconSize]: string | null; - }; + [key in IconName]: string | null; }; diff --git a/src/index.ts b/src/index.ts index 27d9aec..b4b1dad 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,2 +1,2 @@ export * from './controls'; -export * from './MMapDefaultMarker'; +export * from './markers'; diff --git a/src/markers/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg b/src/markers/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg new file mode 100644 index 0000000..09648f8 --- /dev/null +++ b/src/markers/MMapDefaultMarker/backgrounds/micro-poi-stroke.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/markers/MMapDefaultMarker/backgrounds/micro-poi.svg b/src/markers/MMapDefaultMarker/backgrounds/micro-poi.svg new file mode 100644 index 0000000..503e318 --- /dev/null +++ b/src/markers/MMapDefaultMarker/backgrounds/micro-poi.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/markers/MMapDefaultMarker/backgrounds/normal-pin-stroke.svg b/src/markers/MMapDefaultMarker/backgrounds/normal-pin-stroke.svg new file mode 100644 index 0000000..1c98d05 --- /dev/null +++ b/src/markers/MMapDefaultMarker/backgrounds/normal-pin-stroke.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/MMapDefaultMarker/backgrounds/normal-pin.svg b/src/markers/MMapDefaultMarker/backgrounds/normal-pin.svg similarity index 70% rename from src/MMapDefaultMarker/backgrounds/normal-pin.svg rename to src/markers/MMapDefaultMarker/backgrounds/normal-pin.svg index 4fe7f68..833776d 100644 --- a/src/MMapDefaultMarker/backgrounds/normal-pin.svg +++ b/src/markers/MMapDefaultMarker/backgrounds/normal-pin.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/markers/MMapDefaultMarker/backgrounds/small-poi-stroke.svg b/src/markers/MMapDefaultMarker/backgrounds/small-poi-stroke.svg new file mode 100644 index 0000000..5eb676d --- /dev/null +++ b/src/markers/MMapDefaultMarker/backgrounds/small-poi-stroke.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/markers/MMapDefaultMarker/backgrounds/small-poi.svg b/src/markers/MMapDefaultMarker/backgrounds/small-poi.svg new file mode 100644 index 0000000..834e8e6 --- /dev/null +++ b/src/markers/MMapDefaultMarker/backgrounds/small-poi.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/MMapDefaultMarker/index.css b/src/markers/MMapDefaultMarker/index.css similarity index 70% rename from src/MMapDefaultMarker/index.css rename to src/markers/MMapDefaultMarker/index.css index d26740a..fb643f1 100644 --- a/src/MMapDefaultMarker/index.css +++ b/src/markers/MMapDefaultMarker/index.css @@ -8,26 +8,19 @@ /* normal size */ .mappable--normal-pin { - display: flex; - flex-direction: column; - align-items: center; - row-gap: 2px; position: absolute; - transform: translate(-50%, calc(-100% + 4px)); + transform: translate(-50%, calc(-100% + 2px)); /* 2px - point radius */ filter: drop-shadow(0px 2px 6px rgba(24, 27, 34, 0.4)); } -.mappable--normal-icon { +.mappable--normal-pin_stroke { position: absolute; - transform: translate(-50%, calc(-4px - 2px - 51px + 10px)); /* 51px - pin height, 10px - offset */ + transform: translate(-50%, -50%); + z-index: -1; } -.mappable--normal-pin_circle { - display: block; - width: 4px; - height: 4px; - border-width: 2px; - border-style: solid; - border-radius: 50%; - box-shadow: 0px 1px 4px 0px rgba(24, 27, 34, 0.3); +.mappable--normal-icon { + position: absolute; + transform: translate(-50%, calc(-59px + 2px + 10px)); /* 59px - pin height, 2px - point radius, 10px - offset */ + z-index: 1; } /* small size */ diff --git a/src/MMapDefaultMarker/index.ts b/src/markers/MMapDefaultMarker/index.ts similarity index 74% rename from src/MMapDefaultMarker/index.ts rename to src/markers/MMapDefaultMarker/index.ts index b267052..2dd02ff 100644 --- a/src/MMapDefaultMarker/index.ts +++ b/src/markers/MMapDefaultMarker/index.ts @@ -1,15 +1,18 @@ import {MMapMarker, MMapMarkerProps} from '@mappable-world/mappable-types'; -import {IconColor, IconName, IconSize, glyphColors, iconColors, icons} from '../icons'; +import {IconColor, IconName, iconColors, icons} from '../../icons'; import microPoiStrokeSVG from './backgrounds/micro-poi-stroke.svg'; import microPoiSVG from './backgrounds/micro-poi.svg'; +import normalPinStrokeSVG from './backgrounds/normal-pin-stroke.svg'; import normalPinSVG from './backgrounds/normal-pin.svg'; import smallPoiStrokeSVG from './backgrounds/small-poi-stroke.svg'; import smallPoiSVG from './backgrounds/small-poi.svg'; import './index.css'; +const GLYPH_COLOR = '#FFFFFF'; + export type ThemesColor = {day: string; night: string}; export type MarkerColorProps = IconColor | ThemesColor; -export type MarkerSizeProps = IconSize | 'micro'; +export type MarkerSizeProps = 'normal' | 'small' | 'micro'; export type MMapDefaultMarkerProps = MMapMarkerProps & { iconName?: IconName; @@ -31,6 +34,7 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity void; constructor(props: MMapDefaultMarkerProps) { super(props); @@ -77,7 +81,9 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity this._updateTheme(), { + immediate: true + }); } protected _onUpdate(propsDiff: Partial): void { @@ -89,35 +95,44 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity('.mappable--normal-pin_circle'); - this._background.style.color = this._color.day; - circle.style.backgroundColor = this._color.day; - this._icon.style.color = glyphColors.day; - circle.style.borderColor = glyphColors.day; + this._background.style.color = backgroundColor; + this._stroke.style.color = strokeColor; + this._icon.style.color = strokeColor; break; case 'small': - this._background.style.color = this._color.day; - this._stroke.style.color = glyphColors.day; - this._icon.style.color = glyphColors.day; + this._background.style.color = backgroundColor; + this._stroke.style.color = strokeColor; + this._icon.style.color = strokeColor; break; case 'micro': - this._background.style.color = this._color.day; - this._stroke.style.color = glyphColors.day; + this._background.style.color = backgroundColor; + this._stroke.style.color = strokeColor; break; } } private _getIcon(): string { - if (this._props.size === 'micro' || this._props.iconName === undefined) { + const {size} = this._props; + if (size === 'micro' || this._props.iconName === undefined) { return ''; } - if (icons[this._props.iconName][this._props.size]) { - return icons[this._props.iconName][this._props.size]; + if (size === 'normal') { + return icons[this._props.iconName]; } - return icons[this._props.iconName].normal.replace(/ => { @@ -42,23 +38,13 @@ export const fetchFigmaColors = async (): Promise => { const canvas = file.document.children.find((child) => child.name === CANVAS_NAME) as Node<'CANVAS'>; const rubricsPalette = canvas.children.find((child) => child.name === PALETTE_NAME) as Node<'GROUP'>; const rubrics = rubricsPalette.children.filter(({name}) => !name.includes('fallback')) as Node<'GROUP'>[]; - let glyphDay: string = ''; - let glyphNight: string = ''; + const rubricColors = rubrics.reduce((rubricColors, {name, children}) => { const colors = children as Node<'RECTANGLE'>[]; const primaryDay = colors.find((color) => color.name === PRIMARY_DAY)?.fills[0].color; const primaryNight = colors.find((color) => color.name === PRIMARY_NIGHT)?.fills[0].color; - if (glyphDay.length === 0) { - const glyphDayColor = colors.find((color) => color.name === GLYPH_DAY)?.fills[0].color; - glyphDay = glyphDayColor ? rgbaToHex(glyphDayColor) : glyphDay; - } - if (glyphNight.length === 0) { - const glyphNightColor = colors.find((color) => color.name === GLYPH_NIGHT)?.fills[0].color; - glyphNight = glyphNightColor ? rgbaToHex(glyphNightColor) : glyphNight; - } - if (primaryDay === undefined || primaryNight === undefined) { return rubricColors; } @@ -76,7 +62,7 @@ export const fetchFigmaColors = async (): Promise => { }, new Map()); const colors = Array.from(dayNightColorsMap.entries()).map(([day, night]) => ({day, night})); - return {colors, glyphDay, glyphNight}; + return {colors}; }; const rgbaToHex = (rgba: Color): string => { diff --git a/tools/icons/fetch-icons.ts b/tools/icons/fetch-icons.ts index f823ba3..7a7573a 100644 --- a/tools/icons/fetch-icons.ts +++ b/tools/icons/fetch-icons.ts @@ -14,7 +14,7 @@ export type IconDescriptionWithLink = IconDescription & { /** The name of the canvas in the file from which the icons will be loaded */ const CANVAS_NAME = 'glyphs'; /** Available icon sizes specified in Figma */ -const AVAILABLE_SIZES = [14, 24]; +const AVAILABLE_SIZES = [24]; /** RegExp for getting the region code from the component name */ const REGION_CODE_REGEXP = /_([a-z]{2})_/; /** RegExp for getting the size from the component name*/ diff --git a/tools/icons/generate-colors.ts b/tools/icons/generate-colors.ts index 0f7cd8f..a035d77 100644 --- a/tools/icons/generate-colors.ts +++ b/tools/icons/generate-colors.ts @@ -16,7 +16,6 @@ export const generateColorsFile = async (fetchedColors: FetchedColors) => { export const iconColors = { ${colorsObjectValues.join('\n')} } as const; - export const glyphColors = {day:'${fetchedColors.glyphDay}',night:'${fetchedColors.glyphNight}'} as const; export type IconColor = keyof typeof iconColors`; const formattedContent = await prettierFormat(content, 'typescript'); diff --git a/tools/icons/generate-docs.ts b/tools/icons/generate-docs.ts index 5cd8286..8e229f7 100644 --- a/tools/icons/generate-docs.ts +++ b/tools/icons/generate-docs.ts @@ -7,8 +7,8 @@ import {DOCS_FILE_PATH, STATIC_ICONS_PATH} from './paths'; const WARNING = ``; const TITLE = '# List of supported icons'; const TABLE_HEADER = ` -| Name | Normal Size | Small Size | -| --- | --- | --- | +| Name | Normal Size | +| --- | --- | `; export const generateIconsDocsList = async (iconNames: string[]) => { @@ -16,18 +16,14 @@ export const generateIconsDocsList = async (iconNames: string[]) => { content += iconNames .map((name) => { const normalFileName = `${name}_24.svg`; - const smallFileName = `${name}_14.svg`; const normalAbsolutePath = path.join(STATIC_ICONS_PATH, normalFileName); - const smallAbsolutePath = path.join(STATIC_ICONS_PATH, smallFileName); const normalRelativePath = `../static/icons/${normalFileName}`; - const smallRelativePath = `../static/icons/${smallFileName}`; const normalIcon = existsSync(normalAbsolutePath) ? `![${name}](${normalRelativePath})` : `none`; - const smallIcon = existsSync(smallAbsolutePath) ? `![${name}](${smallRelativePath})` : `none`; - return `| ${name} | ${normalIcon} | ${smallIcon} |`; + return `| ${name} | ${normalIcon} |`; }) .join('\n'); const formattedContent = await prettierFormat(content, 'markdown'); diff --git a/tools/icons/generate-imports.ts b/tools/icons/generate-imports.ts index 78934b2..bd1225b 100644 --- a/tools/icons/generate-imports.ts +++ b/tools/icons/generate-imports.ts @@ -14,8 +14,7 @@ export const generateImports = async (iconsDescription: IconDescription[], iconN const iconNamesObject = iconNames .map((iconName) => { const normalIcon = iconsDescription.find((description) => description.name === `${iconName}_24`); - const smallIcon = iconsDescription.find((description) => description.name === `${iconName}_14`); - return `${iconName}:{normal:${normalIcon?.name ?? 'null'},small:${smallIcon?.name ?? 'null'}},`; + return `${iconName}:${normalIcon?.name ?? 'null'},`; }) .join('\n'); From 40a48235cb7d7923a902be6a3f443a9d1346cb83 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Thu, 11 Apr 2024 14:20:09 +0300 Subject: [PATCH 30/43] add hint to marker --- example/default-markers/common.ts | 70 ++++++++++++++++++-- src/markers/MMapDefaultMarker/index.css | 74 ++++++++++++++++++--- src/markers/MMapDefaultMarker/index.ts | 87 +++++++++++++++++++++---- 3 files changed, 203 insertions(+), 28 deletions(-) diff --git a/example/default-markers/common.ts b/example/default-markers/common.ts index 4baa6f2..b130b9c 100644 --- a/example/default-markers/common.ts +++ b/example/default-markers/common.ts @@ -17,15 +17,73 @@ export const MARKER_LOCATIONS: MMapDefaultMarkerProps[] = [ {coordinates: [CENTER[0], CENTER[1] + STEP / 2]}, {coordinates: [CENTER[0] + STEP, CENTER[1] + STEP / 2], size: 'micro'}, // airport icon - {iconName: 'viewpoint', coordinates: [CENTER[0] - STEP, CENTER[1] - STEP / 2], size: 'normal'}, - {iconName: 'viewpoint', coordinates: [CENTER[0], CENTER[1] - STEP / 2]}, - {iconName: 'viewpoint', coordinates: [CENTER[0] + STEP, CENTER[1] - STEP / 2], size: 'micro'}, + { + iconName: 'fallback', + coordinates: [CENTER[0] - STEP, CENTER[1] - STEP / 2], + size: 'normal', + title: 'Normal title', + subtitle: 'Normal subtitle' + }, + { + iconName: 'fallback', + coordinates: [CENTER[0], CENTER[1] - STEP / 2], + title: 'Normal title', + subtitle: 'Normal subtitle' + }, + { + iconName: 'fallback', + coordinates: [CENTER[0] + STEP, CENTER[1] - STEP / 2], + size: 'micro', + title: 'Normal title', + subtitle: 'Normal subtitle' + }, // color {color: 'steelblue', coordinates: [CENTER[0] - STEP, CENTER[1] + STEP], size: 'normal'}, {color: 'steelblue', coordinates: [CENTER[0], CENTER[1] + STEP]}, {color: 'steelblue', coordinates: [CENTER[0] + STEP, CENTER[1] + STEP], size: 'micro'}, // color and icon - {color: 'pink', iconName: 'attraction', coordinates: [CENTER[0] - STEP, CENTER[1] - STEP], size: 'normal'}, - {color: 'pink', iconName: 'attraction', coordinates: [CENTER[0], CENTER[1] - STEP]}, - {color: 'pink', iconName: 'attraction', coordinates: [CENTER[0] + STEP, CENTER[1] - STEP], size: 'micro'} + { + color: 'pink', + iconName: 'attraction', + coordinates: [CENTER[0] - STEP, CENTER[1] - STEP], + size: 'normal', + title: 'Overflow title Overflow title Overflow title Overflow title', + subtitle: 'Overflow subtitle Overflow subtitle Overflow subtitle Overflow subtitle' + }, + { + color: 'pink', + iconName: 'attraction', + coordinates: [CENTER[0], CENTER[1] - STEP], + title: 'Overflow title Overflow title Overflow title Overflow title', + subtitle: 'Overflow subtitle Overflow subtitle Overflow subtitle Overflow subtitle' + }, + { + color: 'pink', + iconName: 'attraction', + coordinates: [CENTER[0] + STEP, CENTER[1] - STEP], + size: 'micro', + title: 'Overflow title Overflow title Overflow title Overflow title', + subtitle: 'Overflow subtitle Overflow subtitle Overflow subtitle Overflow subtitle' + }, + // new group + { + color: 'darksalmon', + iconName: 'beach', + coordinates: [CENTER[0] - STEP, CENTER[1] - STEP * 1.5], + size: 'normal', + title: 'Normal title' + }, + { + color: 'darksalmon', + iconName: 'beach', + coordinates: [CENTER[0], CENTER[1] - STEP * 1.5], + title: 'Normal title' + }, + { + color: 'darksalmon', + iconName: 'beach', + coordinates: [CENTER[0] + STEP, CENTER[1] - STEP * 1.5], + size: 'micro', + title: 'Normal title' + } ]; diff --git a/src/markers/MMapDefaultMarker/index.css b/src/markers/MMapDefaultMarker/index.css index fb643f1..3b7dbdb 100644 --- a/src/markers/MMapDefaultMarker/index.css +++ b/src/markers/MMapDefaultMarker/index.css @@ -6,50 +6,108 @@ display: block; } +.mappable--hint { + box-sizing: border-box; + position: absolute; + display: inline-flex; + max-width: 190px; + padding: 4px 8px; + flex-direction: column; + border-radius: 8px; + background: rgba(255, 255, 255, 0.84); + line-height: 16px; + white-space: nowrap; +} +.mappable--hint-title { + display: block; + width: 100%; + color: #050d33; + font-size: 14px; + font-weight: 500; + overflow: hidden; + text-overflow: ellipsis; +} + +.mappable--hint-subtitle { + display: block; + width: 100%; + color: #7b7d85; + font-size: 12px; + font-weight: 400; + overflow: hidden; + text-overflow: ellipsis; +} + /* normal size */ -.mappable--normal-pin { +.mappable--pin .mappable--default-marker__background { position: absolute; transform: translate(-50%, calc(-100% + 2px)); /* 2px - point radius */ filter: drop-shadow(0px 2px 6px rgba(24, 27, 34, 0.4)); } -.mappable--normal-pin_stroke { +.mappable--pin .mappable--default-marker__stroke { position: absolute; transform: translate(-50%, -50%); z-index: -1; } -.mappable--normal-icon { +.mappable--pin .mappable--default-marker__icon { position: absolute; transform: translate(-50%, calc(-59px + 2px + 10px)); /* 59px - pin height, 2px - point radius, 10px - offset */ z-index: 1; } +.mappable--pin .mappable--hint { + transform: translate( + calc(44px / 2 + 5px), + calc(-59px + 2px + 10px) + ); /* 44px, 59px - pin width, height, 2px - point radius, 5px, 10px - offsets */ +} /* small size */ -.mappable--small-poi { +.mappable--small-poi .mappable--default-marker__background { position: absolute; transform: translate(-50%, -50%); } -.mappable--small-poi_stroke { +.mappable--small-poi .mappable--default-marker__stroke { position: absolute; transform: translate(-50%, -50%); z-index: -1; -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.1)); filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.1)); } -.mappable--small-icon { +.mappable--small-poi .mappable--default-marker__icon { position: absolute; z-index: 1; transform: translate(-50%, -50%); } +.mappable--small-poi .mappable--default-marker__icon svg { + transform: scale(calc(14 / 24)); +} +.mappable--small-poi .mappable--hint { + transform: translate(calc(24px / 2 + 4px), calc(-24px / 2)); /* 24px - poi size, 4px offset */ +} /* micro size */ -.mappable--micro-poi { +.mappable--micro-poi .mappable--default-marker__background { position: absolute; transform: translate(-50%, -50%); } -.mappable--micro-poi_stroke { +.mappable--micro-poi .mappable--default-marker__stroke { position: absolute; transform: translate(-50%, -50%); z-index: -1; -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.1)); filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.1)); } +.mappable--micro-poi .mappable--hint { + transform: translate(calc(14px / 2 + 8px), calc(-14px / 2 - 4px)); +} + +/* dark theme */ +.mappable--default-marker-point_dark .mappable--hint { + background: rgba(29, 30, 31, 0.84); +} +.mappable--default-marker-point_dark .mappable--hint-title { + color: #f2f5fa; +} +.mappable--default-marker-point_dark .mappable--hint-subtitle { + color: #7b7d85; +} diff --git a/src/markers/MMapDefaultMarker/index.ts b/src/markers/MMapDefaultMarker/index.ts index 2dd02ff..2714114 100644 --- a/src/markers/MMapDefaultMarker/index.ts +++ b/src/markers/MMapDefaultMarker/index.ts @@ -10,6 +10,21 @@ import './index.css'; const GLYPH_COLOR = '#FFFFFF'; +const MARKER_BASE_CLASS = 'mappable--default-marker-point'; +const MARKER_BASE_DARK_CLASS = 'mappable--default-marker-point_dark'; + +const NORMAL_SIZE_MARKER_CLASS = 'mappable--pin'; +const SMALL_SIZE_MARKER_CLASS = 'mappable--small-poi'; +const MICRO_SIZE_MARKER_CLASS = 'mappable--micro-poi'; + +const BACKGROUND_CLASS = 'mappable--default-marker__background'; +const STROKE_CLASS = 'mappable--default-marker__stroke'; +const ICON_CLASS = 'mappable--default-marker__icon'; + +const HINT_CLASS = 'mappable--hint'; +const HINT_TITLE_CLASS = 'mappable--hint-title'; +const HINT_SUBTITLE_CLASS = 'mappable--hint-subtitle'; + export type ThemesColor = {day: string; night: string}; export type MarkerColorProps = IconColor | ThemesColor; export type MarkerSizeProps = 'normal' | 'small' | 'micro'; @@ -18,6 +33,8 @@ export type MMapDefaultMarkerProps = MMapMarkerProps & { iconName?: IconName; color?: MarkerColorProps; size?: MarkerSizeProps; + title?: string; + subtitle?: string; }; const defaultProps = Object.freeze({color: 'darkgray', size: 'small'}); @@ -30,10 +47,16 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity void; constructor(props: MMapDefaultMarkerProps) { @@ -47,10 +70,15 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity Date: Thu, 11 Apr 2024 15:38:55 +0300 Subject: [PATCH 31/43] hovered hint --- example/default-markers/common.ts | 18 +++++++++++++++--- src/markers/MMapDefaultMarker/index.css | 24 ++++++++++++++++++++++-- src/markers/MMapDefaultMarker/index.ts | 13 +++++++++++-- 3 files changed, 48 insertions(+), 7 deletions(-) diff --git a/example/default-markers/common.ts b/example/default-markers/common.ts index b130b9c..d3e2de7 100644 --- a/example/default-markers/common.ts +++ b/example/default-markers/common.ts @@ -38,9 +38,21 @@ export const MARKER_LOCATIONS: MMapDefaultMarkerProps[] = [ subtitle: 'Normal subtitle' }, // color - {color: 'steelblue', coordinates: [CENTER[0] - STEP, CENTER[1] + STEP], size: 'normal'}, - {color: 'steelblue', coordinates: [CENTER[0], CENTER[1] + STEP]}, - {color: 'steelblue', coordinates: [CENTER[0] + STEP, CENTER[1] + STEP], size: 'micro'}, + { + color: 'steelblue', + coordinates: [CENTER[0] - STEP, CENTER[1] + STEP], + size: 'normal', + title: 'Hover hint', + staticHint: false + }, + {color: 'steelblue', coordinates: [CENTER[0], CENTER[1] + STEP], title: 'Hover hint', staticHint: false}, + { + color: 'steelblue', + coordinates: [CENTER[0] + STEP, CENTER[1] + STEP], + size: 'micro', + title: 'Hover hint', + staticHint: false + }, // color and icon { color: 'pink', diff --git a/src/markers/MMapDefaultMarker/index.css b/src/markers/MMapDefaultMarker/index.css index 3b7dbdb..2366de2 100644 --- a/src/markers/MMapDefaultMarker/index.css +++ b/src/markers/MMapDefaultMarker/index.css @@ -1,3 +1,14 @@ +@keyframes hint-hover { + from { + margin-left: -10px; + opacity: 0; + } + to { + margin-left: 0px; + opacity: 1; + } +} + .mappable--default-marker-point { position: absolute; cursor: pointer; @@ -9,7 +20,6 @@ .mappable--hint { box-sizing: border-box; position: absolute; - display: inline-flex; max-width: 190px; padding: 4px 8px; flex-direction: column; @@ -17,6 +27,17 @@ background: rgba(255, 255, 255, 0.84); line-height: 16px; white-space: nowrap; + z-index: -2; +} +.mappable--hint__stable { + display: inline-flex; +} +.mappable--hint__hovered { + display: none; +} +.mappable--default-marker-point:hover .mappable--hint__hovered { + display: inline-flex; + animation: hint-hover 200ms ease-out; } .mappable--hint-title { display: block; @@ -27,7 +48,6 @@ overflow: hidden; text-overflow: ellipsis; } - .mappable--hint-subtitle { display: block; width: 100%; diff --git a/src/markers/MMapDefaultMarker/index.ts b/src/markers/MMapDefaultMarker/index.ts index 2714114..fd7f210 100644 --- a/src/markers/MMapDefaultMarker/index.ts +++ b/src/markers/MMapDefaultMarker/index.ts @@ -24,6 +24,8 @@ const ICON_CLASS = 'mappable--default-marker__icon'; const HINT_CLASS = 'mappable--hint'; const HINT_TITLE_CLASS = 'mappable--hint-title'; const HINT_SUBTITLE_CLASS = 'mappable--hint-subtitle'; +const HINT_STABLE = 'mappable--hint__stable'; +const HINT_HOVERED = 'mappable--hint__hovered'; export type ThemesColor = {day: string; night: string}; export type MarkerColorProps = IconColor | ThemesColor; @@ -35,9 +37,10 @@ export type MMapDefaultMarkerProps = MMapMarkerProps & { size?: MarkerSizeProps; title?: string; subtitle?: string; + staticHint?: boolean; }; -const defaultProps = Object.freeze({color: 'darkgray', size: 'small'}); +const defaultProps = Object.freeze({color: 'darkgray', size: 'small', staticHint: true}); type DefaultProps = typeof defaultProps; type BackgroundAndIcon = {background: HTMLElement; stroke?: HTMLElement; icon?: HTMLElement}; @@ -134,6 +137,11 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity Date: Thu, 11 Apr 2024 16:15:49 +0300 Subject: [PATCH 32/43] refactor example --- example/default-markers/common.ts | 116 ++++++++---------------------- 1 file changed, 30 insertions(+), 86 deletions(-) diff --git a/example/default-markers/common.ts b/example/default-markers/common.ts index d3e2de7..146a531 100644 --- a/example/default-markers/common.ts +++ b/example/default-markers/common.ts @@ -11,91 +11,35 @@ export const LOCATION: MMapLocationRequest = {bounds: BOUNDS}; const CENTER: LngLat = [(BOUNDS[0][0] + BOUNDS[1][0]) / 2, (BOUNDS[0][1] + BOUNDS[1][1]) / 2]; const STEP = 0.3; +const getCoordinates = (row: number, col: number): LngLat => [CENTER[0] + row * STEP, CENTER[1] + col * STEP]; + export const MARKER_LOCATIONS: MMapDefaultMarkerProps[] = [ - // no icon markers - {coordinates: [CENTER[0] - STEP, CENTER[1] + STEP / 2], size: 'normal'}, - {coordinates: [CENTER[0], CENTER[1] + STEP / 2]}, - {coordinates: [CENTER[0] + STEP, CENTER[1] + STEP / 2], size: 'micro'}, - // airport icon - { - iconName: 'fallback', - coordinates: [CENTER[0] - STEP, CENTER[1] - STEP / 2], - size: 'normal', - title: 'Normal title', - subtitle: 'Normal subtitle' - }, - { - iconName: 'fallback', - coordinates: [CENTER[0], CENTER[1] - STEP / 2], - title: 'Normal title', - subtitle: 'Normal subtitle' - }, - { - iconName: 'fallback', - coordinates: [CENTER[0] + STEP, CENTER[1] - STEP / 2], - size: 'micro', - title: 'Normal title', - subtitle: 'Normal subtitle' - }, - // color - { - color: 'steelblue', - coordinates: [CENTER[0] - STEP, CENTER[1] + STEP], - size: 'normal', - title: 'Hover hint', - staticHint: false - }, - {color: 'steelblue', coordinates: [CENTER[0], CENTER[1] + STEP], title: 'Hover hint', staticHint: false}, - { - color: 'steelblue', - coordinates: [CENTER[0] + STEP, CENTER[1] + STEP], - size: 'micro', - title: 'Hover hint', - staticHint: false - }, - // color and icon - { - color: 'pink', - iconName: 'attraction', - coordinates: [CENTER[0] - STEP, CENTER[1] - STEP], - size: 'normal', - title: 'Overflow title Overflow title Overflow title Overflow title', - subtitle: 'Overflow subtitle Overflow subtitle Overflow subtitle Overflow subtitle' - }, - { - color: 'pink', - iconName: 'attraction', - coordinates: [CENTER[0], CENTER[1] - STEP], - title: 'Overflow title Overflow title Overflow title Overflow title', - subtitle: 'Overflow subtitle Overflow subtitle Overflow subtitle Overflow subtitle' - }, - { - color: 'pink', - iconName: 'attraction', - coordinates: [CENTER[0] + STEP, CENTER[1] - STEP], - size: 'micro', - title: 'Overflow title Overflow title Overflow title Overflow title', - subtitle: 'Overflow subtitle Overflow subtitle Overflow subtitle Overflow subtitle' - }, - // new group - { - color: 'darksalmon', - iconName: 'beach', - coordinates: [CENTER[0] - STEP, CENTER[1] - STEP * 1.5], - size: 'normal', - title: 'Normal title' - }, - { - color: 'darksalmon', - iconName: 'beach', - coordinates: [CENTER[0], CENTER[1] - STEP * 1.5], - title: 'Normal title' - }, - { - color: 'darksalmon', - iconName: 'beach', - coordinates: [CENTER[0] + STEP, CENTER[1] - STEP * 1.5], - size: 'micro', - title: 'Normal title' - } + // default marker + {coordinates: getCoordinates(-3, 0.5), size: 'normal'}, + {coordinates: getCoordinates(-3, 0), size: 'small'}, + {coordinates: getCoordinates(-3, -0.5), size: 'micro'}, + // fallback color marker + {coordinates: getCoordinates(-2, 0.5), size: 'normal', color: 'bluebell',iconName:'fallback'}, + {coordinates: getCoordinates(-2, 0), size: 'small', color: 'bluebell',iconName:'fallback'}, + {coordinates: getCoordinates(-2, -0.5), size: 'micro', color: 'bluebell',iconName:'fallback'}, + // color icon marker + {coordinates: getCoordinates(-1, 0.5), size: 'normal', color: 'ceil', iconName: 'attraction'}, + {coordinates: getCoordinates(-1, 0), size: 'small', color: 'ceil', iconName: 'attraction'}, + {coordinates: getCoordinates(-1, -0.5), size: 'micro', color: 'ceil', iconName: 'attraction'}, + // title hint + {coordinates: getCoordinates(0, 0.5), size: 'normal', color: 'darksalmon', iconName: 'restaurants',title:'Normal title'}, + {coordinates: getCoordinates(0, 0), size: 'small', color: 'darksalmon', iconName: 'restaurants',title:'Normal title'}, + {coordinates: getCoordinates(0, -0.5), size: 'micro', color: 'darksalmon', iconName: 'restaurants',title:'Normal title'}, + // title subtitle hint + {coordinates: getCoordinates(1, 0.5), size: 'normal', color: 'green', iconName: 'beach',title:'Normal title',subtitle:'Normal subtitle'}, + {coordinates: getCoordinates(1, 0), size: 'small', color: 'green', iconName: 'beach',title:'Normal title',subtitle:'Normal subtitle'}, + {coordinates: getCoordinates(1, -0.5), size: 'micro', color: 'green', iconName: 'beach',title:'Normal title',subtitle:'Normal subtitle'}, + // hover hint + {coordinates: getCoordinates(2, 0.5), size: 'normal', color: "pink", iconName: 'medicine',title:'Hover title',subtitle:'Hover subtitle',staticHint:false,}, + {coordinates: getCoordinates(2, 0), size: 'small', color: "pink", iconName: 'medicine',title:'Hover title',subtitle:'Hover subtitle',staticHint:false,}, + {coordinates: getCoordinates(2, -0.5), size: 'micro', color: "pink", iconName: 'medicine',title:'Hover title',subtitle:'Hover subtitle',staticHint:false,}, + // overflow hint + {coordinates: getCoordinates(3, 0.5), size: 'normal', color: "orchid", iconName: 'auto',title:'Overflow title Overflow title',subtitle:'Overflow subtitle Overflow subtitle'}, + {coordinates: getCoordinates(3, 0), size: 'small', color: "orchid", iconName: 'auto',title:'Overflow title Overflow title',subtitle:'Overflow subtitle Overflow subtitle'}, + {coordinates: getCoordinates(3, -0.5), size: 'micro', color: "orchid", iconName: 'auto',title:'Overflow title Overflow title',subtitle:'Overflow subtitle Overflow subtitle'}, ]; From 374945f85b2a1889cc4cff00ef5a4c5248976ef4 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Thu, 11 Apr 2024 17:42:18 +0300 Subject: [PATCH 33/43] update size --- example/default-markers/react/index.tsx | 16 ++++++-- example/default-markers/vue/index.ts | 22 ++++++++--- src/markers/MMapDefaultMarker/index.ts | 51 +++++++++++++++++++++---- 3 files changed, 73 insertions(+), 16 deletions(-) diff --git a/example/default-markers/react/index.tsx b/example/default-markers/react/index.tsx index 1eb967f..d1d47e9 100644 --- a/example/default-markers/react/index.tsx +++ b/example/default-markers/react/index.tsx @@ -1,4 +1,5 @@ import {LOCATION, MARKER_LOCATIONS} from '../common'; +import {MMapTheme} from '@mappable-world/mappable-types'; window.map = null; @@ -7,9 +8,10 @@ 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} = reactify.module(mappable); + const {MMap, MMapDefaultSchemeLayer, MMapDefaultFeaturesLayer, MMapControls, MMapControlButton} = + reactify.module(mappable); - const {useState} = React; + const {useState, useCallback} = React; const {MMapDefaultMarker} = reactify.module(await mappable.import('@mappable-world/mappable-default-ui-theme')); @@ -22,11 +24,19 @@ async function main() { function App() { const [location] = useState(LOCATION); + const [theme, setTheme] = useState('light'); + + const switchTheme = useCallback(() => { + setTheme(theme === 'light' ? 'dark' : 'light'); + }, [theme]); return ( - (map = x)}> + (map = x)}> + + + {MARKER_LOCATIONS.map((props, i) => ( ))} diff --git a/example/default-markers/vue/index.ts b/example/default-markers/vue/index.ts index 8a56d6a..9c1157e 100644 --- a/example/default-markers/vue/index.ts +++ b/example/default-markers/vue/index.ts @@ -1,3 +1,4 @@ +import {MMapTheme} from '@mappable-world/mappable-types'; import {LOCATION, MARKER_LOCATIONS} from '../common'; window.map = null; @@ -7,7 +8,8 @@ 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} = vuefy.module(mappable); + const {MMap, MMapDefaultSchemeLayer, MMapDefaultFeaturesLayer, MMapControls, MMapControlButton} = + vuefy.module(mappable); const {MMapDefaultMarker} = vuefy.module(await mappable.import('@mappable-world/mappable-default-ui-theme')); @@ -16,18 +18,28 @@ async function main() { MMap, MMapDefaultSchemeLayer, MMapDefaultFeaturesLayer, - MMapDefaultMarker + MMapDefaultMarker, + MMapControls, + MMapControlButton }, setup() { - const refMap = (ref) => { + const refMap = (ref: any) => { window.map = ref?.entity; }; - return {LOCATION, refMap, MARKER_LOCATIONS}; + const theme = Vue.ref('light'); + + const switchTheme = () => { + theme.value = theme.value === 'light' ? 'dark' : 'light'; + }; + return {LOCATION, refMap, MARKER_LOCATIONS, theme, switchTheme}; }, template: ` - + + + + ` }); diff --git a/src/markers/MMapDefaultMarker/index.ts b/src/markers/MMapDefaultMarker/index.ts index fd7f210..bac7579 100644 --- a/src/markers/MMapDefaultMarker/index.ts +++ b/src/markers/MMapDefaultMarker/index.ts @@ -1,11 +1,13 @@ import {MMapMarker, MMapMarkerProps} from '@mappable-world/mappable-types'; import {IconColor, IconName, iconColors, icons} from '../../icons'; + import microPoiStrokeSVG from './backgrounds/micro-poi-stroke.svg'; import microPoiSVG from './backgrounds/micro-poi.svg'; import normalPinStrokeSVG from './backgrounds/normal-pin-stroke.svg'; import normalPinSVG from './backgrounds/normal-pin.svg'; import smallPoiStrokeSVG from './backgrounds/small-poi-stroke.svg'; import smallPoiSVG from './backgrounds/small-poi.svg'; + import './index.css'; const GLYPH_COLOR = '#FFFFFF'; @@ -43,7 +45,7 @@ export type MMapDefaultMarkerProps = MMapMarkerProps & { const defaultProps = Object.freeze({color: 'darkgray', size: 'small', staticHint: true}); type DefaultProps = typeof defaultProps; -type BackgroundAndIcon = {background: HTMLElement; stroke?: HTMLElement; icon?: HTMLElement}; +type BackgroundAndIcon = {background: HTMLElement; stroke: HTMLElement; icon: HTMLElement}; export class MMapDefaultMarker extends mappable.MMapComplexEntity { static defaultProps = defaultProps; @@ -77,9 +79,7 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity): void { + const {title, subtitle} = this._props; if (propsDiff.color !== undefined) { this._color = this._getColor(); this._updateTheme(); } + if (propsDiff.size !== undefined) { + this._updateMarkerSize(); + this._updateSVG(); + } - const {title, subtitle} = this._props; this._titleHint.textContent = title ?? ''; this._subtitleHint.textContent = subtitle ?? ''; - if (title || subtitle) { + const hintAttached = this._markerElement.contains(this._hintContainer); + if (!hintAttached && (title !== undefined || subtitle !== undefined)) { this._markerElement.appendChild(this._hintContainer); - } else { + } else if (hintAttached && title === undefined && subtitle === undefined) { this._markerElement.removeChild(this._hintContainer); } @@ -194,6 +200,32 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity Date: Thu, 11 Apr 2024 17:43:40 +0300 Subject: [PATCH 34/43] download icons --- .gitignore | 4 +--- static/icons/airport_24.svg | 1 + static/icons/attraction_24.svg | 1 + static/icons/auto_24.svg | 1 + static/icons/aviary_24.svg | 1 + static/icons/baby_shop_24.svg | 1 + static/icons/banks_24.svg | 1 + static/icons/barbeque_24.svg | 1 + static/icons/bars_24.svg | 1 + static/icons/beach_24.svg | 1 + static/icons/bench_24.svg | 1 + static/icons/bike_24.svg | 1 + static/icons/bike_rent_24.svg | 1 + static/icons/boat_station_24.svg | 1 + static/icons/bookstore_24.svg | 1 + static/icons/buddhism_24.svg | 1 + static/icons/building_24.svg | 1 + static/icons/bus_24.svg | 1 + static/icons/cafe_24.svg | 1 + static/icons/car_park_24.svg | 1 + static/icons/catholic_church_24.svg | 1 + static/icons/cemetery_24.svg | 1 + static/icons/childrens_playground_24.svg | 1 + static/icons/cinemas_24.svg | 1 + static/icons/clothes_shop_24.svg | 1 + static/icons/college_24.svg | 1 + static/icons/concert_hall_24.svg | 1 + static/icons/confectionary_24.svg | 1 + static/icons/currency_exchange_24.svg | 1 + static/icons/dental_24.svg | 1 + static/icons/driving_school_24.svg | 1 + static/icons/drugstores_24.svg | 1 + static/icons/dry_cleaning_24.svg | 1 + static/icons/equestrian_24.svg | 1 + static/icons/fallback_24.svg | 1 + static/icons/fast_food_24.svg | 1 + static/icons/film_studio_24.svg | 1 + static/icons/fire_station_24.svg | 1 + static/icons/fitness_24.svg | 1 + static/icons/flower_shop_24.svg | 1 + static/icons/forest_24.svg | 1 + static/icons/fountain_24.svg | 1 + static/icons/furniture_store_24.svg | 1 + static/icons/garden_24.svg | 1 + static/icons/gasstation_24.svg | 1 + static/icons/government_24.svg | 1 + static/icons/hairdressers_24.svg | 1 + static/icons/haulier_24.svg | 1 + static/icons/helicopter_24.svg | 1 + static/icons/hospital_24.svg | 1 + static/icons/hotels_24.svg | 1 + static/icons/hypermarket_24.svg | 1 + static/icons/industrial_enterprise_24.svg | 1 + static/icons/information_24.svg | 1 + static/icons/kindergarten_24.svg | 1 + static/icons/landmark_24.svg | 1 + static/icons/laundry_24.svg | 1 + static/icons/library_24.svg | 1 + static/icons/malls_24.svg | 1 + static/icons/medicine_24.svg | 1 + static/icons/memorable_event_24.svg | 1 + static/icons/metro_24.svg | 1 + static/icons/metro_bus_24.svg | 1 + static/icons/metro_cable_24.svg | 1 + static/icons/metro_entrance_24.svg | 1 + static/icons/metro_funicular_24.svg | 1 + static/icons/metro_light_24.svg | 1 + static/icons/metro_monorail_24.svg | 1 + static/icons/metro_tram_24.svg | 1 + static/icons/mobile_phones_24.svg | 1 + static/icons/money_coin_24.svg | 1 + static/icons/monument_24.svg | 1 + static/icons/mosque_24.svg | 1 + static/icons/mountain_24.svg | 1 + static/icons/museum_24.svg | 1 + static/icons/office_24.svg | 1 + static/icons/office_service_24.svg | 1 + static/icons/orthodox_church_24.svg | 1 + static/icons/park_24.svg | 1 + static/icons/pavilion_24.svg | 1 + static/icons/pet_playground_24.svg | 1 + static/icons/petshop_24.svg | 1 + static/icons/photo_24.svg | 1 + static/icons/picnic_24.svg | 1 + static/icons/pier_24.svg | 1 + static/icons/playground_24.svg | 1 + static/icons/police_24.svg | 1 + static/icons/police_post_24.svg | 1 + static/icons/port_24.svg | 1 + static/icons/post_office_24.svg | 1 + static/icons/printing_services_24.svg | 1 + static/icons/protestant_church_24.svg | 1 + static/icons/racing_24.svg | 1 + static/icons/railway_24.svg | 1 + static/icons/railway_station_24.svg | 1 + static/icons/recycling_24.svg | 1 + static/icons/restaurants_24.svg | 1 + static/icons/rezervation_24.svg | 1 + static/icons/sanatorium_24.svg | 1 + static/icons/science_24.svg | 1 + static/icons/skating_rink_24.svg | 1 + static/icons/software_24.svg | 1 + static/icons/spa_24.svg | 1 + static/icons/sportcenter_24.svg | 1 + static/icons/spring_24.svg | 1 + static/icons/stadium_24.svg | 1 + static/icons/supermarket_24.svg | 1 + static/icons/sushi_24.svg | 1 + static/icons/swimming_pool_24.svg | 1 + static/icons/synagogue_24.svg | 1 + static/icons/tailor_24.svg | 1 + static/icons/taxi_24.svg | 1 + static/icons/theatre_24.svg | 1 + static/icons/ticket_office_24.svg | 1 + static/icons/tire_fitting_24.svg | 1 + static/icons/tram_24.svg | 1 + static/icons/trash_24.svg | 1 + static/icons/travel_agency_24.svg | 1 + static/icons/viewpoint_24.svg | 1 + static/icons/waterfall_24.svg | 1 + static/icons/wc_24.svg | 1 + static/icons/zoo_24.svg | 1 + 122 files changed, 122 insertions(+), 3 deletions(-) create mode 100644 static/icons/airport_24.svg create mode 100644 static/icons/attraction_24.svg create mode 100644 static/icons/auto_24.svg create mode 100644 static/icons/aviary_24.svg create mode 100644 static/icons/baby_shop_24.svg create mode 100644 static/icons/banks_24.svg create mode 100644 static/icons/barbeque_24.svg create mode 100644 static/icons/bars_24.svg create mode 100644 static/icons/beach_24.svg create mode 100644 static/icons/bench_24.svg create mode 100644 static/icons/bike_24.svg create mode 100644 static/icons/bike_rent_24.svg create mode 100644 static/icons/boat_station_24.svg create mode 100644 static/icons/bookstore_24.svg create mode 100644 static/icons/buddhism_24.svg create mode 100644 static/icons/building_24.svg create mode 100644 static/icons/bus_24.svg create mode 100644 static/icons/cafe_24.svg create mode 100644 static/icons/car_park_24.svg create mode 100644 static/icons/catholic_church_24.svg create mode 100644 static/icons/cemetery_24.svg create mode 100644 static/icons/childrens_playground_24.svg create mode 100644 static/icons/cinemas_24.svg create mode 100644 static/icons/clothes_shop_24.svg create mode 100644 static/icons/college_24.svg create mode 100644 static/icons/concert_hall_24.svg create mode 100644 static/icons/confectionary_24.svg create mode 100644 static/icons/currency_exchange_24.svg create mode 100644 static/icons/dental_24.svg create mode 100644 static/icons/driving_school_24.svg create mode 100644 static/icons/drugstores_24.svg create mode 100644 static/icons/dry_cleaning_24.svg create mode 100644 static/icons/equestrian_24.svg create mode 100644 static/icons/fallback_24.svg create mode 100644 static/icons/fast_food_24.svg create mode 100644 static/icons/film_studio_24.svg create mode 100644 static/icons/fire_station_24.svg create mode 100644 static/icons/fitness_24.svg create mode 100644 static/icons/flower_shop_24.svg create mode 100644 static/icons/forest_24.svg create mode 100644 static/icons/fountain_24.svg create mode 100644 static/icons/furniture_store_24.svg create mode 100644 static/icons/garden_24.svg create mode 100644 static/icons/gasstation_24.svg create mode 100644 static/icons/government_24.svg create mode 100644 static/icons/hairdressers_24.svg create mode 100644 static/icons/haulier_24.svg create mode 100644 static/icons/helicopter_24.svg create mode 100644 static/icons/hospital_24.svg create mode 100644 static/icons/hotels_24.svg create mode 100644 static/icons/hypermarket_24.svg create mode 100644 static/icons/industrial_enterprise_24.svg create mode 100644 static/icons/information_24.svg create mode 100644 static/icons/kindergarten_24.svg create mode 100644 static/icons/landmark_24.svg create mode 100644 static/icons/laundry_24.svg create mode 100644 static/icons/library_24.svg create mode 100644 static/icons/malls_24.svg create mode 100644 static/icons/medicine_24.svg create mode 100644 static/icons/memorable_event_24.svg create mode 100644 static/icons/metro_24.svg create mode 100644 static/icons/metro_bus_24.svg create mode 100644 static/icons/metro_cable_24.svg create mode 100644 static/icons/metro_entrance_24.svg create mode 100644 static/icons/metro_funicular_24.svg create mode 100644 static/icons/metro_light_24.svg create mode 100644 static/icons/metro_monorail_24.svg create mode 100644 static/icons/metro_tram_24.svg create mode 100644 static/icons/mobile_phones_24.svg create mode 100644 static/icons/money_coin_24.svg create mode 100644 static/icons/monument_24.svg create mode 100644 static/icons/mosque_24.svg create mode 100644 static/icons/mountain_24.svg create mode 100644 static/icons/museum_24.svg create mode 100644 static/icons/office_24.svg create mode 100644 static/icons/office_service_24.svg create mode 100644 static/icons/orthodox_church_24.svg create mode 100644 static/icons/park_24.svg create mode 100644 static/icons/pavilion_24.svg create mode 100644 static/icons/pet_playground_24.svg create mode 100644 static/icons/petshop_24.svg create mode 100644 static/icons/photo_24.svg create mode 100644 static/icons/picnic_24.svg create mode 100644 static/icons/pier_24.svg create mode 100644 static/icons/playground_24.svg create mode 100644 static/icons/police_24.svg create mode 100644 static/icons/police_post_24.svg create mode 100644 static/icons/port_24.svg create mode 100644 static/icons/post_office_24.svg create mode 100644 static/icons/printing_services_24.svg create mode 100644 static/icons/protestant_church_24.svg create mode 100644 static/icons/racing_24.svg create mode 100644 static/icons/railway_24.svg create mode 100644 static/icons/railway_station_24.svg create mode 100644 static/icons/recycling_24.svg create mode 100644 static/icons/restaurants_24.svg create mode 100644 static/icons/rezervation_24.svg create mode 100644 static/icons/sanatorium_24.svg create mode 100644 static/icons/science_24.svg create mode 100644 static/icons/skating_rink_24.svg create mode 100644 static/icons/software_24.svg create mode 100644 static/icons/spa_24.svg create mode 100644 static/icons/sportcenter_24.svg create mode 100644 static/icons/spring_24.svg create mode 100644 static/icons/stadium_24.svg create mode 100644 static/icons/supermarket_24.svg create mode 100644 static/icons/sushi_24.svg create mode 100644 static/icons/swimming_pool_24.svg create mode 100644 static/icons/synagogue_24.svg create mode 100644 static/icons/tailor_24.svg create mode 100644 static/icons/taxi_24.svg create mode 100644 static/icons/theatre_24.svg create mode 100644 static/icons/ticket_office_24.svg create mode 100644 static/icons/tire_fitting_24.svg create mode 100644 static/icons/tram_24.svg create mode 100644 static/icons/trash_24.svg create mode 100644 static/icons/travel_agency_24.svg create mode 100644 static/icons/viewpoint_24.svg create mode 100644 static/icons/waterfall_24.svg create mode 100644 static/icons/wc_24.svg create mode 100644 static/icons/zoo_24.svg diff --git a/.gitignore b/.gitignore index 7f96c5b..e0ddeaa 100644 --- a/.gitignore +++ b/.gitignore @@ -3,6 +3,4 @@ dist node_modules .env -.DS_Store -# FIXME: ignore static folder for a while -static \ No newline at end of file +.DS_Store \ No newline at end of file diff --git a/static/icons/airport_24.svg b/static/icons/airport_24.svg new file mode 100644 index 0000000..7c6839c --- /dev/null +++ b/static/icons/airport_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/attraction_24.svg b/static/icons/attraction_24.svg new file mode 100644 index 0000000..ef7f352 --- /dev/null +++ b/static/icons/attraction_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/auto_24.svg b/static/icons/auto_24.svg new file mode 100644 index 0000000..8737805 --- /dev/null +++ b/static/icons/auto_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/aviary_24.svg b/static/icons/aviary_24.svg new file mode 100644 index 0000000..0c2d2d6 --- /dev/null +++ b/static/icons/aviary_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/baby_shop_24.svg b/static/icons/baby_shop_24.svg new file mode 100644 index 0000000..9786799 --- /dev/null +++ b/static/icons/baby_shop_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/banks_24.svg b/static/icons/banks_24.svg new file mode 100644 index 0000000..2bba9b3 --- /dev/null +++ b/static/icons/banks_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/barbeque_24.svg b/static/icons/barbeque_24.svg new file mode 100644 index 0000000..588774e --- /dev/null +++ b/static/icons/barbeque_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/bars_24.svg b/static/icons/bars_24.svg new file mode 100644 index 0000000..1d7cd89 --- /dev/null +++ b/static/icons/bars_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/beach_24.svg b/static/icons/beach_24.svg new file mode 100644 index 0000000..1a1465e --- /dev/null +++ b/static/icons/beach_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/bench_24.svg b/static/icons/bench_24.svg new file mode 100644 index 0000000..7e6b868 --- /dev/null +++ b/static/icons/bench_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/bike_24.svg b/static/icons/bike_24.svg new file mode 100644 index 0000000..f184f37 --- /dev/null +++ b/static/icons/bike_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/bike_rent_24.svg b/static/icons/bike_rent_24.svg new file mode 100644 index 0000000..f184f37 --- /dev/null +++ b/static/icons/bike_rent_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/boat_station_24.svg b/static/icons/boat_station_24.svg new file mode 100644 index 0000000..31331ca --- /dev/null +++ b/static/icons/boat_station_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/bookstore_24.svg b/static/icons/bookstore_24.svg new file mode 100644 index 0000000..cfd40e0 --- /dev/null +++ b/static/icons/bookstore_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/buddhism_24.svg b/static/icons/buddhism_24.svg new file mode 100644 index 0000000..807816c --- /dev/null +++ b/static/icons/buddhism_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/building_24.svg b/static/icons/building_24.svg new file mode 100644 index 0000000..4cdeddd --- /dev/null +++ b/static/icons/building_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/bus_24.svg b/static/icons/bus_24.svg new file mode 100644 index 0000000..7c0d81c --- /dev/null +++ b/static/icons/bus_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/cafe_24.svg b/static/icons/cafe_24.svg new file mode 100644 index 0000000..05b5515 --- /dev/null +++ b/static/icons/cafe_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/car_park_24.svg b/static/icons/car_park_24.svg new file mode 100644 index 0000000..fb00be2 --- /dev/null +++ b/static/icons/car_park_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/catholic_church_24.svg b/static/icons/catholic_church_24.svg new file mode 100644 index 0000000..e96115b --- /dev/null +++ b/static/icons/catholic_church_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/cemetery_24.svg b/static/icons/cemetery_24.svg new file mode 100644 index 0000000..cbe44d8 --- /dev/null +++ b/static/icons/cemetery_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/childrens_playground_24.svg b/static/icons/childrens_playground_24.svg new file mode 100644 index 0000000..63cfc32 --- /dev/null +++ b/static/icons/childrens_playground_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/cinemas_24.svg b/static/icons/cinemas_24.svg new file mode 100644 index 0000000..e5cd208 --- /dev/null +++ b/static/icons/cinemas_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/clothes_shop_24.svg b/static/icons/clothes_shop_24.svg new file mode 100644 index 0000000..bbaf91d --- /dev/null +++ b/static/icons/clothes_shop_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/college_24.svg b/static/icons/college_24.svg new file mode 100644 index 0000000..9769b47 --- /dev/null +++ b/static/icons/college_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/concert_hall_24.svg b/static/icons/concert_hall_24.svg new file mode 100644 index 0000000..1061df7 --- /dev/null +++ b/static/icons/concert_hall_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/confectionary_24.svg b/static/icons/confectionary_24.svg new file mode 100644 index 0000000..5c360c4 --- /dev/null +++ b/static/icons/confectionary_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/currency_exchange_24.svg b/static/icons/currency_exchange_24.svg new file mode 100644 index 0000000..b4d2a6e --- /dev/null +++ b/static/icons/currency_exchange_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/dental_24.svg b/static/icons/dental_24.svg new file mode 100644 index 0000000..b7a059a --- /dev/null +++ b/static/icons/dental_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/driving_school_24.svg b/static/icons/driving_school_24.svg new file mode 100644 index 0000000..c22d208 --- /dev/null +++ b/static/icons/driving_school_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/drugstores_24.svg b/static/icons/drugstores_24.svg new file mode 100644 index 0000000..359aec6 --- /dev/null +++ b/static/icons/drugstores_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/dry_cleaning_24.svg b/static/icons/dry_cleaning_24.svg new file mode 100644 index 0000000..386a004 --- /dev/null +++ b/static/icons/dry_cleaning_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/equestrian_24.svg b/static/icons/equestrian_24.svg new file mode 100644 index 0000000..0f6820c --- /dev/null +++ b/static/icons/equestrian_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/fallback_24.svg b/static/icons/fallback_24.svg new file mode 100644 index 0000000..8953d2d --- /dev/null +++ b/static/icons/fallback_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/fast_food_24.svg b/static/icons/fast_food_24.svg new file mode 100644 index 0000000..5904915 --- /dev/null +++ b/static/icons/fast_food_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/film_studio_24.svg b/static/icons/film_studio_24.svg new file mode 100644 index 0000000..e5cd208 --- /dev/null +++ b/static/icons/film_studio_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/fire_station_24.svg b/static/icons/fire_station_24.svg new file mode 100644 index 0000000..73765ac --- /dev/null +++ b/static/icons/fire_station_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/fitness_24.svg b/static/icons/fitness_24.svg new file mode 100644 index 0000000..7e9fd41 --- /dev/null +++ b/static/icons/fitness_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/flower_shop_24.svg b/static/icons/flower_shop_24.svg new file mode 100644 index 0000000..7e41c29 --- /dev/null +++ b/static/icons/flower_shop_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/forest_24.svg b/static/icons/forest_24.svg new file mode 100644 index 0000000..4b0de7d --- /dev/null +++ b/static/icons/forest_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/fountain_24.svg b/static/icons/fountain_24.svg new file mode 100644 index 0000000..ff48095 --- /dev/null +++ b/static/icons/fountain_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/furniture_store_24.svg b/static/icons/furniture_store_24.svg new file mode 100644 index 0000000..ed2899d --- /dev/null +++ b/static/icons/furniture_store_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/garden_24.svg b/static/icons/garden_24.svg new file mode 100644 index 0000000..dac7d14 --- /dev/null +++ b/static/icons/garden_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/gasstation_24.svg b/static/icons/gasstation_24.svg new file mode 100644 index 0000000..bc7147f --- /dev/null +++ b/static/icons/gasstation_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/government_24.svg b/static/icons/government_24.svg new file mode 100644 index 0000000..1eb5815 --- /dev/null +++ b/static/icons/government_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/hairdressers_24.svg b/static/icons/hairdressers_24.svg new file mode 100644 index 0000000..f1f9cff --- /dev/null +++ b/static/icons/hairdressers_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/haulier_24.svg b/static/icons/haulier_24.svg new file mode 100644 index 0000000..5ae0211 --- /dev/null +++ b/static/icons/haulier_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/helicopter_24.svg b/static/icons/helicopter_24.svg new file mode 100644 index 0000000..d00d50d --- /dev/null +++ b/static/icons/helicopter_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/hospital_24.svg b/static/icons/hospital_24.svg new file mode 100644 index 0000000..e9bd5cf --- /dev/null +++ b/static/icons/hospital_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/hotels_24.svg b/static/icons/hotels_24.svg new file mode 100644 index 0000000..72a49bb --- /dev/null +++ b/static/icons/hotels_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/hypermarket_24.svg b/static/icons/hypermarket_24.svg new file mode 100644 index 0000000..06d12c8 --- /dev/null +++ b/static/icons/hypermarket_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/industrial_enterprise_24.svg b/static/icons/industrial_enterprise_24.svg new file mode 100644 index 0000000..cbdc443 --- /dev/null +++ b/static/icons/industrial_enterprise_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/information_24.svg b/static/icons/information_24.svg new file mode 100644 index 0000000..086648e --- /dev/null +++ b/static/icons/information_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/kindergarten_24.svg b/static/icons/kindergarten_24.svg new file mode 100644 index 0000000..9786799 --- /dev/null +++ b/static/icons/kindergarten_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/landmark_24.svg b/static/icons/landmark_24.svg new file mode 100644 index 0000000..76104d1 --- /dev/null +++ b/static/icons/landmark_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/laundry_24.svg b/static/icons/laundry_24.svg new file mode 100644 index 0000000..de18ee6 --- /dev/null +++ b/static/icons/laundry_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/library_24.svg b/static/icons/library_24.svg new file mode 100644 index 0000000..20a8fdb --- /dev/null +++ b/static/icons/library_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/malls_24.svg b/static/icons/malls_24.svg new file mode 100644 index 0000000..6aa6a5f --- /dev/null +++ b/static/icons/malls_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/medicine_24.svg b/static/icons/medicine_24.svg new file mode 100644 index 0000000..e9bd5cf --- /dev/null +++ b/static/icons/medicine_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/memorable_event_24.svg b/static/icons/memorable_event_24.svg new file mode 100644 index 0000000..76104d1 --- /dev/null +++ b/static/icons/memorable_event_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/metro_24.svg b/static/icons/metro_24.svg new file mode 100644 index 0000000..81b8ef1 --- /dev/null +++ b/static/icons/metro_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/metro_bus_24.svg b/static/icons/metro_bus_24.svg new file mode 100644 index 0000000..7c0d81c --- /dev/null +++ b/static/icons/metro_bus_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/metro_cable_24.svg b/static/icons/metro_cable_24.svg new file mode 100644 index 0000000..e99a406 --- /dev/null +++ b/static/icons/metro_cable_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/metro_entrance_24.svg b/static/icons/metro_entrance_24.svg new file mode 100644 index 0000000..4b6ff22 --- /dev/null +++ b/static/icons/metro_entrance_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/metro_funicular_24.svg b/static/icons/metro_funicular_24.svg new file mode 100644 index 0000000..a276b29 --- /dev/null +++ b/static/icons/metro_funicular_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/metro_light_24.svg b/static/icons/metro_light_24.svg new file mode 100644 index 0000000..408f6cd --- /dev/null +++ b/static/icons/metro_light_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/metro_monorail_24.svg b/static/icons/metro_monorail_24.svg new file mode 100644 index 0000000..a8257d0 --- /dev/null +++ b/static/icons/metro_monorail_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/metro_tram_24.svg b/static/icons/metro_tram_24.svg new file mode 100644 index 0000000..e15bdaa --- /dev/null +++ b/static/icons/metro_tram_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/mobile_phones_24.svg b/static/icons/mobile_phones_24.svg new file mode 100644 index 0000000..bf50bab --- /dev/null +++ b/static/icons/mobile_phones_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/money_coin_24.svg b/static/icons/money_coin_24.svg new file mode 100644 index 0000000..e49389d --- /dev/null +++ b/static/icons/money_coin_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/monument_24.svg b/static/icons/monument_24.svg new file mode 100644 index 0000000..cae05e6 --- /dev/null +++ b/static/icons/monument_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/mosque_24.svg b/static/icons/mosque_24.svg new file mode 100644 index 0000000..3ab8384 --- /dev/null +++ b/static/icons/mosque_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/mountain_24.svg b/static/icons/mountain_24.svg new file mode 100644 index 0000000..5db4c06 --- /dev/null +++ b/static/icons/mountain_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/museum_24.svg b/static/icons/museum_24.svg new file mode 100644 index 0000000..face4dc --- /dev/null +++ b/static/icons/museum_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/office_24.svg b/static/icons/office_24.svg new file mode 100644 index 0000000..20073f7 --- /dev/null +++ b/static/icons/office_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/office_service_24.svg b/static/icons/office_service_24.svg new file mode 100644 index 0000000..20073f7 --- /dev/null +++ b/static/icons/office_service_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/orthodox_church_24.svg b/static/icons/orthodox_church_24.svg new file mode 100644 index 0000000..10d8939 --- /dev/null +++ b/static/icons/orthodox_church_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/park_24.svg b/static/icons/park_24.svg new file mode 100644 index 0000000..5c6dc3a --- /dev/null +++ b/static/icons/park_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/pavilion_24.svg b/static/icons/pavilion_24.svg new file mode 100644 index 0000000..6691d7e --- /dev/null +++ b/static/icons/pavilion_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/pet_playground_24.svg b/static/icons/pet_playground_24.svg new file mode 100644 index 0000000..7b3511b --- /dev/null +++ b/static/icons/pet_playground_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/petshop_24.svg b/static/icons/petshop_24.svg new file mode 100644 index 0000000..0dc14f3 --- /dev/null +++ b/static/icons/petshop_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/photo_24.svg b/static/icons/photo_24.svg new file mode 100644 index 0000000..57bd18c --- /dev/null +++ b/static/icons/photo_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/picnic_24.svg b/static/icons/picnic_24.svg new file mode 100644 index 0000000..4026a1f --- /dev/null +++ b/static/icons/picnic_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/pier_24.svg b/static/icons/pier_24.svg new file mode 100644 index 0000000..12e5a8c --- /dev/null +++ b/static/icons/pier_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/playground_24.svg b/static/icons/playground_24.svg new file mode 100644 index 0000000..184e5f0 --- /dev/null +++ b/static/icons/playground_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/police_24.svg b/static/icons/police_24.svg new file mode 100644 index 0000000..310e586 --- /dev/null +++ b/static/icons/police_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/police_post_24.svg b/static/icons/police_post_24.svg new file mode 100644 index 0000000..310e586 --- /dev/null +++ b/static/icons/police_post_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/port_24.svg b/static/icons/port_24.svg new file mode 100644 index 0000000..31331ca --- /dev/null +++ b/static/icons/port_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/post_office_24.svg b/static/icons/post_office_24.svg new file mode 100644 index 0000000..0edbe03 --- /dev/null +++ b/static/icons/post_office_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/printing_services_24.svg b/static/icons/printing_services_24.svg new file mode 100644 index 0000000..dda65e7 --- /dev/null +++ b/static/icons/printing_services_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/protestant_church_24.svg b/static/icons/protestant_church_24.svg new file mode 100644 index 0000000..e96115b --- /dev/null +++ b/static/icons/protestant_church_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/racing_24.svg b/static/icons/racing_24.svg new file mode 100644 index 0000000..36e2a17 --- /dev/null +++ b/static/icons/racing_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/railway_24.svg b/static/icons/railway_24.svg new file mode 100644 index 0000000..16bbadd --- /dev/null +++ b/static/icons/railway_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/railway_station_24.svg b/static/icons/railway_station_24.svg new file mode 100644 index 0000000..16bbadd --- /dev/null +++ b/static/icons/railway_station_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/recycling_24.svg b/static/icons/recycling_24.svg new file mode 100644 index 0000000..109ab85 --- /dev/null +++ b/static/icons/recycling_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/restaurants_24.svg b/static/icons/restaurants_24.svg new file mode 100644 index 0000000..dad9435 --- /dev/null +++ b/static/icons/restaurants_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/rezervation_24.svg b/static/icons/rezervation_24.svg new file mode 100644 index 0000000..6b3333b --- /dev/null +++ b/static/icons/rezervation_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/sanatorium_24.svg b/static/icons/sanatorium_24.svg new file mode 100644 index 0000000..60a698b --- /dev/null +++ b/static/icons/sanatorium_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/science_24.svg b/static/icons/science_24.svg new file mode 100644 index 0000000..621d7ce --- /dev/null +++ b/static/icons/science_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/skating_rink_24.svg b/static/icons/skating_rink_24.svg new file mode 100644 index 0000000..ce6782e --- /dev/null +++ b/static/icons/skating_rink_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/software_24.svg b/static/icons/software_24.svg new file mode 100644 index 0000000..1442370 --- /dev/null +++ b/static/icons/software_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/spa_24.svg b/static/icons/spa_24.svg new file mode 100644 index 0000000..deeeb29 --- /dev/null +++ b/static/icons/spa_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/sportcenter_24.svg b/static/icons/sportcenter_24.svg new file mode 100644 index 0000000..204e87a --- /dev/null +++ b/static/icons/sportcenter_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/spring_24.svg b/static/icons/spring_24.svg new file mode 100644 index 0000000..5aba127 --- /dev/null +++ b/static/icons/spring_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/stadium_24.svg b/static/icons/stadium_24.svg new file mode 100644 index 0000000..c1fbe4d --- /dev/null +++ b/static/icons/stadium_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/supermarket_24.svg b/static/icons/supermarket_24.svg new file mode 100644 index 0000000..acc4fb7 --- /dev/null +++ b/static/icons/supermarket_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/sushi_24.svg b/static/icons/sushi_24.svg new file mode 100644 index 0000000..8fb2ca6 --- /dev/null +++ b/static/icons/sushi_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/swimming_pool_24.svg b/static/icons/swimming_pool_24.svg new file mode 100644 index 0000000..18bef0d --- /dev/null +++ b/static/icons/swimming_pool_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/synagogue_24.svg b/static/icons/synagogue_24.svg new file mode 100644 index 0000000..4a23c7c --- /dev/null +++ b/static/icons/synagogue_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/tailor_24.svg b/static/icons/tailor_24.svg new file mode 100644 index 0000000..40fb928 --- /dev/null +++ b/static/icons/tailor_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/taxi_24.svg b/static/icons/taxi_24.svg new file mode 100644 index 0000000..b762696 --- /dev/null +++ b/static/icons/taxi_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/theatre_24.svg b/static/icons/theatre_24.svg new file mode 100644 index 0000000..45ed609 --- /dev/null +++ b/static/icons/theatre_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/ticket_office_24.svg b/static/icons/ticket_office_24.svg new file mode 100644 index 0000000..91e4532 --- /dev/null +++ b/static/icons/ticket_office_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/tire_fitting_24.svg b/static/icons/tire_fitting_24.svg new file mode 100644 index 0000000..b1f6f5d --- /dev/null +++ b/static/icons/tire_fitting_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/tram_24.svg b/static/icons/tram_24.svg new file mode 100644 index 0000000..e15bdaa --- /dev/null +++ b/static/icons/tram_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/trash_24.svg b/static/icons/trash_24.svg new file mode 100644 index 0000000..3352e86 --- /dev/null +++ b/static/icons/trash_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/travel_agency_24.svg b/static/icons/travel_agency_24.svg new file mode 100644 index 0000000..903d56d --- /dev/null +++ b/static/icons/travel_agency_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/viewpoint_24.svg b/static/icons/viewpoint_24.svg new file mode 100644 index 0000000..6e4d088 --- /dev/null +++ b/static/icons/viewpoint_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/waterfall_24.svg b/static/icons/waterfall_24.svg new file mode 100644 index 0000000..3fb0acc --- /dev/null +++ b/static/icons/waterfall_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/wc_24.svg b/static/icons/wc_24.svg new file mode 100644 index 0000000..7c5922f --- /dev/null +++ b/static/icons/wc_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/zoo_24.svg b/static/icons/zoo_24.svg new file mode 100644 index 0000000..4914b81 --- /dev/null +++ b/static/icons/zoo_24.svg @@ -0,0 +1 @@ + \ No newline at end of file From cc828bf51d4e1b112baab421c4e7f558556378c9 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Thu, 11 Apr 2024 17:49:00 +0300 Subject: [PATCH 35/43] fix --- .gitignore | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.gitignore b/.gitignore index e0ddeaa..3ba0c2c 100644 --- a/.gitignore +++ b/.gitignore @@ -3,4 +3,4 @@ dist node_modules .env -.DS_Store \ No newline at end of file +.DS_Store From d16d9a64fea168384cd5194ff79c1683af6e16a9 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Fri, 12 Apr 2024 14:36:20 +0300 Subject: [PATCH 36/43] update package --- package-lock.json | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/package-lock.json b/package-lock.json index 998e9c6..9eb7d64 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10843,6 +10843,12 @@ "@types/node": "*" } }, + "@types/lodash": { + "version": "4.17.0", + "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.0.tgz", + "integrity": "sha512-t7dhREVv6dbNj0q17X12j7yDG4bD/DHYX7o5/DbDxobP0HnGPgpRz2Ej77aL7TZT3DSw13fqUTj8J4mMnqa7WA==", + "dev": true + }, "@types/mime": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.5.tgz", @@ -14555,6 +14561,15 @@ "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==", "dev": true }, + "nanospinner": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/nanospinner/-/nanospinner-1.1.0.tgz", + "integrity": "sha512-yFvNYMig4AthKYfHFl1sLj7B2nkHL4lzdig4osvl9/LdGbXwrdFRoqBS98gsEsOakr0yH+r5NZ/1Y9gdVB8trA==", + "dev": true, + "requires": { + "picocolors": "^1.0.0" + } + }, "natural-compare": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz", From 02e8d2b16063aae57fd35272d5308572f577c776 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Mon, 15 Apr 2024 14:26:48 +0300 Subject: [PATCH 37/43] add vuefy options --- src/markers/MMapDefaultMarker/index.ts | 2 ++ src/markers/MMapDefaultMarker/vue/index.ts | 33 ++++++++++++++++++++++ 2 files changed, 35 insertions(+) create mode 100644 src/markers/MMapDefaultMarker/vue/index.ts diff --git a/src/markers/MMapDefaultMarker/index.ts b/src/markers/MMapDefaultMarker/index.ts index bac7579..2bf51fb 100644 --- a/src/markers/MMapDefaultMarker/index.ts +++ b/src/markers/MMapDefaultMarker/index.ts @@ -1,5 +1,6 @@ import {MMapMarker, MMapMarkerProps} from '@mappable-world/mappable-types'; import {IconColor, IconName, iconColors, icons} from '../../icons'; +import {MMapDefaultMarkerVuefyOptions} from './vue'; import microPoiStrokeSVG from './backgrounds/micro-poi-stroke.svg'; import microPoiSVG from './backgrounds/micro-poi.svg'; @@ -49,6 +50,7 @@ type BackgroundAndIcon = {background: HTMLElement; stroke: HTMLElement; icon: HT export class MMapDefaultMarker extends mappable.MMapComplexEntity { static defaultProps = defaultProps; + static [mappable.optionsKeyVuefy] = MMapDefaultMarkerVuefyOptions; private _marker: MMapMarker; private _markerElement: HTMLElement; diff --git a/src/markers/MMapDefaultMarker/vue/index.ts b/src/markers/MMapDefaultMarker/vue/index.ts new file mode 100644 index 0000000..c72bcdf --- /dev/null +++ b/src/markers/MMapDefaultMarker/vue/index.ts @@ -0,0 +1,33 @@ +import {CustomVuefyOptions} from '@mappable-world/mappable-types/modules/vuefy'; +import type TVue from '@vue/runtime-core'; +import {MMapDefaultMarker, MarkerColorProps, MarkerSizeProps} from '../'; +import {MMapFeatureProps, MMapMarkerEventHandler} from '@mappable-world/mappable-types'; +import {IconName} from '../../../icons'; + +export const MMapDefaultMarkerVuefyOptions: CustomVuefyOptions = { + props: { + coordinates: {type: Object, required: true}, + source: String, + zIndex: {type: Number, default: 0}, + properties: Object, + id: String, + disableRoundCoordinates: {type: Boolean, default: undefined}, + hideOutsideViewport: {type: [Object, Boolean], default: false}, + draggable: {type: Boolean, default: false}, + mapFollowsOnDrag: {type: [Boolean, Object]}, + onDragStart: Function as TVue.PropType, + onDragEnd: Function as TVue.PropType, + onDragMove: Function as TVue.PropType, + blockEvents: {type: Boolean, default: undefined}, + blockBehaviors: {type: Boolean, default: undefined}, + onDoubleClick: Function as TVue.PropType, + onClick: Function as TVue.PropType, + onFastClick: Function as TVue.PropType, + iconName: {type: String as TVue.PropType}, + color: {type: Object as TVue.PropType, default: 'darkgray'}, + size: {type: String as TVue.PropType, default: 'small'}, + title: {type: String}, + subtitle: {type: String}, + staticHint: {type: Boolean, default: true} + } +}; From 4d8b8a05b9fd88cd086dc5a154add87afc1b2037 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Thu, 18 Apr 2024 18:09:08 +0300 Subject: [PATCH 38/43] took chunk function from lodash --- tools/icons/fetch-icons.ts | 4 ++-- tools/utils/make-chunks.ts | 10 ---------- 2 files changed, 2 insertions(+), 12 deletions(-) delete mode 100644 tools/utils/make-chunks.ts diff --git a/tools/icons/fetch-icons.ts b/tools/icons/fetch-icons.ts index 7a7573a..80ae5f5 100644 --- a/tools/icons/fetch-icons.ts +++ b/tools/icons/fetch-icons.ts @@ -1,6 +1,6 @@ import {Api as FigmaApi, isNodeType, Node} from 'figma-api'; import {GetImageResult} from 'figma-api/lib/api-types'; -import {makeChunks} from '../utils/make-chunks'; +import lodashChunk from 'lodash/chunk'; export type IconDescription = { componentId: string; @@ -115,7 +115,7 @@ const getImageLinks = async ( fileId: string, api: FigmaApi ): Promise => { - const chunks = makeChunks(descriptions, ICONS_PER_CHUNK); + const chunks = lodashChunk(descriptions, ICONS_PER_CHUNK); const linkChunks = await Promise.all( chunks.map((chunk) => api.getImage(fileId, { diff --git a/tools/utils/make-chunks.ts b/tools/utils/make-chunks.ts deleted file mode 100644 index 5debb13..0000000 --- a/tools/utils/make-chunks.ts +++ /dev/null @@ -1,10 +0,0 @@ -export const makeChunks = (input: T[], perChunk: number): T[][] => { - return input.reduce((chunks, item, index) => { - const chunkIndex = Math.floor(index / perChunk); - if (!chunks[chunkIndex]) { - chunks[chunkIndex] = []; - } - chunks[chunkIndex].push(item); - return chunks; - }, []); -}; From 1114cef06c92052f03fbd1a97ea78d7a95462fd6 Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Thu, 18 Apr 2024 18:10:02 +0300 Subject: [PATCH 39/43] rename generated files --- docs/{icons.md => icons.generated.md} | 0 src/icons/{icon-colors.ts => icon-colors.generated.ts} | 0 src/icons/{icon-name.ts => icon-name.generated.ts} | 0 src/icons/{icons.ts => icons.generated.ts} | 0 src/icons/index.ts | 6 +++--- src/icons/types.ts | 2 +- static/icons/cafe_24.svg | 2 +- tools/icons/generate-colors.ts | 2 +- tools/icons/generate-docs.ts | 2 +- tools/icons/generate-imports.ts | 2 +- tools/icons/generate-types.ts | 2 +- 11 files changed, 9 insertions(+), 9 deletions(-) rename docs/{icons.md => icons.generated.md} (100%) rename src/icons/{icon-colors.ts => icon-colors.generated.ts} (100%) rename src/icons/{icon-name.ts => icon-name.generated.ts} (100%) rename src/icons/{icons.ts => icons.generated.ts} (100%) diff --git a/docs/icons.md b/docs/icons.generated.md similarity index 100% rename from docs/icons.md rename to docs/icons.generated.md diff --git a/src/icons/icon-colors.ts b/src/icons/icon-colors.generated.ts similarity index 100% rename from src/icons/icon-colors.ts rename to src/icons/icon-colors.generated.ts diff --git a/src/icons/icon-name.ts b/src/icons/icon-name.generated.ts similarity index 100% rename from src/icons/icon-name.ts rename to src/icons/icon-name.generated.ts diff --git a/src/icons/icons.ts b/src/icons/icons.generated.ts similarity index 100% rename from src/icons/icons.ts rename to src/icons/icons.generated.ts diff --git a/src/icons/index.ts b/src/icons/index.ts index 6cb8ce8..b536d5c 100644 --- a/src/icons/index.ts +++ b/src/icons/index.ts @@ -1,3 +1,3 @@ -export {IconColor, iconColors} from './icon-colors'; -export {IconName} from './icon-name'; -export {icons} from './icons'; +export {IconColor, iconColors} from './icon-colors.generated'; +export {IconName} from './icon-name.generated'; +export {icons} from './icons.generated'; diff --git a/src/icons/types.ts b/src/icons/types.ts index 3e3063b..a6e7657 100644 --- a/src/icons/types.ts +++ b/src/icons/types.ts @@ -1,4 +1,4 @@ -import {IconName} from './icon-name'; +import {IconName} from './icon-name.generated'; export type Icons = { [key in IconName]: string | null; diff --git a/static/icons/cafe_24.svg b/static/icons/cafe_24.svg index 05b5515..a27232b 100644 --- a/static/icons/cafe_24.svg +++ b/static/icons/cafe_24.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/tools/icons/generate-colors.ts b/tools/icons/generate-colors.ts index a035d77..4f263aa 100644 --- a/tools/icons/generate-colors.ts +++ b/tools/icons/generate-colors.ts @@ -19,5 +19,5 @@ export const generateColorsFile = async (fetchedColors: FetchedColors) => { export type IconColor = keyof typeof iconColors`; const formattedContent = await prettierFormat(content, 'typescript'); - await fs.writeFile(path.join(SRC_ICONS_PATH, 'icon-colors.ts'), formattedContent); + await fs.writeFile(path.join(SRC_ICONS_PATH, 'icon-colors.generated.ts'), formattedContent); }; diff --git a/tools/icons/generate-docs.ts b/tools/icons/generate-docs.ts index 8e229f7..b7753c6 100644 --- a/tools/icons/generate-docs.ts +++ b/tools/icons/generate-docs.ts @@ -27,5 +27,5 @@ export const generateIconsDocsList = async (iconNames: string[]) => { }) .join('\n'); const formattedContent = await prettierFormat(content, 'markdown'); - await fs.writeFile(path.join(DOCS_FILE_PATH, 'icons.md'), formattedContent); + await fs.writeFile(path.join(DOCS_FILE_PATH, 'icons.generated.md'), formattedContent); }; diff --git a/tools/icons/generate-imports.ts b/tools/icons/generate-imports.ts index bd1225b..8cca0ad 100644 --- a/tools/icons/generate-imports.ts +++ b/tools/icons/generate-imports.ts @@ -27,5 +27,5 @@ export const generateImports = async (iconsDescription: IconDescription[], iconN ${iconNamesObject} }`; const formattedContent = await prettierFormat(fileContent, 'typescript'); - await fs.writeFile(path.join(SRC_ICONS_PATH, 'icons.ts'), formattedContent); + await fs.writeFile(path.join(SRC_ICONS_PATH, 'icons.generated.ts'), formattedContent); }; diff --git a/tools/icons/generate-types.ts b/tools/icons/generate-types.ts index da8758c..b5cf9c9 100644 --- a/tools/icons/generate-types.ts +++ b/tools/icons/generate-types.ts @@ -10,5 +10,5 @@ export const generateIconsTypes = async (iconNames: string[]) => { export type ${type} =${iconNames.map((name) => `| '${name}'`).join('\n')}; `; const formattedContent = await prettierFormat(content, 'typescript'); - await fs.writeFile(path.join(SRC_ICONS_PATH, 'icon-name.ts'), formattedContent); + await fs.writeFile(path.join(SRC_ICONS_PATH, 'icon-name.generated.ts'), formattedContent); }; From 1a6e863fc536a6d0319e26c49594cc7a4d2c6ead Mon Sep 17 00:00:00 2001 From: Matthew Kalinin Date: Fri, 19 Apr 2024 17:49:13 +0300 Subject: [PATCH 40/43] fix --- src/markers/MMapDefaultMarker/index.css | 4 ++-- src/markers/MMapDefaultMarker/index.ts | 8 +------- tools/icons/fetch-icons.ts | 2 +- 3 files changed, 4 insertions(+), 10 deletions(-) diff --git a/src/markers/MMapDefaultMarker/index.css b/src/markers/MMapDefaultMarker/index.css index 2366de2..94157dd 100644 --- a/src/markers/MMapDefaultMarker/index.css +++ b/src/markers/MMapDefaultMarker/index.css @@ -1,4 +1,4 @@ -@keyframes hint-hover { +@keyframes mappable--default-marker-hint-hover { from { margin-left: -10px; opacity: 0; @@ -37,7 +37,7 @@ } .mappable--default-marker-point:hover .mappable--hint__hovered { display: inline-flex; - animation: hint-hover 200ms ease-out; + animation: mappable--default-marker-hint-hover 200ms ease-out; } .mappable--hint-title { display: block; diff --git a/src/markers/MMapDefaultMarker/index.ts b/src/markers/MMapDefaultMarker/index.ts index 2bf51fb..0864a70 100644 --- a/src/markers/MMapDefaultMarker/index.ts +++ b/src/markers/MMapDefaultMarker/index.ts @@ -64,8 +64,6 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity void; - constructor(props: MMapDefaultMarkerProps) { super(props); } @@ -120,7 +118,7 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity this._updateTheme(), { + this._watchContext(mappable.ThemeContext, () => this._updateTheme(), { immediate: true }); } @@ -153,10 +151,6 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity Date: Fri, 19 Apr 2024 18:04:37 +0300 Subject: [PATCH 41/43] unknown size throw error --- src/markers/MMapDefaultMarker/index.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/markers/MMapDefaultMarker/index.ts b/src/markers/MMapDefaultMarker/index.ts index 0864a70..487b950 100644 --- a/src/markers/MMapDefaultMarker/index.ts +++ b/src/markers/MMapDefaultMarker/index.ts @@ -100,6 +100,10 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity Date: Thu, 25 Apr 2024 13:30:09 +0300 Subject: [PATCH 42/43] remove __impl --- src/markers/MMapDefaultMarker/index.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/markers/MMapDefaultMarker/index.ts b/src/markers/MMapDefaultMarker/index.ts index 487b950..fcad78e 100644 --- a/src/markers/MMapDefaultMarker/index.ts +++ b/src/markers/MMapDefaultMarker/index.ts @@ -68,10 +68,6 @@ export class MMapDefaultMarker extends mappable.MMapComplexEntity Date: Fri, 26 Apr 2024 10:51:20 +0300 Subject: [PATCH 43/43] sync new icons --- docs/icons.generated.md | 8 ++++++++ src/icons/icon-name.generated.ts | 8 ++++++++ src/icons/icons.generated.ts | 16 ++++++++++++++++ static/icons/airfield_24.svg | 1 + static/icons/animation_24.svg | 1 + static/icons/armenian_church_24.svg | 1 + static/icons/festival_24.svg | 1 + static/icons/metro_24.svg | 2 +- static/icons/metro_entrance_24.svg | 2 +- static/icons/nail_studio_24.svg | 1 + static/icons/stage_24.svg | 1 + static/icons/stenograffia_24.svg | 1 + static/icons/waterpark_24.svg | 1 + 13 files changed, 42 insertions(+), 2 deletions(-) create mode 100644 static/icons/airfield_24.svg create mode 100644 static/icons/animation_24.svg create mode 100644 static/icons/armenian_church_24.svg create mode 100644 static/icons/festival_24.svg create mode 100644 static/icons/nail_studio_24.svg create mode 100644 static/icons/stage_24.svg create mode 100644 static/icons/stenograffia_24.svg create mode 100644 static/icons/waterpark_24.svg diff --git a/docs/icons.generated.md b/docs/icons.generated.md index fb76816..4f18a46 100644 --- a/docs/icons.generated.md +++ b/docs/icons.generated.md @@ -4,7 +4,10 @@ | Name | Normal Size | | --------------------- | ---------------------------------------------------------------------- | +| airfield | ![airfield](../static/icons/airfield_24.svg) | | airport | ![airport](../static/icons/airport_24.svg) | +| animation | ![animation](../static/icons/animation_24.svg) | +| armenian_church | ![armenian_church](../static/icons/armenian_church_24.svg) | | attraction | ![attraction](../static/icons/attraction_24.svg) | | auto | ![auto](../static/icons/auto_24.svg) | | aviary | ![aviary](../static/icons/aviary_24.svg) | @@ -39,6 +42,7 @@ | equestrian | ![equestrian](../static/icons/equestrian_24.svg) | | fallback | ![fallback](../static/icons/fallback_24.svg) | | fast_food | ![fast_food](../static/icons/fast_food_24.svg) | +| festival | ![festival](../static/icons/festival_24.svg) | | film_studio | ![film_studio](../static/icons/film_studio_24.svg) | | fire_station | ![fire_station](../static/icons/fire_station_24.svg) | | fitness | ![fitness](../static/icons/fitness_24.svg) | @@ -78,6 +82,7 @@ | mosque | ![mosque](../static/icons/mosque_24.svg) | | mountain | ![mountain](../static/icons/mountain_24.svg) | | museum | ![museum](../static/icons/museum_24.svg) | +| nail_studio | ![nail_studio](../static/icons/nail_studio_24.svg) | | office | ![office](../static/icons/office_24.svg) | | office_service | ![office_service](../static/icons/office_service_24.svg) | | orthodox_church | ![orthodox_church](../static/icons/orthodox_church_24.svg) | @@ -109,6 +114,8 @@ | sportcenter | ![sportcenter](../static/icons/sportcenter_24.svg) | | spring | ![spring](../static/icons/spring_24.svg) | | stadium | ![stadium](../static/icons/stadium_24.svg) | +| stage | ![stage](../static/icons/stage_24.svg) | +| stenograffia | ![stenograffia](../static/icons/stenograffia_24.svg) | | supermarket | ![supermarket](../static/icons/supermarket_24.svg) | | sushi | ![sushi](../static/icons/sushi_24.svg) | | swimming_pool | ![swimming_pool](../static/icons/swimming_pool_24.svg) | @@ -123,5 +130,6 @@ | travel_agency | ![travel_agency](../static/icons/travel_agency_24.svg) | | viewpoint | ![viewpoint](../static/icons/viewpoint_24.svg) | | waterfall | ![waterfall](../static/icons/waterfall_24.svg) | +| waterpark | ![waterpark](../static/icons/waterpark_24.svg) | | wc | ![wc](../static/icons/wc_24.svg) | | zoo | ![zoo](../static/icons/zoo_24.svg) | diff --git a/src/icons/icon-name.generated.ts b/src/icons/icon-name.generated.ts index a69b724..141e0c7 100644 --- a/src/icons/icon-name.generated.ts +++ b/src/icons/icon-name.generated.ts @@ -1,6 +1,9 @@ /** Don't edit manually. Generated by script: ./tools/icons/generate-types.ts */ export type IconName = + | 'airfield' | 'airport' + | 'animation' + | 'armenian_church' | 'attraction' | 'auto' | 'aviary' @@ -35,6 +38,7 @@ export type IconName = | 'equestrian' | 'fallback' | 'fast_food' + | 'festival' | 'film_studio' | 'fire_station' | 'fitness' @@ -74,6 +78,7 @@ export type IconName = | 'mosque' | 'mountain' | 'museum' + | 'nail_studio' | 'office' | 'office_service' | 'orthodox_church' @@ -105,6 +110,8 @@ export type IconName = | 'sportcenter' | 'spring' | 'stadium' + | 'stage' + | 'stenograffia' | 'supermarket' | 'sushi' | 'swimming_pool' @@ -119,5 +126,6 @@ export type IconName = | 'travel_agency' | 'viewpoint' | 'waterfall' + | 'waterpark' | 'wc' | 'zoo'; diff --git a/src/icons/icons.generated.ts b/src/icons/icons.generated.ts index ae767aa..c7f5ea4 100644 --- a/src/icons/icons.generated.ts +++ b/src/icons/icons.generated.ts @@ -1,5 +1,8 @@ /** Don't edit manually. Generated by script: ./tools/icons/generate-imports.ts */ +import airfield_24 from '../../static/icons/airfield_24.svg'; import airport_24 from '../../static/icons/airport_24.svg'; +import animation_24 from '../../static/icons/animation_24.svg'; +import armenian_church_24 from '../../static/icons/armenian_church_24.svg'; import attraction_24 from '../../static/icons/attraction_24.svg'; import auto_24 from '../../static/icons/auto_24.svg'; import aviary_24 from '../../static/icons/aviary_24.svg'; @@ -34,6 +37,7 @@ import dry_cleaning_24 from '../../static/icons/dry_cleaning_24.svg'; import equestrian_24 from '../../static/icons/equestrian_24.svg'; import fallback_24 from '../../static/icons/fallback_24.svg'; import fast_food_24 from '../../static/icons/fast_food_24.svg'; +import festival_24 from '../../static/icons/festival_24.svg'; import film_studio_24 from '../../static/icons/film_studio_24.svg'; import fire_station_24 from '../../static/icons/fire_station_24.svg'; import fitness_24 from '../../static/icons/fitness_24.svg'; @@ -73,6 +77,7 @@ import monument_24 from '../../static/icons/monument_24.svg'; import mosque_24 from '../../static/icons/mosque_24.svg'; import mountain_24 from '../../static/icons/mountain_24.svg'; import museum_24 from '../../static/icons/museum_24.svg'; +import nail_studio_24 from '../../static/icons/nail_studio_24.svg'; import office_24 from '../../static/icons/office_24.svg'; import office_service_24 from '../../static/icons/office_service_24.svg'; import orthodox_church_24 from '../../static/icons/orthodox_church_24.svg'; @@ -104,6 +109,8 @@ import spa_24 from '../../static/icons/spa_24.svg'; import sportcenter_24 from '../../static/icons/sportcenter_24.svg'; import spring_24 from '../../static/icons/spring_24.svg'; import stadium_24 from '../../static/icons/stadium_24.svg'; +import stage_24 from '../../static/icons/stage_24.svg'; +import stenograffia_24 from '../../static/icons/stenograffia_24.svg'; import supermarket_24 from '../../static/icons/supermarket_24.svg'; import sushi_24 from '../../static/icons/sushi_24.svg'; import swimming_pool_24 from '../../static/icons/swimming_pool_24.svg'; @@ -118,12 +125,16 @@ import trash_24 from '../../static/icons/trash_24.svg'; import travel_agency_24 from '../../static/icons/travel_agency_24.svg'; import viewpoint_24 from '../../static/icons/viewpoint_24.svg'; import waterfall_24 from '../../static/icons/waterfall_24.svg'; +import waterpark_24 from '../../static/icons/waterpark_24.svg'; import wc_24 from '../../static/icons/wc_24.svg'; import zoo_24 from '../../static/icons/zoo_24.svg'; import type {Icons} from './types'; export const icons: Icons = { + airfield: airfield_24, airport: airport_24, + animation: animation_24, + armenian_church: armenian_church_24, attraction: attraction_24, auto: auto_24, aviary: aviary_24, @@ -158,6 +169,7 @@ export const icons: Icons = { equestrian: equestrian_24, fallback: fallback_24, fast_food: fast_food_24, + festival: festival_24, film_studio: film_studio_24, fire_station: fire_station_24, fitness: fitness_24, @@ -197,6 +209,7 @@ export const icons: Icons = { mosque: mosque_24, mountain: mountain_24, museum: museum_24, + nail_studio: nail_studio_24, office: office_24, office_service: office_service_24, orthodox_church: orthodox_church_24, @@ -228,6 +241,8 @@ export const icons: Icons = { sportcenter: sportcenter_24, spring: spring_24, stadium: stadium_24, + stage: stage_24, + stenograffia: stenograffia_24, supermarket: supermarket_24, sushi: sushi_24, swimming_pool: swimming_pool_24, @@ -242,6 +257,7 @@ export const icons: Icons = { travel_agency: travel_agency_24, viewpoint: viewpoint_24, waterfall: waterfall_24, + waterpark: waterpark_24, wc: wc_24, zoo: zoo_24 }; diff --git a/static/icons/airfield_24.svg b/static/icons/airfield_24.svg new file mode 100644 index 0000000..19f3b2a --- /dev/null +++ b/static/icons/airfield_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/animation_24.svg b/static/icons/animation_24.svg new file mode 100644 index 0000000..5af7796 --- /dev/null +++ b/static/icons/animation_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/armenian_church_24.svg b/static/icons/armenian_church_24.svg new file mode 100644 index 0000000..e96115b --- /dev/null +++ b/static/icons/armenian_church_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/festival_24.svg b/static/icons/festival_24.svg new file mode 100644 index 0000000..51efc61 --- /dev/null +++ b/static/icons/festival_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/metro_24.svg b/static/icons/metro_24.svg index 81b8ef1..2138591 100644 --- a/static/icons/metro_24.svg +++ b/static/icons/metro_24.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/static/icons/metro_entrance_24.svg b/static/icons/metro_entrance_24.svg index 4b6ff22..4f8746e 100644 --- a/static/icons/metro_entrance_24.svg +++ b/static/icons/metro_entrance_24.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/static/icons/nail_studio_24.svg b/static/icons/nail_studio_24.svg new file mode 100644 index 0000000..33146da --- /dev/null +++ b/static/icons/nail_studio_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/stage_24.svg b/static/icons/stage_24.svg new file mode 100644 index 0000000..30371fe --- /dev/null +++ b/static/icons/stage_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/stenograffia_24.svg b/static/icons/stenograffia_24.svg new file mode 100644 index 0000000..4fe7388 --- /dev/null +++ b/static/icons/stenograffia_24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/icons/waterpark_24.svg b/static/icons/waterpark_24.svg new file mode 100644 index 0000000..a2230bb --- /dev/null +++ b/static/icons/waterpark_24.svg @@ -0,0 +1 @@ + \ No newline at end of file