import { default as CortexElement } from '../../../../base/src/cortex-element.ts';
import { TemplateResult } from 'lit';
import { default as CxIcon } from '../icon/icon';
import { default as CxLineClamp } from '../line-clamp/line-clamp';
import { default as CxProgressBar } from '../progress-bar/progress-bar';
import { default as CxTooltip } from '../tooltip/tooltip';

export type CxStepSelect = CustomEvent<{
    id?: string;
}>;
declare global {
    interface GlobalEventHandlersEventMap {
        'cx-step-select': CxStepSelect;
    }
}
/**
 * @summary Steps are used inside [stepper](?s=atoms&id=/stepper).
 *
 * @slot (default) - The step label.
 */
export default class CxStep extends CortexElement {
    static readonly styles: import('lit').CSSResult[];
    static readonly dependencies: {
        'cx-icon': typeof CxIcon;
        'cx-line-clamp': typeof CxLineClamp;
        'cx-progress-bar': typeof CxProgressBar;
        'cx-tooltip': typeof CxTooltip;
    };
    private readonly step;
    /**
     * Draws the step in an active state.
     */
    active: boolean;
    /**
     * Draws the step in a completed state.
     */
    completed: boolean;
    /**
     * Disables the tab and prevents selection.
     */
    disabled: boolean;
    /**
     * Draws the step with a circle on the left.
     */
    readonly: boolean;
    /**
     * The text color of the active step. The background color will be dimmed to be 15% of it.
     */
    error: boolean;
    /**
     * Index
     */
    index: number;
    /**
     * Is last
     */
    last: boolean;
    /**
     * The step small text.
     */
    helpText: string;
    /**
     * The current progress as a percentage, 0 to 100.
     */
    progress: number;
    /**
     * This is the one that draws the circle
     */
    color: string;
    /**
     * Draws the step with a circle indicator instead of an arrow.
     */
    round: boolean;
    /**
     * The step description.
     */
    description: string;
    constructor();
    private handleClick;
    private renderDefaultStep;
    private renderRoundStep;
    render(): TemplateResult;
}
declare global {
    interface HTMLElementTagNameMap {
        'cx-step': CxStep;
    }
}
