v49.0.0-rc.3

49.0.0-rc.3 (2026-02-12)

Features

• landing-page: remove registration introduction text due to ux guidelines (10c08f8)
• schematics: add class member replacement functionality (f31da29)
• schematics: add element class migration for element styling changes (94d9bcf)
• schematics: add icon path migration schematic to update icon imports (0d99124)
• schematics: rename output-names and component-names model (ebbf217)

Bug Fixes

• dashboards-ng: correctly overlap gridstack resize icon on custom resize icon (0db47e7)
• dashboards-ng: use consistent spacing for draggable-overlay (d73d785)
• datepicker: update date even on changing only time (b3b3c8f), closes #1431
• inline-notification: remove colon from heading (800ee01)
• ip-input: retain cursor position when inserting characters (2084039)
• schematics: remove unused simpl-siemens-migration schematic (56d5c79)
• toast-notification: restore RTL for toast notification (a4732be)
• tooltip: update content while tooltip is open (f279709)

BREAKING CHANGES

• landing-page: The registerNowIntroText input has been removed to align with UX guidelines.
  Remove all usages.

v48.10.1

48.10.1 (2026-02-12)

Bug Fixes

• datepicker: update date even on changing only time (1c59830), closes #1431
• datepicker: update date even on changing only time (c55aa24), closes #1443
• pills-input: only show placeholder text when a string is provided (1986cdb)
• tree-view: use hasAnyChildren from parent to determine inline padding (b693936)

v49.0.0-rc.2

49.0.0-rc.2 (2026-02-06)

Features

• buttons: add square icon buttons (acb4069)
• buttons: unify sizing across text and icon variants (d3c42ba)
• chat-messages: add ai-welcome-screen component (1aaaf7c)
• content-action-bar: add tooltip support (8a153c3)
• dashboards: native federation (f81c5a4)
• element-ng: replace @angular/animations with native CSS (4ae0b79)
• element-theme: introduce new active states (d917006)
• file-uploader: provide translation params to uploader messages (d6dfadf), closes #1447
• form: extend and align validation messages with UX guidelines (13f8c88), closes #1373
• forms: derive validation border via CSS on .form-control-wrapper (85bcfb3), closes #1339
• icons: use open source icons (be23170)
• launchpad: align to new style and responsive design (643f66c)
• list-details: stabilize APIs and remove experimental flag (cb3ad59)
• navbar-vertical: update badges visibility logic (acd4456)
• navbar-vertical: use siTooltip for collapsed items (515137a)
• npm: add support for ngx-translate v17 (56e04bf)
• password-toggle: support form validation for si-password-toggle (caca09e)
• schematics: add new schematics data for version 49 (41535ca)
• schematics: add ng-update schematic (4622b60)
• schematics: remove OSS migration schematics (8bfc8bf)
• tooltip: add animation (a3e09ea)

Bug Fixes

• buttons: button group sizing (f928791)
• chat-messages: improve scroll responsiveness and expose scroll methods on si-chat-container (58b6c2e)
• deps: add missing peer dependencies for dashboards-ng, maps-ng and native-charts-ng (1c8b49a)
• file-uploader: center file types text in si-file-dropzone (e12fff8)
• filtered-search: avoid expression change errors in zoneless apps (025ccf9)
• list-details: prevent half visible content (9b43b9d)
• live-preview: support zoneless (6d83417)
• pills-input: only show placeholder text when a string is provided (4e1ccdf)
• side-panel: set default display to inline-flex (5317335)
• tooltip: always show if hovered or focused (b55e175)

NOTES

• icons: We updated the icons’ underlying grid.
  The geometry has been improved to allow proportional scaling at 16, 20, and 24 px,
  with line thickness adjusted accordingly.
  This also allows scaling up, if needed, in 4 px increments.
  The new icon set also has reduced built-in margins around the icons,
  improving visual balance with surrounding elements.
• navbar-vertical: The badge behavior in the vertical navbar has been updated. Badge
  colors are now consistent in both collapsed and expanded states, text-only
  badges are detected and rendered as a simple dot in collapsed mode.
  In addition, a new input property hideBadgeWhenCollapsed allows
  to optionally hide the badge when the navbar is collapsed (by default,
  badges remain visible in both states), improving flexibility and visual consistency.
• launchpad: The subtitleText input no longer shows "Access all your apps" by default.
  To maintain the previous behavior, explicitly set the input.
• buttons: The new square icon buttons (.btn-icon) are introduced as the
  new default style for icon buttons. The existing circle buttons (.btn-circle)
  are now reserved for cases where a circular shape is explicitly required.

BREAKING CHANGES

