@ngrdt/menu 0.0.11 → 0.0.14

package/lib/menu-base/rdt-menu-base.component.d.ts

@@ -5,7 +5,7 @@ import { RdtShortcut, RdtShortcutService } from '@ngrdt/shortcuts';
 import { RdtHorizontalDirection, RdtVerticalDirection } from '@ngrdt/utils';
 import { Subscription } from 'rxjs';
 import { RdtMenuOverlayComponent } from '../menu-overlay/rdt-menu-overlay.component';
-import { ParsedRdtMenuItem } from '../private-models';
+import { ParsedRdtMenuItem, RdtMenuExpandedChild, RdtMenuExpandSource } from '../private-models';
 import { ParsedRdtMenuItemWithShortcut, Size } from '../utils';
 import * as i0 from "@angular/core";
 export declare abstract class RdtMenuBaseComponent implements OnInit, OnChanges, AfterViewInit {
@@ -14,6 +14,7 @@ export declare abstract class RdtMenuBaseComponent implements OnInit, OnChanges,
     shortcutMode: 'focus-item' | 'open-submenu';
     closeOnFocusOut: boolean;
     openOnHover: boolean;
+    hitboxMargin: number;
     readonly cd: ChangeDetectorRef;
     readonly destroyRef: DestroyRef;
     protected readonly rdtRouter: RdtRouterService;
@@ -25,8 +26,9 @@ export declare abstract class RdtMenuBaseComponent implements OnInit, OnChanges,
     protected readonly injector: EnvironmentInjector;
     protected children: QueryList<RdtMenuOverlayComponent>;
     protected focusableElements: QueryList<ElementRef<HTMLElement>>;
+    abstract get buttonContainer(): HTMLElement | undefined;
     classes: string;
-    protected expanded: ParsedRdtMenuItem | null;
+    expandedChild: RdtMenuExpandedChild | null;
     protected autofocusSubmenuItem: 'first' | 'last' | null;
     protected parsedItems: ParsedRdtMenuItem[];
     get clientSize(): Size;
@@ -38,6 +40,8 @@ export declare abstract class RdtMenuBaseComponent implements OnInit, OnChanges,
         right: number;
     };
     private _bodyMargin;
+    get buttonContainerRect(): DOMRect | undefined;
+    private _buttonContainerRect?;
     protected allParsedItems: ParsedRdtMenuItem[];
     protected childRoutesMap: Map<ParsedRdtMenuItem, string[][]>;
     protected shortcutSub: Subscription;
@@ -53,7 +57,6 @@ export declare abstract class RdtMenuBaseComponent implements OnInit, OnChanges,
     closeSubmenus(focusExpanded?: boolean): void;
     protected onItemClick(item: ParsedRdtMenuItem): void;
     protected onItemPointerEnter(item: ParsedRdtMenuItem): void;
-    protected onItemPointerLeave(item: ParsedRdtMenuItem): void;
     protected onKeyDown(itemIndex: number, event: KeyboardEvent): void;
     protected invokeItemClick(item: ParsedRdtMenuItem): void;
     protected filterItems(): void;
@@ -62,24 +65,39 @@ export declare abstract class RdtMenuBaseComponent implements OnInit, OnChanges,
         params: Record<string, any>;
     }): ParsedRdtMenuItem[];
     protected invokeItemClickByIndex(itemIndex: number): void;
-    protected openSubmenu(itemIndex: number, visibleFocus: 'first' | 'last'): void;
+    protected openSubmenu(itemIndex: number, visibleFocus: 'first' | 'last', src: RdtMenuExpandSource): void;
     protected focusItem(item: number | ParsedRdtMenuItem): void;
     protected focusNextItem(itemIndex: number): void;
     protected focusPrevItem(itemIndex: number): void;
     protected blurAllFocusable(): void;
     protected focusFocusable(itemIndex: number): void;
+    protected onPointerMove(event: PointerEvent): void;
     protected checkActiveElement(event: FocusEvent): void;
     protected onDocumentClick(event: PointerEvent): void;
     protected measure(): void;
     protected readMargin(): void;
     protected measureClientSize(): void;
