@tekus/design-system 5.20.0 → 5.22.0

package/types/tekus-design-system-components-icon.d.ts

@@ -0,0 +1,108 @@
+import * as _angular_core from '@angular/core';
+import { OnDestroy, EffectRef } from '@angular/core';
+import { SafeHtml, DomSanitizer } from '@angular/platform-browser';
+import { SizeProp, IconProp } from '@fortawesome/fontawesome-svg-core';
+
+/**
+ * IconStylesLight is used to define the available light styles for each icon in the IconCatalog.
+ * It includes styles such as 'light', 'fal', 'fa-light', and 'tkl'.
+ */
+type IconStylesLight = 'light' | 'fal' | 'fa-light' | 'tkl';
+/**
+ * IconStylesSolid is used to define the available solid styles for each icon in the IconCatalog.
+ * It includes styles such as 'solid', 'fas', 'fa-solid', and 'tks'.
+ */
+type IconStylesSolid = 'solid' | 'fas' | 'fa-solid' | 'tks';
+/**
+ * IconStylesRegular is used to define the available regular styles for each icon in the IconCatalog.
+ * It includes styles such as 'regular', 'far', 'fa-regular', 'fa', 'fa-classic', and 'tkr'.
+ */
+type IconStylesRegular = 'regular' | 'far' | 'fa-regular' | 'fa' | 'fa-classic' | 'tkr';
+/**
+ * IconStylesGeneral is used to define the available general styles for each icon in the IconCatalog.
+ * It includes all styles from light, solid, and regular categories.
+ */
+type IconStylesGeneral = IconStylesLight | IconStylesSolid | IconStylesRegular | null;
+/**
+ * IconColors is used to define the available colors for each icon in the IconCatalog.
+ * It includes colors such as 'primary', 'secondary', 'success', 'danger', 'warning', 'info', and 'light'.
+ */
+type IconColors = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'light' | null;
+
+type SizeMap = SizeProp | 'md';
+declare class IconComponent implements OnDestroy {
+    /**
+     * The name of the icon to display.
+     * This is a required field.
+     * It should match one of the icons in the *IconCatalog*.
+     */
+    icon: _angular_core.ModelSignal<string>;
+    /**
+     * The style of the icon to display.
+     * This is an optional field.
+     * It defaults to 'regular'.
+     */
+    styleIcon: _angular_core.ModelSignal<IconStylesGeneral>;
+    /**
+     * The color of the icon to display.
+     */
+    color: _angular_core.ModelSignal<IconColors | undefined>;
+    /**
+     * The size of the icon to display.
+     */
+    size: _angular_core.ModelSignal<SizeMap | undefined>;
+    /**
+     * Whether the icon is disabled.
+     */
+    disabled: _angular_core.ModelSignal<boolean>;
+    /**
+     * The definition of the icon to display for Font Awesome.
+     */
+    iconDefinition: _angular_core.WritableSignal<IconProp | null>;
+    /**
+     * The SVG content of the icon to display for custom icons.
+     */
+    svgContent: _angular_core.WritableSignal<SafeHtml | null>;
+    /**
+     * The sanitizer service to use for sanitizing SVG content.
+     */
+    sanitizer: DomSanitizer;
+    /**
+     * The size property to use for the icon.
+     */
+    sizeProp: _angular_core.Signal<SizeProp | null>;
+    /**
+     * The effect reference for the icon.
+     */
+    iconEffect: EffectRef;
+    constructor();
+    /**
+     * Destroy icon effect
+     */
+    ngOnDestroy(): void;
+    /**
+     * Gets the icon to display.
+     */
+    getIcon(): void;
+    /**
+     * Loads the icon from Font Awesome.
+     */
+    loadIconFa(): Promise<void>;
+    /**
+     * Gets the key style for the icon based on the current styleIcon model.
+     *
+    * @returns 'light' | 'regular' | 'solid' | null
+     */
+    getKeyStyle(): 'light' | 'regular' | 'solid' | null;
+    /**
+     * Loads a custom icon from the IconCatalog.
+     * Sanitize the SVG content and apply the appropriate color.
+     * @returns void
+     */
+    loadIconCustom(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<IconComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<IconComponent, "tk-icon", never, { "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "styleIcon": { "alias": "styleIcon"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "icon": "iconChange"; "styleIcon": "styleIconChange"; "color": "colorChange"; "size": "sizeChange"; "disabled": "disabledChange"; }, never, never, true, never>;
+}
+
+export { IconComponent };
+export type { SizeMap };

package/{components/input-number/src/input-number.component.d.ts → types/tekus-design-system-components-input-number.d.ts}

@@ -1,7 +1,8 @@
+import * as _angular_core from '@angular/core';
 import { OnInit, OnDestroy } from '@angular/core';
-import { ControlValueAccessor, FormControl, NgControl } from '@angular/forms';
-import * as i0 from "@angular/core";
-export declare class InputNumberComponent implements ControlValueAccessor, OnInit, OnDestroy {
+import { ControlValueAccessor, NgControl, FormControl } from '@angular/forms';
+
+declare class InputNumberComponent implements ControlValueAccessor, OnInit, OnDestroy {
     readonly ngControl: NgControl | null;
     constructor();
     /**
@@ -9,46 +10,46 @@ export declare class InputNumberComponent implements ControlValueAccessor, OnIni
      * @description
      * The value of the input. Supports two-way binding via signals.
      */
-    value: import("@angular/core").ModelSignal<number | null>;
+    value: _angular_core.ModelSignal<number | null>;
     /**
      * @property {InputSignal<FormControl>} control
      * @description
      * External FormControl used to read/set the input value.
      * If not provided, an internal FormControl is created.
      */
-    control: import("@angular/core").InputSignal<FormControl<any>>;
+    control: _angular_core.InputSignal<FormControl<any>>;
     /**
      * @property {InputSignal<string>} label
      * @description
      * Label displayed above the input.
      */
-    label: import("@angular/core").InputSignal<string>;
+    label: _angular_core.InputSignal<string>;
     /**
      * @property {InputSignal<string>} id
      * @description
      * HTML id attribute for the input.
      * @default 'tk-input-number'
      */
-    id: import("@angular/core").InputSignal<string>;
+    id: _angular_core.InputSignal<string>;
     /**
      * @property {InputSignal<string>} errorMessage
      * @description
      * Message to display when the control is invalid and touched.
      */
-    errorMessage: import("@angular/core").InputSignal<string>;
+    errorMessage: _angular_core.InputSignal<string>;
     /**
      * @property {InputSignal<boolean>} showButtons
      * @description
      * Whether to display spinner buttons.
      * @default false
      */
-    showButtons: import("@angular/core").InputSignal<boolean>;
+    showButtons: _angular_core.InputSignal<boolean>;
     /**
      * @property {boolean} disabled
      * @description
      * Whether the input is disabled.
      */
-    disabled: import("@angular/core").WritableSignal<boolean>;
+    disabled: _angular_core.WritableSignal<boolean>;
     get effectiveControl(): FormControl | null;
     onChange: (value: number | null) => void;
     onTouched: () => void;
@@ -97,6 +98,8 @@ export declare class InputNumberComponent implements ControlValueAccessor, OnIni
      * Handles blur events to mark the control as touched.
      */
     onBlur(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<InputNumberComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputNumberComponent, "tk-input-number", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "control": { "alias": "control"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "showButtons": { "alias": "showButtons"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<InputNumberComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<InputNumberComponent, "tk-input-number", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "control": { "alias": "control"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "showButtons": { "alias": "showButtons"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
 }
+
+export { InputNumberComponent };

package/{components/input-text/src/input-text.component.d.ts → types/tekus-design-system-components-input-text.d.ts}

@@ -1,7 +1,8 @@
+import * as _angular_core from '@angular/core';
 import { OnInit, OnDestroy } from '@angular/core';
-import { ControlValueAccessor, FormControl, NgControl } from '@angular/forms';
-import * as i0 from "@angular/core";
-export declare class InputTextComponent implements ControlValueAccessor, OnInit, OnDestroy {
+import { ControlValueAccessor, NgControl, FormControl } from '@angular/forms';
+
+declare class InputTextComponent implements ControlValueAccessor, OnInit, OnDestroy {
     readonly ngControl: NgControl | null;
     constructor();
     /**
@@ -9,53 +10,53 @@ export declare class InputTextComponent implements ControlValueAccessor, OnInit,
      * @description
      * The value of the input. Supports two-way binding via signals.
      */
-    value: import("@angular/core").ModelSignal<string>;
+    value: _angular_core.ModelSignal<string>;
     /**
      * @property {InputSignal<FormControl>} control
      * @description
      * External FormControl used to read/set the input value.
      * If not provided, an internal FormControl is created.
      */
-    control: import("@angular/core").InputSignal<FormControl<any>>;
+    control: _angular_core.InputSignal<FormControl<any>>;
     /**
      * @property {InputSignal<string>} label
      * @description
      * Label displayed above the input.
      */
-    label: import("@angular/core").InputSignal<string>;
+    label: _angular_core.InputSignal<string>;
     /**
      * @property {InputSignal<string>} type
      * @description
      * Type of the input (text, password, email, etc.).
      * @default 'text'
      */
-    type: import("@angular/core").InputSignal<string>;
+    type: _angular_core.InputSignal<string>;
     /**
      * @property {InputSignal<string>} id
      * @description
      * HTML id attribute for the input.
      * @default 'tk-input-text'
      */
-    id: import("@angular/core").InputSignal<string>;
+    id: _angular_core.InputSignal<string>;
     /**
      * @property {InputSignal<string>} icon
      * @description
      * Icon to display next to the input (e.g., 'pi pi-search').
      */
-    icon: import("@angular/core").InputSignal<string>;
+    icon: _angular_core.InputSignal<string>;
     /**
      * @property {InputSignal<boolean>} clearable
      * @description
      * Whether to show a clear button when the input has a value.
      * @default false
      */
-    clearable: import("@angular/core").InputSignal<boolean>;
+    clearable: _angular_core.InputSignal<boolean>;
     /**
      * @property {InputSignal<string>} errorMessage
      * @description
      * Message to display when the control is invalid and touched.
      */
-    errorMessage: import("@angular/core").InputSignal<string>;
+    errorMessage: _angular_core.InputSignal<string>;
     /**
      * @property {InputSignal<string>} hint
      * @description
@@ -66,21 +67,21 @@ export declare class InputTextComponent implements ControlValueAccessor, OnInit,
      * @description
      * Hint text to display below the input.
      */
-    hint: import("@angular/core").InputSignal<string>;
+    hint: _angular_core.InputSignal<string>;
     /**
      * @property {InputSignal<number | null>} maxLength
      * @description
      * Maximum number of characters allowed in the input.
      */
-    maxLength: import("@angular/core").InputSignal<number | null>;
+    maxLength: _angular_core.InputSignal<number | null>;
     /**
      * @property {boolean} disabled
      * @description
      * Whether the input is disabled.
      */
-    disabled: import("@angular/core").WritableSignal<boolean>;
+    disabled: _angular_core.WritableSignal<boolean>;
     get effectiveControl(): FormControl;
-    counterText: import("@angular/core").Signal<string>;
+    counterText: _angular_core.Signal<string>;
     onChange: (value: string) => void;
     onTouched: () => void;
     private isWriting;
@@ -134,6 +135,8 @@ export declare class InputTextComponent implements ControlValueAccessor, OnInit,
      * Clears the input value.
      */
     clear(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<InputTextComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputTextComponent, "tk-input-text", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "control": { "alias": "control"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, ["[tk-prefix]", "[tk-suffix]"], true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<InputTextComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<InputTextComponent, "tk-input-text", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "control": { "alias": "control"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, ["[tk-prefix]", "[tk-suffix]"], true, never>;
 }
+
+export { InputTextComponent };

package/types/tekus-design-system-components-modal.d.ts

@@ -0,0 +1,186 @@
+import * as _angular_core from '@angular/core';
+import { Type, OnDestroy, EventEmitter, ComponentRef } from '@angular/core';
+import { Variant } from '@tekus/design-system/components/button';
+import { TkCloseInterceptor } from '@tekus/design-system/core/types';
+import { Observable } from 'rxjs';
+
+type ModalSizeType = 'small' | 'large' | 'medium' | 'full';
+type SeverityType = 'primary' | 'secondary' | 'danger';
+interface ModalFooterButton {
+    label: string;
+    severity: SeverityType;
+    /** Optional callback function executed when the button is clicked */
+    action?: () => void;
+    /** Optional value emitted when the modal closes after clicking this button */
+    returnValue?: unknown;
+    /** Optional button variant */
+    variant?: Variant;
+}
+interface ModalConfig<T = unknown> {
+    /** The title displayed at the top of the modal */
+    title: string;
+    /** The main content of the modal. Can be a string or a Component Type. */
+    content?: string | Type<T>;
+    /** Array of footer buttons with label, callback, and return value */
+    footerButtons?: ModalFooterButton[];
+    /** Modal size: 'small', 'large', 'medium' or 'full' */
+    size?: ModalSizeType;
+    /** Whether the modal can be closed by the user via close button */
+    closable?: boolean;
+    /** Whether clicking outside the modal mask closes the modal */
+    closeOnOutsideClick?: boolean;
+    /**
+     * Optional data to be passed as inputs to the dynamic component.
+     * Keys must match the component's @Input names.
+     */
+    data?: Partial<T>;
+    /**
+     * Optional interceptor called before the modal closes.
+     * Return false, Promise<false> or Observable<false> to prevent closing.
+     */
+    interceptor?: TkCloseInterceptor;
+}
+
+/**
+ * @component ModalComponent
+ * @description
+ * A programmatically controlled modal dialog used for displaying dynamic content.
+ * Modernized for Angular 19 with 100% synchronous Signal-based closing interception.
+ */
+declare class ModalComponent<T = unknown> implements OnDestroy {
+    private readonly elementRef;
+    private readonly contentHost;
+    private componentRef?;
+    /** The title displayed at the top of the modal */
+    title: _angular_core.InputSignal<string>;
+    /** The main content of the modal. Can be a string or a Component Type. */
+    content: _angular_core.InputSignal<string | Type<T> | null>;
+    /** Array of footer buttons with label, callback, and return value */
+    footerButtons: _angular_core.InputSignal<ModalFooterButton[]>;
+    /** Modal size: 'small', 'large', 'medium' or 'full' */
+    size: _angular_core.InputSignal<ModalSizeType>;
+    /** Whether the modal can be closed by the user via close button */
+    closable: _angular_core.InputSignal<boolean>;
+    /** Whether clicking outside the modal mask closes the modal */
+    closeOnOutsideClick: _angular_core.InputSignal<boolean>;
+    /**
+     * Optional data to be passed as inputs to the dynamic component.
+     */
+    data: _angular_core.InputSignal<Partial<T>>;
+    /**
+     * Optional interceptor called before the modal closes.
+     * MUST be synchronous. Returns true to allow closing.
+     */
+    interceptor: _angular_core.InputSignal<TkCloseInterceptor | undefined>;
+    /** Computed: whether the content is a simple string */
+    isContentString: _angular_core.Signal<boolean>;
+    /** Computed: whether the modal has footer buttons to display */
+    hasFooter: _angular_core.Signal<boolean>;
+    /** Whether the modal should be responsive on mobile screens */
+    responsive: _angular_core.InputSignal<boolean>;
+    /** Visibility flag as Model Signal (allows two-way binding) */
+    isOpened: _angular_core.ModelSignal<boolean>;
+    /** Whether the modal content has a scrollbar */
+    hasScroll: boolean;
+    /** Emits when the modal closes, passing the return value from footer buttons or null */
+    readonly onClose: EventEmitter<unknown>;
+    private alreadyEmitted;
+    private returnValueOnClose;
+    constructor();
+    /** Computed: calculates modal max-width based on `size` */
+    modalMaxWidth: _angular_core.Signal<"67.5rem" | "35rem" | "98vw" | "25rem">;
+    ngOnDestroy(): void;
+    /**
+     * @summary Orchestrates dynamic rendering and destruction based on visibility.
+     * @private
+     */
+    private attachDynamicContent;
+    /**
+     * @summary Synchronizes incoming data record with the dynamic instance @Inputs.
+     * @private
+     */
+    private syncDynamicInputs;
+    /**
+     * @summary Safely destroys the dynamic component and clears references.
+     * @private
+     */
+    private detachDynamicContent;
+    /**
+     * Checks if the modal content has a scrollbar and updates `hasScroll` state.
+     */
+    checkScroll(): void;
+    /**
+     * Opens the modal dialog.
+     */
+    open(): void;
+    /**
+     * @summary Main entry point for closure requests.
+     * Evaluation is 100% synchronous based on current Signal state.
+     * @param returnValue (Optional) Value to emit on close.
+     */
+    tryClose(returnValue?: unknown): void;
+    /**
+     * @summary Synchronous evaluator of hierarchical guards.
+     * @returns true if closure is allowed.
+     * @private
+     */
+    private canExecuteClosure;
+    /**
+     * @summary Unified logic to execute the final closure state change.
+     * @private
+     */
+    private executeClosure;
+    /**
+     * @summary Handles external visibility changes (from p-dialog 'X' or Escape).
+     * Ensures the reactive guard is respected before allowing closure.
+     */
+    onVisibleChange(visible: boolean): void;
+    /**
+     * Handles the close event from the underlying dialog component.
+     */
+    handleClose(): void;
+    /**
+     * @summary Handles actions triggered by footer buttons.
+     */
+    handleAction(action: (() => void) | undefined, returnValue: unknown): void;
+    /**
+     * @summary Safely closes the modal forcefully without checks.
+     */
+    close(): void;
+    /**
+     * @private
+     * Encapsulates state cleanup to avoid repetitive assignments
+     */
+    private resetClosureState;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ModalComponent<any>, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ModalComponent<any>, "tk-modal", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "content": { "alias": "content"; "required": false; "isSignal": true; }; "footerButtons": { "alias": "footerButtons"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "closeOnOutsideClick": { "alias": "closeOnOutsideClick"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "interceptor": { "alias": "interceptor"; "required": false; "isSignal": true; }; "responsive": { "alias": "responsive"; "required": false; "isSignal": true; }; "isOpened": { "alias": "isOpened"; "required": false; "isSignal": true; }; }, { "isOpened": "isOpenedChange"; }, never, never, true, never>;
+}
+
+/**
+ * @service ModalService
+ * @description
+ * Service responsible for programmatically opening and managing modal dialogs.
+ * It handles component creation, attachment to the document body, and cleanup.
+ */
+declare class ModalService {
+    private readonly injector;
+    private readonly appRef;
+    /** Reference to the currently open modal component */
+    private modalRef;
+    /** Internal getter for testing purposes */
+    get _modalRefForTesting(): ComponentRef<ModalComponent> | null;
+    /** Internal setter for testing purposes */
+    set _modalRefForTesting(ref: ComponentRef<ModalComponent> | null);
+    /**
+     * Opens a modal dialog with the provided configuration.
+     * Only one modal can be open at a time.
+     * @param config Configuration object for the modal (title, content, buttons, etc.)
+     * @returns An observable that emits the modal's return value when it closes.
+     */
+    open(config: ModalConfig): Observable<unknown>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ModalService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<ModalService>;
+}
+
+export { ModalComponent, ModalService };
+export type { ModalConfig, ModalFooterButton, ModalSizeType, SeverityType };

package/{components/multiselect/src/multiselect.component.d.ts → types/tekus-design-system-components-multiselect.d.ts}

@@ -1,7 +1,12 @@
-import { ControlValueAccessor, FormControl, NgControl } from '@angular/forms';
-import { MultiSelectOption } from './multiselect.types';
-import * as i0 from "@angular/core";
-export declare class MultiselectComponent implements ControlValueAccessor {
+import * as _angular_core from '@angular/core';
+import { ControlValueAccessor, NgControl, FormControl } from '@angular/forms';
+
+interface MultiSelectOption {
+    name: string;
+    code: string;
+}
+
+declare class MultiselectComponent implements ControlValueAccessor {
     readonly ngControl: NgControl | null;
     constructor();
     /**
@@ -15,13 +20,13 @@ export declare class MultiselectComponent implements ControlValueAccessor {
      * @description
      * The model signal for two-way binding.
      */
-    readonly model: import("@angular/core").ModelSignal<MultiSelectOption[] | null>;
+    readonly model: _angular_core.ModelSignal<MultiSelectOption[] | null>;
     /**
      * @property {MultiSelectOption[]} options
      * @description
      * Array of available options shown in the multiselect dropdown.
      */
-    options: import("@angular/core").InputSignal<MultiSelectOption[]>;
+    options: _angular_core.InputSignal<MultiSelectOption[]>;
     /**
      * @property {string} labelText
      * @description
@@ -29,7 +34,7 @@ export declare class MultiselectComponent implements ControlValueAccessor {
      *
      * @default 'Select'
      */
-    labelText: import("@angular/core").InputSignal<string>;
+    labelText: _angular_core.InputSignal<string>;
     /**
      * @property {string} display
      * @description
@@ -37,7 +42,7 @@ export declare class MultiselectComponent implements ControlValueAccessor {
      *
      * @default 'chip'
      */
-    display: import("@angular/core").InputSignal<string>;
+    display: _angular_core.InputSignal<string>;
     /**
      * @property {number} maxSelectedLabels
      * @description
@@ -45,7 +50,7 @@ export declare class MultiselectComponent implements ControlValueAccessor {
      *
      * @default 4
      */
-    maxSelectedLabels: import("@angular/core").InputSignal<number>;
+    maxSelectedLabels: _angular_core.InputSignal<number>;
     /**
      * @property {string} selectedItemsLabel
      * @description
@@ -53,7 +58,7 @@ export declare class MultiselectComponent implements ControlValueAccessor {
      *
      * @default '{0} elementos seleccionados'
      */
-    selectedItemsLabel: import("@angular/core").InputSignal<string>;
+    selectedItemsLabel: _angular_core.InputSignal<string>;
     /**
      * @property {string} emptyFilterMessage
      * @description
@@ -61,7 +66,7 @@ export declare class MultiselectComponent implements ControlValueAccessor {
      *
      * @default 'No hay resultados'
      */
-    emptyFilterMessage: import("@angular/core").InputSignal<string>;
+    emptyFilterMessage: _angular_core.InputSignal<string>;
     /**
      * @property {boolean} filter
      * @description
@@ -69,13 +74,13 @@ export declare class MultiselectComponent implements ControlValueAccessor {
      *
      * @default true
      */
-    filter: import("@angular/core").InputSignal<boolean>;
+    filter: _angular_core.InputSignal<boolean>;
     /**
      * @property {string} filterPlaceHolder
      * @description
      * Placeholder text for the filter input.
      */
-    filterPlaceHolder: import("@angular/core").InputSignal<string>;
+    filterPlaceHolder: _angular_core.InputSignal<string>;
     /**
      * @property {string} id
      * @description
@@ -83,25 +88,25 @@ export declare class MultiselectComponent implements ControlValueAccessor {
      *
      * @default 'multiselect'
      */
-    id: import("@angular/core").InputSignal<string>;
+    id: _angular_core.InputSignal<string>;
     /**
      * @property {string} styleClass
      * @description
      * Additional CSS class applied to the multiselect container.
      */
-    styleClass: import("@angular/core").InputSignal<string>;
+    styleClass: _angular_core.InputSignal<string>;
     /**
    * @property {InputSignal<string>} errorMessage
    * @description
    * Message to display when the control is invalid and touched.
    */
-    errorMessage: import("@angular/core").InputSignal<string>;
+    errorMessage: _angular_core.InputSignal<string>;
     /**
    * @property {InputSignal<string>} hint
    * @description
    * Hint text to display below the input.
    */
-    hint: import("@angular/core").InputSignal<string>;
+    hint: _angular_core.InputSignal<string>;
     /**
      * @event selectionChange
      * @description
@@ -111,20 +116,20 @@ export declare class MultiselectComponent implements ControlValueAccessor {
      * @example
      * <tk-multiselect (selectionChange)="onChange($event)"></tk-multiselect>
      */
-    selectionChange: import("@angular/core").OutputEmitterRef<MultiSelectOption[] | null>;
+    selectionChange: _angular_core.OutputEmitterRef<MultiSelectOption[] | null>;
     /**
      * @event filterChange
      * @description
      * Emits the filter text when the user types in the search input.
      */
-    readonly filterChange: import("@angular/core").OutputEmitterRef<string>;
+    readonly filterChange: _angular_core.OutputEmitterRef<string>;
     /**
      * @property internalOptions
      * @description
      * Computed signal that merges the current options with the selected items pool
      * to ensure selected items are always visible.
      */
-    readonly internalOptions: import("@angular/core").Signal<any[]>;
+    readonly internalOptions: _angular_core.Signal<any[]>;
     /**
      * @method handleFilter
      * @description
@@ -201,6 +206,9 @@ export declare class MultiselectComponent implements ControlValueAccessor {
      * either from NgControl or the internal model.
      */
     get effectiveControl(): FormControl | null;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MultiselectComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MultiselectComponent, "tk-multiselect", never, { "model": { "alias": "model"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "labelText": { "alias": "labelText"; "required": false; "isSignal": true; }; "display": { "alias": "display"; "required": false; "isSignal": true; }; "maxSelectedLabels": { "alias": "maxSelectedLabels"; "required": false; "isSignal": true; }; "selectedItemsLabel": { "alias": "selectedItemsLabel"; "required": false; "isSignal": true; }; "emptyFilterMessage": { "alias": "emptyFilterMessage"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "filterPlaceHolder": { "alias": "filterPlaceHolder"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "styleClass": { "alias": "styleClass"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; }, { "model": "modelChange"; "selectionChange": "selectionChange"; "filterChange": "filterChange"; }, never, never, true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MultiselectComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MultiselectComponent, "tk-multiselect", never, { "model": { "alias": "model"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "labelText": { "alias": "labelText"; "required": false; "isSignal": true; }; "display": { "alias": "display"; "required": false; "isSignal": true; }; "maxSelectedLabels": { "alias": "maxSelectedLabels"; "required": false; "isSignal": true; }; "selectedItemsLabel": { "alias": "selectedItemsLabel"; "required": false; "isSignal": true; }; "emptyFilterMessage": { "alias": "emptyFilterMessage"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "filterPlaceHolder": { "alias": "filterPlaceHolder"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "styleClass": { "alias": "styleClass"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; }, { "model": "modelChange"; "selectionChange": "selectionChange"; "filterChange": "filterChange"; }, never, never, true, never>;
 }
+
+export { MultiselectComponent };
+export type { MultiSelectOption };