@weeehaoooz/talos-ui 0.1.0 → 0.1.2

package/types/weeehaoooz-talos-ui-layout.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { Type } from '@angular/core';
+import { Type, TemplateRef, AfterViewInit, ElementRef } from '@angular/core';
 import { LucideChevronDown } from '@lucide/angular';
 
 interface RightPanelOptions {
@@ -281,6 +281,854 @@ declare class TalosExpansionPanelModule {
     static ɵinj: _angular_core.ɵɵInjectorDeclaration<TalosExpansionPanelModule>;
 }
 
-export { LayoutService, MainLayoutComponent, SidePanelComponent, TalosCardActionsDirective, TalosCardAvatarDirective, TalosCardBodyComponent, TalosCardComponent, TalosCardFooterComponent, TalosCardHeaderComponent, TalosCardMediaDirective, TalosCardModule, TalosCardSubtitleDirective, TalosCardTitleDirective, TalosExpansionPanelActionsDirective, TalosExpansionPanelBodyComponent, TalosExpansionPanelComponent, TalosExpansionPanelContentDirective, TalosExpansionPanelDescriptionDirective, TalosExpansionPanelGroupComponent, TalosExpansionPanelHeaderComponent, TalosExpansionPanelIconDirective, TalosExpansionPanelModule, TalosExpansionPanelTitleDirective, TalosExpansionPanelToggleDirective };
-export type { RightPanelOptions, TalosCardFooterAlign, TalosCardPadding, TalosCardVariant, TalosExpansionPanelPadding, TalosExpansionPanelSize, TalosExpansionPanelTogglePosition, TalosExpansionPanelVariant };
+/**
+ * Visual styling variants available for tabs.
+ * - `line`: Classic border indicator bar beneath/beside active tab.
+ * - `pills`: Rounded pill-shaped active tab highlight.
+ * - `card`: Tab-shaped enclosed folder/card style.
+ * - `segmented`: Contained background segment control style.
+ * - `subtle`: Minimal text-only variant with subtle color shift.
+ */
+type TalosTabsVariant = 'line' | 'pills' | 'card' | 'segmented' | 'subtle';
+/**
+ * Sizing scale for the tab headers.
+ */
+type TalosTabsSize = 'xs' | 'sm' | 'md' | 'lg';
+/**
+ * Layout orientation for the tab list and panels.
+ */
+type TalosTabsOrientation = 'horizontal' | 'vertical';
+/**
+ * Alignment of tab headers within the tab list bar.
+ */
+type TalosTabsAlign = 'start' | 'center' | 'end' | 'stretch';
+/**
+ * Data model representing an individual tab item in data-driven mode.
+ */
+interface TalosTabItem {
+    /**
+     * Unique identifier for the tab item.
+     */
+    id: string | number;
+    /**
+     * Visible label text for the tab header.
+     */
+    label: string;
+    /**
+     * Optional icon component to display preceding the label (e.g., Lucide icon).
+     */
+    icon?: Type<unknown>;
+    /**
+     * Optional badge count or text indicator to render beside the label.
+     */
+    badge?: string | number;
+    /**
+     * Whether this tab is disabled and cannot be selected.
+     */
+    disabled?: boolean;
+    /**
+     * Whether this tab item can be closed by the user.
+     */
+    closable?: boolean;
+    /**
+     * Text or HTML string content for the tab panel body.
+     */
+    content?: string;
+    /**
+     * Optional custom template reference for the panel body.
+     */
+    template?: TemplateRef<unknown>;
+    /**
+     * Optional custom template reference for the tab header label.
+     */
+    labelTemplate?: TemplateRef<unknown>;
+    /**
+     * Accessible description for screen readers (aria-label).
+     */
+    ariaLabel?: string;
+}
+/**
+ * Event payload emitted when the active selected tab changes.
+ */
+interface TalosTabChangeEvent {
+    /**
+     * Zero-based index of the newly selected tab.
+     */
+    index: number;
+    /**
+     * Identifier of the newly selected tab.
+     */
+    id: string | number;
+    /**
+     * The tab instance or data item that was selected.
+     */
+    tab: unknown;
+}
+/**
+ * Event payload emitted when a tab's close action is triggered.
+ */
+interface TalosTabCloseEvent {
+    /**
+     * Zero-based index of the closed tab.
+     */
+    index: number;
+    /**
+     * Identifier of the closed tab.
+     */
+    id: string | number;
+    /**
+     * The tab instance or data item that was closed.
+     */
+    tab: unknown;
+}
+
+/**
+ * Directive applied to an `<ng-template>` to provide a custom header label template for a tab.
+ *
+ * Usage:
+ * ```html
+ * <talos-tab>
+ *   <ng-template talosTabLabel>
+ *     <svg lucideBell [size]="14"></svg>
+ *     <span>Notifications</span>
+ *   </ng-template>
+ *   Tab content...
+ * </talos-tab>
+ * ```
+ */
+declare class TalosTabLabelDirective {
+    readonly templateRef: TemplateRef<any>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosTabLabelDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TalosTabLabelDirective, "[talosTabLabel], ng-template[talosTabLabel]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Directive applied to an `<ng-template>` to delay rendering of the tab panel's content
+ * until the tab is first activated / selected (lazy loading).
+ *
+ * Usage:
+ * ```html
+ * <talos-tab label="Heavy Data">
+ *   <ng-template talosTabContent>
+ *     <heavy-data-grid />
+ *   </ng-template>
+ * </talos-tab>
+ * ```
+ */
+declare class TalosTabContentDirective {
+    readonly templateRef: TemplateRef<any>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosTabContentDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TalosTabContentDirective, "[talosTabContent], ng-template[talosTabContent]", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * An individual tab panel element to be placed inside `<talos-tabs>`.
+ */
+declare class TalosTabComponent {
+    private readonly defaultUniqueId;
+    /**
+     * Header label text for this tab.
+     */
+    readonly label: _angular_core.InputSignal<string>;
+    /**
+     * Unique identifier for this tab. If omitted, an auto-generated id is assigned.
+     */
+    readonly id: _angular_core.InputSignal<string | number>;
+    /**
+     * Optional icon component to display before the label text.
+     */
+    readonly icon: _angular_core.InputSignal<Type<unknown> | null>;
+    /**
+     * Optional badge count or status text rendered alongside the tab label.
+     */
+    readonly badge: _angular_core.InputSignal<string | number | null>;
+    /**
+     * Whether this tab is disabled and cannot be activated.
+     */
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether this tab displays an inline close action button.
+     */
+    readonly closable: _angular_core.InputSignal<boolean>;
+    /**
+     * Accessible description for screen readers (aria-label).
+     */
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    /**
+     * Custom label template projected with `*talosTabLabel`.
+     */
+    readonly customLabel: _angular_core.Signal<TalosTabLabelDirective | undefined>;
+    /**
+     * Lazy-loaded panel content projected with `*talosTabContent`.
+     */
+    readonly lazyContent: _angular_core.Signal<TalosTabContentDirective | undefined>;
+    /**
+     * Internal selection state controlled by parent `<talos-tabs>`.
+     */
+    readonly active: _angular_core.WritableSignal<boolean>;
+    /**
+     * Whether this tab has been active at least once (used for lazy-loading retention).
+     */
+    readonly hasBeenActive: _angular_core.WritableSignal<boolean>;
+    /**
+     * The effective unique key for this tab.
+     */
+    readonly key: _angular_core.Signal<string | number>;
+    /**
+     * The HTML element ID of the tab panel.
+     */
+    readonly panelId: _angular_core.Signal<string>;
+    /**
+     * The HTML element ID of the tab header button.
+     */
+    readonly headerId: _angular_core.Signal<string>;
+    /**
+     * Sets active state and tracks lazy load retention.
+     */
+    setActive(isActive: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosTabComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TalosTabComponent, "talos-tab, [talosTab]", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "badge": { "alias": "badge"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, ["customLabel", "lazyContent"], ["*"], true, never>;
+}
+
+/**
+ * Normalized internal representation of a tab header.
+ */
+interface NormalizedTabHeader {
+    id: string | number;
+    label: string;
+    headerId: string;
+    panelId: string;
+    icon?: Type<unknown> | null;
+    badge?: string | number | null;
+    disabled: boolean;
+    closable: boolean;
+    customLabel?: TalosTabLabelDirective | null;
+    labelTemplate?: TemplateRef<unknown> | null;
+    source: TalosTabComponent | TalosTabItem;
+}
+declare class TalosTabsComponent implements AfterViewInit {
+    /**
+     * The index of the currently active tab (two-way bindable via `[(selectedIndex)]`).
+     */
+    readonly selectedIndex: _angular_core.ModelSignal<number>;
+    /**
+     * The unique ID of the currently active tab (two-way bindable via `[(activeId)]`).
+     */
+    readonly activeId: _angular_core.ModelSignal<string | number | null>;
+    /**
+     * Visual styling variant of the tabs.
+     * @default 'line'
+     */
+    readonly variant: _angular_core.InputSignal<TalosTabsVariant>;
+    /**
+     * Sizing scale of the tabs.
+     * @default 'md'
+     */
+    readonly size: _angular_core.InputSignal<TalosTabsSize>;
+    /**
+     * Layout orientation of the tab headers and panels.
+     * @default 'horizontal'
+     */
+    readonly orientation: _angular_core.InputSignal<TalosTabsOrientation>;
+    /**
+     * Horizontal alignment of tab headers within the container.
+     * @default 'start'
+     */
+    readonly align: _angular_core.InputSignal<TalosTabsAlign>;
+    /**
+     * Optional data-driven items array. When provided, renders data-driven tabs.
+     */
+    readonly items: _angular_core.InputSignal<TalosTabItem[] | null>;
+    /**
+     * Whether tabs show an inline close button by default.
+     * @default false
+     */
+    readonly closable: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether to display an add tab button in the header bar.
+     * @default false
+     */
+    readonly addable: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether to enable animated indicator transitions.
+     * @default true
+     */
+    readonly animated: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether tabs stretch equally to fill the full width of the container.
+     * @default false
+     */
+    readonly stretched: _angular_core.InputSignal<boolean>;
+    /**
+     * Accessible description for the tablist landmark.
+     * @default 'Tabs navigation'
+     */
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    /**
+     * Emitted when the selected tab changes.
+     */
+    readonly tabChange: _angular_core.OutputEmitterRef<TalosTabChangeEvent>;
+    /**
+     * Emitted when a tab's close button is clicked.
+     */
+    readonly tabClose: _angular_core.OutputEmitterRef<TalosTabCloseEvent>;
+    /**
+     * Emitted when the add tab button is clicked.
+     */
+    readonly tabAdd: _angular_core.OutputEmitterRef<void>;
+    /**
+     * Projected declarative child `<talos-tab>` instances.
+     */
+    readonly projectedTabs: _angular_core.Signal<readonly TalosTabComponent[]>;
+    /**
+     * DOM button elements for all rendered tab headers.
+     */
+    readonly tabButtons: _angular_core.Signal<readonly ElementRef<HTMLButtonElement>[]>;
+    /**
+     * Container element for the tab navigation bar.
+     */
+    readonly navContainer: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
+    protected readonly indicatorLeft: _angular_core.WritableSignal<number>;
+    protected readonly indicatorTop: _angular_core.WritableSignal<number>;
+    protected readonly indicatorWidth: _angular_core.WritableSignal<number>;
+    protected readonly indicatorHeight: _angular_core.WritableSignal<number>;
+    protected readonly hasIndicator: _angular_core.WritableSignal<boolean>;
+    /**
+     * Normalized array of tab headers combining declarative children and data items.
+     */
+    readonly tabHeaders: _angular_core.Signal<NormalizedTabHeader[]>;
+    constructor();
+    ngAfterViewInit(): void;
+    /**
+     * Activates the tab at the given index.
+     */
+    selectTab(index: number, header: NormalizedTabHeader): void;
+    /**
+     * Checks whether an individual tab is closable.
+     */
+    isClosable(header: NormalizedTabHeader): boolean;
+    /**
+     * Closes the tab at the specified index.
+     */
+    closeTab(event: Event, index: number, header: NormalizedTabHeader): void;
+    /**
+     * Triggers the tab add event.
+     */
+    addTab(): void;
+    /**
+     * Keyboard accessibility handler following WAI-ARIA Tab guidelines.
+     */
+    onKeydown(event: KeyboardEvent, currentIndex: number, currentHeader: NormalizedTabHeader): void;
+    private findNextAvailableTab;
+    private focusTabButton;
+    /**
+     * Recalculates indicator offset and size for smooth animations.
+     */
+    updateIndicator(): void;
+    /**
+     * Unique panel id generator for data items.
+     */
+    getDataPanelId(item: TalosTabItem): string;
+    /**
+     * Unique header id generator for data items.
+     */
+    getDataHeaderId(item: TalosTabItem): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosTabsComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TalosTabsComponent, "talos-tabs, [talosTabs]", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; "isSignal": true; }; "activeId": { "alias": "activeId"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "addable": { "alias": "addable"; "required": false; "isSignal": true; }; "animated": { "alias": "animated"; "required": false; "isSignal": true; }; "stretched": { "alias": "stretched"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "selectedIndex": "selectedIndexChange"; "activeId": "activeIdChange"; "tabChange": "tabChange"; "tabClose": "tabClose"; "tabAdd": "tabAdd"; }, ["projectedTabs"], ["*"], true, never>;
+}
+
+declare class TalosTabsModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosTabsModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<TalosTabsModule, never, [typeof TalosTabsComponent, typeof TalosTabComponent, typeof TalosTabLabelDirective, typeof TalosTabContentDirective], [typeof TalosTabsComponent, typeof TalosTabComponent, typeof TalosTabLabelDirective, typeof TalosTabContentDirective]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<TalosTabsModule>;
+}
+
+/**
+ * Visual styling variants available for the stepper.
+ * - `default` / `circles`: Standard numbered circular badges with connecting lines.
+ * - `progress`: Sleek progress bar indicator at the top with step counter.
+ * - `cards`: Interactive summary card headers for multi-stage checkout and config flows.
+ */
+type TalosStepperVariant = 'default' | 'circles' | 'progress' | 'cards';
+/**
+ * Layout orientation for the stepper.
+ */
+type TalosStepperOrientation = 'horizontal' | 'vertical';
+/**
+ * Sizing scale for the stepper step headers and indicators.
+ */
+type TalosStepperSize = 'sm' | 'md' | 'lg';
+/**
+ * Placement of step labels relative to the step indicator in horizontal mode.
+ * - `end`: Label appears to the right of the indicator badge.
+ * - `bottom`: Label appears centered beneath the indicator badge.
+ */
+type TalosStepperLabelPosition = 'end' | 'bottom';
+/**
+ * Semantic state of an individual step.
+ */
+type TalosStepState = 'pending' | 'active' | 'completed' | 'error' | 'warning';
+/**
+ * Data model representing an individual step in data-driven mode.
+ */
+interface TalosStepItem {
+    /**
+     * Unique identifier for the step. If omitted, an auto-generated id is assigned.
+     */
+    id?: string | number;
+    /**
+     * Primary title label for the step header.
+     */
+    label: string;
+    /**
+     * Optional supporting subtitle or descriptive text.
+     */
+    description?: string;
+    /**
+     * Optional icon component to display within the step indicator (e.g. Lucide icon).
+     */
+    icon?: Type<unknown>;
+    /**
+     * Explicit semantic state override. If omitted, state is computed based on active index.
+     */
+    state?: TalosStepState;
+    /**
+     * Whether this step is disabled and cannot be selected.
+     */
+    disabled?: boolean;
+    /**
+     * Whether this step is optional (displays an "(Optional)" badge).
+     */
+    optional?: boolean;
+    /**
+     * Whether this step has been completed.
+     */
+    completed?: boolean;
+    /**
+     * Whether this step is in an error state.
+     */
+    hasError?: boolean;
+    /**
+     * Optional contextual error message to display when step validation fails.
+     */
+    errorMessage?: string;
+    /**
+     * Static text or HTML string content for the step panel body.
+     */
+    content?: string;
+    /**
+     * Custom template reference for the step panel body.
+     */
+    template?: TemplateRef<unknown>;
+    /**
+     * Optional custom template reference for the step header label.
+     */
+    labelTemplate?: TemplateRef<unknown>;
+    /**
+     * Optional custom template reference for the step indicator icon.
+     */
+    iconTemplate?: TemplateRef<unknown>;
+    /**
+     * Accessible description for screen readers (aria-label).
+     */
+    ariaLabel?: string;
+}
+/**
+ * Event payload emitted when the active selected step changes.
+ */
+interface TalosStepChangeEvent {
+    /**
+     * Zero-based index of the newly selected step.
+     */
+    index: number;
+    /**
+     * Zero-based index of the previously selected step.
+     */
+    previousIndex: number;
+    /**
+     * Identifier of the newly selected step.
+     */
+    id: string | number;
+    /**
+     * The step component or data item instance that was selected.
+     */
+    step: unknown;
+}
+/**
+ * Event payload emitted when the user reaches and submits or finishes the final step.
+ */
+interface TalosStepperFinishEvent {
+    /**
+     * Total number of steps in the stepper.
+     */
+    stepsCount: number;
+    /**
+     * Whether all steps are completed.
+     */
+    completed: boolean;
+}
+
+/**
+ * An individual step container component to be declared inside `<talos-stepper>`.
+ */
+declare class TalosStepComponent {
+    private readonly defaultUniqueId;
+    /**
+     * Title text for the step header.
+     */
+    readonly label: _angular_core.InputSignal<string>;
+    /**
+     * Optional secondary description or helper text.
+     */
+    readonly description: _angular_core.InputSignal<string>;
+    /**
+     * Unique identifier for this step. If omitted, an auto-generated ID is assigned.
+     */
+    readonly id: _angular_core.InputSignal<string | number>;
+    /**
+     * Optional icon component to display within the step indicator.
+     */
+    readonly icon: _angular_core.InputSignal<Type<unknown> | null>;
+    /**
+     * Whether this step is optional (displays an "(Optional)" subtitle indicator).
+     */
+    readonly optional: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether this step is disabled and cannot be navigated to.
+     */
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    /**
+     * Explicit completed flag. If undefined, completion is inferred automatically in sequential progression.
+     */
+    readonly completed: _angular_core.InputSignal<boolean | undefined>;
+    /**
+     * Whether this step is in an error state.
+     */
+    readonly hasError: _angular_core.InputSignal<boolean>;
+    /**
+     * Contextual error message to display when step validation fails.
+     */
+    readonly errorMessage: _angular_core.InputSignal<string>;
+    /**
+     * Explicit semantic state override ('pending' | 'active' | 'completed' | 'error' | 'warning').
+     */
+    readonly state: _angular_core.InputSignal<TalosStepState | undefined>;
+    /**
+     * Accessible description for screen readers (aria-label).
+     */
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    /**
+     * Custom label template projected with `*talosStepLabel`.
+     */
+    readonly customLabel: _angular_core.Signal<TalosStepLabelDirective | undefined>;
+    /**
+     * Custom icon template projected with `*talosStepIcon`.
+     */
+    readonly customIcon: _angular_core.Signal<TalosStepIconDirective | undefined>;
+    /**
+     * Lazy-loaded panel content projected with `*talosStepContent`.
+     */
+    readonly lazyContent: _angular_core.Signal<TalosStepContentDirective | undefined>;
+    /**
+     * Root template ref for declarative step projection.
+     */
+    readonly stepContentTemplate: _angular_core.Signal<TemplateRef<unknown> | undefined>;
+    /**
+     * Internal selection state controlled by the parent `<talos-stepper>`.
+     */
+    readonly active: _angular_core.WritableSignal<boolean>;
+    /**
+     * Whether this step has been active at least once (used for lazy-loading retention).
+     */
+    readonly hasBeenActive: _angular_core.WritableSignal<boolean>;
+    /**
+     * The effective unique key for this step.
+     */
+    readonly key: _angular_core.Signal<string | number>;
+    /**
+     * The HTML element ID of the step panel.
+     */
+    readonly panelId: _angular_core.Signal<string>;
+    /**
+     * The HTML element ID of the step header button.
+     */
+    readonly headerId: _angular_core.Signal<string>;
+    /**
+     * Updates active state and marks the step as having been visited.
+     */
+    setActive(isActive: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosStepComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TalosStepComponent, "talos-step, [talosStep]", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "optional": { "alias": "optional"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "completed": { "alias": "completed"; "required": false; "isSignal": true; }; "hasError": { "alias": "hasError"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, ["customLabel", "customIcon", "lazyContent"], ["*"], true, never>;
+}
+
+/**
+ * Internal normalized representation of a step header item.
+ */
+interface NormalizedStepHeader {
+    index: number;
+    id: string | number;
+    label: string;
+    description?: string;
+    headerId: string;
+    panelId: string;
+    icon?: Type<unknown> | null;
+    optional: boolean;
+    disabled: boolean;
+    completed: boolean;
+    hasError: boolean;
+    errorMessage?: string;
+    state: TalosStepState;
+    ariaLabel?: string;
+    customLabel?: TalosStepLabelDirective | null;
+    labelTemplate?: TemplateRef<unknown> | null;
+    customIcon?: TalosStepIconDirective | null;
+    iconTemplate?: TemplateRef<unknown> | null;
+    contentTemplate?: TemplateRef<unknown> | null;
+    contentString?: string;
+    source: TalosStepComponent | TalosStepItem;
+}
+declare class TalosStepperComponent {
+    /**
+     * The index of the currently active step (two-way bindable via `[(selectedIndex)]`).
+     */
+    readonly selectedIndex: _angular_core.ModelSignal<number>;
+    /**
+     * The unique ID of the currently active step (two-way bindable via `[(activeId)]`).
+     */
+    readonly activeId: _angular_core.ModelSignal<string | number | null>;
+    /**
+     * Layout orientation of the stepper.
+     * @default 'horizontal'
+     */
+    readonly orientation: _angular_core.InputSignal<TalosStepperOrientation>;
+    /**
+     * Visual variant presentation style.
+     * @default 'default'
+     */
+    readonly variant: _angular_core.InputSignal<TalosStepperVariant>;
+    /**
+     * Sizing scale of the step indicator buttons and labels.
+     * @default 'md'
+     */
+    readonly size: _angular_core.InputSignal<TalosStepperSize>;
+    /**
+     * Label position relative to step indicator in horizontal mode.
+     * @default 'end'
+     */
+    readonly labelPosition: _angular_core.InputSignal<TalosStepperLabelPosition>;
+    /**
+     * Whether strict linear step progression is enforced (disallows skipping uncompleted steps).
+     * @default false
+     */
+    readonly linear: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether steps can be clicked to navigate directly.
+     * @default true
+     */
+    readonly clickable: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether to animate panel transitions.
+     * @default true
+     */
+    readonly animated: _angular_core.InputSignal<boolean>;
+    /**
+     * Data items for data-driven stepper configuration.
+     */
+    readonly steps: _angular_core.InputSignal<TalosStepItem[]>;
+    /**
+     * Emitted whenever the active step changes.
+     */
+    readonly stepChange: _angular_core.OutputEmitterRef<TalosStepChangeEvent>;
+    /**
+     * Emitted when reaching and finishing the final step.
+     */
+    readonly stepperFinished: _angular_core.OutputEmitterRef<TalosStepperFinishEvent>;
+    /**
+     * Projected child steps in declarative mode.
+     */
+    readonly childSteps: _angular_core.Signal<readonly TalosStepComponent[]>;
+    /**
+     * Header button elements for keyboard focus navigation.
+     */
+    readonly stepButtons: _angular_core.Signal<readonly ElementRef<HTMLButtonElement>[]>;
+    /**
+     * Unified normalized step items combining both declarative `<talos-step>` components and `steps()` input data.
+     */
+    readonly normalizedSteps: _angular_core.Signal<NormalizedStepHeader[]>;
+    /**
+     * Total number of steps available.
+     */
+    readonly totalSteps: _angular_core.Signal<number>;
+    /**
+     * Whether the stepper is currently at the first step.
+     */
+    readonly isFirst: _angular_core.Signal<boolean>;
+    /**
+     * Whether the stepper is currently at the last step.
+     */
+    readonly isLast: _angular_core.Signal<boolean>;
+    /**
+     * Progress percentage through the steps (0 to 100).
+     */
+    readonly progressPercent: _angular_core.Signal<number>;
+    /**
+     * Currently active normalized step item.
+     */
+    readonly currentStep: _angular_core.Signal<NormalizedStepHeader | null>;
+    /**
+     * Whether declarative children mode is active.
+     */
+    readonly isDeclarative: _angular_core.Signal<boolean>;
+    constructor();
+    /**
+     * Selects a specific step index if allowed by validation and disabled rules.
+     */
+    selectStep(index: number, emitEvent?: boolean): boolean;
+    /**
+     * Advances to the next step. If currently at the last step, emits `stepperFinished`.
+     */
+    next(): boolean;
+    /**
+     * Returns to the preceding step.
+     */
+    previous(): boolean;
+    /**
+     * Jumps to a designated step index.
+     */
+    goTo(index: number): boolean;
+    /**
+     * Resets the stepper back to step index 0.
+     */
+    reset(): boolean;
+    /**
+     * Click handler for step header indicator buttons.
+     */
+    onStepHeaderClick(index: number): void;
+    /**
+     * Keyboard navigation across step header buttons.
+     */
+    onKeydown(event: KeyboardEvent, index: number): void;
+    private findNextFocusableIndex;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosStepperComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TalosStepperComponent, "talos-stepper, [talosStepper]", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; "isSignal": true; }; "activeId": { "alias": "activeId"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; "linear": { "alias": "linear"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "animated": { "alias": "animated"; "required": false; "isSignal": true; }; "steps": { "alias": "steps"; "required": false; "isSignal": true; }; }, { "selectedIndex": "selectedIndexChange"; "activeId": "activeIdChange"; "stepChange": "stepChange"; "stepperFinished": "stepperFinished"; }, ["childSteps"], ["*"], true, never>;
+}
+
+/**
+ * Directive applied to an `<ng-template>` to provide a custom header label template for a step.
+ *
+ * Usage:
+ * ```html
+ * <talos-step>
+ *   <ng-template talosStepLabel>
+ *     <svg lucideSettings [size]="14"></svg>
+ *     <span>Custom Step Label</span>
+ *   </ng-template>
+ *   Step content...
+ * </talos-step>
+ * ```
+ */
+declare class TalosStepLabelDirective {
+    readonly templateRef: TemplateRef<any>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosStepLabelDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TalosStepLabelDirective, "[talosStepLabel], ng-template[talosStepLabel]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Directive applied to an `<ng-template>` to delay rendering of the step panel content
+ * until the step is first navigated to (lazy loading).
+ *
+ * Usage:
+ * ```html
+ * <talos-step label="Billing Information">
+ *   <ng-template talosStepContent>
+ *     <heavy-billing-form />
+ *   </ng-template>
+ * </talos-step>
+ * ```
+ */
+declare class TalosStepContentDirective {
+    readonly templateRef: TemplateRef<any>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosStepContentDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TalosStepContentDirective, "[talosStepContent], ng-template[talosStepContent]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Directive applied to an `<ng-template>` to provide a custom icon template
+ * rendered inside the step circle or indicator badge.
+ *
+ * Usage:
+ * ```html
+ * <talos-step label="Payment">
+ *   <ng-template talosStepIcon let-state="state" let-index="index">
+ *     <svg lucideCreditCard [size]="16"></svg>
+ *   </ng-template>
+ *   Step content...
+ * </talos-step>
+ * ```
+ */
+declare class TalosStepIconDirective {
+    readonly templateRef: TemplateRef<any>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosStepIconDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TalosStepIconDirective, "[talosStepIcon], ng-template[talosStepIcon]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Button directive that advances the parent `<talos-stepper>` to the next step when clicked.
+ *
+ * Usage:
+ * ```html
+ * <button talosButton talosStepperNext>Continue</button>
+ * ```
+ */
+declare class TalosStepperNextDirective {
+    private readonly stepper;
+    /**
+     * Explicit stepper reference if the button resides outside the `<talos-stepper>` tree.
+     */
+    readonly talosStepperNext: _angular_core.InputSignalWithTransform<TalosStepperComponent | null, string | TalosStepperComponent | null | undefined>;
+    protected onClick(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosStepperNextDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TalosStepperNextDirective, "[talosStepperNext], button[talosStepperNext]", never, { "talosStepperNext": { "alias": "talosStepperNext"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+/**
+ * Button directive that returns the parent `<talos-stepper>` to the previous step when clicked.
+ *
+ * Usage:
+ * ```html
+ * <button talosButton variant="secondary" talosStepperPrevious>Back</button>
+ * ```
+ */
+declare class TalosStepperPreviousDirective {
+    private readonly stepper;
+    /**
+     * Explicit stepper reference if the button resides outside the `<talos-stepper>` tree.
+     */
+    readonly talosStepperPrevious: _angular_core.InputSignalWithTransform<TalosStepperComponent | null, string | TalosStepperComponent | null | undefined>;
+    protected onClick(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosStepperPreviousDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TalosStepperPreviousDirective, "[talosStepperPrevious], button[talosStepperPrevious]", never, { "talosStepperPrevious": { "alias": "talosStepperPrevious"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+/**
+ * Button directive that resets the parent `<talos-stepper>` back to step 0 when clicked.
+ *
+ * Usage:
+ * ```html
+ * <button talosButton variant="outline" talosStepperReset>Reset Wizard</button>
+ * ```
+ */
+declare class TalosStepperResetDirective {
+    private readonly stepper;
+    /**
+     * Explicit stepper reference if the button resides outside the `<talos-stepper>` tree.
+     */
+    readonly talosStepperReset: _angular_core.InputSignalWithTransform<TalosStepperComponent | null, string | TalosStepperComponent | null | undefined>;
+    protected onClick(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosStepperResetDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TalosStepperResetDirective, "[talosStepperReset], button[talosStepperReset]", never, { "talosStepperReset": { "alias": "talosStepperReset"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare class TalosStepperModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TalosStepperModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<TalosStepperModule, never, [typeof TalosStepperComponent, typeof TalosStepComponent, typeof TalosStepLabelDirective, typeof TalosStepContentDirective, typeof TalosStepIconDirective, typeof TalosStepperNextDirective, typeof TalosStepperPreviousDirective, typeof TalosStepperResetDirective], [typeof TalosStepperComponent, typeof TalosStepComponent, typeof TalosStepLabelDirective, typeof TalosStepContentDirective, typeof TalosStepIconDirective, typeof TalosStepperNextDirective, typeof TalosStepperPreviousDirective, typeof TalosStepperResetDirective]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<TalosStepperModule>;
+}
+
+export { LayoutService, MainLayoutComponent, SidePanelComponent, TalosCardActionsDirective, TalosCardAvatarDirective, TalosCardBodyComponent, TalosCardComponent, TalosCardFooterComponent, TalosCardHeaderComponent, TalosCardMediaDirective, TalosCardModule, TalosCardSubtitleDirective, TalosCardTitleDirective, TalosExpansionPanelActionsDirective, TalosExpansionPanelBodyComponent, TalosExpansionPanelComponent, TalosExpansionPanelContentDirective, TalosExpansionPanelDescriptionDirective, TalosExpansionPanelGroupComponent, TalosExpansionPanelHeaderComponent, TalosExpansionPanelIconDirective, TalosExpansionPanelModule, TalosExpansionPanelTitleDirective, TalosExpansionPanelToggleDirective, TalosStepComponent, TalosStepContentDirective, TalosStepIconDirective, TalosStepLabelDirective, TalosStepperComponent, TalosStepperModule, TalosStepperNextDirective, TalosStepperPreviousDirective, TalosStepperResetDirective, TalosTabComponent, TalosTabContentDirective, TalosTabLabelDirective, TalosTabsComponent, TalosTabsModule };
+export type { NormalizedStepHeader, NormalizedTabHeader, RightPanelOptions, TalosCardFooterAlign, TalosCardPadding, TalosCardVariant, TalosExpansionPanelPadding, TalosExpansionPanelSize, TalosExpansionPanelTogglePosition, TalosExpansionPanelVariant, TalosStepChangeEvent, TalosStepItem, TalosStepState, TalosStepperFinishEvent, TalosStepperLabelPosition, TalosStepperOrientation, TalosStepperSize, TalosStepperVariant, TalosTabChangeEvent, TalosTabCloseEvent, TalosTabItem, TalosTabsAlign, TalosTabsOrientation, TalosTabsSize, TalosTabsVariant };
 //# sourceMappingURL=weeehaoooz-talos-ui-layout.d.ts.map