@angulogic/ng-sidebar/lib/component/ng-sidebar.component.d.ts

angular sidebar

import { DoCheck, OnInit, TemplateRef } from '@angular/core';
import { MenuData, SidebarModel } from '../sidebar.model';
import { NgSidebarService } from '../ng-sidebar.service';
import * as i0 from "@angular/core";
/**
 * A dynamic and interactive sidebar component for Angular applications.
 * It supports features such as menu navigation, search, favorites, and theme management.
 *
 * @export
 * @class NgSidebarComponent
 * @implements {DoCheck}
 * @implements {OnInit}
 */
export declare class NgSidebarComponent implements DoCheck, OnInit {
    ngSidebarService: NgSidebarService;
    /**
     * Stores the current sidebar configuration.
     */
    sidebarData: SidebarModel;
    /**
     * Stores the original sidebar data for deep cloning.
     */
    SIDEBAR_DATA: SidebarModel;
    /**
     * Stores the list of favorite menu items.
     */
    favorites: MenuData[];
    /**
     * Sets the sidebar options and initializes the sidebar data.
     * Ensures the default theme is applied if not provided.
     *
     * @param {SidebarModel} val - The sidebar configuration model.
     */
    set options(val: SidebarModel);
    /**
     * Defines a custom template for menu node content.
     */
    nodeContent?: TemplateRef<any>;
    /**
     * Adds the `.ng-sidebar` class to the component.
     */
    ngSidebarClass: boolean;
    /**
     * Applies the `.collapsed` class when the sidebar is collapsed.
     */
    get isCollapsed(): boolean;
    /**
     * Applies the `.transition` class when the sidebar is transitioning.
     */
    get isTransition(): boolean;
    /**
     * Applies the `.al-dark-theme` class when the dark theme is active.
     */
    get isDarkTheme(): boolean;
    /**
     * Binds the sidebar's width dynamically based on its expanded state.
     */
    get sidebarWidth(): string;
    /**
     * Binds the sidebar's max width dynamically.
     */
    get sidebarMaxWidth(): string;
    /**
     * Binds the sidebar's min width dynamically.
     */
    get sidebarMinWidth(): string;
    /**
     * Creates an instance of `NgSidebarComponent`.
     *
     * @param {NgSidebarService} ngSidebarService - The sidebar service for handling state and actions.
     */
    constructor(ngSidebarService: NgSidebarService);
    /**
     * Lifecycle hook that runs when the component initializes.
     * It updates the list of favorite menu items.
     */
    ngOnInit(): void;
    /**
     * Lifecycle hook that detects changes and manages auto-positioning.
     */
    ngDoCheck(): void;
    /**
     * Handles click events on the banner elements (logo or title).
     * Triggers the `onClick` event if it exists in `bannerOptions`.
     *
     * @param {'logo' | 'title'} element - The clicked banner element.
     */
    protected onBannerClick(element: 'logo' | 'title'): void;
    /**
     * Handles click events on the user profile elements (avatar or name).
     * Triggers the `onClick` event if it exists in `userOptions`.
     *
     * @param {'avatar' | 'name'} element - The clicked user profile element.
     */
    protected onUserClick(element: 'avatar' | 'name'): void;
    /**
     * Handles search input events and filters the sidebar menu items.
     * Triggers `onSearchStart` and `onSearchEnd` events if provided.
     *
     * @param {KeyboardEvent} event - The keyboard event triggered by the search input.
     */
    protected onSearch(event: KeyboardEvent): Promise<void>;
    /**
     * Resets the search input and restores the sidebar menu items.
     * Triggers `onSearchStart` and `onSearchEnd` events if provided.
     *
     * @param {HTMLInputElement} searchInput - The search input element to clear.
     */
    protected onCancelSearch(searchInput: HTMLInputElement): Promise<void>;
    /**
     * Handles click events on menu items.
     * If the item has children, it toggles the node.
     * If the item has a route, it navigates to it.
     *
     * @param {MenuData} node - The clicked menu item.
     * @param {MouseEvent} mouseEvent - The mouse event triggering the click.
     */
    protected onMenuClick(node: MenuData, mouseEvent: MouseEvent): Promise<void>;
    /**
     * Handles click events on favorite menu items.
     * Triggers the `onClick` event if it exists for the menu item.
     *
     * @param {MenuData & { cancel: boolean }} favorite - The favorite menu item clicked.
     */
    private onFavoriteClick;
    /**
     * Expands the sidebar when the mouse enters, if viewMode is set to "hover".
     */
    protected onEnter(): void;
    /**
     * Collapses the sidebar when the mouse leaves, if viewMode is set to "hover".
     */
    protected onLeave(): void;
    /**
     * Toggles the expansion state of a menu node.
     * If the node is already expanded, it collapses it with an animation.
     *
     * @param {MenuData} node - The menu node to toggle.
     * @param {MouseEvent} event - The mouse event triggering the toggle.
     */
    private nodeToggle;
    /**
     * Adds or removes a menu item from the favorites list.
     *
     * @param {MenuData} node - The menu item to toggle as a favorite.
     */
    protected onFavoriteNode(node: MenuData): void;
    /**
     * Checks if a menu item is in the favorites list.
     *
     * @param {string} name - The name of the menu item to check.
     * @returns {boolean} - True if the item is in favorites, false otherwise.
     */
    protected isOnFav(name: string): boolean;
    /**
     * Updates the favorites list by scanning the sidebar menu items.
     */
    private updateFavorites;
    /**
     * Recursively collects favorite menu items from a list of nodes.
     *
     * @param {MenuData[]} nodes - The list of menu nodes to scan.
     */
    private collectFavorites;
    /**
     * Toggles the pinned state of the sidebar.
     * When pinned, the sidebar remains expanded regardless of hover interactions.
     */
    togglePin(): void;
    /**
     * Performs a deep clone of an object to prevent reference issues.
     *
     * @template T
     * @param {T} obj - The object to clone.
     * @returns {T} - A deep copy of the input object.
     */
    private deepClone;
    static ɵfac: i0.ɵɵFactoryDeclaration<NgSidebarComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<NgSidebarComponent, "ng-sidebar", never, { "options": { "alias": "options"; "required": true; }; "nodeContent": { "alias": "nodeContent"; "required": false; }; }, {}, never, ["[al-sidebar-banner]", "[al-sidebar-top-user]", "[al-sidebar-search]", "[al-sidebar-menu]", "[al-sidebar-bottom-user]"], false, never>;
}