@siemens/element-ng 47.3.0 → 47.5.0

package/side-panel/si-side-panel-content.component.d.ts

@@ -0,0 +1,105 @@
+import { OnInit } from '@angular/core';
+import { MenuItem as MenuItemLegacy } from '@siemens/element-ng/common';
+import { ContentActionBarMainItem } from '@siemens/element-ng/content-action-bar';
+import { MenuItem } from '@siemens/element-ng/menu';
+import { TranslatableString } from '@siemens/element-translate-ng/translate';
+import * as i0 from "@angular/core";
+/**
+ * An extension of MenuItem to support combined icons
+ */
+export interface StatusItem extends MenuItemLegacy {
+    overlayIcon?: string;
+}
+export declare class SiSidePanelContentComponent implements OnInit {
+    /**
+     * @defaultValue false
+     */
+    readonly collapsible: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Header of side panel
+     *
+     * @defaultValue ''
+     */
+    readonly heading: import("@angular/core").InputSignal<TranslatableString>;
+    /**
+     * Input list of primary action items
+     *
+     * @defaultValue []
+     */
+    readonly primaryActions: import("@angular/core").InputSignal<(MenuItemLegacy | ContentActionBarMainItem)[]>;
+    /**
+     * Input list of secondary action items.
+     *
+     * @defaultValue []
+     */
+    readonly secondaryActions: import("@angular/core").InputSignal<(MenuItemLegacy | MenuItem)[]>;
+    /**
+     * Status icons/actions
+     *
+     * @defaultValue []
+     */
+    readonly statusActions: import("@angular/core").InputSignal<StatusItem[]>;
+    /**
+     * Toggles search bar
+     *
+     * @defaultValue false
+     */
+    readonly searchable: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Placeholder text for search
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_SIDE_PANEL.SEARCH_PLACEHOLDER:Search...`
+     * ```
+     */
+    readonly searchPlaceholder: import("@angular/core").InputSignal<TranslatableString>;
+    /**
+     * Aria label for close button. Needed for a11y
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_SIDE_PANEL.CLOSE:Close`
+     * ```
+     */
+    readonly closeButtonLabel: import("@angular/core").InputSignal<TranslatableString>;
+    /**
+     * Toggle icon aria-label, required for a11y
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_SIDE_PANEL.TOGGLE:Toggle`
+     * ```
+     */
+    readonly toggleItemLabel: import("@angular/core").InputSignal<TranslatableString>;
+    /**
+     * Show a badge on the mobile drawer indicating a new alert or notification
+     *
+     * @defaultValue false
+     */
+    readonly showMobileDrawerBadge: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Output for search bar input
+     */
+    readonly searchEvent: import("@angular/core").OutputEmitterRef<string>;
+    protected readonly isCollapsed: import("@angular/core").WritableSignal<boolean>;
+    protected readonly isExpanded: import("@angular/core").WritableSignal<boolean>;
+    protected readonly enableMobile: import("@angular/core").Signal<boolean>;
+    protected readonly mobileSize: import("@angular/core").WritableSignal<boolean>;
+    protected readonly focusable: import("@angular/core").Signal<boolean>;
+    protected readonly icons: Record<"elementDoubleLeft" | "elementDoubleRight", string>;
+    /**
+     * The $rpanel-transition-duration in the style is 0.5 seconds.
+     * For the animation we need to wait until the resize is done.
+     */
+    private readonly resizeAnimationDelay;
+    private readonly destroyRef;
+    private readonly service;
+    private readonly breakpointObserver;
+    private expandedTimeout;
+    constructor();
+    ngOnInit(): void;
+    protected toggleSidePanel(event?: MouseEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiSidePanelContentComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SiSidePanelContentComponent, "si-side-panel-content", never, { "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "primaryActions": { "alias": "primaryActions"; "required": false; "isSignal": true; }; "secondaryActions": { "alias": "secondaryActions"; "required": false; "isSignal": true; }; "statusActions": { "alias": "statusActions"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "closeButtonLabel": { "alias": "closeButtonLabel"; "required": false; "isSignal": true; }; "toggleItemLabel": { "alias": "toggleItemLabel"; "required": false; "isSignal": true; }; "showMobileDrawerBadge": { "alias": "showMobileDrawerBadge"; "required": false; "isSignal": true; }; }, { "searchEvent": "searchEvent"; }, never, ["*"], true, never>;
+}

package/side-panel/si-side-panel.component.d.ts

@@ -0,0 +1,108 @@
+import { OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core';
+import { Breakpoints, ElementDimensions } from '@siemens/element-ng/resize-observer';
+import { SidePanelMode, SidePanelSize } from './side-panel.model';
+import * as i0 from "@angular/core";
+export declare class SiSidePanelComponent implements OnInit, OnDestroy, OnChanges {
+    /**
+     * @defaultValue false
+     */
+    readonly collapsible: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Default state of navigation
+     */
+    readonly collapsed: import("@angular/core").ModelSignal<boolean | undefined>;
+    /**
+     * Mode of side panel
+     * (ignored below a certain width)
+     *
+     * @defaultValue 'over'
+     */
+    readonly mode: import("@angular/core").InputSignal<SidePanelMode>;
+    /**
+     * Size of side-panel
+     *
+     * @defaultValue 'regular'
+     */
+    readonly size: import("@angular/core").InputSignal<SidePanelSize>;
+    /**
+     * Toggle icon aria-label, required for a11y
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_SIDE_PANEL.TOGGLE:Toggle`
+     * ```
+     */
+    readonly toggleItemLabel: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate-types").TranslatableString>;
+    /**
+     * Specifies custom breakpoints to automatically switch mode.
+     * The `smMinimum` specifies the breakpoint for the mobile view.
+     * The `lgMinimum` specifies the breakpoint to allow scroll mode
+     * (below automatically uses over mode).
+     * The `xlMinimum` specifies the breakpoint to allow scroll mode
+     * with wide size (below automatically uses over mode).
+     */
+    readonly breakpoints: import("@angular/core").InputSignal<Breakpoints | undefined>;
+    /**
+     * Enable mobile drawer for small screen sizes. Should not be used in conjunction with the vertical navbar.
+     *
+     * @defaultValue false
+     */
+    readonly enableMobile: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Emits when the panel is closed
+     */
+    readonly closed: import("@angular/core").OutputEmitterRef<void>;
+    /**
+     * Emits whenever the content is resized due to opening and closing or parent resize.
+     */
+    readonly contentResize: import("@angular/core").OutputEmitterRef<ElementDimensions>;
+    protected readonly isScrollMode: import("@angular/core").Signal<boolean>;
+    protected readonly isXs: import("@angular/core").WritableSignal<boolean>;
+    protected readonly isSm: import("@angular/core").WritableSignal<boolean>;
+    protected readonly isMd: import("@angular/core").WritableSignal<boolean>;
+    protected readonly isLg: import("@angular/core").WritableSignal<boolean>;
+    protected readonly isXl: import("@angular/core").WritableSignal<boolean>;
+    protected readonly isCollapsed: import("@angular/core").WritableSignal<boolean>;
+    protected readonly ready: import("@angular/core").WritableSignal<boolean>;
+    protected readonly isHidden: import("@angular/core").WritableSignal<boolean>;
+    protected readonly showTempContent: import("@angular/core").WritableSignal<boolean>;
+    private readonly panelElement;
+    private readonly contentElement;
+    private readonly portalOutlet;
+    private readonly tmpPortalOutlet;
+    /**
+     * The $rpanel-transition-duration in the style is 0.5 seconds.
+     * Sending the resize event after resize need to wait until resize is done.
+     */
+    private readonly resizeEventDelay;
+    private resizeEvent;
+    private openingOrClosing;
+    private previousContentDimensions;
+    private isCollapsedInternal;
+    private readonly isBrowser;
+    private readonly element;
+    private readonly resizeObserver;
+    private readonly service;
+    private readonly cdRef;
+    private readonly destroyRef;
+    private readonly document;
+    constructor();
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /**
+     * Toggle whether the side panel is expanded or not.
+     */
+    toggleSidePanel(): void;
+    private emitResizeOutputs;
+    private getContentDimensions;
+    private setBreakpoints;
+    private sendResize;
+    private attachContent;
+    private attachTempContent;
+    private openClose;
+    private doOpenClose;
+    private moveFocusInside;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiSidePanelComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SiSidePanelComponent, "si-side-panel", never, { "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "toggleItemLabel": { "alias": "toggleItemLabel"; "required": false; "isSignal": true; }; "breakpoints": { "alias": "breakpoints"; "required": false; "isSignal": true; }; "enableMobile": { "alias": "enableMobile"; "required": false; "isSignal": true; }; }, { "collapsed": "collapsedChange"; "closed": "closed"; "contentResize": "contentResize"; }, never, ["si-side-panel-content, element-side-panel-content", "*"], true, never>;
+}

package/side-panel/si-side-panel.module.d.ts

@@ -0,0 +1,8 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./si-side-panel.component";
+import * as i2 from "./si-side-panel-content.component";
+export declare class SiSidePanelModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiSidePanelModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SiSidePanelModule, never, [typeof i1.SiSidePanelComponent, typeof i2.SiSidePanelContentComponent], [typeof i1.SiSidePanelComponent, typeof i2.SiSidePanelContentComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SiSidePanelModule>;
+}

package/side-panel/si-side-panel.service.d.ts

@@ -0,0 +1,45 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+import { Portal } from '@angular/cdk/portal';
+import { Observable } from 'rxjs';
+import * as i0 from "@angular/core";
+export declare class SiSidePanelService {
+    private contentSubject;
+    /** @internal */
+    readonly content$: Observable<Portal<any> | undefined>;
+    private openSubject;
+    /**
+     * Emits on side panel is open or close.
+     *
+     * @defaultValue this.openSubject.asObservable()
+     */
+    readonly isOpen$: Observable<boolean>;
+    private tempContentSubject;
+    /** @internal */
+    readonly tempContent$: Observable<Portal<any> | undefined>;
+    private tempContentClosed?;
+    /** @internal */
+    readonly enableMobile: import("@angular/core").WritableSignal<boolean>;
+    /** Set or update displayed content. */
+    setSidePanelContent(portal: Portal<any> | undefined): void;
+    /** Open side panel. */
+    open(): void;
+    /** Close side panel. */
+    close(): void;
+    /** Toggle side panel open/close. */
+    toggle(): void;
+    /** Indicate is side panel open. */
+    isOpen(): boolean;
+    /**
+     * Indicate that the side panel is open with temporary content.
+     */
+    isTemporaryOpen(): boolean;
+    /** Show side panel temporary content, opening the side panel when necessary. */
+    showTemporaryContent(portal: Portal<any> | undefined): Observable<void>;
+    /** Hide side panel temporary content, reverting to state before showing temporary content. */
+    hideTemporaryContent(): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiSidePanelService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<SiSidePanelService>;
+}

package/side-panel/side-panel.model.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+/**
+ * Side panel mode options.
+ * - scroll: pushes content when side panel opens/closes,
+ * - over: Opens as an overlay on existing content. Just like modal.
+ */
+export type SidePanelMode = 'scroll' | 'over';
+/**
+ * Side panel size options.
+ * - wide: 500px,
+ * - regular: 390px
+ */
+export type SidePanelSize = 'wide' | 'regular';

package/slider/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+export * from './si-slider.component';
+export * from './si-slider.module';

package/slider/package.json

@@ -0,0 +1,3 @@
+{
+  "module": "../fesm2022/siemens-element-ng-slider.mjs"
+}

package/slider/si-slider.component.d.ts

@@ -0,0 +1,129 @@
+import { ControlValueAccessor } from '@angular/forms';
+import { SiFormItemControl } from '@siemens/element-ng/form';
+import * as i0 from "@angular/core";
+export declare class SiSliderComponent implements ControlValueAccessor, SiFormItemControl {
+    private static idCounter;
+    private readonly handleRef;
+    private readonly disabledNgControl;
+    /**
+     * @defaultValue
+     * ```
+     * `__si-slider-${SiSliderComponent.idCounter++}`
+     * ```
+     */
+    readonly id: import("@angular/core").InputSignal<string>;
+    /**
+     * Current value of slider.
+     */
+    readonly value: import("@angular/core").ModelSignal<number | undefined>;
+    /**
+     * Minimum of slider range.
+     *
+     * @defaultValue 0
+     */
+    readonly min: import("@angular/core").InputSignalWithTransform<number, unknown>;
+    /**
+     * Maximum of slider range.
+     *
+     * @defaultValue 100
+     */
+    readonly max: import("@angular/core").InputSignalWithTransform<number, unknown>;
+    /**
+     * Label to describe minimum of slider range.
+     *
+     * @defaultValue ''
+     */
+    readonly minLabel: import("@angular/core").InputSignal<string>;
+    /**
+     * Label to describe maximum of slider range.
+     *
+     * @defaultValue ''
+     */
+    readonly maxLabel: import("@angular/core").InputSignal<string>;
+    /**
+     * Interval to step through the slider.
+     *
+     * @defaultValue 1
+     */
+    readonly step: import("@angular/core").InputSignalWithTransform<number, unknown>;
+    /**
+     * Icon to use as the slider thumb.
+     */
+    readonly thumbIcon: import("@angular/core").InputSignal<string | undefined>;
+    /**
+     * Text for aria-label of increment. Needed for a11y.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_SLIDER.INCREMENT:Increment`
+     * ```
+     */
+    readonly incrementLabel: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * Text for aria-label of decrement. Needed for a11y.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_SLIDER.DECREMENT:Decrement`
+     * ```
+     */
+    readonly decrementLabel: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * Text for aria-label of slider. Needed for a11y
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_SLIDER.LABEL:Value`
+     * ```
+     */
+    readonly sliderLabel: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * @defaultValue
+     * ```
+     * `${this.id()}-label`
+     * ```
+     */
+    readonly labelledby: import("@angular/core").InputSignal<string>;
+    /** @defaultValue false */
+    readonly disabledInput: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    protected readonly disabled: import("@angular/core").Signal<boolean>;
+    protected readonly sliderValue: import("@angular/core").Signal<number>;
+    /** @internal */
+    readonly errormessageId: string;
+    protected readonly indicatorPos: import("@angular/core").Signal<number>;
+    protected readonly icons: Record<"elementMinus" | "elementPlus", string>;
+    protected isDragging: boolean;
+    private autoUpdate$;
+    private autoUpdateSubs?;
+    private rtl;
+    private unlistenDragEvents;
+    private onTouchedCallback;
+    private onChangeCallback;
+    private zone;
+    private changeDetectorRef;
+    private incrementValue;
+    private decrementValue;
+    private roundToStepPrecision;
+    private normalizeValue;
+    private handleTouchMove;
+    private handleMouseMove;
+    private handleDragMove;
+    private handleDragEnd;
+    private valueChanged;
+    protected handlePointerDown(event: Event): void;
+    protected autoUpdateKeydown(event: KeyboardEvent): void;
+    protected autoUpdateStart(event: Event, isIncrement: boolean): void;
+    protected autoUpdateStop(): void;
+    protected handleMouseDown(event: MouseEvent): void;
+    protected handleTouchStart(event: TouchEvent): void;
+    /** @internal */
+    writeValue(val: any): void;
+    /** @internal */
+    registerOnChange(fn: any): void;
+    /** @internal */
+    registerOnTouched(fn: () => void): void;
+    /** @internal */
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiSliderComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SiSliderComponent, "si-slider", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "minLabel": { "alias": "minLabel"; "required": false; "isSignal": true; }; "maxLabel": { "alias": "maxLabel"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "thumbIcon": { "alias": "thumbIcon"; "required": false; "isSignal": true; }; "incrementLabel": { "alias": "incrementLabel"; "required": false; "isSignal": true; }; "decrementLabel": { "alias": "decrementLabel"; "required": false; "isSignal": true; }; "sliderLabel": { "alias": "sliderLabel"; "required": false; "isSignal": true; }; "labelledby": { "alias": "labelledby"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, ["*"], true, never>;
+}

package/slider/si-slider.module.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./si-slider.component";
+export declare class SiSliderModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiSliderModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SiSliderModule, never, [typeof i1.SiSliderComponent], [typeof i1.SiSliderComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SiSliderModule>;
+}

package/sort-bar/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+export * from './si-sort-bar.component';
+export * from './si-sort-bar.module';

package/sort-bar/package.json

@@ -0,0 +1,3 @@
+{
+  "module": "../fesm2022/siemens-element-ng-sort-bar.mjs"
+}

package/sort-bar/si-sort-bar.component.d.ts

@@ -0,0 +1,42 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+import { HttpParams } from '@angular/common/http';
+import { OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+export interface SortCriteria {
+    name: string;
+    key: number | string;
+}
+export declare class SiSortBarComponent implements OnInit {
+    /**
+     * Custom sort title.
+     *
+     * @defaultValue
+     * ```
+     * $localize`:@@SI_SORT_BAR.TITLE:Sort by`
+     * ```
+     */
+    readonly sortTitle: import("@angular/core").InputSignal<import("@siemens/element-translate-ng/translate").TranslatableString>;
+    /**
+     * List of sort criteria.
+     */
+    readonly sortCriteria: import("@angular/core").InputSignal<SortCriteria[]>;
+    /**
+     * `key` which sortCriteria is active by default.
+     */
+    readonly defaultSortCriteria: import("@angular/core").InputSignal<string | number>;
+    /**
+     * Output callback event will provide you with a HttpParams object if active
+     * sortCriteria change.
+     */
+    readonly sortChange: import("@angular/core").OutputEmitterRef<HttpParams>;
+    protected readonly icons: Record<"elementSortDown" | "elementSortUp", string>;
+    protected activeSortCriteria: SortCriteria['key'];
+    protected sortIsDescending: boolean;
+    ngOnInit(): void;
+    protected setActive(key: SortCriteria['key']): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiSortBarComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SiSortBarComponent, "si-sort-bar", never, { "sortTitle": { "alias": "sortTitle"; "required": false; "isSignal": true; }; "sortCriteria": { "alias": "sortCriteria"; "required": true; "isSignal": true; }; "defaultSortCriteria": { "alias": "defaultSortCriteria"; "required": true; "isSignal": true; }; }, { "sortChange": "sortChange"; }, never, never, true, never>;
+}

package/sort-bar/si-sort-bar.module.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./si-sort-bar.component";
+export declare class SiSortBarModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SiSortBarModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SiSortBarModule, never, [typeof i1.SiSortBarComponent], [typeof i1.SiSortBarComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SiSortBarModule>;
+}

package/split/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright Siemens 2016 - 2025.
+ * SPDX-License-Identifier: MIT
+ */
+export * from './si-split.module';
+export * from './si-split-part.component';
+export * from './si-split.component';
+export * from './si-split.interfaces';

package/split/package.json

@@ -0,0 +1,3 @@
+{
+  "module": "../fesm2022/siemens-element-ng-split.mjs"
+}