@siemens/element-ng 47.8.0 → 48.0.0-next.1

package/phone-number/index.d.ts

@@ -1,7 +1,196 @@
+import * as _angular_core from '@angular/core';
+import { OnChanges, ElementRef, SimpleChanges } from '@angular/core';
+import * as _siemens_element_translate_ng_translate_types from '@siemens/element-translate-ng/translate-types';
+import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors } from '@angular/forms';
+import { SiFormItemControl } from '@siemens/element-ng/form';
+
 /**
  * Copyright (c) Siemens 2016 - 2025
  * SPDX-License-Identifier: MIT
  */
-export * from './si-phone-number-input.module';
-export * from './si-phone-number-input.component';
-export * from './si-phone-number-input.models';
+interface PhoneNumberModel {
+    /**
+     * Country code
+     */
+    countryCode?: string;
+    /**
+     * Phone number
+     */
+    phoneNumber?: string;
+}
+/**
+ * Describes the country information of the phone number.
+ */
+interface CountryInfo {
+    /**
+     * The name of the country.
+     **/
+    name: string;
+    /**
+     * The country dial code
+     */
+    countryCode: number;
+    /**
+     * The country ISO code.
+     */
+    isoCode: string;
+}
+/**
+ * Describes the phone number, its validity and associated country information.
+ */
+interface PhoneDetails {
+    /**
+     * CountryInfo object containing name, countryCode and isoCode of the phone number.
+     */
+    country?: CountryInfo;
+    /**
+     * Phone number entered by the user.
+     */
+    phoneNumber?: string;
+    /**
+     * Confirms if the phone number is valid or not
+     */
+    isValid: boolean;
+}
+
+declare class SiPhoneNumberInputComponent implements ControlValueAccessor, Validator, OnChanges, SiFormItemControl {
+    private static idCounter;
+    private phoneUtil;
+    private translate;
+    private changeDetectorRef;
+    private elementRef;
+    /**
+     * Unique identifier.
+     *
+     * @defaultValue
+     * ```
+     * `__si-phone-number-input-${SiPhoneNumberInputComponent.idCounter++}`
+     * ```
+     */
+    readonly id: _angular_core.InputSignal<string>;
+    /**
+     * ISO_3166-2 Code of the selected country.
+     */
+    readonly country: _angular_core.ModelSignal<string | undefined>;
+    /**
+     * ISO_3166-2 Code of the country which shall be used on form-control reset.
+     */
+    readonly defaultCountry: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Placeholder text for country search input.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SEARCH_PLACEHOLDER:Search`)
+     * ```
+     */
+    readonly placeholderForSearch: _angular_core.InputSignal<_siemens_element_translate_ng_translate_types.TranslatableString>;
+    /**
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SEARCH_NO-RESULTS_FOUND:No results found`)
+     * ```
+     */
+    readonly searchNoResultsFoundLabel: _angular_core.InputSignal<_siemens_element_translate_ng_translate_types.TranslatableString>;
+    /**
+     * Text for the country dropdown aria-label attribute.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SELECT_COUNTRY:Select country`)
+     * ```
+     */
+    readonly selectCountryAriaLabel: _angular_core.InputSignal<_siemens_element_translate_ng_translate_types.TranslatableString>;
+    /**
+     * Text for the phone number input aria-label attribute.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.PHONE_NUMBER_INPUT_LABEL:Enter phone number`)
+     * ```
+     */
+    readonly phoneNumberAriaLabel: _angular_core.InputSignal<_siemens_element_translate_ng_translate_types.TranslatableString>;
+    /**
+     * List of countries in ISO2 format, from which the user is allowed to select one.
+     * If no values are provided, the dropdown will show all known countries.
+     */
+    readonly supportedCountries: _angular_core.InputSignal<readonly string[] | null | undefined>;
+    /**
+     * @defaultValue
+     * ```
+     * `${this.id()}-label`
+     * ```
+     */
+    readonly labelledby: _angular_core.InputSignal<string>;
+    /** @defaultValue false */
+    readonly disabledInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** @defaultValue false */
+    readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly valueChange: _angular_core.OutputEmitterRef<PhoneDetails>;
+    /** @internal */
+    readonly errormessageId: string;
+    protected readonly phoneInput: _angular_core.Signal<ElementRef<HTMLInputElement>>;
+    protected selectedCountry?: CountryInfo;
+    protected placeholder: string;
+    protected readonly countryFocused: _angular_core.WritableSignal<boolean>;
+    protected open: boolean;
+    protected overlayWidth: number;
+    protected readonly disabled: _angular_core.Signal<boolean>;
+    protected readonly countryList: _angular_core.Signal<{
+        name: string;
+        countryCode: number;
+        isoCode: string;
+    }[]>;
+    protected readonly icons: Record<"elementDown2", string>;
+    private readonly allowedCountries;
+    private readonly disabledNgControl;
+    private isValidNumber;
+    private phoneNumber?;
+    private onChange;
+    private onTouched;
+    ngOnChanges(changes: SimpleChanges): void;
+    /** @internal */
+    writeValue(value: string | undefined): void;
+    /** @internal */
+    registerOnChange(fn: any): void;
+    /** @internal */
+    registerOnTouched(fn: () => void): void;
+    /** @internal */
+    setDisabledState(isDisabled: boolean): void;
+    /** @internal */
+    validate(control: AbstractControl): ValidationErrors | null;
+    protected input(): void;
+    protected blur(): void;
+    protected countryInput(num: CountryInfo): void;
+    protected openOverlay(): void;
+    protected overlayDetach(): void;
+    protected valueProvider(country: CountryInfo): string;
+    private writeCountry;
+    private getCountryName;
+    private updatePlaceholder;
+    private parseNumber;
+    /**
+     * PhoneUtil does not resolve country code early enough when the national prefix is shared among other countries (+1 and +44).
+     * This Method fakes a complete number to force PhoneUtil returning a proper region code.
+     */
+    private getRegionCode;
+    private formatPhoneNumber;
+    private handleChange;
+    private writeTextToInput;
+    /**
+     * Format and update input text or clear input text if the input value is undefined.
+     */
+    private writeValueToInput;
+    private refreshValueAfterCountryChange;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiPhoneNumberInputComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiPhoneNumberInputComponent, "si-phone-number-input", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "country": { "alias": "country"; "required": false; "isSignal": true; }; "defaultCountry": { "alias": "defaultCountry"; "required": false; "isSignal": true; }; "placeholderForSearch": { "alias": "placeholderForSearch"; "required": false; "isSignal": true; }; "searchNoResultsFoundLabel": { "alias": "searchNoResultsFoundLabel"; "required": false; "isSignal": true; }; "selectCountryAriaLabel": { "alias": "selectCountryAriaLabel"; "required": false; "isSignal": true; }; "phoneNumberAriaLabel": { "alias": "phoneNumberAriaLabel"; "required": false; "isSignal": true; }; "supportedCountries": { "alias": "supportedCountries"; "required": false; "isSignal": true; }; "labelledby": { "alias": "labelledby"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; }, { "country": "countryChange"; "valueChange": "valueChange"; }, never, never, true, never>;
+}
+
+declare class SiPhoneNumberInputModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiPhoneNumberInputModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<SiPhoneNumberInputModule, never, [typeof SiPhoneNumberInputComponent], [typeof SiPhoneNumberInputComponent]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<SiPhoneNumberInputModule>;
+}
+
+export { SiPhoneNumberInputComponent, SiPhoneNumberInputModule };
+export type { CountryInfo, PhoneDetails, PhoneNumberModel };

