@siemens/element-ng 48.3.0 → 48.5.0

package/filtered-search/index.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
+import { OnInit, OnChanges, SimpleChanges } from '@angular/core';
 import { BackgroundColorVariant } from '@siemens/element-ng/common';
 import { TypeaheadOption } from '@siemens/element-ng/typeahead';
 import { TranslatableString } from '@siemens/element-translate-ng/translate';
@@ -150,7 +150,7 @@ interface InternalCriterionDefinition extends CriterionDefinition {
     translatedLabel: string;
 }
 
-declare class SiFilteredSearchComponent implements OnInit, OnChanges, OnDestroy {
+declare class SiFilteredSearchComponent implements OnInit, OnChanges {
     private static readonly criterionRegex;
     /**
      * Output callback event that provides an object describing the
@@ -370,10 +370,10 @@ declare class SiFilteredSearchComponent implements OnInit, OnChanges, OnDestroy
     private typeaheadInputChange;
     /** Used to debounce the Search emissions */
     private searchEmitQueue;
-    private destroySubscriptions;
-    private cdRef;
-    private translateService;
-    private locale;
+    private readonly destroyRef;
+    private readonly cdRef;
+    private readonly translateService;
+    private readonly locale;
     /**
      * The cache is used to control when the interceptDisplayedCriteria event needs to be called.
      * Every time a criteria gain the focus we have to reset the cache to call the interceptor.
@@ -388,7 +388,6 @@ declare class SiFilteredSearchComponent implements OnInit, OnChanges, OnDestroy
     constructor();
     ngOnChanges(changes: SimpleChanges): void;
     ngOnInit(): void;
-    ngOnDestroy(): void;
     private initCriteria;
     private initValue;
     /**

package/navbar-vertical/index.d.ts

@@ -1,6 +1,6 @@
 import * as _siemens_element_translate_ng_translate_types from '@siemens/element-translate-ng/translate-types';
 import * as _angular_core from '@angular/core';
-import { OnChanges, OnInit, OnDestroy, SimpleChanges } from '@angular/core';
+import { OnChanges, OnInit, SimpleChanges } from '@angular/core';
 import { NavigationExtras, IsActiveMatchOptions, ActivatedRoute } from '@angular/router';
 import { MenuItem } from '@siemens/element-ng/common';
 import { TranslatableString } from '@siemens/element-translate-ng/translate';
@@ -91,7 +91,8 @@ declare class SiNavbarVerticalItemGuardDirective {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiNavbarVerticalItemGuardDirective, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiNavbarVerticalItemGuardDirective, "[siNavbarVerticalItemGuard]", never, {}, {}, never, never, true, never>;
 }
-declare class SiNavbarVerticalComponent implements OnChanges, OnInit, OnDestroy {
+declare class SiNavbarVerticalComponent implements OnChanges, OnInit {
+    protected readonly icons: Record<"elementSearch" | "elementDoubleLeft" | "elementDoubleRight", string>;
     /**
      * Whether the navbar-vertical is collapsed.
      *
@@ -197,12 +198,10 @@ declare class SiNavbarVerticalComponent implements OnChanges, OnInit, OnDestroy
     private readonly itemsToComponents;
     protected readonly smallScreen: _angular_core.WritableSignal<boolean>;
     protected readonly uiStateExpandedItems: _angular_core.WritableSignal<Record<string, boolean>>;
-    private destroyer;
     private preferCollapse;
     constructor();
     ngOnChanges(changes: SimpleChanges): void;
     ngOnInit(): void;
-    ngOnDestroy(): void;
     protected toggleCollapse(): void;
     /** Expands the vertical navbar. */
     expand(): void;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@siemens/element-ng",
   "description": "Element Angular component library, implementing the Siemens Design Language",
-  "version": "48.3.0",
+  "version": "48.5.0",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -30,8 +30,8 @@
     "@angular/router": "20",
     "@ngx-formly/bootstrap": "^6.2.2",
     "@ngx-formly/core": "^6.2.2",
-    "@siemens/element-translate-ng": "48.3.0",
-    "@siemens/element-theme": "48.3.0",
+    "@siemens/element-translate-ng": "48.5.0",
+    "@siemens/element-theme": "48.5.0",
     "@siemens/ngx-datatable": "22 - 24",
     "flag-icons": "^7.3.2",
     "google-libphonenumber": "^3.2.40",
@@ -71,14 +71,14 @@
       "types": "./accordion/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-accordion.mjs"
     },
-    "./about": {
-      "types": "./about/index.d.ts",
-      "default": "./fesm2022/siemens-element-ng-about.mjs"
-    },
     "./action-modal": {
       "types": "./action-modal/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-action-modal.mjs"
     },
+    "./about": {
+      "types": "./about/index.d.ts",
+      "default": "./fesm2022/siemens-element-ng-about.mjs"
+    },
     "./application-header": {
       "types": "./application-header/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-application-header.mjs"
@@ -111,14 +111,14 @@
       "types": "./card/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-card.mjs"
     },
-    "./chat-messages": {
-      "types": "./chat-messages/index.d.ts",
-      "default": "./fesm2022/siemens-element-ng-chat-messages.mjs"
-    },
     "./circle-status": {
       "types": "./circle-status/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-circle-status.mjs"
     },
+    "./chat-messages": {
+      "types": "./chat-messages/index.d.ts",
+      "default": "./fesm2022/siemens-element-ng-chat-messages.mjs"
+    },
     "./color-picker": {
       "types": "./color-picker/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-color-picker.mjs"
@@ -251,14 +251,14 @@
       "types": "./markdown-renderer/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-markdown-renderer.mjs"
     },
-    "./menu": {
-      "types": "./menu/index.d.ts",
-      "default": "./fesm2022/siemens-element-ng-menu.mjs"
-    },
     "./modal": {
       "types": "./modal/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-modal.mjs"
     },
+    "./menu": {
+      "types": "./menu/index.d.ts",
+      "default": "./fesm2022/siemens-element-ng-menu.mjs"
+    },
     "./navbar": {
       "types": "./navbar/index.d.ts",
       "default": "./fesm2022/siemens-element-ng-navbar.mjs"

package/schematics/migrations/action-modal-migration/action-modal-migration.js

@@ -29,7 +29,11 @@ export const actionModalMigrationRule = (options) => {
                 continue;
             }
             const pendingTransformations = [];
+            const usedIdentifier = new Set();
             const visitNodeAndCollectTransformations = (node) => {
+                if (ts.isImportDeclaration(node)) {
+                    return;
+                }
                 // Collect method call transformations
                 if (ts.isCallExpression(node)) {
                     const methodTransformation = createActionDialogMethodCallTransformation(node);
@@ -42,11 +46,17 @@ export const actionModalMigrationRule = (options) => {
                     const typeTransformation = createActionDialogTypeTransformation(node);
                     if (typeTransformation) {
                         pendingTransformations.push(typeTransformation);
+                        // We remove the usage here. In order to avoid counting it as used identifier, we skip further processing.
+                        return;
                     }
                 }
+                if (ts.isIdentifier(node)) {
+                    usedIdentifier.add(node.text);
+                }
                 node.forEachChild(visitNodeAndCollectTransformations);
             };
             sourceFile.forEachChild(visitNodeAndCollectTransformations);
+            pendingTransformations.push(...removeUnusedImports(sourceFile, usedIdentifier));
             if (pendingTransformations.length > 0) {
                 applyCodeTransformations(tree, filePath, pendingTransformations);
             }
@@ -69,8 +79,7 @@ const createActionDialogMethodCallTransformation = (node) => {
     const newCode = printer.printNode(ts.EmitHint.Expression, newNode, node.getSourceFile());
     return {
         node,
-        newCode,
-        type: 'method-call'
+        newCode
     };
 };
 const createActionDialogTypeTransformation = (node) => {
@@ -81,8 +90,7 @@ const createActionDialogTypeTransformation = (node) => {
     }
     return {
         node,
-        newCode: `'${matchingReplacement.new}'`,
-        type: 'type-reference'
+        newCode: `'${matchingReplacement.new}'`
     };
 };
 /**
@@ -119,3 +127,36 @@ const applyCodeTransformations = (tree, filePath, codeTransformations) => {
     });
     tree.commitUpdate(recorder);
 };
+const removeUnusedImports = (sourceFile, usedIdentifier) => {
+    const printer = ts.createPrinter();
+    const importFinder = (node) => {
+        if (ts.isImportDeclaration(node) &&
+            ts.isStringLiteral(node.moduleSpecifier) &&
+            /@(siemens|simpl)\/element-ng(\/action-modal)?/.test(node.moduleSpecifier.text) &&
+            node.importClause?.namedBindings &&
+            ts.isNamedImports(node.importClause.namedBindings)) {
+            const usedBindings = node.importClause.namedBindings.elements.filter(element => 
+            // This script anyway is not capable of handling aliasing imports, so we can ignore them here.
+            usedIdentifier.has(element.name.text) || !ACTION_MODAL_SYMBOLS.includes(element.name.text));
+            if (usedBindings.length === node.importClause.namedBindings.elements.length) {
+                // All bindings are used, no changes needed
+                return undefined;
+            }
+            if (usedBindings.length === 0) {
+                // No bindings are used, remove the entire import statement
+                return {
+                    node,
+                    newCode: ''
+                };
+            }
+            // Recreate import statement with only used bindings
+            const newImport = ts.factory.createImportDeclaration(node.modifiers, ts.factory.createImportClause(node.importClause.isTypeOnly, node.importClause.name, ts.factory.createNamedImports(usedBindings)), node.moduleSpecifier, node.attributes);
+            return {
+                node,
+                newCode: printer.printNode(ts.EmitHint.Unspecified, newImport, sourceFile)
+            };
+        }
+        return undefined;
+    };
+    return sourceFile.statements.map(importFinder).filter(transform => transform !== undefined);
+};

package/schematics/migrations/data/output-names.js

@@ -2,7 +2,6 @@ export const OUTPUT_NAMES_MIGRATION = [
     {
         module: /@(siemens|simpl)\/element-ng(\/accordion)?/,
         elementSelector: 'si-collapsible-panel',
-        componentOrModuleName: ['SiCollapsiblePanelComponent', 'SiAccordionModule'],
         apiMappings: [{ replace: '(toggle)', replaceWith: '(panelToggle)' }]
     }
 ];

package/schematics/migrations/data/symbol-removals.js

@@ -2,57 +2,48 @@ export const SYMBOL_REMOVALS_MIGRATION = [
     {
         module: /@(siemens|simpl)\/element-ng(\/accordion)?/,
         elementSelector: 'si-accordion',
-        componentOrModuleName: ['SiAccordionComponent', 'SiAccordionModule'],
         names: ['colorVariant']
     },
     {
         module: /@(siemens|simpl)\/element-ng(\/datepicker)?/,
         elementSelector: 'input',
         attributeSelector: 'siDateInput',
-        componentOrModuleName: ['SiDateInputDirective', 'SiDatepickerModule'],
         names: ['dateInputDebounceTime']
     },
     {
         module: /@(siemens|simpl)\/element-ng(\/datepicker)?/,
         elementSelector: 'input',
         attributeSelector: 'siDatepicker',
-        componentOrModuleName: ['SiDateInputDirective', 'SiDatepickerModule'],
         names: ['triggeringInput']
     },
     {
         module: /@(siemens|simpl)\/element-ng(\/datepicker)?/,
         elementSelector: 'si-date-range',
-        componentOrModuleName: ['SiDateRangeComponent', 'SiDatepickerModule'],
         names: ['debounceTime']
     },
     {
         module: /@(siemens|simpl)\/element-ng(\/filtered-search)?/,
         elementSelector: 'si-filtered-search',
-        componentOrModuleName: ['SiFilteredSearchComponent', 'SiFilteredSearchModule'],
         names: ['showIcon', 'noMatchingCriteriaText']
     },
     {
         module: /@(siemens|simpl)\/element-ng(\/form)?/,
         elementSelector: 'si-form-item',
-        componentOrModuleName: ['SiFormItemComponent', 'SiFormModule'],
         names: ['inputId', 'readonly']
     },
     {
         module: /@(siemens|simpl)\/element-ng(\/navbar-vertical)?/,
         elementSelector: 'si-navbar-vertical',
-        componentOrModuleName: ['SiNavbarVerticalComponent', 'SiNavbarVerticalModule'],
         names: ['autoCollapseDelay']
     },
     {
         module: /@(siemens|simpl)\/element-ng(\/split)?/,
         elementSelector: 'si-split-part',
-        componentOrModuleName: ['SiSplitPartComponent', 'SiSplitModule'],
         names: ['headerStatusColor', 'headerStatusIconClass']
     },
     {
         module: /@(siemens|simpl)\/element-ng(\/navbar-vertical)?/,
         elementSelector: 'si-tree-view',
-        componentOrModuleName: ['SiTreeViewComponent', 'SiTreeViewModule'],
         names: ['disableFilledIcons', 'trackByFunction']
     }
 ];

package/schematics/migrations/element-migration/element-migration.js

@@ -4,7 +4,7 @@
  */
 import * as ts from 'typescript';
 import { EmitHint } from 'typescript';
-import { discoverSourceFiles, getImportSpecifiers, renameApi, renameAttribute, renameElementTag, renameIdentifier, removeSymbol } from '../../utils/index.js';
+import { discoverSourceFiles, renameApi, renameAttribute, renameElementTag, renameIdentifier, removeSymbol } from '../../utils/index.js';
 import { getElementMigrationData } from '../data/index.js';
 export const elementMigrationRule = (options) => {
     return async (tree, context) => {
@@ -60,10 +60,6 @@ export const elementMigrationRule = (options) => {
             if (migrationData.outputNameChanges) {
                 recorder ??= tree.beginUpdate(filePath);
                 for (const change of migrationData.outputNameChanges) {
-                    const importSpecifiers = getImportSpecifiers(sourceFile, change.module, change.componentOrModuleName);
-                    if (!importSpecifiers?.length) {
-                        continue;
-                    }
                     renameApi({
                         tree,
                         recorder,
@@ -77,10 +73,6 @@ export const elementMigrationRule = (options) => {
             if (migrationData.symbolRemovalChanges) {
                 recorder ??= tree.beginUpdate(filePath);
                 for (const change of migrationData.symbolRemovalChanges) {
-                    const importSpecifiers = getImportSpecifiers(sourceFile, change.module, change.componentOrModuleName);
-                    if (!importSpecifiers?.length) {
-                        continue;
-                    }
                     removeSymbol({
                         tree,
                         recorder,

package/schematics/migrations/wizard-migration/index.js

@@ -2,9 +2,9 @@
  * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
-import { join, dirname } from 'path';
+import { join, dirname } from 'path/posix';
 import * as ts from 'typescript';
-import { discoverSourceFiles, findElement, getImportSpecifiers, getInlineTemplates, getTemplateUrl } from '../../utils/index.js';
+import { discoverSourceFiles, findElement, getInlineTemplates, getTemplateUrl } from '../../utils/index.js';
 export const wizardMigrationRule = (options) => {
     return async (tree, context) => {
         context.logger.info('🔄 Migrating wizard api...');
@@ -15,14 +15,6 @@ export const wizardMigrationRule = (options) => {
                 continue;
             }
             const sourceFile = ts.createSourceFile(filePath, content.toString(), ts.ScriptTarget.Latest, true);
-            const modulePathToMatch = /@(siemens|simpl)\/element-ng(\/wizard)?/;
-            const wizardImports = getImportSpecifiers(sourceFile, modulePathToMatch, [
-                'SiWizardComponent',
-                'SiWizardModule'
-            ]);
-            if (!wizardImports?.length) {
-                continue;
-            }
             const recorder = tree.beginUpdate(filePath);
             renameApi({
                 tree,

package/schematics/ts-import-to-siemens-migration/index.js

@@ -3,8 +3,10 @@
  * SPDX-License-Identifier: MIT
  */
 import { chain } from '@angular-devkit/schematics';
+import { getDecoratorMetadata, getMetadataField } from '@schematics/angular/utility/ast-utils';
+import * as ts from 'typescript';
 import { getImportNodes, getSymbols, discoverSourceFiles } from '../utils/index.js';
-import { CHARTS_NG_MAPPINGS, DASHBOARDS_NG_MAPPINGS, ELEMENT_NG_MAPPINGS, ELEMENT_TRANSLATE_NG_MAPPINGS, MAPS_NG_MAPPINGS } from './mappings/index.js';
+import { CHARTS_NG_MAPPINGS, DASHBOARDS_NG_MAPPINGS, ELEMENT_NG_MAPPINGS, ELEMENT_TRANSLATE_NG_MAPPINGS, MAPS_NG_MAPPINGS, NATIVE_CHARTS_NG_MAPPINGS, SIMPL_ELEMENT_NG_MODULES } from './mappings/index.js';
 export const tsImportMigration = (_options) => {
     return (tree, context) => {
         context.logger.info('🚀 Starting Simpl to Siemens migration...');
@@ -33,8 +35,10 @@ export const tsImportMigrationRule = (_options) => {
         const sourceFiles = await discoverSourceFiles(tree, context, _options.path);
         for (const filePath of sourceFiles) {
             const migrations = collectMigrationImports(filePath, tree, context);
-            const { imports, toRemoveImports } = migrations;
-            if (imports.size === 0 && toRemoveImports.length === 0) {
+            const { imports, toRemoveImports, hasSimplElementNgModuleImport } = migrations;
+            if (imports.size === 0 &&
+                toRemoveImports.length === 0 &&
+                hasSimplElementNgModuleImport === false) {
                 continue;
             }
             const rule = rewriteImportsInFile(filePath, migrations);
@@ -43,57 +47,155 @@ export const tsImportMigrationRule = (_options) => {
         return chain([...rules]);
     };
 };
+/**
+ * Adds a symbol to the imports map, avoiding duplicates
+ */
+const addSymbolToImports = (imports, importPath, symbolName) => {
+    const existingSymbols = imports.get(importPath);
+    if (!existingSymbols) {
+        imports.set(importPath, [symbolName]);
+    }
+    else if (!existingSymbols.includes(symbolName)) {
+        existingSymbols.push(symbolName);
+    }
+};
 const collectMigrationImports = (filePath, tree, _context) => {
     const content = tree.read(filePath);
     const imports = new Map();
+    let hasSimplElementNgModuleImport = false;
     if (!content) {
-        return { imports, toRemoveImports: [] };
+        return {
+            imports,
+            toRemoveImports: [],
+            hasSimplElementNgModuleImport
+        };
     }
     const simplImports = getImportNodes(filePath, content.toString(), '@simpl/');
     const toRemoveImports = [];
     for (const node of simplImports) {
         const symbols = getSymbols(node);
         const importPath = node.moduleSpecifier.getText().replace(/['"]/g, '');
-        let toRemove = false;
+        let shouldRemoveImport = false;
         for (const symbol of symbols) {
             const symbolName = symbol.name.getText();
-            const newImportPath = findComponentImportPath(symbolName, importPath);
-            if (!newImportPath) {
-                continue;
-            }
-            toRemove = true;
-            const migration = imports.get(newImportPath);
-            if (!migration) {
-                imports.set(newImportPath, [symbolName]);
+            if (symbolName === 'SimplElementNgModule') {
+                hasSimplElementNgModuleImport = true;
+                for (const moduleName of SIMPL_ELEMENT_NG_MODULES) {
+                    const newImportPath = findComponentImportPath(moduleName, '@simpl/element-ng');
+                    if (!newImportPath) {
+                        continue;
+                    }
+                    shouldRemoveImport = true;
+                    addSymbolToImports(imports, newImportPath, moduleName);
+                }
             }
             else {
-                migration.push(symbolName);
+                const newImportPath = findComponentImportPath(symbolName, importPath);
+                if (!newImportPath) {
+                    continue;
+                }
+                shouldRemoveImport = true;
+                addSymbolToImports(imports, newImportPath, symbolName);
             }
         }
-        if (toRemove) {
+        if (shouldRemoveImport) {
             toRemoveImports.push(node);
         }
     }
-    return { imports, toRemoveImports };
+    return { imports, toRemoveImports, hasSimplElementNgModuleImport };
 };
 const rewriteImportsInFile = (filePath, migrations) => {
     return (tree) => {
         const recorder = tree.beginUpdate(filePath);
-        const start = migrations.toRemoveImports.at(0)?.getFullStart() ?? 0;
-        // Remove old imports
-        for (const importDecl of migrations.toRemoveImports) {
-            recorder.remove(importDecl.getFullStart(), importDecl.getFullWidth());
+        const insertPosition = migrations.toRemoveImports.at(0)?.getFullStart() ?? 0;
+        const content = tree.read(filePath);
+        if (!content) {
+            return tree;
         }
+        const sourceFile = ts.createSourceFile(filePath, content.toString(), ts.ScriptTarget.Latest, true);
+        // Remove old imports
+        removeOldImports(recorder, migrations.toRemoveImports);
         // Add new imports
-        const importPaths = Array.from(migrations.imports.keys()).sort((a, b) => a.localeCompare(b));
-        for (const path of importPaths) {
-            const symbols = migrations.imports.get(path);
-            recorder.insertLeft(start, `\nimport { ${symbols.sort((a, b) => a.localeCompare(b)).join(', ')} } from '${path}';`);
+        addNewImports(recorder, migrations.imports, insertPosition, sourceFile);
+        // Update NgModule/Component imports array if needed
+        if (migrations.hasSimplElementNgModuleImport) {
+            updateDecoratorImports(recorder, sourceFile);
         }
         tree.commitUpdate(recorder);
         return tree;
     };
 };
+const updateDecoratorImports = (recorder, sourceFile) => {
+    const decoratorNames = ['NgModule', 'Component'];
+    let decoratorNode;
+    // Try to find NgModule or Component decorator
+    for (const decoratorName of decoratorNames) {
+        const nodes = getDecoratorMetadata(sourceFile, decoratorName, '@angular/core');
+        if (nodes.length > 0) {
+            decoratorNode = nodes[0];
+            break;
+        }
+    }
+    if (!decoratorNode || !ts.isObjectLiteralExpression(decoratorNode)) {
+        return;
+    }
+    const matchingProperties = getMetadataField(decoratorNode, 'imports');
+    const importsAssignment = matchingProperties[0];
+    if (!ts.isPropertyAssignment(importsAssignment) ||
+        !ts.isArrayLiteralExpression(importsAssignment.initializer)) {
+        return;
+    }
+    const elements = importsAssignment.initializer.elements;
+    // Filter out SimplElementNgModule and get existing modules
+    const existingModules = elements
+        .filter(e => e.getText() !== 'SimplElementNgModule')
+        .map(e => e.getText());
+    const existingModulesSet = new Set(existingModules);
+    // Only add modules that don't already exist
+    const newModulesToAdd = SIMPL_ELEMENT_NG_MODULES.filter(m => !existingModulesSet.has(m));
+    // Combine existing (without SimplElementNgModule) + new modules
+    const allModules = [...existingModules, ...newModulesToAdd];
+    // Remove existing imports array
+    recorder.remove(importsAssignment.getFullStart(), importsAssignment.getFullWidth());
+    // Create and insert the updated property assignment
+    const printer = ts.createPrinter();
+    const newNode = ts.factory.createArrayLiteralExpression(allModules.map(m => ts.factory.createIdentifier(m)), true);
+    const newProperty = ts.factory.updatePropertyAssignment(importsAssignment, importsAssignment.name, newNode);
+    const propertyText = printer.printNode(ts.EmitHint.Unspecified, newProperty, sourceFile);
+    // Had to add extra indentation to align properly
+    recorder.insertLeft(importsAssignment.getStart(), `\n  ` + propertyText);
+};
+/**
+ * Removes old import declarations from the file
+ */
+const removeOldImports = (recorder, toRemoveImports) => {
+    for (const importDecl of toRemoveImports) {
+        recorder.remove(importDecl.getFullStart(), importDecl.getFullWidth());
+    }
+};
+/**
+ * Adds new import declarations to the file
+ */
+const addNewImports = (recorder, imports, insertPosition, sourceFile) => {
+    const sortedImportPaths = Array.from(imports.keys()).sort((a, b) => a.localeCompare(b));
+    const printer = ts.createPrinter();
+    let counter = 0;
+    for (const path of sortedImportPaths) {
+        const symbols = imports.get(path);
+        const sortedSymbols = symbols.sort((a, b) => a.localeCompare(b));
+        const importDeclaration = createImportDeclaration(path, sortedSymbols);
+        const importStatement = printer.printNode(ts.EmitHint.Unspecified, importDeclaration, sourceFile);
+        const prefix = insertPosition === 0 && counter === 0 ? '' : '\n';
+        recorder.insertLeft(insertPosition, `${prefix}${importStatement}`);
+        counter++;
+    }
+};
+/**
+ * Creates import declarations using TypeScript AST
+ */
+const createImportDeclaration = (importPath, symbols) => {
+    return ts.factory.createImportDeclaration(undefined, ts.factory.createImportClause(false, undefined, ts.factory.createNamedImports(symbols.map(symbol => ts.factory.createImportSpecifier(false, undefined, ts.factory.createIdentifier(symbol))))), ts.factory.createStringLiteral(importPath, true));
+};
 const findComponentImportPath = (symbolName, moduleSpecifier) => {
     const [, project, subPath] = moduleSpecifier.split('/');
     switch (project) {
@@ -102,7 +204,8 @@ const findComponentImportPath = (symbolName, moduleSpecifier) => {
             if (symbolName === 'MenuItem' && subPath === 'menu') {
                 return '@siemens/element-ng/menu';
             }
-            return ELEMENT_NG_MAPPINGS[symbolName];
+            // Added the OR condition to check in ELEMENT_TRANSLATE_NG_MAPPINGS as well because translation are also part of `@simpl/element-ng` imports
+            return ELEMENT_NG_MAPPINGS[symbolName] || ELEMENT_TRANSLATE_NG_MAPPINGS[symbolName];
         }
         case 'maps-ng':
             return MAPS_NG_MAPPINGS[symbolName];
@@ -110,6 +213,8 @@ const findComponentImportPath = (symbolName, moduleSpecifier) => {
             return DASHBOARDS_NG_MAPPINGS[symbolName];
         case 'charts-ng':
             return CHARTS_NG_MAPPINGS[symbolName];
+        case 'native-charts-ng':
+            return NATIVE_CHARTS_NG_MAPPINGS[symbolName];
         case 'element-translate-ng':
             return ELEMENT_TRANSLATE_NG_MAPPINGS[symbolName];
         default:

package/schematics/ts-import-to-siemens-migration/mappings/charts-ng-mappings.js

@@ -66,5 +66,6 @@ export const CHARTS_NG_MAPPINGS = {
     'themeElement': '@siemens/charts-ng',
     'themeSupport': '@siemens/charts-ng',
     'XAxisPosition': '@siemens/charts-ng',
-    'YAxisPosition': '@siemens/charts-ng'
+    'YAxisPosition': '@siemens/charts-ng',
+    'SimplChartsNgModule': '@siemens/charts-ng'
 };

package/schematics/ts-import-to-siemens-migration/mappings/dashboards-ng-mappings.js

@@ -48,5 +48,7 @@ export const DASHBOARDS_NG_MAPPINGS = {
     'WidgetInstanceEditor': '@siemens/dashboards-ng',
     'WidgetInstanceEditorWizard': '@siemens/dashboards-ng',
     'WidgetInstanceEditorWizardState': '@siemens/dashboards-ng',
-    'WidgetPositionConfig': '@siemens/dashboards-ng'
+    'WidgetPositionConfig': '@siemens/dashboards-ng',
+    'SimplDashboardsNgModule': '@siemens/dashboards-ng',
+    'SiWidgetStorage': '@siemens/dashboards-ng'
 };

package/schematics/ts-import-to-siemens-migration/mappings/element-ng-mappings.js

@@ -473,6 +473,7 @@ export const ELEMENT_NG_MAPPINGS = {
     'SiLoadingSpinnerModule': '@siemens/element-ng/loading-spinner',
     'SiLocaleConfig': '@siemens/element-ng/localization',
     'SiLocaleId': '@siemens/element-ng/localization',
+    'SiLocaleStore': '@siemens/element-ng/localization',
     'SiLocaleService': '@siemens/element-ng/localization',
     'SiLoginBasicComponent': '@siemens/element-ng/landing-page',
     'SiLoginSingleSignOnComponent': '@siemens/element-ng/landing-page',
@@ -649,3 +650,56 @@ export const ELEMENT_NG_MAPPINGS = {
     'WEEK_START_OFFSET': '@siemens/element-ng/datepicker',
     'WeekStart': '@siemens/element-ng/datepicker'
 };
+export const SIMPL_ELEMENT_NG_MODULES = [
+    'SiAboutModule',
+    'SiAccordionModule',
+    'SiBreadcrumbModule',
+    'SiBreadcrumbRouterModule',
+    'SiCardModule',
+    'SiCircleStatusModule',
+    'SiConnectionStrengthModule',
+    'SiContentActionBarModule',
+    'SiCopyrightNoticeModule',
+    'SiDatepickerModule',
+    'SiDateRangeFilterModule',
+    'SiElectrontitlebarModule',
+    'SiEmptyStateModule',
+    'SiFileUploaderModule',
+    'SiFilterBarModule',
+    'SiFilteredSearchModule',
+    'SiFooterModule',
+    'SiFormModule',
+    'SiIconModule',
+    'SiIconStatusModule',
+    'SiInlineNotificationModule',
+    'SiLandingPageModule',
+    'SiLanguageSwitcherModule',
+    'SiLinkModule',
+    'SiLoadingSpinnerModule',
+    'SiMainDetailContainerModule',
+    'SiNavbarModule',
+    'SiNavbarVerticalModule',
+    'SiNumberInputModule',
+    'SiPaginationModule',
+    'SiPasswordStrengthModule',
+    'SiPasswordToggleModule',
+    'SiPillsInputModule',
+    'SiPopoverLegacyModule',
+    'SiProgressbarModule',
+    'SiResizeObserverModule',
+    'SiResultDetailsListModule',
+    'SiSearchBarModule',
+    'SiSelectModule',
+    'SiSidePanelModule',
+    'SiSliderModule',
+    'SiSortBarModule',
+    'SiSplitModule',
+    'SiStatusBarModule',
+    'SiTabsLegacyModule',
+    'SiThresholdModule',
+    'SiTooltipModule',
+    'SiTreeViewModule',
+    'SiTypeaheadModule',
+    'SiUnauthorizedPageModule',
+    'SiWizardModule'
+];