• file-uploader: File uploader translation strings now require interpolation placeholders.

  The SiFileUploaderComponent and SiFileDropzoneComponent inputs:

  • maxFileSizeText requires the placeholder {{maxFileSize}} to display the maximum file size.
  • acceptText requires the placeholder {{accept}} to display the accepted file types.
  • maxFilesReachedText requires the placeholder {{maxFiles}} to display the maximum number of files allowed.

  Migration guide for english default translation keys:

  Before:

  {
    "SI_FILE_UPLOADER.MAX_SIZE": "Maximum upload size",
    "SI_FILE_UPLOADER.ACCEPTED_FILE_TYPES": "Accepted file types",
    "SI_FILE_UPLOADER.MAX_FILE_REACHED": "Maximum number of files reached"
  }

  After:

  {
    "SI_FILE_UPLOADER.MAX_SIZE": "Max. {{maxFileSize}} upload size.",
    "SI_FILE_UPLOADER.ACCEPTED_FILE_TYPES": "Accepted file types: {{accept}}.",
    "SI_FILE_UPLOADER.MAX_FILE_REACHED": "Max. {{maxFiles}} files"
  }

• element-ng: Animations can no longer be disabled using
  @angular/animations specific features like:

  • NoopAnimationsModule
  • BrowserAnimationsModule.withConfig({disableAnimations: false})
  • provideNoopAnimations
  • provideAnimationsAsync('noop')

  Use CSS to disable animations. See: https://element.siemens.io/architecture/motion-animation/

• icons: @simpl/element-icons package replaced by @siemens/element-icons.

  The new icon set implements the new icon style, which has a reduced margin
  around the icons.

  Replace the package:

  1. Uninstall @simpl/element-icons
  2. Install @siemens/element-icons
  3. Adjust import in style sheet.
     Before: @use '@simpl/element-icons/dist/style/simpl-element-icons';
     After: @use '@siemens/element-icons/dist/style/siemens-element-icons';
  4. Adjust SVG imports:
     Before: import { ... } from '@simpl/element-ng/ionic';
     Before: import { ... } from '@simpl/element-ng/svg';
     After: import { ... } from '@siemens/element-icons';

  Adjust styles:
  Always use the correct classes for sizing an icon:

  • (small: 16px): <si-icon class="icon-sm" icon="..." />
  • (default: 20px): <si-icon class="icon" icon="..." />
  • (large: 24px): <si-icon class="icon-lg" icon="..." />

  As the icons new have a reduced built-in margin, spacings must be adjusted:

  • remove negative margins, which previously were needed to remove the spacing overhead
  • add extra spacing-1 between icons and inline-text

  Element components have those changes automatically applied (including buttons).
  When updating follow Element recommendations, always use the icon classes
  and remove custom overrides.

• tooltip: The triggers input has been removed to align the behavior with accessibility guidelines.
  Remove all usages. The tooltip will always be shown if the target element is focused or hovered.

• buttons: Removed the class btn-xs, use instead btn-sm for icon buttons.

  Button heights has been standardized to fix misalignment between text buttons and icon buttons.

  All button sizes now follow the same specifications:

  • Default: 32px
  • Large (btn-lg): 40px
  • Small (btn-sm): 24px (reduced from 28px for text buttons)

  Changes:

  • btn-sm reduced to 24px to preserve the 8px increment scale (24 → 32 → 40)
  • icon buttons now match text button heights

  Update your code if it relies on previous .btn-circle sizing:

  Before:

  <!-- Circle buttons had inconsistent height mapping -->
  <button class="btn btn-circle">...</button> <!-- was 40px -->
  <button class="btn btn-circle btn-sm">...</button> ...

v49.0.0-rc.1

49.0.0-rc.1 (2026-01-15)

Features

• ag-grid: add Element theme for AG Grid (0c6ad96)
• angular: update to Angular 21 (1f6ff72)
• charts: theme change without reloading the chart (48aee8e)
• dashboards-ng: custom id provider for widget instance (f815092)
• live-preview: use siemens syntax highlighting colors (f2b77a8)
• schematics: update schematics for dashboards config token migration (ea54afb)
• side-panel: add backdrop support (fb9fefd)

Bug Fixes

• charts: update progress chart colors on theme change (be0defc)
• dashboards-ng: drop ngx-translate peerDependency (b5fa436)
• date-range-filter: correctly update range when toggling advanced mode (287dedb)
• select: maintain filtered rows when updating all rows (769a8f7)
• tree-view: use hasAnyChildren from parent to determine inline padding (9d37335)
• typeahead: treat space as normal search text in multi select (75f293d)

NOTES

• side-panel: Backdrop support has been added to the side-panel. By default, the side-panel will now render a modal backdrop that blocks background interactions
  and closes the panel on click. To restore the previous behavior (without a backdrop), set disableBackdrop to true.
