@tekus/design-system 5.23.0 → 5.25.0

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

@@ -1,9 +1,8 @@
 import * as _angular_core from '@angular/core';
-import { Type, OnDestroy, EventEmitter, ComponentRef } from '@angular/core';
+import { Type, OnDestroy, ComponentRef } from '@angular/core';
 import { Variant } from '@tekus/design-system/components/button';
 import { SeverityType } from '@tekus/design-system/components/modal';
-import { TkCloseInterceptor } from '@tekus/design-system/core/types';
-import { Observable } from 'rxjs';
+import { TkCloseInterceptor, TkDialogRef } from '@tekus/design-system/core/types';
 
 type DrawerSizeType = 'small' | 'large';
 interface DrawerHeaderAction {
@@ -60,8 +59,11 @@ interface DrawerConfig<T = unknown> {
  */
 declare class DrawerComponent<T = unknown> implements OnDestroy {
     private readonly elementRef;
+    private readonly injector;
     private readonly contentHost;
     private componentRef?;
+    /** The dialog ref associated with this drawer */
+    dialogRef: _angular_core.InputSignal<TkDialogRef<DrawerComponent<T>, unknown> | null>;
     /** The required title displayed at the top left of the drawer header */
     title: _angular_core.InputSignal<string>;
     /** The main content of the drawer. Can be a string or a Component Type. */
@@ -90,7 +92,7 @@ declare class DrawerComponent<T = unknown> implements OnDestroy {
     /** Whether the drawer content has a scrollbar */
     hasScroll: boolean;
     /** Emits when the drawer closes, passing the return value from header action or null */
-    readonly onClose: EventEmitter<unknown>;
+    readonly closed: _angular_core.OutputEmitterRef<unknown>;
     private alreadyEmitted;
     private returnValueOnClose;
     constructor();
@@ -102,8 +104,11 @@ declare class DrawerComponent<T = unknown> implements OnDestroy {
      * Checks if the drawer content has a scrollbar and updates `hasScroll` state.
      */
     checkScroll(): void;
+    private wasOpened;
     /** Opens the drawer */
     open(): void;
+    /** Marks the drawer as shown to enable closure emission guards */
+    handleShow(): void;
     /**
      * @summary Main entry point for closure requests.
      * @returns true if closure was executed.
@@ -123,15 +128,15 @@ declare class DrawerComponent<T = unknown> implements OnDestroy {
     handleHeaderAction(action: (() => void) | undefined, returnValue: unknown): void;
     private resetClosureState;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DrawerComponent<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DrawerComponent<any>, "tk-drawer", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "content": { "alias": "content"; "required": false; "isSignal": true; }; "headerAction": { "alias": "headerAction"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "interceptor": { "alias": "interceptor"; "required": false; "isSignal": true; }; "isOpened": { "alias": "isOpened"; "required": false; "isSignal": true; }; }, { "isOpened": "isOpenedChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DrawerComponent<any>, "tk-drawer", never, { "dialogRef": { "alias": "dialogRef"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": true; "isSignal": true; }; "content": { "alias": "content"; "required": false; "isSignal": true; }; "headerAction": { "alias": "headerAction"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "interceptor": { "alias": "interceptor"; "required": false; "isSignal": true; }; "isOpened": { "alias": "isOpened"; "required": false; "isSignal": true; }; }, { "isOpened": "isOpenedChange"; "closed": "closed"; }, never, never, true, never>;
 }
 
 declare class DrawerService {
     private readonly appRef;
-    private drawerRef;
-    get _drawerRefForTesting(): ComponentRef<DrawerComponent<unknown>> | null;
-    set _drawerRefForTesting(ref: ComponentRef<DrawerComponent<unknown>> | null);
-    open(config: DrawerConfig): Observable<unknown>;
+    private dialogRef;
+    get drawerRefForTesting(): ComponentRef<DrawerComponent<unknown>> | null;
+    set drawerRefForTesting(ref: ComponentRef<DrawerComponent<unknown>> | null);
+    open<T = unknown, R = unknown>(config: DrawerConfig): TkDialogRef<DrawerComponent<T>, R>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DrawerService, never>;
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<DrawerService>;
 }

package/types/tekus-design-system-components-fallback-view.d.ts

@@ -1,12 +1,11 @@
-import * as i0 from '@angular/core';
-import { EventEmitter } from '@angular/core';
+import * as _angular_core from '@angular/core';
 
 type FallbackViewType = 'content' | 'section';
 /**
  * @component FallbackViewComponent
  * @description
  * A reusable component for displaying fallback or empty states such as
- * “no results found”, “error loading data”, or “content not available”.
+ * "no results found", "error loading data", or "content not available".
  * It provides a consistent structure with support for an image, title,
  * message, and optional action buttons.
  *
@@ -68,9 +67,9 @@ declare class FallbackViewComponent {
      * - `'content'`: Standard size.
      * - `'section'`: A more compact version.
      *
-     * @default `'default'`
+     * @default `'content'`
      */
-    type: FallbackViewType;
+    type: _angular_core.InputSignal<FallbackViewType>;
     /**
      * @property {string} imageSrc
      * @description
@@ -78,12 +77,12 @@ declare class FallbackViewComponent {
      *
      * @default `''`
      */
-    imageSrc: string;
+    imageSrc: _angular_core.InputSignal<string>;
     /**
      * @property {string} illustrationAlt
      * Descriptive alternative text for the image. Improves accessibility.
      */
-    illustrationAlt: string;
+    illustrationAlt: _angular_core.InputSignal<string>;
     /**
      * @property {string} title
      * @description
@@ -91,7 +90,7 @@ declare class FallbackViewComponent {
      *
      * @default `''`
      */
-    title: string;
+    title: _angular_core.InputSignal<string>;
     /**
      * @property {string} message
      * @description
@@ -99,7 +98,7 @@ declare class FallbackViewComponent {
      *
      * @default `''`
      */
-    message: string;
+    message: _angular_core.InputSignal<string>;
     /**
      * @property {string} buttonLabel
      * @description
@@ -107,7 +106,7 @@ declare class FallbackViewComponent {
      *
      * @default `''`
      */
-    buttonLabel: string;
+    buttonLabel: _angular_core.InputSignal<string>;
     /**
      * @property {string} linkLabel
      * @description
@@ -116,7 +115,7 @@ declare class FallbackViewComponent {
      *
      * @default `''`
      */
-    linkLabel: string;
+    linkLabel: _angular_core.InputSignal<string>;
     /**
      * @property {boolean} buttonDisabled
      * @description
@@ -125,25 +124,25 @@ declare class FallbackViewComponent {
      *
      * @default false
      */
-    buttonDisabled: boolean;
+    buttonDisabled: _angular_core.InputSignal<boolean>;
     /**
      * @event buttonAction
      * @description
      * Emits when the main action button is clicked. Listen to this event
      * to handle the primary call-to-action.
      */
-    buttonAction: EventEmitter<void>;
+    buttonAction: _angular_core.OutputEmitterRef<void>;
     /**
      * @event linkAction
      * @description
      * Emits when the link-styled button is clicked. Use for secondary
      * or alternative actions.
      */
-    linkAction: EventEmitter<void>;
+    linkAction: _angular_core.OutputEmitterRef<void>;
     /**
-     * @method  onButtonActionClick
+     * @method onButtonActionClick
      * @description
-     * Internal handler that emits the `primaryAction` event when the
+     * Internal handler that emits the `buttonAction` event when the
      * main button is clicked.
      */
     onButtonActionClick(): void;
@@ -154,8 +153,8 @@ declare class FallbackViewComponent {
      * link button is clicked.
      */
     onLinkActionClick(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<FallbackViewComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FallbackViewComponent, "tk-fallback-view", never, { "type": { "alias": "type"; "required": false; }; "imageSrc": { "alias": "imageSrc"; "required": false; }; "illustrationAlt": { "alias": "illustrationAlt"; "required": false; }; "title": { "alias": "title"; "required": false; }; "message": { "alias": "message"; "required": false; }; "buttonLabel": { "alias": "buttonLabel"; "required": false; }; "linkLabel": { "alias": "linkLabel"; "required": false; }; "buttonDisabled": { "alias": "buttonDisabled"; "required": false; }; }, { "buttonAction": "buttonAction"; "linkAction": "linkAction"; }, never, ["[image]", "[title]", "[message]", "[actions]"], true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FallbackViewComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FallbackViewComponent, "tk-fallback-view", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "imageSrc": { "alias": "imageSrc"; "required": false; "isSignal": true; }; "illustrationAlt": { "alias": "illustrationAlt"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "message": { "alias": "message"; "required": false; "isSignal": true; }; "buttonLabel": { "alias": "buttonLabel"; "required": false; "isSignal": true; }; "linkLabel": { "alias": "linkLabel"; "required": false; "isSignal": true; }; "buttonDisabled": { "alias": "buttonDisabled"; "required": false; "isSignal": true; }; }, { "buttonAction": "buttonAction"; "linkAction": "linkAction"; }, never, ["[image]", "[title]", "[message]", "[actions]"], true, never>;
 }
 
 export { FallbackViewComponent };

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

@@ -1,5 +1,4 @@
 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';
 
@@ -30,31 +29,31 @@ type IconStylesGeneral = IconStylesLight | IconStylesSolid | IconStylesRegular |
 type IconColors = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'light' | null;
 
 type SizeMap = SizeProp | 'md';
-declare class IconComponent implements OnDestroy {
+declare class IconComponent {
     /**
      * 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>;
+    icon: _angular_core.InputSignal<string>;
     /**
      * The style of the icon to display.
      * This is an optional field.
      * It defaults to 'regular'.
      */
-    styleIcon: _angular_core.ModelSignal<IconStylesGeneral>;
+    styleIcon: _angular_core.InputSignal<IconStylesGeneral>;
     /**
      * The color of the icon to display.
      */
-    color: _angular_core.ModelSignal<IconColors | undefined>;
+    color: _angular_core.InputSignal<IconColors | undefined>;
     /**
      * The size of the icon to display.
      */
-    size: _angular_core.ModelSignal<SizeMap | undefined>;
+    size: _angular_core.InputSignal<SizeMap | undefined>;
     /**
      * Whether the icon is disabled.
      */
-    disabled: _angular_core.ModelSignal<boolean>;
+    disabled: _angular_core.InputSignal<boolean>;
     /**
      * The definition of the icon to display for Font Awesome.
      */
@@ -71,15 +70,7 @@ declare class IconComponent implements OnDestroy {
      * 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.
      */
@@ -101,7 +92,7 @@ declare class IconComponent implements OnDestroy {
      */
     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>;
+    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; }; }, {}, never, never, true, never>;
 }
 
 export { IconComponent };

package/types/tekus-design-system-components-input-number.d.ts

@@ -1,9 +1,10 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, OnDestroy } from '@angular/core';
+import { OnInit } from '@angular/core';
 import { ControlValueAccessor, NgControl, FormControl } from '@angular/forms';
 
-declare class InputNumberComponent implements ControlValueAccessor, OnInit, OnDestroy {
+declare class InputNumberComponent implements ControlValueAccessor, OnInit {
     readonly ngControl: NgControl | null;
+    private readonly destroyRef;
     constructor();
     /**
      * @property {ModelSignal<number | null>} value
@@ -54,9 +55,7 @@ declare class InputNumberComponent implements ControlValueAccessor, OnInit, OnDe
     onChange: (value: number | null) => void;
     onTouched: () => void;
     private isWriting;
-    private readonly subscription;
     ngOnInit(): void;
-    ngOnDestroy(): void;
     /**
      * @method writeValue
      * @description

package/types/tekus-design-system-components-input-text.d.ts

@@ -1,10 +1,11 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, OnDestroy } from '@angular/core';
+import { OnInit } from '@angular/core';
 import { ControlValueAccessor, NgControl, FormControl } from '@angular/forms';
 
-declare class InputTextComponent implements ControlValueAccessor, OnInit, OnDestroy {
+declare class InputTextComponent implements ControlValueAccessor, OnInit {
     readonly ngControl: NgControl | null;
-    constructor();
+    private readonly destroyRef;
+    private readonly init;
     /**
      * @property {ModelSignal<string>} value
      * @description
@@ -57,11 +58,6 @@ declare class InputTextComponent implements ControlValueAccessor, OnInit, OnDest
      * Message to display when the control is invalid and touched.
      */
     errorMessage: _angular_core.InputSignal<string>;
-    /**
-     * @property {InputSignal<string>} hint
-     * @description
-     * Hint text to display below the input.
-     */
     /**
      * @property {InputSignal<string>} hint
      * @description
@@ -85,9 +81,7 @@ declare class InputTextComponent implements ControlValueAccessor, OnInit, OnDest
     onChange: (value: string) => void;
     onTouched: () => void;
     private isWriting;
-    private readonly subscription;
     ngOnInit(): void;
-    ngOnDestroy(): void;
     /**
      * @method writeValue
      * @description

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

@@ -1,8 +1,7 @@
 import * as _angular_core from '@angular/core';
-import { Type, OnDestroy, EventEmitter, ComponentRef } from '@angular/core';
+import { Type, OnDestroy, ComponentRef } from '@angular/core';
 import { Variant } from '@tekus/design-system/components/button';
-import { TkCloseInterceptor } from '@tekus/design-system/core/types';
-import { Observable } from 'rxjs';
+import { TkCloseInterceptor, TkDialogRef } from '@tekus/design-system/core/types';
 
 type ModalSizeType = 'small' | 'large' | 'medium' | 'full';
 type SeverityType = 'primary' | 'secondary' | 'danger';
@@ -49,8 +48,11 @@ interface ModalConfig<T = unknown> {
  */
 declare class ModalComponent<T = unknown> implements OnDestroy {
     private readonly elementRef;
+    private readonly injector;
     private readonly contentHost;
     private componentRef?;
+    /** The dialog ref associated with this modal */
+    dialogRef: _angular_core.InputSignal<TkDialogRef<ModalComponent<T>, unknown> | null>;
     /** 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. */
@@ -83,7 +85,7 @@ declare class ModalComponent<T = unknown> implements OnDestroy {
     /** 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>;
+    readonly closed: _angular_core.OutputEmitterRef<unknown>;
     private alreadyEmitted;
     private returnValueOnClose;
     constructor();
@@ -109,6 +111,7 @@ declare class ModalComponent<T = unknown> implements OnDestroy {
      * Checks if the modal content has a scrollbar and updates `hasScroll` state.
      */
     checkScroll(): void;
+    private wasOpened;
     /**
      * Opens the modal dialog.
      */
@@ -153,7 +156,7 @@ declare class ModalComponent<T = unknown> implements OnDestroy {
      */
     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>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ModalComponent<any>, "tk-modal", never, { "dialogRef": { "alias": "dialogRef"; "required": false; "isSignal": true; }; "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"; "closed": "closed"; }, never, never, true, never>;
 }
 
 /**
@@ -163,21 +166,20 @@ declare class ModalComponent<T = unknown> implements OnDestroy {
  * 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;
+    /** Reference to the currently open modal dialog ref */
+    private dialogRef;
     /** Internal getter for testing purposes */
-    get _modalRefForTesting(): ComponentRef<ModalComponent> | null;
+    get modalRefForTesting(): ComponentRef<ModalComponent> | null;
     /** Internal setter for testing purposes */
-    set _modalRefForTesting(ref: ComponentRef<ModalComponent> | null);
+    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.
+     * @returns A TkDialogRef for the opened modal.
      */
-    open(config: ModalConfig): Observable<unknown>;
+    open<T = unknown, R = unknown>(config: ModalConfig): TkDialogRef<ModalComponent<T>, R>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ModalService, never>;
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<ModalService>;
 }

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

@@ -1,5 +1,4 @@
-import * as i0 from '@angular/core';
-import { EventEmitter } from '@angular/core';
+import * as _angular_core from '@angular/core';
 
 /**
  * @component PanelComponent
@@ -15,7 +14,7 @@ import { EventEmitter } from '@angular/core';
  * <tk-panel
  *   header="Panel Title"
  *   [toggleable]="true"
- *   [collapsed]="false">
+ *   [(collapsed)]="isCollapsed">
  *   <p>Panel content goes here</p>
  * </tk-panel>
  * ```
@@ -28,7 +27,7 @@ declare class PanelComponent {
      *
      * @default undefined
      */
-    header?: string;
+    header: _angular_core.InputSignal<string | undefined>;
     /**
      * @property {boolean} toggleable
      * @description
@@ -36,23 +35,16 @@ declare class PanelComponent {
      *
      * @default false
      */
-    toggleable: boolean;
+    toggleable: _angular_core.InputSignal<boolean>;
     /**
-     * @property {boolean} collapsed
+     * @property {ModelSignal<boolean>} collapsed
      * @description
      * Defines whether the panel is collapsed or expanded.
-     * Supports two-way binding.
+     * Supports two-way binding via [(collapsed)].
      *
      * @default false
      */
-    collapsed: boolean;
-    /**
-     * @event collapsedChange
-     * @description
-     * Emits when the collapsed state changes.
-     * Enables two-way binding with [(collapsed)].
-     */
-    collapsedChange: EventEmitter<boolean>;
+    collapsed: _angular_core.ModelSignal<boolean>;
     /**
      * @event toggled
      * @description
@@ -64,7 +56,7 @@ declare class PanelComponent {
      * <tk-panel (toggled)="handleToggle($event)"></tk-panel>
      * ```
      */
-    toggled: EventEmitter<{
+    toggled: _angular_core.OutputEmitterRef<{
         collapsed: boolean;
     }>;
     /**
@@ -78,8 +70,8 @@ declare class PanelComponent {
     handleToggle(event: {
         collapsed: boolean | undefined;
     }): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<PanelComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PanelComponent, "tk-panel", never, { "header": { "alias": "header"; "required": false; }; "toggleable": { "alias": "toggleable"; "required": false; }; "collapsed": { "alias": "collapsed"; "required": false; }; }, { "collapsedChange": "collapsedChange"; "toggled": "toggled"; }, never, ["*"], true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PanelComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PanelComponent, "tk-panel", never, { "header": { "alias": "header"; "required": false; "isSignal": true; }; "toggleable": { "alias": "toggleable"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; }, { "collapsed": "collapsedChange"; "toggled": "toggled"; }, never, ["*"], true, never>;
 }
 
 export { PanelComponent };

package/types/tekus-design-system-components-radio-button.d.ts

@@ -1,9 +1,10 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, OnDestroy } from '@angular/core';
+import { OnInit } from '@angular/core';
 import { ControlValueAccessor, NgControl, FormControl } from '@angular/forms';
 
-declare class RadioButtonComponent implements ControlValueAccessor, OnInit, OnDestroy {
+declare class RadioButtonComponent implements ControlValueAccessor, OnInit {
     readonly ngControl: NgControl | null;
+    private readonly destroyRef;
     /**
      * Initialize the component and register it as a ControlValueAccessor.
      */
@@ -64,15 +65,10 @@ declare class RadioButtonComponent implements ControlValueAccessor, OnInit, OnDe
     get effectiveControl(): FormControl;
     onChange: (value: unknown) => void;
     onTouched: () => void;
-    private readonly subscription;
     /**
      * Configure synchronization between the form control and component state.
      */
     ngOnInit(): void;
-    /**
-     * Clean up subscriptions.
-     */
-    ngOnDestroy(): void;
     /**
      * Implementation of ControlValueAccessor: Writes a new value from the form.
      */

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

@@ -94,7 +94,20 @@ declare class SelectComponent<T = unknown> implements ControlValueAccessor {
     modelChange: _angular_core.OutputEmitterRef<T | null>;
     private onChangeFn;
     private onTouchedFn;
-    constructor();
+    private readonly init;
+    /**
+     * @effect disabled → internalDisabled
+     * @description
+     * Synchronizes the disabled input signal with the internal disabled state.
+     */
+    private readonly syncDisabled;
+    /**
+     * @effect model → internal value
+     * @description
+     * Synchronizes changes coming from the Signal `model()` back into the internal value.
+     * Ensures consistency between Angular Forms, PrimeNG UI events, and Signals.
+     */
+    private readonly syncModel;
     /**
      * @method writeValue
      * @description

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

@@ -34,12 +34,12 @@ declare class TableComponent<T = unknown> {
      */
     data: _angular_core.InputSignal<T[]>;
     /**
-     * @property {ViewChild} tableRef
+     * @property {viewChild} tableRef
      * @description
      * Reference to the PrimeNG Table component instance.
      * Used to access table methods and properties directly.
      */
-    tableRef: Table;
+    readonly tableRef: _angular_core.Signal<Table<any> | undefined>;
     /**
      * @property {InputSignal<TableColumn<T>[]>} columns
      * @description
@@ -74,9 +74,9 @@ declare class TableComponent<T = unknown> {
      * Property name to uniquely identify a row.
      */
     dataKey: _angular_core.InputSignal<string | undefined>;
-    initialData: T[];
-    internalData: T[];
-    isSorted: boolean | null;
+    readonly initialData: _angular_core.WritableSignal<T[]>;
+    readonly internalData: _angular_core.WritableSignal<T[]>;
+    readonly isSorted: _angular_core.WritableSignal<boolean | null>;
     /**
      * @computed isAllSelected
      * @description

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

@@ -1,9 +1,10 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, OnDestroy } from '@angular/core';
+import { OnInit } from '@angular/core';
 import { ControlValueAccessor, FormControl } from '@angular/forms';
 
-declare class TextareaComponent implements ControlValueAccessor, OnInit, OnDestroy {
+declare class TextareaComponent implements ControlValueAccessor, OnInit {
     private readonly ngControl;
+    private readonly destroyRef;
     constructor();
     /**
      * @property {ModelSignal<string>} value
@@ -73,9 +74,7 @@ declare class TextareaComponent implements ControlValueAccessor, OnInit, OnDestr
     private propagateChange;
     private propagateTouched;
     private syncingFromView;
-    private readonly subscriptions;
     ngOnInit(): void;
-    ngOnDestroy(): void;
     /**
      * @method writeValue
      * @description

package/types/tekus-design-system-core-types.d.ts

@@ -1,6 +1,8 @@
 import { ValidatorFn } from '@angular/forms';
 import * as _angular_core from '@angular/core';
+import { ComponentRef } from '@angular/core';
 import { Preset } from '@primeuix/themes/types';
+import { PartialObserver, Subscription } from 'rxjs';
 
 interface Option {
     ViewValue: string;
@@ -178,5 +180,47 @@ interface TkCanClose {
  */
 type TkCloseInterceptor = () => boolean;
 
-export { Breakpoints, GapGutter, Gutter, PaddingGridContainer, TkPreset, provideTkTheme };
+/**
+ * Reference to a dialog/drawer opened via a service.
+ * Supports both Observable-style subscription and Signal-based state.
+ */
+declare class TkDialogRef<T, R = unknown> {
+    readonly componentRef: ComponentRef<T>;
+    private readonly closedSubject;
+    private readonly resultSignal;
+    private readonly isClosedSignal;
+    /**
+     * Signal that holds the result of the dialog after it closes.
+     */
+    readonly result: _angular_core.Signal<R | undefined>;
+    /**
+     * Signal that indicates if the dialog has been closed.
+     */
+    readonly isClosed: _angular_core.Signal<boolean>;
+    constructor(componentRef: ComponentRef<T>);
+    /**
+     * The instance of the component opened in the dialog.
+     */
+    get componentInstance(): T;
+    /**
+     * Closes the dialog, optionally passing a result back.
+     * Internal implementation calls the component's tryClose to respect guards.
+     */
+    close(result?: R): void;
+    /**
+     * Subscribes to the closure event.
+     * This maintains compatibility with existing service.open(...).subscribe() patterns
+     * using the modern RxJS signature.
+     */
+    subscribe(nextOrObserver?: ((value: R | undefined) => void) | PartialObserver<R | undefined>): Subscription;
+    /**
+     * Internal method to emit the result and update reactive state.
+     * Not intended for public use outside the opening service.
+     */
+    emitClose(result?: R): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TkDialogRef<any, any>, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<TkDialogRef<any, any>>;
+}
+
+export { Breakpoints, GapGutter, Gutter, PaddingGridContainer, TkDialogRef, TkPreset, provideTkTheme };
 export type { AutoFillGridProps, ColumnRowSize, ComposeMinMax, ComposeSize, ContainerType, DropdownListItem, FixedGridProps, FontCSSProperties, GridColumns, GutterType, IllustrationConfig, Option, ThemeLogo, TkCanClose, TkCloseInterceptor, TypographyStyles, ValidatorWithMessage, VariantLogo };