feat(maps-ng): add maps-ng

Author: Killusions

.docs-composerrc.mts

@@ -10,7 +10,12 @@ export const config: Config = {
     'projects/charts-ng',
     'projects/dashboards-ng',
     'projects/native-charts-ng',
-    'projects/element-translate-ng'
+    'projects/element-translate-ng',
+    {
+      packageDir: 'projects/maps-ng',
+      publicEntrypoint: 'docs.ts',
+      publicTsconfig: 'tsconfig.docs.json'
+    }
   ],
   typedocJson: 'src/assets/typedoc/**/docs.json',
   generate: {

.github/workflows/build-and-test.yaml

@@ -6,8 +6,14 @@ on:
         required: true
       SIEMENS_NPM_USER:
         required: true
+      MAPTILER_KEY:
+        required: true
   pull_request:
 
+env:
+  MAPTILER_KEY: ${{ secrets.MAPTILER_KEY }}
+  MAPTILER_URL: https://api.maptiler.com/maps/voyager/style.json?key=${{ secrets.MAPTILER_KEY }}
+
 jobs:
   build:
     runs-on: ubuntu-24.04
@@ -28,7 +34,7 @@ jobs:
       - run: npm run prepare-brand
       - run: npm run build:all:update-translatable-keys # Output is needed in dist for providing default translations
       - run: git diff --exit-code "projects/**/*-translatable-keys.interface.ts"
-      - run: npm run build:examples
+      - run: npm run build:examples --define="maptilerKey='$MAPTILER_KEY'" --define="maptilerUrl='$MAPTILER_URL'"
       - run: npm run dashboards-demo:build:demo -- --progress=false
       - run: npm run dashboards-demo:build:webcomponents -- --progress=false
       - run: npm run dashboards-demo:build:mfe -- --progress=false
@@ -65,6 +71,7 @@ jobs:
       - run: npm run lib:test -- --watch=false --progress=false --code-coverage
       - run: npm run charts:test -- --watch=false --progress=false
       - run: npm run dashboards:test -- --watch=false --progress=false
+      - run: npm run maps:test -- --watch=false --progress=false
       # TODO: Upload coverage reports
 
   aot:
@@ -86,7 +93,7 @@ jobs:
           SIEMENS_NPM_TOKEN: ${{ secrets.SIEMENS_NPM_TOKEN }}
       - run: npm ci --prefer-offline --no-audit --include=optional
       - run: npm run prepare-brand
-      - run: npm run build:examples:aot
+      - run: npm run build:examples:aot --define="maptilerKey='$MAPTILER_KEY'" --define="maptilerUrl='$MAPTILER_URL'"
 
   e2e:
     runs-on: ubuntu-24.04

.github/workflows/publish-documentation.yaml

@@ -10,6 +10,7 @@ jobs:
     secrets:
       SIEMENS_NPM_TOKEN: ${{ secrets.SIEMENS_NPM_TOKEN }}
       SIEMENS_NPM_USER: ${{ secrets.SIEMENS_NPM_USER }}
+      MAPTILER_KEY: ${{ secrets.MAPTILER_KEY }}
 
   publish-documentation:
     runs-on: ubuntu-24.04

.github/workflows/release.yaml

@@ -8,6 +8,7 @@ jobs:
     secrets:
       SIEMENS_NPM_TOKEN: ${{ secrets.SIEMENS_NPM_TOKEN }}
       SIEMENS_NPM_USER: ${{ secrets.SIEMENS_NPM_USER }}
+      MAPTILER_KEY: ${{ secrets.MAPTILER_KEY }}
 
   publish:
     runs-on: ubuntu-24.04

.gitignore

@@ -52,6 +52,9 @@ testem.log
 messages.json
 __pycache__
 
+# Environment variables
+/src/environments/environment.local.ts
+
 # System Files
 .DS_Store
 Thumbs.db

.releaserc.js

@@ -76,6 +76,12 @@ export default {
         pkgRoot: 'dist/@siemens/dashboards-ng'
       }
     ],
+    [
+      '@semantic-release/npm',
+      {
+        pkgRoot: 'dist/@siemens/maps-ng'
+      }
+    ],
     [
       '@semantic-release/npm',
       {
@@ -131,6 +137,13 @@ export default {
         npmPublish: false
       }
     ],
+    [
+      '@semantic-release/npm',
+      {
+        pkgRoot: 'projects/maps-ng',
+        npmPublish: false
+      }
+    ],
     // Root package.json only needs version update
     // This must be AFTER all other package updates as this will update the peer dependencies.
     [

angular.json

@@ -56,7 +56,11 @@
             "extractLicenses": false,
             "sourceMap": true,
             "optimization": false,
-            "namedChunks": true
+            "namedChunks": true,
+            "define": {
+              "maptilerKey": "''",
+              "maptilerUrl": "''"
+            }
           },
           "configurations": {
             "production": {
@@ -78,6 +82,14 @@
                 }
               ]
             },
+            "local-maps": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.local-maps.ts"
+                }
+              ]
+            },
             "aot": {
               "aot": true,
               "sourceMap": false,
@@ -94,6 +106,9 @@
           "configurations": {
             "production": {
               "buildTarget": "element-examples:build:production"
+            },
+            "local": {
+              "buildTarget": "element-examples:build:local"
             }
           }
         },
@@ -374,6 +389,38 @@
         }
       }
     },
+    "maps-ng": {
+      "projectType": "library",
+      "root": "projects/maps-ng",
+      "sourceRoot": "projects/maps-ng/src",
+      "prefix": "si",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "tsConfig": "projects/maps-ng/tsconfig.lib.json",
+            "project": "projects/maps-ng/ng-package.json"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "builderMode": "application",
+            "polyfills": ["zone.js", "zone.js/testing"],
+            "tsConfig": "projects/maps-ng/tsconfig.spec.json",
+            "karmaConfig": "projects/maps-ng/karma.conf.cjs",
+            "codeCoverageExclude": ["projects/maps-ng/src/**/*.module.ts"]
+          }
+        },
+        "lint": {
+          "builder": "@angular-eslint/builder:lint",
+          "options": {
+            "lintFilePatterns": ["projects/maps-ng/**/*.ts", "projects/maps-ng/**/*.html"],
+            "eslintConfig": "projects/maps-ng/eslint.config.js"
+          }
+        }
+      }
+    },
     "dashboards-ng": {
       "projectType": "library",
       "root": "projects/dashboards-ng",

docs/components/index.md

@@ -75,6 +75,7 @@ documentation.
 ## M
 
 - [Main-Detail Container](layout-navigation/main-detail-container.md)
+- [Maps](maps/maps.md)
 - [Menu](buttons-menus/menu.md)
 - [Micro charts](charts/micro-charts.md)
 - [Modals](layout-navigation/modals.md)