import * as rxjs from 'rxjs';
import { BehaviorSubject, Observable } from 'rxjs';
import * as i0 from '@angular/core';
import { AfterViewInit, AfterContentChecked, OnInit, OnChanges, EventEmitter } from '@angular/core';
import { SidepanelService } from '@talenra/ngx-base/workspace-sidepanel';

/**
 * Represents a single item in the global side-navigation.
 *
 * Used by
 * - {@link AppFrameComponent}
 *
 * ### Import
 *
 * ```typescript
 * import { SidenavItem } from '@talenra/ngx-base/app-layout';
 * ```
 */
interface SidenavItem {
    /**
     * Optional string to identify the SidenavItem.
     */
    identifier?: string;
    /**
     * Label displayed to the user
     */
    label: string;
    /**
     * Identifier of the icon displayed. A list of all icons supported is
     * included in the README of package `@talenra/icons`.
     */
    icon: string;
    /**
     * A counter value attached to the label (visually represented as
     * badge/call-out). Typically a number that represents the number of items
     * contained in this navigation item.
     */
    counter?: number;
    /**
     * Link to an internal resource (e.g. `/foo`).
     */
    destination?: string;
    /**
     * An array of sub-navigation items. If sub-navigation items are available,
     * a second level menu is added. Note that the side-navigation currently
     * supports only one level of sub-navigation.
     */
    children?: SidenavItem[];
    /**
     * Boolean indicating whether the item's children are expanded. Has no effect
     * if the item has no children.
     */
    isExpanded?: boolean;
}

/**
 * Provides utilities used for state management in SideNav.
 *
 * @internal
 */
declare class SidenavState {
    /** Hash table to access items by identifier. */
    private _itemsByIdentifier;
    /** Hash table to access items by URL fragment. */
    private _itemsByDestination;
    /**
     * Creates a hash table by flattening the items array, using destination strings (URLs) as keys.
     * e.g. { '/foo/bar': [{ label: 'Foo', icon: 'bar', destination: '/foo/bar' }] }
     *
     * Note that a given URL might match several items as the URL in SidenavItem.destination must
     * not be unique.
     */
    createTable: (items: SidenavItem[]) => void;
    /**
     * Returns an array of items matching a given destination (URL). Returns an empty array if no matches.
     */
    getItemsByDestination: (destination: string) => SidenavItem[];
    /**
     * Returns an array of indices matching a given destination (URL). Returns an empty array if no matches.
     * The indices represent the matched item's position in sidenav item's tree.
     */
    getIndicesByDestination: (destination: string) => number[][];
    /**
     * Returns an array of items matching a given identifer. Returns an empty array if no matches.
     */
    getItemsByIdentifier: (identifier: string) => SidenavItem[];
    /**
     * Returns an array of indices matching a given destination (URL). Returns an empty array if no matches.
     * The indices represent the matched item's position in sidenav item's tree.
     */
    getIndicesByIdentifier: (identifier: string) => number[][];
}

/**
 * Provides control and state of the app's side navigation.
 *
 * ### Import
 *
 * ```typescript
 * import { SidenavService } from '@talenra/ngx-base/app-layout';
 * ```
 */
declare class SidenavService {
    /**
     * Provides whether the side-navigation is expanded. Note that it might be
     * expanded even when hidden.
     */
    readonly isExpanded$: BehaviorSubject<boolean>;
    /**
     * Collapses or expands the side-navigation
     */
    setExpanded(isExpanded: boolean): void;
    /**
     * Provides whether the side-navigation is hidden. Note that the
     * side-navigation will keep its state (collapsed or expanded) while hidden.
     */
    readonly isHidden$: BehaviorSubject<boolean>;
    /**
     * Hides or shows the side-navigation
     */
    setHidden(isHidden: boolean): void;
    /**
     * **Experimental:** Provides an array with the currently selected sidenav items.
     *
     * ```typescript
     * constructor(private navigationService: SidenavService) {}
     *
     * ngOnInit(): void {
     *   this.navigationService.currentItems$.subscribe((value) => {
     *     console.log(value);
     *   });
     * }
     * ```
     *
     * This feature is considered _experimental_ as the logic could be implemented by
     * the consuming app, which might be the ideal approach (only implemented if used).
     *
     * @experimental
     */
    readonly currentItems$: BehaviorSubject<SidenavItem[] | null>;
    /**
     * Sets the current item.
     *
     * @internal
     */
    setCurrentItems(currentItems: SidenavItem[]): void;
    /**
     * Sidenav state provided by Sidenav component
     */
    private _state?;
    /**
     * Attach Sidenav's state instance
     *
     * @internal
     */
    attachState(state: SidenavState): void;
    /**
     * **Experimental:** Returns an array of items matching a given identifer. Returns an empty array if no matches.
     *
     * @experimental
     */
    getItemsByIdentifier(identifier?: string): SidenavItem[];
    /**
     * **Experimental:** Returns an array of indices of items matching a given identifer. Returns an empty array if no matches.
     *
     * @experimental
     */
    getIndicesByIdentifier(identifier?: string): number[][];
    static ɵfac: i0.ɵɵFactoryDeclaration<SidenavService, never>;
    static ɵprov: i0.ɵɵInjectableDeclaration<SidenavService>;
}

