import * as _angular_core from '@angular/core';
import { OnDestroy, Signal, ElementRef, TemplateRef } from '@angular/core';
import { FocusableOption, FocusKeyManager } from '@angular/cdk/a11y';
import { DomPortal } from '@angular/cdk/portal';
import * as _siemens_element_ng_tabs from '@siemens/element-ng/tabs';
import { TranslatableString } from '@siemens/element-translate-ng/translate';
import * as i1 from '@angular/router';
import { RouterLink, RouterLinkActive } from '@angular/router';

declare abstract class SiTabBaseDirective implements OnDestroy, FocusableOption {
    abstract readonly active: Signal<boolean | undefined>;
    /** Title of the tab item. */
    readonly heading: _angular_core.InputSignal<TranslatableString>;
    /**
     * Icon of the tab item.
     * If provided, heading text will be ignored and only icon will be displayed.
     */
    readonly icon: _angular_core.InputSignal<string | undefined>;
    /**
     * Additional badge content. A value of
     * - `true` will render a red dot
     * - any string without a `badgeColor` will render a red dot with text
     * - any string with a `badgeColor` will render a normal badge
     */
    readonly badgeContent: _angular_core.InputSignal<boolean | TranslatableString | undefined>;
    /**
     * Background color of the badge.
     * If no color is provided a red dot badge will be rendered.
     */
    readonly badgeColor: _angular_core.InputSignal<string | undefined>;
    /**
     * Disables the tab.
     *
     * @defaultValue false
     */
    readonly disabledTab: _angular_core.InputSignalWithTransform<boolean, unknown>;
    /**
     * Close the current tab.
     *
     * @defaultValue false
     */
    readonly closable: _angular_core.InputSignalWithTransform<boolean, unknown>;
    /** Event emitter to notify when a tab is closed. */
    readonly closeTriggered: _angular_core.OutputEmitterRef<void>;
    /** @internal */
    protected readonly tabButton: ElementRef<HTMLElement>;
    /** @internal */
    readonly tabContent: Signal<TemplateRef<any> | undefined>;
    private static tabCounter;
    private indexBeforeClose;
    /** @internal */
    tabId: string;
    protected readonly icons: Record<"elementCancel", string>;
    protected tabset: _siemens_element_ng_tabs.SiTabsetComponent;
    private readonly index;
    constructor();
    ngOnDestroy(): void;
    protected closeTab(event: Event): void;
    /** @internal */
    focus(): void;
    /** @internal */
    get disabled(): boolean;
    /**
     * Programmatically selects the current tab.
     */
    selectTab(retainFocus?: boolean): void;
    /** @internal */
    deSelectTab(): void;
    /** @internal */
    scrollTabIntoView(): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiTabBaseDirective, never>;
    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SiTabBaseDirective, "[siTabNextBase]", never, { "heading": { "alias": "heading"; "required": true; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "badgeContent": { "alias": "badgeContent"; "required": false; "isSignal": true; }; "badgeColor": { "alias": "badgeColor"; "required": false; "isSignal": true; }; "disabledTab": { "alias": "disabled"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; }, { "closeTriggered": "closeTriggered"; }, never, never, true, never>;
}

/**
 * Creates a tab that uses the Angular router.
 *
 * @example
 * ```html
 * <si-tabset>
 *   <a si-tab routerLink="/home" heading="Home"></a>
 *
 *   <router-outlet />
 * </si-tabset>
 * ```
 */
declare class SiTabLinkComponent extends SiTabBaseDirective {
    private router;
    /** @internal */
    routerLink: RouterLink;
    protected routerLinkActive: RouterLinkActive;
    /** @defaultValue false */
    readonly active: _angular_core.Signal<boolean | undefined>;
    /** {@inheritDoc} */
    selectTab(retainFocus?: boolean): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiTabLinkComponent, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiTabLinkComponent, "a[si-tab][routerLink]", never, {}, {}, never, ["*"], true, [{ directive: typeof i1.RouterLinkActive; inputs: {}; outputs: {}; }]>;
}

/**
 * A component to group multiple tabs together.
 * Can either be used with {@link SiTabLinkComponent} or {@link SiTabComponent} components.
 */
declare class SiTabsetComponent {
    /**
     * When set, the overflowing content inside the tab will automatically scroll
     * @defaultValue false
     **/
    readonly contentOverflowAuto: _angular_core.InputSignalWithTransform<boolean, unknown>;
    protected readonly icons: Record<"elementOptions", string>;
    private readonly contentNode;
    /**
     * A `DomPortal` wrapping the tab panel container. Used by {@link SiTabPortalComponent}
     * to render the active tab's content at a remote location in the DOM.
     *
     * @internal
     */
    readonly contentPortal: _angular_core.Signal<DomPortal<unknown>>;
    /** @internal */
    readonly activeTab: _angular_core.Signal<SiTabBaseDirective | undefined>;
    /** @internal */
    readonly tabPanels: _angular_core.Signal<readonly SiTabBaseDirective[]>;
    /** @internal */
    focusKeyManager: FocusKeyManager<SiTabBaseDirective>;
    /** @internal */
    protected readonly showMenuButton: _angular_core.WritableSignal<boolean>;
    protected tabIsLink(tab: unknown): tab is SiTabLinkComponent;
    constructor();
    /** @internal */
    removedTabByUser(index: number, active?: boolean): void;
    protected resizeContainer(width: number, scrollWidth: number): void;
    protected keydown(event: KeyboardEvent): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiTabsetComponent, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiTabsetComponent, "si-tabset", never, { "contentOverflowAuto": { "alias": "contentOverflowAuto"; "required": false; "isSignal": true; }; }, {}, ["tabPanels"], ["*", "router-outlet"], true, never>;
}

/**
 * Creates a normal tab that can contain any content.
 *
 * @example
 * ```html
 * <si-tabset>
 *   <si-tab heading="Tab 1">
 *     <p>Content of Tab 1</p>
 *   </si-tab>
 * </si-tabset>
 * ```
 */
declare class SiTabComponent extends SiTabBaseDirective implements OnDestroy {
    /**
     * Whether the tab is active or not.
     * If set to `true`, the tab will be selected and its content will be displayed.
     * @defaultValue false
     * */
    readonly active: _angular_core.ModelSignal<boolean>;
    /**
     * Guard to check if the tab can be activated.
     * If not provided, the tab can always be activated.
     */
    readonly canActivate: _angular_core.InputSignal<(() => boolean) | undefined>;
    /**
     * Guard to check if the tab can be deactivated.
     * If not provided, the tab can always be deactivated.
     */
    readonly canDeactivate: _angular_core.InputSignal<(() => boolean) | undefined>;
    protected selectTabByUser(): void;
    /** {@inheritDoc} */
    selectTab(retainFocus?: boolean): void;
    /** @internal */
    deSelectTab(): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiTabComponent, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiTabComponent, "si-tab", never, { "active": { "alias": "active"; "required": false; "isSignal": true; }; "canActivate": { "alias": "canActivate"; "required": false; "isSignal": true; }; "canDeactivate": { "alias": "canDeactivate"; "required": false; "isSignal": true; }; }, { "active": "activeChange"; }, never, ["*"], true, never>;
}

/**
 * A component that renders the active tab's content at a remote
 * location in the DOM using an Angular CDK `DomPortal`.
 *
 * This component **automatically** renders the content of the currently
 * active `si-tab`, including the `role="tabpanel"` container with proper
 * ARIA attributes linked to the active tab.
 *
 * @example
 * ```html
 * <si-tabset #tabset>
 *   <si-tab heading="Overview" [active]="true">
 *     overview content
 *   </si-tab>
 *   <si-tab heading="History">
 *     history content
 *   </si-tab>
 * </si-tabset>
 *
 * <si-tab-portal [tabset]="tabset" />
 * ```
 */
declare class SiTabPortalComponent {
    /**
     * Reference to the {@link SiTabsetComponent} whose active tab content
     * this component renders via a `DomPortal`.
     *
     * The tabset's tab panel container, including the `role="tabpanel"` element
     * with proper ARIA attributes, is transported to this component's location.
     */
    readonly tabset: _angular_core.InputSignal<SiTabsetComponent>;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiTabPortalComponent, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiTabPortalComponent, "si-tab-portal", never, { "tabset": { "alias": "tabset"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
}

export { SiTabComponent, SiTabLinkComponent, SiTabPortalComponent, SiTabsetComponent };
