@sixbell-telco/sdk/components/wizard/wizard-sub-step/wizard-sub-step.component.d.ts

A collection of reusable components designed for use in Sixbell Telco Angular projects

import { WizardService } from '../services/wizard.service';
import * as i0 from "@angular/core";
/**
 * Layout variants for the sub-step connector
 * @typedef {'vertical' | 'horizontal'} WizardSubStepVariantProps
 */
export type WizardSubStepVariantProps = 'vertical' | 'horizontal';
/**
 * A component that visualizes the connection between wizard steps with animated progress indicators.
 *
 * @remarks
 * Handles both horizontal and vertical layouts with status-dependent animations. Manages three segments:
 * - Left connector (before the step)
 * - Center indicator (current step marker)
 * - Right connector (after the step)
 *
 * @example
 * ```html
 * <!-- Horizontal sub-step -->
 * <st-wizard-sub-step
 *   [stepIndex]="1"
 *   [stepStatus]="'completed'"
 * ></st-wizard-sub-step>
 *
 * <!-- Vertical sub-step -->
 * <st-wizard-sub-step
 *   variant="vertical"
 *   [stepIndex]="2"
 *   [stepStatus]="'in progress'"
 * ></st-wizard-sub-step>
 * ```
 */
export declare class WizardSubStepComponent {
    /**
     * Layout direction for the sub-step connectors
     * @default 'horizontal'
     */
    variant: import("@angular/core").InputSignal<WizardSubStepVariantProps>;
    /** @internal Injected wizard state service */
    wizardService: WizardService;
    /**
     * Index of the parent step in the wizard sequence
     * @remarks Required for position calculation
     */
    stepIndex: import("@angular/core").InputSignal<number>;
    /**
     * Current status of the associated wizard step
     * @remarks Determines visual state and animations
     */
    stepStatus: import("@angular/core").InputSignal<"in progress" | "pending" | "completed">;
    /**
     * Checks if this sub-step's index matches the current active step
     * @returns {boolean} True if this is the active step
     * @internal
     */
    isCurrentStep: import("@angular/core").Signal<boolean>;
    /**
     * Computed classes for horizontal left connector segment
     * @returns {string} Tailwind classes with animated width transition
     * @internal
     */
    horizontalLeftClasses: import("@angular/core").Signal<string>;
    /**
     * Computed classes for horizontal center indicator
     * @returns {string} Tailwind classes with color transition delays
     * @internal
     */
    horizontalCenterClasses: import("@angular/core").Signal<string>;
    /**
     * Computed classes for horizontal right connector segment
     * @returns {string} Tailwind classes with completion-based width
     * @internal
     */
    horizontalRightClasses: import("@angular/core").Signal<string>;
    /**
     * Computed classes for vertical left connector segment
     * @returns {string} Tailwind classes with animated height transition
     * @internal
     */
    verticalLeftClasses: import("@angular/core").Signal<string>;
    /**
     * Computed classes for vertical center indicator
     * @returns {string} Tailwind classes with color transition logic
     * @internal
     */
    verticalCenterClasses: import("@angular/core").Signal<string>;
    /**
     * Computed classes for vertical right connector segment
     * @returns {string} Tailwind classes with completion-based height
     * @internal
     */
    verticalRightClasses: import("@angular/core").Signal<string>;
    static ɵfac: i0.ɵɵFactoryDeclaration<WizardSubStepComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<WizardSubStepComponent, "st-wizard-sub-step", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "stepIndex": { "alias": "stepIndex"; "required": true; "isSignal": true; }; "stepStatus": { "alias": "stepStatus"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
}