+    protected measureButtonContainer(): void;
     protected listenWindowResize(): void;
     protected listenShortcuts(): void;
     protected getShortcutMap(itemsWithShortcuts: ParsedRdtMenuItemWithShortcut[]): Record<string, ParsedRdtMenuItem[]>;
     protected onShortcut(shortcut: RdtShortcut): void;
-    protected activateItemRecursively(path: ParsedRdtMenuItem[]): void;
+    protected activateItemRecursively(path: ParsedRdtMenuItem[], src: RdtMenuExpandSource): void;
+    isPointerInsideHitbox(hitbox: DOMRect, event: PointerEvent): boolean;
+    getHitboxes(): {
+        rect: DOMRect;
+        fixed: boolean;
+        close: () => void;
+    }[];
+    getOpenMenuBoundingBoxes(): {
+        rect: DOMRect;
+        fixed: boolean;
+        close: () => void;
+    }[];
+    private getOpenMenuBoundingBoxesRec;
     static ɵfac: i0.ɵɵFactoryDeclaration<RdtMenuBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RdtMenuBaseComponent, never, never, { "preferredVerticalDir": { "alias": "preferredVerticalDir"; "required": false; }; "preferredHorizontalDir": { "alias": "preferredHorizontalDir"; "required": false; }; "shortcutMode": { "alias": "shortcutMode"; "required": false; }; "closeOnFocusOut": { "alias": "closeOnFocusOut"; "required": false; }; "openOnHover": { "alias": "openOnHover"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<RdtMenuBaseComponent, never, never, { "preferredVerticalDir": { "alias": "preferredVerticalDir"; "required": false; }; "preferredHorizontalDir": { "alias": "preferredHorizontalDir"; "required": false; }; "shortcutMode": { "alias": "shortcutMode"; "required": false; }; "closeOnFocusOut": { "alias": "closeOnFocusOut"; "required": false; }; "openOnHover": { "alias": "openOnHover"; "required": false; }; "hitboxMargin": { "alias": "hitboxMargin"; "required": false; }; }, {}, never, never, false, never>;
     static ngAcceptInputType_closeOnFocusOut: unknown;
     static ngAcceptInputType_openOnHover: unknown;
+    static ngAcceptInputType_hitboxMargin: unknown;
 }

package/lib/menu-overlay/rdt-menu-overlay.component.d.ts

@@ -1,6 +1,6 @@
-import { AfterViewInit, DestroyRef, ElementRef, OnChanges, OnInit, SimpleChanges } from '@angular/core';
+import { AfterViewInit, DestroyRef, ElementRef, OnChanges, OnInit, QueryList, SimpleChanges } from '@angular/core';
 import { RdtHorizontalDirection, RdtVerticalDirection } from '@ngrdt/utils';
-import { ParsedRdtMenuItem, ParsedRdtMenuItemWithChildren } from '../private-models';
+import { ParsedRdtMenuItem, ParsedRdtMenuItemWithChildren, RdtMenuExpandSource } from '../private-models';
 import { HorDirWithOffset, VertDirWithOffset } from '../utils';
 import * as i0 from "@angular/core";
 export declare class RdtMenuOverlayComponent implements OnInit, OnChanges, AfterViewInit {
@@ -13,7 +13,7 @@ export declare class RdtMenuOverlayComponent implements OnInit, OnChanges, After
     private readonly router;
     private readonly document;
     private readonly shortcutService;
-    private children;
+    readonly children: QueryList<RdtMenuOverlayComponent>;
     private focusableElements;
     private menuItemContainer;
     item: ParsedRdtMenuItemWithChildren;
@@ -34,11 +34,15 @@ export declare class RdtMenuOverlayComponent implements OnInit, OnChanges, After
     private _viewWasInit;
     protected verticalDir: VertDirWithOffset | null;
     protected horizontalDir: HorDirWithOffset | null;
-    protected expandedChild: ParsedRdtMenuItem | null;
+    protected expandedChild: {
+        item: ParsedRdtMenuItem;
+        src: RdtMenuExpandSource;
+    } | null;
     protected autofocusSubmenuItem: 'first' | 'last' | null;
     readonly keyActions: {
         [x: string]: (index: number) => void;
     };
+    get selfExpandSrc(): RdtMenuExpandSource | undefined;
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
@@ -48,7 +52,6 @@ export declare class RdtMenuOverlayComponent implements OnInit, OnChanges, After
     private getMaxOffsetTop;
     recalculatePosition(preferredHorizontalDir: RdtHorizontalDirection, preferredVerticalDir: RdtVerticalDirection): void;
     onItemPointerEnter(item: ParsedRdtMenuItem): void;
-    onItemPointerLeave(item: ParsedRdtMenuItem): void;
     onItemClick(item: ParsedRdtMenuItem): void;
     invokeItemClick(item: ParsedRdtMenuItem): void;
     getChildRoutes(item: ParsedRdtMenuItem): string[][];
@@ -64,7 +67,7 @@ export declare class RdtMenuOverlayComponent implements OnInit, OnChanges, After
     private focusNextItem;
     private focusPrevItem;
     private openSubmenu;
-    private closeSelf;
+    closeSelf(focusExpanded?: boolean): void;
     private checkActiveElement;
     private getRealHorizontalDir;
     private getNarrowScreenHorizontalDir;

package/lib/private-models.d.ts

@@ -1,8 +1,8 @@
+import { Injector } from '@angular/core';
 import { RdtRoute } from '@ngrdt/router';
 import { RdtShortcut } from '@ngrdt/shortcuts';
 import { WindowOpenTargetType } from '@ngrdt/utils';
 import { RdtMenuItem } from './models';
-import { Injector } from '@angular/core';
 export interface RdtMenuItemBase<TIcon = string> {
     label: string;
     icon?: TIcon;
@@ -15,24 +15,24 @@ export interface RdtMenuItemBase<TIcon = string> {
     requiredParent?: RdtRoute;
     dataTestId?: string;
 }
-export interface ParsedRdtMenuItemWithChildren<TIcon = string> extends RdtMenuItemBase<TIcon> {
-    items: ParsedRdtMenuItem[];
+export interface ParsedRdtMenuItemBase<TIcon = string> extends RdtMenuItemBase<TIcon> {
     dataTestId: string;
+}
+export interface ParsedRdtMenuItemWithChildren<TIcon = string> extends ParsedRdtMenuItemBase<TIcon> {
+    items: ParsedRdtMenuItem[];
     routerLink?: never;
     externalLink?: never;
     icon?: never;
     target?: never;
 }
-export interface ParsedRdtMenuItemWithRoute<TIcon = string> extends RdtMenuItemBase<TIcon> {
-    dataTestId: string;
+export interface ParsedRdtMenuItemWithRoute<TIcon = string> extends ParsedRdtMenuItemBase<TIcon> {
     items?: never;
     routerLink?: string[];
     externalLink?: never;
     icon?: TIcon;
     target: WindowOpenTargetType;
 }
-export interface ParsedRdtMenuItemWithLink<TIcon = string> extends RdtMenuItemBase<TIcon> {
-    dataTestId: string;
+export interface ParsedRdtMenuItemWithLink<TIcon = string> extends ParsedRdtMenuItemBase<TIcon> {
     items?: never;
     routerLink?: never;
     externalLink?: string;
@@ -41,3 +41,13 @@ export interface ParsedRdtMenuItemWithLink<TIcon = string> extends RdtMenuItemBa
 }
 export type ParsedRdtMenuItem = ParsedRdtMenuItemWithRoute | ParsedRdtMenuItemWithChildren | ParsedRdtMenuItemWithLink;
 export declare function parseMenuItems(items: RdtMenuItem[], injector: Injector, prefix?: string): ParsedRdtMenuItem[];
+export declare enum RdtMenuExpandSource {
+    Click = 0,
+    Hover = 1,
+    Shortcut = 2,
+    Focus = 3
+}
+export interface RdtMenuExpandedChild {
+    item: ParsedRdtMenuItem;
+    src: RdtMenuExpandSource;
+}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@ngrdt/menu",
-  "version": "0.0.11",
+  "version": "0.0.14",
   "peerDependencies": {
     "@angular/common": ">=18.2.0",
     "@angular/core": ">=18.2.0",
     "@angular/router": ">=18.2.0",
     "rxjs": ">=7.0.0",
-    "@ngrdt/router": ">=0.0.12",
+    "@ngrdt/router": ">=0.0.13",
     "@ngrdt/utils": ">=0.0.8",
     "@ngrdt/button": ">=0.0.2",
     "@ngrdt/shortcuts": ">=0.0.7"