package/photo-upload/index.d.ts

@@ -1,6 +1,306 @@
+import * as _angular_core from '@angular/core';
+import { OnChanges, OnDestroy, TemplateRef, ElementRef, SimpleChanges } from '@angular/core';
+import { SafeResourceUrl } from '@angular/platform-browser';
+import { ModalRef } from '@siemens/element-ng/modal';
+import { TranslatableString } from '@siemens/element-translate-ng/translate';
+import { ImageCropperComponent, ImageCroppedEvent } from 'ngx-image-cropper';
+import * as i1 from '@siemens/element-ng/avatar';
+
+declare class SiImageCropperStyleComponent {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiImageCropperStyleComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiImageCropperStyleComponent, "si-image-cropper-style", never, {}, {}, never, ["*"], true, never>;
+}
+
 /**
- * Copyright (c) Siemens 2016 - 2025
- * SPDX-License-Identifier: MIT
+ * A component used to upload, edit, and delete a user's photo. The user can upload
+ * a photo either via file browser or a URL to the photo. You can set the source
+ * photo with the `sourcePhoto` Data URL input or the `sourcePhotoUrl` URL input.
+ * If you already have a cropped image you can set it with the `croppedPhoto` input.
+ * Cropping changes are emitted via the `croppedPhotoChange` output.
  */