/**
 * Layout type to be applied to content renderend inside
 * `<talenra-header-drawer>` component. Currently only a single layout-type is
 * supported.
 *
 * Used by
 * - {@link HeaderDrawerComponent}
 *
 * ### Import
 *
 * ```typescript
 * import { AppHeaderDrawerLayoutType } from '@talenra/ngx-base/app-layout';
 * ```
 */
declare enum AppHeaderDrawerLayoutType {
    ThreeColumns = "three-columns"
}
/**
 * Represents a header-drawer-item (content displayed in the header-drawer component)
 *
 * Used by
 * - AppHeaderDrawer
 *
 * @internal
 */
type AppHeaderDrawerStateItem = null | string;
/**
 * Represents the state of the global header-drawer.
 *
 * @internal
 */
interface AppHeaderDrawerState {
    /** The item displayed before the current item was displayed in the header-drawer. */
    prev: AppHeaderDrawerStateItem;
    /** The item currently displayed in the header-drawer. */
    current: AppHeaderDrawerStateItem;
}

/**
 * Provides control and state of the app's header-drawer.
 *
 * ### Import
 *
 * ```typescript
 * import { HeaderDrawerService } from '@talenra/ngx-base/app-layout';
 * ```
 */
declare class HeaderDrawerService {
    /**
     * Storage property accessed by `item$`
     */
    private stateSrc;
    /**
     * Provides the header-drawer's state (current and previous items).
     *
     * Used by
     * - {@link AppFrameComponent}
     * - {@link HeaderDrawerComponent}
     */
    readonly item$: rxjs.Observable<{
        prev: AppHeaderDrawerStateItem;
        current: AppHeaderDrawerStateItem;
    }>;
    /**
     * Toggles the header-drawer-item given.
     */
    toggleItem(item: string): void;
    /**
     * Displays the header-drawer-item given. Pass an item of value `null` to
     * collapse the header-drawer.
     */
    setItem(item: AppHeaderDrawerStateItem): void;
    /**
     * Close the header-drawer.
     */
    close(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<HeaderDrawerService, never>;
    static ɵprov: i0.ɵɵInjectableDeclaration<HeaderDrawerService>;
}

/**
 * Provides a wrapper for header-drawer content.
 *
 * ### Import
 *
 * ```typescript
 * import { AppLayoutModule } from '@talenra/ngx-base/app-layout';
 * ```
 *
 * <example-url>../../#/welcome</example-url>
 */
declare class HeaderDrawerComponent implements AfterViewInit, AfterContentChecked, OnInit {
    /** @internal */
    static TRANSITION_DURATION: number;
    /**
     * Unique identifier of the drawer
     */
    id: string;
    /**
     * Layout to be applied
     *
     * see {@link AppHeaderDrawerLayoutType}
     */
    layoutType?: AppHeaderDrawerLayoutType;
    /**
     * Tracking reference is used to determinate whether the drawer needs re-initialization. If you use the
     * HeaderDrawer with static content only, you might not need this.
     *
     * If you use the HeaderDrawer with dynamic content (e.g. inject async data or content changes based on
     * route updates or user interactions), you need to provide an updated value for `trackingRef` whenever
     * content changes.
     */
    trackingRef: string;
    private prevTrackingRef;
    /** @internal */
    private wrapperRef;
    private elementHeight;
    /** @internal */
    currentItemId$: Observable<AppHeaderDrawerState>;
    private latestDrawerState?;
    /** @internal */
    transitionDuration: number;
    /** @internal */
    transitionDelay: number;
    /** @internal */
    isResizing: boolean;
    private readonly destroyRef;
    /**
     * This property is used to initially hide the component and reveal it slightly after the view is initialized. This
     * is a workaround to prevent flickering when re-/loading.
     *
     * @internal */
    viewIsInitialized: boolean;
    private resizeTimeout?;
    private headerDrawerService;
    /** @internal */
    constructor();
    /** @internal */
    ngOnInit(): void;
    /** @internal */
    ngAfterViewInit(): void;
    /**
     * Updates drawer height when content _and_ tracking reference changes. To prevent costly change detection, we use a
     * tracking reference to determine whether an update is required.
     *
     * @internal
     */
    ngAfterContentChecked(): void;
    /**
     * Handle drawer state changes: Delay the fade-in transtion if another drawer
     * item is already active.
     */
    private watchDrawerState;
    /**
     * Hide the drawer while the viewport is resized to prevent flickering. Flickering can be observed when the
     * component's layout switches (breakpoints). Once the resizing is done, update the drawer height and show
     * it again.
     */
    private handleResize;
    private setDrawerHeight;
    /** @internal */
    wrapperOffset(): number;
    /** @internal */
    isActive(): boolean;
    /**
     * Collapses the current drawer.
     */
    private collapse;
    static ɵfac: i0.ɵɵFactoryDeclaration<HeaderDrawerComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<HeaderDrawerComponent, "talenra-header-drawer", never, { "id": { "alias": "id"; "required": false; }; "layoutType": { "alias": "layoutType"; "required": false; }; "trackingRef": { "alias": "trackingRef"; "required": false; }; }, {}, never, ["*"], true, never>;
}

/**
 * Supported Environments
 *
 * ### Import
 *
 * ```typescript
 * import { SupportedEnvironments } from '@talenra/ngx-base/app-layout';
 * ```
 */
declare enum SupportedEnvironment {
    AIT = "AIT",
    DEV = "DEV",
    EDU = "EDU",
    SIT = "SIT",
    PROD = "PROD"
}

/**
 * Provides the global app layout. Is typically placed at the root of your app's
 * component tree.
 *
 * ### Template slots
 *
 * The template uses three template slots
 *
 * - **[default]** – Projects child elements of `<talenra-app-frame>` except for
 * children using one of the following attributes. Typically the only element
 * you want to be projected in the default template slot is `<router-outlet>`.
 * - **appHeader** - The element with the `appHeader` attribute is
 * projected in the slot in the upper-right corner of the app's header. This
 * slot is typically used for buttons like "apps", "user-settings" etc. Expects
 * a single element. Example: `<div appHeader>`
 * - **appHeaderDrawer** - Elements with the `appHeaderDrawer` attribute are
 * expected to be instances of `<talenra-header-drawer>` component and are
 * projected in the global "App Header Drawer". Check the component's docs for
 * details. Example: `<talenra-header-drawer appHeaderDrawer […] >`
 *
 * ### Import
 *
 * ```typescript
 * import { AppLayoutModule } from '@talenra/ngx-base/app-layout';
 * ```
 *
 * <example-url>../../#/welcome</example-url>
 */
declare class AppFrameComponent implements OnInit, OnChanges {
    /** Name of the issuer of the app (e.g. "SVA Zürich") */
    issuerName: string;
    /**
     * Name of the app (e.g. "SoHi"). Note that while most app names are
     * displayed as plain text, some names might be represented as logotype
     * (e.g. "talenra").
     */
    appName: string;
    /** Code for the current environment (e.g. 'AIT', 'DEV', 'EDU', 'SIT', 'PROD'). Displayed in the app's footer. */
    appEnv: SupportedEnvironment;
    /** Version of the app (e.g. 'AB123' or '1.2.3') */
    appVersion: string;
    /** Code for the current language (e.g. 'de', 'fr', 'it'). Displayed in the app's footer. */
    appLang: string;
    /**
     * Items displayed in the main section of the side-navigation. Supports two-way binding.
     *
     * ```html
     * <!-- Component template -->
     * <talenra-app-frame [...] [(sidenavItems)]="sidenavItems"></talenra-checkbox>
     * ```
     *
     * see {@link SidenavItem}
     */
    sidenavItems: SidenavItem[];
    /**
     * Event emitted when value of `sidenavItems` changes.
     *
     * ```typescript
     * // Component class
     * sidenavItemsChange(sidenavItems: SidenavItem[]): void => {
     *   console.log(sidenavItems);
     * }
     * ```
     *
     * ```html
     * <!-- Component template -->
     * <talenra-app-frame [...] [(sidenavItems)]="sidenavItems" (sidenavItemsChange)="sidenavItemsChange($event)"></talenra-app-frame>
     * ```
     */
    readonly sidenavItemsChange: EventEmitter<SidenavItem[]>;
    /**
     * Event emitted when a sidenavItem is toggled (property `isExpanded` has updated). The updated item is attached.
     *
     * ```typescript
     * // Component class
     * sidenavItemExpandedChange(sidenavItem: SidenavItem): void => {
     *   console.log(sidenavItem);
     * }
     * ```
     *
     * ```html
     * <!-- Component template -->
     * <talenra-app-frame
     *   [...]
     *   [(sidenavItems)]="sidenavItems"
     *   (sidenavItemExpandedChange)="sidenavItemExpandedChange($event)"></talenra-app-frame>
     * ```
     */
    readonly sidenavItemExpandedChange: EventEmitter<SidenavItem>;
    /**
     * Items displayed in the footer section of the side-navigation. Typically
     * used for things like settings.
     *
     * see {@link SidenavItem}
     */
    sidenavBottomItems: SidenavItem[];
    /**
     * Renders the layout _without_ the app's header. Note that this option is deprecated and support will be dropped.
     *
     * Headerless mode is required by the apps listed below. It is deprecated on release and _shall not be used by any
     * other product_.
     *
     * - KAMESA
     * - SoHi
     *
     * IMPORTANT: Support shall not be dropped without consulting the teams responsible for the apps listed above.
     *
     * @deprecated
     */
    headerless: boolean;
    protected currentAppHeaderDrawerItem: AppHeaderDrawerStateItem;
    /** List of all logotypes available. */
    private logotypes;
    /** Name of the app as displayed in the header. If the app name is associated with a
     * logotype, this logotype is rendered and the display name is shortened accordingly
     * (e.g. "talenra Fall-Manager" is rendered as "[talenra Logotype] Fall-Manager") */
    appDisplayName: string;
    /**
     * Key of the logotype to be used in the UI. Is set automatically based on the provided app name.
     */
    protected logotype: string;
    private readonly layoutService;
    protected readonly sidenavService: SidenavService;
    protected readonly sidepanelService: SidepanelService;
    private readonly headerDrawerService;
    private readonly destroyRef;
    /** @internal */
    ngOnInit(): void;
    /** @internal */
    ngOnChanges(): void;
    protected handleItemsChange(): void;
    protected onSidenavItemExpandedChange(item: SidenavItem): void;
    /**
     * Collapse overlays on outside-click
     */
    protected autoCollapse(): void;
    /**
     * Updates the app's display name logotype key based on the given app name.
     */
    private updateAppDisplayName;
    static ɵfac: i0.ɵɵFactoryDeclaration<AppFrameComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<AppFrameComponent, "talenra-app-frame", never, { "issuerName": { "alias": "issuerName"; "required": false; }; "appName": { "alias": "appName"; "required": false; }; "appEnv": { "alias": "appEnv"; "required": false; }; "appVersion": { "alias": "appVersion"; "required": false; }; "appLang": { "alias": "appLang"; "required": false; }; "sidenavItems": { "alias": "sidenavItems"; "required": false; }; "sidenavBottomItems": { "alias": "sidenavBottomItems"; "required": false; }; "headerless": { "alias": "headerless"; "required": false; }; "appDisplayName": { "alias": "appDisplayName"; "required": false; }; }, { "sidenavItemsChange": "sidenavItemsChange"; "sidenavItemExpandedChange": "sidenavItemExpandedChange"; }, never, ["[appHeader]", "[appHeaderDrawer]", "*", "[systemInfo]"], true, never>;
    static ngAcceptInputType_headerless: unknown;
}

/**
 * Layout widths supported by workspace layouts (e.g. WorkspaceSimple).
 *
 * ```html
 * <talenra-workspace-simple width="s"></talenra-workspace-simple>
 * ```
 *
 * ### Import
 *
 * ```typescript
 * import { WorkspaceWidth } from '@talenra/ngx-base/app-layout';
 * ```
 *
 * @see {@link TWorkspaceWidth}
 * @see {@link WorkspaceSimpleComponent}
 */
declare const WorkspaceWidth: {
    readonly XS: "xs";
    readonly S: "s";
    readonly M: "m";
    readonly L: "l";
    readonly Max: "max";
};
/**
 * Type of layout sizes supported by Workspace layouts.
 *
 * ### Import
 *
 * ```typescript
 * import { TWorkspaceWidth } from '@talenra/ngx-base/app-layout';
 * ```
 *
 * @see {@link WorkspaceWidth}
 * @see {@link WorkspaceSimpleComponent}
 */
type TWorkspaceWidth = (typeof WorkspaceWidth)[keyof typeof WorkspaceWidth];

export { AppFrameComponent, AppHeaderDrawerLayoutType, HeaderDrawerComponent, HeaderDrawerService, SidenavService, SupportedEnvironment, WorkspaceWidth };
export type { AppHeaderDrawerState, AppHeaderDrawerStateItem, SidenavItem, TWorkspaceWidth };