import type { IElementRef, OnCreate, OnDestroy, OnRender } from '@melodicdev/core';
import type { StepsVariant, StepsOrientation, StepsConnector, StepsColor, StepConfig, StepStatus } from './steps.types.js';
/**
 * ml-steps - Multi-step progress/wizard component
 *
 * @example Config array mode:
 * ```html
 * <ml-steps active="company" variant="circles" .steps=${stepConfigs}>
 *   <ml-step-panel value="details">Step 1 content</ml-step-panel>
 *   <ml-step-panel value="company">Step 2 content</ml-step-panel>
 * </ml-steps>
 * ```
 *
 * @example Slotted mode:
 * ```html
 * <ml-steps active="company" variant="numbered">
 *   <ml-step slot="step" value="details" label="Your details"></ml-step>
 *   <ml-step slot="step" value="company" label="Company"></ml-step>
 *   <ml-step-panel value="details">Content 1</ml-step-panel>
 *   <ml-step-panel value="company">Content 2</ml-step-panel>
 * </ml-steps>
 * ```
 *
 * @slot step - Step header elements (ml-step)
 * @slot default - Step panel content or router-outlet
 *
 * @fires ml:change - Emitted when active step changes
 */
export declare class StepsComponent implements IElementRef, OnCreate, OnDestroy, OnRender {
    elementRef: HTMLElement;
    /** Currently active step value */
    active: string;
    /** Visual variant */
    variant: StepsVariant;
    /** Layout orientation */
    orientation: StepsOrientation;
    /** Connector line style */
    connector: StepsConnector;
    /** Accent color */
    color: StepsColor;
    /** Compact dots mode */
    compact: boolean;
    /** Enable router integration */
    routed: boolean;
    /** Step configurations (alternative to slotted ml-step elements) */
    steps: StepConfig[];
    /** Internal tracking of slotted steps */
    private _slottedSteps;
    /** Navigation event listener for routed mode */
    private readonly _handleNavigation;
    onCreate(): void;
    onRender(): void;
    onDestroy(): void;
    /** Handle step slot changes */
    handleStepSlotChange: (event: Event) => void;
    /** Handle step click (config mode) */
    handleStepClick: (stepValue: string, href?: string) => void;
    /** Handle slotted step click event */
    private handleSlottedStepClick;
    /** Handle keyboard navigation */
    handleKeyDown: (event: KeyboardEvent) => void;
    /** Get status for a step based on its position relative to active */
    getStepStatus(stepValue: string): StepStatus;
    /** Get current step index (1-based, for compact label) */
    getCurrentStepNumber(): number;
    /** Get total step count */
    getTotalSteps(): number;
    /** Get all steps (from config or slotted) */
    getAllSteps(): StepConfig[];
    /** Get step by value */
    private getStepByValue;
    /** Update attributes on slotted steps */
    private updateSlottedStepStates;
    /** Update panel visibility */
    private updatePanelVisibility;
    /** Focus a specific step button */
    private focusStep;
    /** Sync active step with current route */
    private syncWithRoute;
    /** Handle navigation events (routed mode) */
    private onNavigation;
}
//# sourceMappingURL=steps.component.d.ts.map