-export * from './si-image-cropper-style.component';
-export * from './si-photo-upload.component';
+declare class SiPhotoUploadComponent implements OnChanges, OnDestroy {
+    private static idCounter;
+    /**
+     * Indicate that changing or uploads are disabled.
+     *
+     * @defaultValue false
+     */
+    readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Optionally disable image cropping.
+     *
+     * @defaultValue false
+     */
+    readonly disabledCropping: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Accepted image formats for the file selection dialog.
+     *
+     * @defaultValue '.png, .jpg, .jpeg'
+     *
+     * @see
+     *
+     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#attr-accept
+     */
+    readonly acceptedUploadFormats: _angular_core.InputSignal<string>;
+    /**
+     * Maximum allowed file size of the uploaded file in kilobytes.
+     *
+     * @defaultValue 2048
+     */
+    readonly maxFileSize: _angular_core.InputSignal<number>;
+    /**
+     * If the uploaded file is of an unsupported type, this
+     * error message will be displayed to the user.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHOTO_UPLOAD.ERROR_FILE_TYPE:The image file is not valid. Please upload a PNG or JP(E)G.`)
+     * ```
+     */
+    readonly uploadErrorWrongType: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * If the uploaded file exceeds the allowed upload size, this
+     * error message will be displayed to the user.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHOTO_UPLOAD.ERROR_FILE_SIZE_EXCEEDED:The actual file size {{mb}} MB exceeds the {{maxSizeMb}} MB limit.`)
+     * ```
+     */
+    readonly uploadErrorTooBig: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Alternative text for the photo.
+     *
+     * @defaultValue ''
+     */
+    readonly photoAltText: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Alternative text for the photo´s placeholder.
+     * The value will be used to calculate the background color when `autoColor` is true.
+     *
+     * @defaultValue ''
+     */
+    readonly placeholderAltText: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Text for the button changing the photo.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHOTO_UPLOAD.CHANGE_PHOTO:Change`)
+     * ```
+     */
+    readonly changePhotoText: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Cropper frame aria label.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHOTO_UPLOAD.CROPPER_FRAME_LABEL:Crop photo`)
+     * ```
+     */
+    readonly cropperFrameAriaLabel: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Text for the button uploading a photo.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHOTO_UPLOAD.UPLOAD_PHOTO:Upload photo`)
+     * ```
+     */
+    readonly uploadPhotoText: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Text for the button removing the photo.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHOTO_UPLOAD.REMOVE:Remove`)
+     * ```
+     */
+    readonly removePhotoText: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Text for the button cancelling the editing process.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHOTO_UPLOAD.CANCEL:Cancel`)
+     * ```
+     */
+    readonly cancelEditText: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Text for the button applying the edited photo.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHOTO_UPLOAD.APPLY_PHOTO:Apply`)
+     * ```
+     */
+    readonly applyEditText: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Text displayed as header of the editing modal.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PHOTO_UPLOAD.MODAL_TITLE:Avatar photo`)
+     * ```
+     */
+    readonly modalHeader: _angular_core.InputSignal<TranslatableString>;
+    /**
+     * Text displayed as description of the editing modal.
+     */
+    readonly modalDescription: _angular_core.InputSignal<TranslatableString | undefined>;
+    /**
+     * Output format of the edited image.
+     *
+     * @defaultValue 'jpeg'
+     */
+    readonly cropperImageFormat: _angular_core.InputSignal<"png" | "jpeg">;
+    /**
+     * The width / height ratio (e.g. 1 / 1 for a square, 4 / 3, 16 / 9 ...).
+     *
+     * @defaultValue 1
+     */
+    readonly cropperAspectRatio: _angular_core.InputSignal<number>;
+    /**
+     * Whether to keep the width and height of the cropped image equal according
+     * to the aspectRatio.
+     *
+     * @defaultValue true
+     */
+    readonly cropperMaintainAspectRatio: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * When set to true, padding will be added around the image to make it fit to
+     * the aspect ratio. Be aware that this transformation will cause the loaded
+     * image to be a png file with an increased base64 string payload.
+     *
+     * @defaultValue false
+     */
+    readonly cropperContainWithinAspectRatio: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * The cropper´s width cannot be made smaller than this number of pixels
+     * (relative to original image´s size). (0 = disabled).
+     *
+     * @defaultValue 50
+     */
+    readonly cropperMinWidth: _angular_core.InputSignal<number>;
+    /**
+     * The cropper´s height cannot be made smaller than this number of pixels
+     * (relative to original image´s size). Will be ignored if
+     * `cropperMaintainAspectRatio` is set. (0 = disabled).
+     *
+     * @defaultValue 50
+     */
+    readonly cropperMinHeight: _angular_core.InputSignal<number>;
+    /**
+     * The cropper´s width cannot be made bigger than this number of pixels.
+     * Default is 0 (disabled).
+     *
+     * @defaultValue 0
+     */
+    readonly cropperMaxWidth: _angular_core.InputSignal<number>;
+    /**
+     * The cropper´s height cannot be made bigger than this number of pixels.
+     * Default is 0 (disabled).
+     *
+     * @defaultValue 0
+     */
+    readonly cropperMaxHeight: _angular_core.InputSignal<number>;
+    /**
+     * Set this to true for a round cropper. Resulting image will still
+     * be square, but visually clipped with a border-radius: 50% on the
+     * resulting image to show it as round.
+     *
+     * @defaultValue true
+     */
+    readonly roundImage: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * The input photo to be used for cropping. A string in [Data URL](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URLs) format
+     * with base64 encoding.
+     */
+    readonly sourcePhoto: _angular_core.ModelSignal<string | undefined>;
+    /**
+     * URL to a photo to be used for cropping.
+     */
+    readonly sourcePhotoUrl: _angular_core.InputSignal<string | undefined>;
+    /**
+     * The photo to be displayed and edited (when not readonly).
+     */
+    readonly croppedPhoto: _angular_core.ModelSignal<string | undefined>;
+    protected readonly editPhotoTemplate: _angular_core.Signal<TemplateRef<any>>;
+    protected readonly fileInput: _angular_core.Signal<ElementRef<any>>;
+    protected readonly imageCropper: _angular_core.Signal<ImageCropperComponent | undefined>;
+    protected readonly titleId: string;
+    /**
+     * The trusted photo url string which is used to display the photo.
+     */
+    protected readonly sanitizedPhotoUrl: _angular_core.WritableSignal<SafeResourceUrl | undefined>;
+    /**
+     * The appropriate error message displayed to the user. Might be
+     * `uploadErrorWrongType` or `uploadErrorTooBig`.
+     */
+    protected readonly uploadErrorMessage: _angular_core.WritableSignal<string | undefined>;
+    protected readonly editButtonText: _angular_core.Signal<TranslatableString>;
+    protected readonly currentFileSizeKilobytes: _angular_core.WritableSignal<number>;
+    protected readonly currentFileSizeMegabytes: _angular_core.WritableSignal<number>;
+    protected readonly maxSizeMb: _angular_core.Signal<number>;
+    /**
+     * The photo instance to be used in the image cropper. We need a different
+     * reference than `sourcePhoto` to support the cancel after uploading
+     * a new photo. While `sourcePhoto` is A and image cropper uploads B,
+     * we should not replace `sourcePhoto` A until user presses apply.
+     */
+    protected readonly imageCropperPhoto: _angular_core.WritableSignal<string | undefined>;
+    protected readonly icons: Record<"elementCancel" | "elementCircleFilled" | "elementStateExclamationMark", string>;
+    /**
+     * Reference to the modal displaying the photo to edit.
+     */
+    protected modalRef?: ModalRef;
+    /**
+     * The last cropped event of the image cropper component.
+     * Will be set on every mouse drag of the user. It contains
+     * the cropped image and the position. When user completes
+     * the cropping, the data from the last event is used.
+     */
+    private imageCroppedEvent?;
+    /**
+     * Applied cropper position necessary to restore the cropper position when the use press the Change button.
+     */
+    private cropperPosition?;
+    private readonly sanitizer;
+    private readonly modalService;
+    private readonly autoBackgroundColorDirective;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    /**
+     * Opens a modal dialog with the cropping component.
+     */
+    protected showCroppingDialog(): void;
+    protected fileUpload(event: Event): void;
+    private updateCroppedPhoto;
+    protected removePhoto(): void;
+    /**
+     * Invoked when user cropped the photo and pressed apply button.
+     * Updates the current photo by the selected cropped photo and
+     * closes the modal dialog.
+     */
+    protected imageCropperApplied(): void;
+    protected imageCropperCanceled(): void;
+    /**
+     * Callback from the image cropper on every mouse drag invoking a cropping.
+     *
+     * @param event - Event containing the cropped image and the image cropped position.
+     *
+     */
+    protected cropperImageCropped(event: ImageCroppedEvent): void;
+    /**
+     * Lifecycle hook from the image cropper component. Informs
+     * us when initialized and ready.
+     */
+    protected cropperReady(): void;
+    private resetFileInputValue;
+    private resetErrorMessage;
+    private setPhoto;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiPhotoUploadComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiPhotoUploadComponent, "si-photo-upload", never, { "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "disabledCropping": { "alias": "disabledCropping"; "required": false; "isSignal": true; }; "acceptedUploadFormats": { "alias": "acceptedUploadFormats"; "required": false; "isSignal": true; }; "maxFileSize": { "alias": "maxFileSize"; "required": false; "isSignal": true; }; "uploadErrorWrongType": { "alias": "uploadErrorWrongType"; "required": false; "isSignal": true; }; "uploadErrorTooBig": { "alias": "uploadErrorTooBig"; "required": false; "isSignal": true; }; "photoAltText": { "alias": "photoAltText"; "required": false; "isSignal": true; }; "placeholderAltText": { "alias": "placeholderAltText"; "required": false; "isSignal": true; }; "changePhotoText": { "alias": "changePhotoText"; "required": false; "isSignal": true; }; "cropperFrameAriaLabel": { "alias": "cropperFrameAriaLabel"; "required": false; "isSignal": true; }; "uploadPhotoText": { "alias": "uploadPhotoText"; "required": false; "isSignal": true; }; "removePhotoText": { "alias": "removePhotoText"; "required": false; "isSignal": true; }; "cancelEditText": { "alias": "cancelEditText"; "required": false; "isSignal": true; }; "applyEditText": { "alias": "applyEditText"; "required": false; "isSignal": true; }; "modalHeader": { "alias": "modalHeader"; "required": false; "isSignal": true; }; "modalDescription": { "alias": "modalDescription"; "required": false; "isSignal": true; }; "cropperImageFormat": { "alias": "cropperImageFormat"; "required": false; "isSignal": true; }; "cropperAspectRatio": { "alias": "cropperAspectRatio"; "required": false; "isSignal": true; }; "cropperMaintainAspectRatio": { "alias": "cropperMaintainAspectRatio"; "required": false; "isSignal": true; }; "cropperContainWithinAspectRatio": { "alias": "cropperContainWithinAspectRatio"; "required": false; "isSignal": true; }; "cropperMinWidth": { "alias": "cropperMinWidth"; "required": false; "isSignal": true; }; "cropperMinHeight": { "alias": "cropperMinHeight"; "required": false; "isSignal": true; }; "cropperMaxWidth": { "alias": "cropperMaxWidth"; "required": false; "isSignal": true; }; "cropperMaxHeight": { "alias": "cropperMaxHeight"; "required": false; "isSignal": true; }; "roundImage": { "alias": "roundImage"; "required": false; "isSignal": true; }; "sourcePhoto": { "alias": "sourcePhoto"; "required": false; "isSignal": true; }; "sourcePhotoUrl": { "alias": "sourcePhotoUrl"; "required": false; "isSignal": true; }; "croppedPhoto": { "alias": "croppedPhoto"; "required": false; "isSignal": true; }; }, { "sourcePhoto": "sourcePhotoChange"; "croppedPhoto": "croppedPhotoChange"; }, never, never, true, [{ directive: typeof i1.SiAvatarBackgroundColorDirective; inputs: { "color": "color"; "autoColor": "autoColor"; }; outputs: {}; }]>;
+}
+
+export { SiImageCropperStyleComponent, SiPhotoUploadComponent };

package/pills-input/index.d.ts

@@ -1,9 +1,135 @@
-/**
- * Copyright (c) Siemens 2016 - 2025
- * SPDX-License-Identifier: MIT
- */
-export * from './si-pills-input.component';
-export * from './si-pills-input.module';
-export * from './si-pills-input-csv.directive';
-export * from './si-pills-input-email.directive';
-export * from './si-pills-input-value-handler';
+import * as _siemens_element_translate_ng_translate_types from '@siemens/element-translate-ng/translate-types';
+import * as _angular_core from '@angular/core';
+import { OnInit, Signal } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import { SiFormItemControl } from '@siemens/element-ng/form';
+
+declare class SiPillsInputComponent implements OnInit, ControlValueAccessor, SiFormItemControl {
+    private static idCounter;
+    /**
+     * The identifier of the pills-input. Will be generated if not provided.
+     *
+     * @defaultValue
+     * ```
+     * `__si-pills-input-${SiPillsInputComponent.idCounter++}`
+     * ```
+     */
+    readonly id: _angular_core.InputSignal<string>;
+    /**
+     * The aria-label for the inner input where users enter new items.
+     *
+     * @defaultValue
+     * ```
+     * t(() => $localize`:@@SI_PILLS_INPUT.INPUT_ELEMENT_ARIA_LABEL:Create item`)
+     * ```
+     */
+    readonly inputElementAriaLabel: _angular_core.InputSignal<_siemens_element_translate_ng_translate_types.TranslatableString>;
+    /**
+     * Whether the pills-input is disabled.
+     *
+     * @defaultValue false
+     */
+    readonly disabledInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Whether the pills-input is readonly
+     *
+     * @defaultValue false
+     */
+    readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** The placeholder to be shown if no value is currently present. */
+    readonly placeholder: _angular_core.InputSignal<string | undefined>;
+    /**
+     * @defaultValue
+     * ```
+     * `${this.id()}-label`
+     * ```
+     */
+    readonly labelledby: _angular_core.InputSignal<string>;
+    /** @internal */
+    readonly errormessageId: string;
+    protected inputValue: string;
+    protected onTouched: () => void;
+    protected onChange: (val: any) => void;
+    protected readonly pills: _angular_core.WritableSignal<string[]>;
+    protected readonly activePillIndex: _angular_core.WritableSignal<number | undefined>;
+    protected readonly inputId: _angular_core.Signal<string>;
+    protected readonly disabled: _angular_core.Signal<boolean>;
+    protected readonly activeDescendant: _angular_core.Signal<string | null>;
+    protected readonly tabindex: _angular_core.Signal<0 | -1 | undefined>;
+    private readonly inputElement;
+    private readonly disabledNgControl;
+    private siPillsInputValueHandlerDirective;
+    private readonly cdRef;
+    private readonly elementRef;
+    ngOnInit(): void;
+    protected input(): void;
+    protected click(): void;
+    protected blur(): void;
+    protected keydownEnter(event: Event): void;
+    protected keydownBackspace(event: Event): void;
+    protected remove(index: number, focus?: boolean): void;
+    private rebuildValue;
+    protected arrowLeft(): void;
+    protected arrowRight(): void;
+    protected delete(): void;
+    /** @internal */
+    registerOnChange(fn: any): void;
+    /** @internal */
+    registerOnTouched(fn: () => void): void;
+    /** @internal */
+    setDisabledState(isDisabled: boolean): void;
+    /** @internal */
+    writeValue(value?: string[] | null): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiPillsInputComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiPillsInputComponent, "si-pills-input", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "inputElementAriaLabel": { "alias": "inputElementAriaLabel"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "labelledby": { "alias": "labelledby"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface SiPillsInputValueParseResult {
+    newValue: string;
+    newPills: string[];
+}
+type SiPillsInputValueHandlerTrigger = 'input' | 'keydown.enter' | 'blur';
+declare abstract class SiPillsInputValueHandlerDirective {
+    /** @internal */
+    abstract handle(value: string, trigger: SiPillsInputValueHandlerTrigger): SiPillsInputValueParseResult | undefined;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiPillsInputValueHandlerDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiPillsInputValueHandlerDirective, never, never, {}, {}, never, never, true, never>;
+}
+
+declare abstract class SiPillsInputPatternBase {
+    /**
+     * Regex to split the input value into segments.
+     *
+     * @defaultValue SEPARATOR_REGEX
+     */
+    readonly separatorRegex: _angular_core.WritableSignal<RegExp>;
+    /** Regex to validate an input string item. */
+    readonly validationRegex?: Signal<RegExp | undefined>;
+    /** @internal */
+    handle(value: string, trigger: SiPillsInputValueHandlerTrigger): SiPillsInputValueParseResult | undefined;
+}
+
+declare class SiPillsInputCsvDirective extends SiPillsInputPatternBase {
+    /** @defaultValue undefined */
+    readonly validationRegex: _angular_core.InputSignal<RegExp | undefined>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiPillsInputCsvDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiPillsInputCsvDirective, "[siPillsInputCsv]", never, { "validationRegex": { "alias": "pillsInputCsvItemRegex"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare class SiPillsInputEmailDirective extends SiPillsInputPatternBase {
+    /**
+     * @defaultValue signal(EMAIL_REGEX).asReadonly()
+     */
+    readonly validationRegex: _angular_core.Signal<RegExp>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiPillsInputEmailDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiPillsInputEmailDirective, "[siPillsInputEmail]", never, {}, {}, never, never, true, never>;
+}
+
+declare class SiPillsInputModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiPillsInputModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<SiPillsInputModule, never, [typeof SiPillsInputComponent, typeof SiPillsInputCsvDirective, typeof SiPillsInputEmailDirective], [typeof SiPillsInputComponent, typeof SiPillsInputCsvDirective, typeof SiPillsInputEmailDirective]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<SiPillsInputModule>;
+}
+
+export { SiPillsInputComponent, SiPillsInputCsvDirective, SiPillsInputEmailDirective, SiPillsInputModule, SiPillsInputValueHandlerDirective };
+export type { SiPillsInputValueHandlerTrigger, SiPillsInputValueParseResult };