• typeahead: The typeahead multi selection which is also used in the filtered-search
  no longer selects values when pressing space.
  Instead space is treated as a normal search value.

BREAKING CHANGES

• angular: Angular 21+ is required.
  Follow the Angular update guide to update your app: https://angular.dev/update-guide?v=20.0-21.0

• dashboards-ng: New widgets are now assigned IDs upon creation using the SiWidgetIdProvider.generateWidgetId, rather than using temporary NEW_WIDGET_PREFIX IDs that are replaced on save.

  The save() method signature in the abstract class SiWidgetStorage has been modified to separate existing widgets from new widgets:

  Before:

  abstract save(
    widgets: (WidgetConfig | Omit<WidgetConfig, 'id'>)[],
    removedWidgets?: WidgetConfig[],
    dashboardId?: string
  ): Observable<WidgetConfig[]>;
  

  After:

  abstract save(
    modifiedWidgets: WidgetConfig[],
    addedWidgets: WidgetConfig[],
    removedWidgets?: WidgetConfig[],
    dashboardId?: string
  ): Observable<WidgetConfig[]>;
  

  addedWidgets array will contain new widgets with ids generated by SiWidgetIdProvider.generateWidgetId.

• select: Removed deprecated interface SelectOptionLegacy. Use interface SelectOption instead.

  The options can be converted like below:

  Before:

  const options: SelectOptionLegacy[] = [
    { id: '1', title: 'Option 1' },
    { id: '2', title: 'Option 2', icon: 'check', color: 'text-success', disabled: false }
  ];
  

  After:

  const options: SelectOption<string>[] = [
    { type: 'option', value: '1', label: 'Option 1' },
    { type: 'option', value: '2', label: 'Option 2', icon: 'check', iconColor: 'text-success', disabled: false }
  ];
  

• select: Removed deprecated output SiSelectComponent.dropdownClose. Use output SiSelectComponent.openChange instead.

• unauthorized-page: Removed the deprecated SiUnauthorizedPageComponent component. Use the SiInfoPageComponent component with the si-info-page element instead. The SiInfoPageComponent is a superset of this component and supports the same use cases and more.

  Before:

  <si-unauthorized-page
    heading="Access denied"
    subHeading="You are not authorized to access this section."
    description="Contact your administrator"
    [link]="{ title: 'Go back', link: '/' }"
  />
  

  After:

  <si-info-page
    icon="element-warning-filled"
    iconColor="status-warning"
    titleText="Access denied"
    copyText="You are not authorized to access this section."
    instructions="Contact your administrator"
    [link]="{ title: 'Go back', link: '/' }"
  />
  

• dashboards: Removed injection token CONFIG_TOKEN. Use SI_DASHBOARD_CONFIGURATION injection token instead.

• dashboards-ng: Removed property WidgetConfig.invalid. Use WidgetInstanceEditor.statusChanges emitter instead.

  Example usage:

   this.statusChanges.emit({
      invalid: this.isInvalid
   });
  

• dashboards-ng: Removed module configuration SiDashboardsNgModule.forRoot. Use injection tokens SI_DASHBOARD_CONFIGURATION and SI_WIDGET_STORE directly in your app configuration.

  Before:

  imports: [
    SiDashboardsNgModule.forRoot({
      config: {},
      dashboardApi: {
        provide: SiWidgetStorage,
        useClass: CustomWidgetStorage
      }
    })
  ]
  

  After:

  imports: [SiDashboardsNgModule],
  providers: [
    { provide: SI_WIDGET_STORE, useClass: AppWidgetStorage },
    { provide: SI_DASHBOARD_CONFIGURATION, useValue: config }
  ]
  

• modal: Removed property ModalOptions.initialState. Use ModalOptions.inputValues instead. Note that inputValues only binds to component inputs, unlike initialState, which could set any property on the component instance.

• dashboards/grid: Removed property SiGridComponent.loadingService. Use SiGridComponent.isLoading instead to indicate load and save operations.

• common: Removed buildTrackByIdentity() function. Use Angular's new control-flow syntax instead.

• common: Removed buildTrackByIndex() function. Use Angular's new control-flow syntax instead.

• buttons: Changed selection-buttons sizing.

  The sizing has been aligned with regular buttons. The sizing classes are now consistent with standard button classes:

  • Use btn-lg for large selection buttons
  • Use btn (no modifier) for default size selection buttons
  • Use btn-sm for small selection buttons

  This change affects the HTML structure of selection button groups. Previously, selection buttons had different size mappings compared to regular buttons.

  Before:

  <!-- Small selection buttons (visually same as default regular buttons) -->
  <div class="btn-group">
    <label>
      <input type="radio" class="btn-check" name="example" />
      <span class="btn btn-sm">Option 1</span>
    </label>
  </div>
  

  After:

  <!-- Default selection buttons (now visually same as default regular buttons) -->
  <div class="btn-group">
    <label>
      <input type="radio" class="btn-check" name="example" />
      <span class="btn">Option 1</span>
    </label>
  </div>
  

