@egose/shadcn-theme-ng 0.0.28 → 0.2.0

package/layout-simple/types/layout-simple.d.ts

@@ -1,153 +1,204 @@
 import * as _angular_core from '@angular/core';
-import { TemplateRef } from '@angular/core';
-import { BreakpointObserver } from '@angular/cdk/layout';
+import { TemplateRef, ElementRef } from '@angular/core';
 import { ClassValue } from 'clsx';
 import { hlm } from '@egose/shadcn-theme-ng/utils';
 import { BrnSheet } from '@spartan-ng/brain/sheet';
 
-interface UserMenuItem {
+/** Navigation destination or action shared by the header, mobile menu, and footer. */
+interface MenuItem {
     label: string;
-    icon?: any;
-    action?: () => void;
+    /** Supporting text displayed in fly-out cards. */
+    description?: string;
+    /** SVG data, e.g. `lucideHome` from `@ng-icons/lucide`. */
+    icon?: string;
+    /** Internal Angular router URL. A link takes precedence over an action. */
     link?: string;
+    action?: () => void;
+    /** Exact path matching by default; query parameters and fragments are ignored. */
+    activeMatch?: 'exact' | 'prefix';
+    disabled?: boolean;
     class?: string;
 }
+interface MenuGroup {
+    label?: string;
+    items: readonly MenuItem[];
+}
+/** A named navbar disclosure that opens a wide grid of navigation cards. */
+interface FlyoutMenuGroup extends MenuGroup {
+    label: string;
+    /** Optional introduction shown above the cards. */
+    description?: string;
+    icon?: string;
+}
+/** Internal matching contract shared by links and dropdown destinations. */
+declare function navigationMatchOptions(item: MenuItem): {
+    paths: "exact" | "subset";
+    queryParams: "ignored";
+    fragment: "ignored";
+    matrixParams: "ignored";
+};
+
+type UserMenuItem = MenuItem;
 interface UserMenuSection {
     label?: string;
     separator?: boolean;
-    items?: UserMenuItem[];
+    items?: readonly UserMenuItem[];
 }
 declare class EgLayoutSimpleUserMenu {
-    hlm: typeof hlm;
-    lucideUser: string;
-    menus: _angular_core.InputSignal<UserMenuSection[]>;
-    menuTrigger: _angular_core.InputSignal<TemplateRef<any> | undefined>;
+    protected readonly hlm: typeof hlm;
+    protected readonly navigationMatchOptions: typeof navigationMatchOptions;
+    protected readonly userIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><path d=\"M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2\"></path><circle cx=\"12\" cy=\"7\" r=\"4\"></circle></svg>";
+    readonly sections: _angular_core.InputSignal<readonly UserMenuSection[]>;
+    readonly triggerTemplate: _angular_core.InputSignal<TemplateRef<unknown> | undefined>;
+    readonly triggerLabel: _angular_core.InputSignal<string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgLayoutSimpleUserMenu, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgLayoutSimpleUserMenu, "eg-layout-simple-user-menu", never, { "menus": { "alias": "menus"; "required": false; "isSignal": true; }; "menuTrigger": { "alias": "menuTrigger"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgLayoutSimpleUserMenu, "eg-layout-simple-user-menu", never, { "sections": { "alias": "sections"; "required": false; "isSignal": true; }; "triggerTemplate": { "alias": "triggerTemplate"; "required": false; "isSignal": true; }; "triggerLabel": { "alias": "triggerLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-declare class EgLayoutSimpleSidebar {
-    readonly viewchildSheetRef: _angular_core.Signal<BrnSheet | undefined>;
-    side: _angular_core.InputSignal<"top" | "bottom" | "left" | "right" | undefined>;
-    title: _angular_core.InputSignal<string | undefined>;
-    content: _angular_core.InputSignal<TemplateRef<any> | undefined>;
-    contentContext: _angular_core.InputSignal<any>;
+/** Called when search opens and after the query changes. Return already-filtered results. */
+type LayoutSearchLoader<TItem> = (params: {
+    search: string;
+}) => Promise<readonly TItem[]>;
+interface LayoutSearchResultContext<TItem> {
+    $implicit: TItem;
+}
+/** Async page search with debouncing, stale-response protection, and keyboard navigation. */
+declare class EgLayoutSearch<TItem = unknown> {
+    readonly placeholder: _angular_core.InputSignal<string>;
+    readonly emptyText: _angular_core.InputSignal<string>;
+    readonly errorText: _angular_core.InputSignal<string>;
+    readonly loadingText: _angular_core.InputSignal<string>;
+    readonly retryText: _angular_core.InputSignal<string>;
+    readonly loader: _angular_core.InputSignal<LayoutSearchLoader<TItem> | undefined>;
+    readonly resultLabel: _angular_core.InputSignal<((item: TItem) => string) | undefined>;
+    readonly resultTemplate: _angular_core.InputSignal<TemplateRef<LayoutSearchResultContext<TItem>> | undefined>;
+    readonly resultSelected: _angular_core.OutputEmitterRef<TItem>;
+    protected readonly searchIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><path d=\"m21 21-4.34-4.34\"></path><circle cx=\"11\" cy=\"11\" r=\"8\"></circle></svg>";
+    protected readonly query: _angular_core.WritableSignal<string>;
+    protected readonly results: _angular_core.WritableSignal<readonly TItem[]>;
+    protected readonly isOpen: _angular_core.WritableSignal<boolean>;
+    protected readonly isLoading: _angular_core.WritableSignal<boolean>;
+    protected readonly hasError: _angular_core.WritableSignal<boolean>;
+    private readonly retryVersion;
+    private readonly searchInput;
+    private readonly resultButtons;
     constructor();
-    openSheet(): void;
-    closeSheet(): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgLayoutSimpleSidebar, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgLayoutSimpleSidebar, "eg-layout-simple-sidebar", never, { "side": { "alias": "side"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "content": { "alias": "content"; "required": false; "isSignal": true; }; "contentContext": { "alias": "contentContext"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    protected labelFor(item: TItem): string;
+    protected setOpen(open: boolean): void;
+    protected retry(): void;
+    protected selectResult(item: TItem): void;
+    protected focusResult(index: number, event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgLayoutSearch<any>, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgLayoutSearch<any>, "eg-layout-search", never, { "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "errorText": { "alias": "errorText"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "retryText": { "alias": "retryText"; "required": false; "isSignal": true; }; "loader": { "alias": "loader"; "required": false; "isSignal": true; }; "resultLabel": { "alias": "resultLabel"; "required": false; "isSignal": true; }; "resultTemplate": { "alias": "resultTemplate"; "required": false; "isSignal": true; }; }, { "resultSelected": "resultSelected"; }, never, never, true, never>;
 }
 
-interface MenuItem {
-    label: string;
-    icon?: any;
-    link?: string;
-    action?: () => void;
-    class?: string;
-}
-interface MenuGroup {
-    label?: string;
-    items: MenuItem[];
-}
-declare class EgLayoutSimple<TItem, TParams extends object = {
-    search: string;
-}> {
-    private breakpointObserver;
-    hlm: typeof hlm;
-    menuIcon: string;
-    sidebarEnabled: _angular_core.InputSignal<boolean>;
-    sidebarTitle: _angular_core.InputSignal<string>;
-    sidebarContent: _angular_core.InputSignal<TemplateRef<any> | undefined>;
-    userMenuTrigger: _angular_core.InputSignal<TemplateRef<any> | undefined>;
-    /** Menu data inputs */
-    leftMenus: _angular_core.InputSignal<MenuItem[]>;
-    leftMenuGroups: _angular_core.InputSignal<MenuGroup[]>;
-    rightMenus: _angular_core.InputSignal<MenuItem[]>;
-    topMenus: _angular_core.InputSignal<MenuItem[]>;
-    topSecondaryMenus: _angular_core.InputSignal<MenuGroup[]>;
-    userMenus: _angular_core.InputSignal<UserMenuSection[]>;
-    logo: _angular_core.InputSignal<string>;
-    logoLink: _angular_core.InputSignal<string>;
-    logoClass: _angular_core.InputSignal<ClassValue>;
-    headerClass: _angular_core.InputSignal<ClassValue>;
-    contentClass: _angular_core.InputSignal<ClassValue>;
-    contentBottomClass: _angular_core.InputSignal<ClassValue>;
-    /** Container class inputs */
-    leftMenuClass: _angular_core.InputSignal<ClassValue>;
-    rightMenuClass: _angular_core.InputSignal<ClassValue>;
-    topMenuClass: _angular_core.InputSignal<ClassValue>;
-    /** Link/button base class inputs */
-    leftLinkClass: _angular_core.InputSignal<ClassValue>;
-    rightLinkClass: _angular_core.InputSignal<ClassValue>;
-    topLinkClass: _angular_core.InputSignal<ClassValue>;
-    searchEnabled: _angular_core.InputSignal<boolean>;
-    loading: _angular_core.InputSignal<boolean>;
-    searchPlaceholderText: _angular_core.InputSignal<string>;
-    searchEmptyText: _angular_core.InputSignal<string>;
-    searchOptionTemplate: _angular_core.InputSignal<TemplateRef<any> | undefined>;
-    searchLoaderFn: _angular_core.InputSignal<((params: TParams) => Promise<TItem[]>) | undefined>;
-    searchTransformValueToSearch: _angular_core.InputSignal<((value: TItem) => string) | undefined>;
-    readonly searchOptionChange: _angular_core.OutputEmitterRef<TItem>;
-    protected readonly _logoClass: _angular_core.Signal<string>;
-    protected readonly _headerClass: _angular_core.Signal<string>;
-    protected readonly _contentClass: _angular_core.Signal<string>;
-    protected readonly _contentBottomClass: _angular_core.Signal<string>;
-    /** Computed merged classes for containers */
-    protected readonly _computedLeftClass: _angular_core.Signal<string>;
-    protected readonly _computedRightClass: _angular_core.Signal<string>;
-    protected readonly _computedTopClass: _angular_core.Signal<string>;
-    protected readonly _computedTopSecondaryClass: _angular_core.Signal<string>;
-    /** Computed merged classes for link/button elements */
-    protected readonly _computedLeftLinkClass: _angular_core.Signal<string>;
-    protected readonly _computedRightLinkClass: _angular_core.Signal<string>;
-    protected readonly _computedTopLinkClass: _angular_core.Signal<string>;
-    mobileMenuItemClass: string;
-    footerEnabled: _angular_core.InputSignal<boolean>;
-    footerMenus: _angular_core.InputSignal<MenuItem[]>;
-    footerMenuClass: _angular_core.InputSignal<ClassValue>;
-    footerLinkClass: _angular_core.InputSignal<ClassValue>;
-    footerContent: _angular_core.InputSignal<string>;
-    footerClass: _angular_core.InputSignal<ClassValue>;
-    protected readonly _footerClass: _angular_core.Signal<string>;
-    protected readonly _computedFooterMenuClass: _angular_core.Signal<string>;
-    protected readonly _computedFooterLinkClass: _angular_core.Signal<string>;
-    /** Mobile menu state */
-    mobileMenuOpen: boolean;
-    isMobile: _angular_core.WritableSignal<boolean>;
-    constructor(breakpointObserver: BreakpointObserver);
-    toggleMobileMenu(): void;
-    onSearchOptionChange(value: TItem): void;
-    readonly viewchildSheetRef: _angular_core.Signal<EgLayoutSimpleSidebar | undefined>;
-    openSidebar(): void;
-    closeSidebar(): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgLayoutSimple<any, any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgLayoutSimple<any, any>, "eg-layout-simple", never, { "sidebarEnabled": { "alias": "sidebarEnabled"; "required": false; "isSignal": true; }; "sidebarTitle": { "alias": "sidebarTitle"; "required": false; "isSignal": true; }; "sidebarContent": { "alias": "sidebarContent"; "required": false; "isSignal": true; }; "userMenuTrigger": { "alias": "userMenuTrigger"; "required": false; "isSignal": true; }; "leftMenus": { "alias": "leftMenus"; "required": false; "isSignal": true; }; "leftMenuGroups": { "alias": "leftMenuGroups"; "required": false; "isSignal": true; }; "rightMenus": { "alias": "rightMenus"; "required": false; "isSignal": true; }; "topMenus": { "alias": "topMenus"; "required": false; "isSignal": true; }; "topSecondaryMenus": { "alias": "topSecondaryMenus"; "required": false; "isSignal": true; }; "userMenus": { "alias": "userMenus"; "required": false; "isSignal": true; }; "logo": { "alias": "logo"; "required": false; "isSignal": true; }; "logoLink": { "alias": "logoLink"; "required": false; "isSignal": true; }; "logoClass": { "alias": "logoClass"; "required": false; "isSignal": true; }; "headerClass": { "alias": "headerClass"; "required": false; "isSignal": true; }; "contentClass": { "alias": "contentClass"; "required": false; "isSignal": true; }; "contentBottomClass": { "alias": "contentBottomClass"; "required": false; "isSignal": true; }; "leftMenuClass": { "alias": "leftClass"; "required": false; "isSignal": true; }; "rightMenuClass": { "alias": "rightClass"; "required": false; "isSignal": true; }; "topMenuClass": { "alias": "topClass"; "required": false; "isSignal": true; }; "leftLinkClass": { "alias": "leftLinkClass"; "required": false; "isSignal": true; }; "rightLinkClass": { "alias": "rightLinkClass"; "required": false; "isSignal": true; }; "topLinkClass": { "alias": "topLinkClass"; "required": false; "isSignal": true; }; "searchEnabled": { "alias": "searchEnabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "searchPlaceholderText": { "alias": "searchPlaceholderText"; "required": false; "isSignal": true; }; "searchEmptyText": { "alias": "searchEmptyText"; "required": false; "isSignal": true; }; "searchOptionTemplate": { "alias": "searchOptionTemplate"; "required": false; "isSignal": true; }; "searchLoaderFn": { "alias": "searchLoaderFn"; "required": false; "isSignal": true; }; "searchTransformValueToSearch": { "alias": "searchTransformValueToSearch"; "required": false; "isSignal": true; }; "footerEnabled": { "alias": "footerEnabled"; "required": false; "isSignal": true; }; "footerMenus": { "alias": "footerMenus"; "required": false; "isSignal": true; }; "footerMenuClass": { "alias": "footerMenuClass"; "required": false; "isSignal": true; }; "footerLinkClass": { "alias": "footerLinkClass"; "required": false; "isSignal": true; }; "footerContent": { "alias": "footerContent"; "required": false; "isSignal": true; }; "footerClass": { "alias": "footerClass"; "required": false; "isSignal": true; }; }, { "searchOptionChange": "searchOptionChange"; }, never, ["*"], true, never>;
+declare class EgLayoutSimpleSidebar {
+    readonly sheet: _angular_core.Signal<BrnSheet | undefined>;
+    readonly panelId: _angular_core.InputSignal<string>;
+    readonly title: _angular_core.InputSignal<string>;
+    readonly content: _angular_core.InputSignal<TemplateRef<unknown> | undefined>;
+    readonly contentContext: _angular_core.InputSignal<object | null>;
+    open(): void;
+    close(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgLayoutSimpleSidebar, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgLayoutSimpleSidebar, "eg-layout-simple-sidebar", never, { "panelId": { "alias": "panelId"; "required": true; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "content": { "alias": "content"; "required": false; "isSignal": true; }; "contentContext": { "alias": "contentContext"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-interface AutocompleteOption<T = unknown> {
-    label: string;
-    value: T;
-    raw?: T;
-}
-declare class EgGenericAutocomplete<TItem, TParams extends object = {
-    search: string;
-}> {
-    placeholderText: _angular_core.InputSignal<string>;
-    emptyText: _angular_core.InputSignal<string>;
-    /** Loader function: takes search string, returns options. */
-    loaderFn: _angular_core.InputSignal<((params: TParams) => Promise<TItem[]>) | undefined>;
-    transformValueToSearch: _angular_core.InputSignal<((value: TItem) => string) | undefined>;
-    readonly search: _angular_core.WritableSignal<string>;
-    readonly options: _angular_core.WritableSignal<TItem[]>;
-    protected readonly filtered: _angular_core.Signal<AutocompleteOption<TItem>[]>;
-    readonly optionChange: _angular_core.OutputEmitterRef<TItem>;
+/** Matches Tailwind's default `md` breakpoint. */
+declare const EG_LAYOUT_SIMPLE_MOBILE_BREAKPOINT = "(max-width: 767.98px)";
+/** Responsive application shell. All navigation surfaces share the same item model. */
+declare class EgLayoutSimple<TItem = unknown> {
+    private readonly destroyRef;
+    private readonly breakpointObserver;
+    private readonly router;
+    private readonly instanceId;
+    protected readonly mainId: string;
+    protected readonly mobileMenuId: string;
+    protected readonly sidebarId: string;
+    protected readonly hlm: typeof hlm;
+    protected readonly navigationMatchOptions: typeof navigationMatchOptions;
+    protected readonly menuIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><path d=\"M4 5h16\"></path><path d=\"M4 12h16\"></path><path d=\"M4 19h16\"></path></svg>";
+    protected readonly sidebarIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\"></rect><path d=\"M9 3v18\"></path></svg>";
+    protected readonly closeIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><path d=\"M18 6 6 18\"></path><path d=\"m6 6 12 12\"></path></svg>";
+    protected readonly chevronIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><path d=\"m6 9 6 6 6-6\"></path></svg>";
+    protected readonly mobileMenuTrigger: _angular_core.Signal<ElementRef<HTMLButtonElement> | undefined>;
+    protected readonly mainContent: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
+    protected readonly sidebar: _angular_core.Signal<EgLayoutSimpleSidebar | undefined>;
+    readonly sidebarEnabled: _angular_core.InputSignal<boolean>;
+    readonly sidebarTitle: _angular_core.InputSignal<string>;
+    readonly sidebarContent: _angular_core.InputSignal<TemplateRef<unknown> | undefined>;
+    readonly sidebarToggleLabel: _angular_core.InputSignal<string>;
+    readonly mobileMenuLabel: _angular_core.InputSignal<string>;
+    readonly mobileMenuCloseLabel: _angular_core.InputSignal<string>;
+    readonly userMenuTrigger: _angular_core.InputSignal<TemplateRef<unknown> | undefined>;
+    readonly userMenuLabel: _angular_core.InputSignal<string>;
+    /** Main header destinations; use `activeMatch: 'prefix'` for whole sections. */
+    readonly primaryNavigation: _angular_core.InputSignal<readonly MenuItem[]>;
+    readonly navigationGroups: _angular_core.InputSignal<readonly MenuGroup[]>;
+    readonly utilityNavigation: _angular_core.InputSignal<readonly MenuItem[]>;
+    readonly sectionNavigation: _angular_core.InputSignal<readonly MenuItem[]>;
+    readonly secondaryNavigationGroups: _angular_core.InputSignal<readonly MenuGroup[]>;
+    /** Category navbar with wide card panels; mobile renders expandable groups. */
+    readonly flyoutNavigationGroups: _angular_core.InputSignal<readonly FlyoutMenuGroup[]>;
+    readonly flyoutNavigationLabel: _angular_core.InputSignal<string>;
+    readonly flyoutCloseLabel: _angular_core.InputSignal<string>;
+    readonly userMenuSections: _angular_core.InputSignal<readonly UserMenuSection[]>;
+    /** Optional image. Without it, the brand name is shown instead of a broken image. */
+    readonly logo: _angular_core.InputSignal<string>;
+    readonly brandName: _angular_core.InputSignal<string>;
+    readonly logoLink: _angular_core.InputSignal<string>;
+    readonly logoClass: _angular_core.InputSignal<ClassValue>;
+    /** Disable for a shell preview embedded inside another page. */
+    readonly fullHeight: _angular_core.InputSignal<boolean>;
+    readonly headerClass: _angular_core.InputSignal<ClassValue>;
+    readonly contentClass: _angular_core.InputSignal<ClassValue>;
+    readonly primaryNavigationClass: _angular_core.InputSignal<ClassValue>;
+    readonly utilityNavigationClass: _angular_core.InputSignal<ClassValue>;
+    readonly sectionNavigationClass: _angular_core.InputSignal<ClassValue>;
+    readonly secondaryNavigationClass: _angular_core.InputSignal<ClassValue>;
+    readonly flyoutNavigationClass: _angular_core.InputSignal<ClassValue>;
+    readonly flyoutPanelClass: _angular_core.InputSignal<ClassValue>;
+    readonly navigationItemClass: _angular_core.InputSignal<ClassValue>;
+    readonly loading: _angular_core.InputSignal<boolean>;
+    readonly loadingText: _angular_core.InputSignal<string>;
+    readonly skipLinkText: _angular_core.InputSignal<string>;
+    readonly searchEnabled: _angular_core.InputSignal<boolean>;
+    readonly searchPlaceholder: _angular_core.InputSignal<string>;
+    readonly searchEmptyText: _angular_core.InputSignal<string>;
+    readonly searchErrorText: _angular_core.InputSignal<string>;
+    readonly searchResultTemplate: _angular_core.InputSignal<TemplateRef<LayoutSearchResultContext<TItem>> | undefined>;
+    readonly searchLoader: _angular_core.InputSignal<LayoutSearchLoader<TItem> | undefined>;
+    readonly searchResultLabel: _angular_core.InputSignal<((item: TItem) => string) | undefined>;
+    readonly searchResultSelected: _angular_core.OutputEmitterRef<TItem>;
+    readonly footerEnabled: _angular_core.InputSignal<boolean>;
+    readonly footerNavigation: _angular_core.InputSignal<readonly MenuItem[]>;
+    readonly footerText: _angular_core.InputSignal<string>;
+    readonly footerClass: _angular_core.InputSignal<ClassValue>;
+    protected readonly logoClasses: _angular_core.Signal<string>;
+    protected readonly headerClasses: _angular_core.Signal<string>;
+    protected readonly contentClasses: _angular_core.Signal<string>;
+    protected readonly primaryNavigationClasses: _angular_core.Signal<string>;
+    protected readonly utilityNavigationClasses: _angular_core.Signal<string>;
+    protected readonly sectionNavigationClasses: _angular_core.Signal<string>;
+    protected readonly secondaryNavigationClasses: _angular_core.Signal<string>;
+    protected readonly footerClasses: _angular_core.Signal<string>;
+    protected readonly iconButtonClasses = "tw:inline-flex tw:size-11 tw:shrink-0 tw:items-center tw:justify-center tw:rounded-lg tw:border tw:border-border tw:bg-background tw:text-foreground tw:cursor-pointer tw:hover:bg-foreground/5 tw:focus-visible:outline-2 tw:focus-visible:outline-offset-2 tw:focus-visible:outline-ring";
+    protected readonly mobileMenuOpen: _angular_core.WritableSignal<boolean>;
+    protected readonly isMobile: _angular_core.WritableSignal<boolean>;
+    protected readonly sidebarOpen: _angular_core.WritableSignal<boolean>;
+    protected readonly sidebarContext: {
+        close: () => void;
+    };
     constructor();
-    private loadOptions;
-    select(opt: AutocompleteOption<TItem>): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgGenericAutocomplete<any, any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgGenericAutocomplete<any, any>, "eg-generic-autocomplete", never, { "placeholderText": { "alias": "placeholderText"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "loaderFn": { "alias": "loaderFn"; "required": false; "isSignal": true; }; "transformValueToSearch": { "alias": "transformValueToSearch"; "required": false; "isSignal": true; }; }, { "optionChange": "optionChange"; }, never, never, true, never>;
+    protected toggleMobileMenu(): void;
+    protected closeMobileMenu(restoreFocus?: boolean): void;
+    protected selectSearchResult(item: TItem): void;
+    protected focusContent(event: Event): void;
+    openSidebar(): void;
+    closeSidebar(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgLayoutSimple<any>, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgLayoutSimple<any>, "eg-layout-simple", never, { "sidebarEnabled": { "alias": "sidebarEnabled"; "required": false; "isSignal": true; }; "sidebarTitle": { "alias": "sidebarTitle"; "required": false; "isSignal": true; }; "sidebarContent": { "alias": "sidebarContent"; "required": false; "isSignal": true; }; "sidebarToggleLabel": { "alias": "sidebarToggleLabel"; "required": false; "isSignal": true; }; "mobileMenuLabel": { "alias": "mobileMenuLabel"; "required": false; "isSignal": true; }; "mobileMenuCloseLabel": { "alias": "mobileMenuCloseLabel"; "required": false; "isSignal": true; }; "userMenuTrigger": { "alias": "userMenuTrigger"; "required": false; "isSignal": true; }; "userMenuLabel": { "alias": "userMenuLabel"; "required": false; "isSignal": true; }; "primaryNavigation": { "alias": "primaryNavigation"; "required": false; "isSignal": true; }; "navigationGroups": { "alias": "navigationGroups"; "required": false; "isSignal": true; }; "utilityNavigation": { "alias": "utilityNavigation"; "required": false; "isSignal": true; }; "sectionNavigation": { "alias": "sectionNavigation"; "required": false; "isSignal": true; }; "secondaryNavigationGroups": { "alias": "secondaryNavigationGroups"; "required": false; "isSignal": true; }; "flyoutNavigationGroups": { "alias": "flyoutNavigationGroups"; "required": false; "isSignal": true; }; "flyoutNavigationLabel": { "alias": "flyoutNavigationLabel"; "required": false; "isSignal": true; }; "flyoutCloseLabel": { "alias": "flyoutCloseLabel"; "required": false; "isSignal": true; }; "userMenuSections": { "alias": "userMenuSections"; "required": false; "isSignal": true; }; "logo": { "alias": "logo"; "required": false; "isSignal": true; }; "brandName": { "alias": "brandName"; "required": false; "isSignal": true; }; "logoLink": { "alias": "logoLink"; "required": false; "isSignal": true; }; "logoClass": { "alias": "logoClass"; "required": false; "isSignal": true; }; "fullHeight": { "alias": "fullHeight"; "required": false; "isSignal": true; }; "headerClass": { "alias": "headerClass"; "required": false; "isSignal": true; }; "contentClass": { "alias": "contentClass"; "required": false; "isSignal": true; }; "primaryNavigationClass": { "alias": "primaryNavigationClass"; "required": false; "isSignal": true; }; "utilityNavigationClass": { "alias": "utilityNavigationClass"; "required": false; "isSignal": true; }; "sectionNavigationClass": { "alias": "sectionNavigationClass"; "required": false; "isSignal": true; }; "secondaryNavigationClass": { "alias": "secondaryNavigationClass"; "required": false; "isSignal": true; }; "flyoutNavigationClass": { "alias": "flyoutNavigationClass"; "required": false; "isSignal": true; }; "flyoutPanelClass": { "alias": "flyoutPanelClass"; "required": false; "isSignal": true; }; "navigationItemClass": { "alias": "navigationItemClass"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "skipLinkText": { "alias": "skipLinkText"; "required": false; "isSignal": true; }; "searchEnabled": { "alias": "searchEnabled"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "searchEmptyText": { "alias": "searchEmptyText"; "required": false; "isSignal": true; }; "searchErrorText": { "alias": "searchErrorText"; "required": false; "isSignal": true; }; "searchResultTemplate": { "alias": "searchResultTemplate"; "required": false; "isSignal": true; }; "searchLoader": { "alias": "searchLoader"; "required": false; "isSignal": true; }; "searchResultLabel": { "alias": "searchResultLabel"; "required": false; "isSignal": true; }; "footerEnabled": { "alias": "footerEnabled"; "required": false; "isSignal": true; }; "footerNavigation": { "alias": "footerNavigation"; "required": false; "isSignal": true; }; "footerText": { "alias": "footerText"; "required": false; "isSignal": true; }; "footerClass": { "alias": "footerClass"; "required": false; "isSignal": true; }; }, { "searchResultSelected": "searchResultSelected"; }, never, ["*"], true, never>;
 }
 
-export { EgGenericAutocomplete, EgLayoutSimple, EgLayoutSimpleUserMenu };
-export type { AutocompleteOption, MenuGroup, MenuItem, UserMenuItem, UserMenuSection };
+export { EG_LAYOUT_SIMPLE_MOBILE_BREAKPOINT, EgLayoutSearch, EgLayoutSimple, EgLayoutSimpleUserMenu };
+export type { FlyoutMenuGroup, LayoutSearchLoader, LayoutSearchResultContext, MenuGroup, MenuItem, UserMenuItem, UserMenuSection };