• maps: Removed the deprecated SiMapComponent.onResize() method. It had no impact.

• resize-observer: Removed following deprecated properties from SiResponsiveContainerDirective in favor of signal-based properties:

  isXs -> Use xs instead
  isSm -> Use sm instead
  isMd -> Use md instead
  isLg -> Use lg instead
  isXl -> Use xl instead
  isXxl -> Use xxl instead

• select: Removed the [complexOptions] input of si-select. Instead use the [options] input which supports

  • grouping of options
  • providing values of any type

  Complex options can be converted like below:

  <!-- Before -->
  <si-select
    [complexOptions]="{group1: [{myLabel: 'My Label', uniqueData: uniqueData}]}"
    [valueProvider]="valueProvider"
    [groupProvider]="groupProvider"
    [optionEqualCheckFn]="uniqueDataEqual"
  />
  
  <!-- After -->
  <si-select
    [options]="[
      {
        type: 'group',
        label: 'Group-1',
        key: 'group1 (optional)',
        options: [{type: 'option', label: 'My Label', value: uniqueData}]
      }
    ]"
    [optionEqualCheckFn]="uniqueDataEqual"

• charts/gauge: Removed input SiChartGaugeComponent.numberOfDecimals. Use SiChartGaugeComponent.minNumberOfDecimals or SiChartGaugeComponent.maxNumberOfDecimals inputs instead.

• tour: Removed property attachTo.on of TourStep interface. It has no effect, position is automatic.

DEPRECATIONS

• charts: SiChartsNgModule is deprecated, import individual components instead. Starting with v49, separate entry points are available for each component, allowing applications to import components from specific entry points, which helps reduce the application bundle size.
• chart: The method SiChartComponent.resetChart is deprecated and should not be used by the consumer directly.

v48.10.0

48.10.0 (2026-01-15)

Features

• ag-grid: add Element theme for AG Grid (4cfe0ef)
• charts: theme change without reloading the chart (4cbfd82)

Bug Fixes

• select: maintain filtered rows when updating all rows (29d3337)

DEPRECATIONS

• charts: The method SiChartComponent.resetChart is deprecated and should not be used by the consumer directly.

v48.9.0

48.9.0 (2025-12-19)

Features

• angular: add support for Angular 21 (11fce52)
• dashboards-ng: support widgets as standalone component (5dad1d4)
• filtered-search: support free text as pills (1970897)

Bug Fixes

• charts/circle: align with figma specs (75157e7)
• side-panel: ensure search bar focus outline is visible (32d3959), closes #1204

NOTES

• angular: Angular without ZoneJS (Zoneless) is generally supported but due to incomplete of testing,
  it might not work in all cases.

v48.8.0

48.8.0 (2025-12-17)

Features

• side-panel: add extended size option (199e451)
• side-panel: enhance navigation with router-link and link support (3f8679a)
• side-panel: implement fullscreen overlay and navigation modes (526773f)

Bug Fixes

• date-range-filter: update datepicker date-range on preset selection (70433ae)
• datepicker: convert 12 AM to 0 hours for 12-hour clock (1f2eb16)
• icon: render font icons when name contains kebab-case with numbers (8684c7f)
• password-toggle: hide MS Edge built-in reveal toggle icon (fdba859)

v48.7.0

48.7.0 (2025-12-10)

Features

• chat-messages: allow asterisk lists and simple images for markdown renderer (7559fce)
• typeahead: introduce experimental create option (a2b2ae9)

Bug Fixes

• charts/cartesian: confine tooltip for cartesian (f3dc55f)
• datatable: support compatibility with datatable v22 (bedc4ec)
• loading-spinner: should work in zoneless environment (09b6530)

v48.6.0

48.6.0 (2025-12-02)

Features

• datatable: support @siemens/ngx-datatable@25 (c89d4f6)
• microchart-line: add area support (de15e4d)

Bug Fixes

• icon: don't use hardcoded id on svg (8b0792f)
• microchart-line: fix gradient ID not unique (0a1ceb0)
• schematics: ignore dot files and node_modules in directory traversal (b97e4ce)
• schematics: remove simpl-element-ng token from scss files and support single and double quotes (8500e73)
• summary-chip: make value attribute optional (ea69015)

v48.5.2

48.5.2 (2025-11-26)

Bug Fixes

• map: avoid TypeError when clicking point without handler (b8f36b4)
• schematics: scss migration should not modify node_modules (e521c20)
• translate-ng: prevent unwanted import of ngx-translate (d8a636c)