@tolle_/tolle-ui 18.2.28 → 18.2.30

package/lib/combobox.component.d.ts

@@ -0,0 +1,90 @@
+import { EventEmitter, ElementRef, ChangeDetectorRef, OnDestroy } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import { type VariantProps } from 'class-variance-authority';
+import { cn } from './utils/cn';
+import * as i0 from "@angular/core";
+declare const comboboxTriggerVariants: (props?: ({
+    size?: "default" | "xs" | "sm" | "lg" | null | undefined;
+    invalid?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type ComboboxProps = VariantProps<typeof comboboxTriggerVariants>;
+export type ComboboxOption = {
+    label: string;
+    value: any;
+    disabled?: boolean;
+    /** Extra terms that should also match this option when searching. */
+    keywords?: string[];
+};
+/**
+ * A searchable single-select: a button that opens a `tolle-command` list in a
+ * floating panel. Implements `ControlValueAccessor`, so it works with
+ * `ngModel` and reactive forms.
+ *
+ * Use `tolle-select` when the list is short and needs no search, and
+ * `tolle-multi-select` when more than one value can be chosen.
+ * @new
+ */
+export declare class ComboboxComponent implements ControlValueAccessor, OnDestroy {
+    private cdr;
+    /** Options to choose from. @default [] */
+    options: ComboboxOption[];
+    /** Text shown on the trigger when nothing is selected. @default 'Select an option…' */
+    placeholder: string;
+    /** Placeholder inside the search box. @default 'Search…' */
+    searchPlaceholder: string;
+    /** Message shown when the query matches no option. @default 'No results found.' */
+    emptyMessage: string;
+    /** Height and text size of the trigger. @default 'default' */
+    size: ComboboxProps['size'];
+    /** Applies the destructive border and focus ring. @default false */
+    invalid: boolean;
+    /** Disables the control. @default false */
+    disabled: boolean;
+    /** Set false to filter the options yourself, e.g. server-side. @default true */
+    shouldFilter: boolean;
+    /** Close the panel after a value is chosen. @default true */
+    closeOnSelect: boolean;
+    /** Where the panel opens relative to the trigger. @default 'bottom-start' */
+    placement: 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end';
+    /** Accessible name when there is no associated visible label. @default '' */
+    ariaLabel: string;
+    /** Extra Tailwind classes merged onto the trigger via `cn()` (last-wins). */
+    class: string;
+    /** Emitted with the chosen value whenever the selection changes. */
+    valueChange: EventEmitter<any>;
+    /** Emitted with the query text as the user searches. */
+    searchChange: EventEmitter<string>;
+    /** Emitted when the panel opens. */
+    opened: EventEmitter<void>;
+    /** Emitted when the panel closes. */
+    closed: EventEmitter<void>;
+    triggerEl?: ElementRef<HTMLElement>;
+    panelEl?: ElementRef<HTMLElement>;
+    readonly panelId: string;
+    value: any;
+    isOpen: boolean;
+    protected cn: typeof cn;
+    private cleanup?;
+    private onChange;
+    private onTouched;
+    constructor(cdr: ChangeDetectorRef);
+    private readonly outsideClickHandler;
+    private readonly escapeHandler;
+    get selectedLabel(): string;
+    get computedTriggerClass(): string;
+    toggle(): void;
+    open(): void;
+    close(): void;
+    onTriggerKeyDown(event: KeyboardEvent): void;
+    onSelect(value: any): void;
+    private updatePosition;
+    private teardown;
+    ngOnDestroy(): void;
+    writeValue(value: any): void;
+    registerOnChange(fn: (value: any) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComboboxComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ComboboxComponent, "tolle-combobox", never, { "options": { "alias": "options"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; }; "size": { "alias": "size"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "shouldFilter": { "alias": "shouldFilter"; "required": false; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, { "valueChange": "valueChange"; "searchChange": "searchChange"; "opened": "opened"; "closed": "closed"; }, never, never, true, never>;
+}
+export {};

package/lib/command-dialog.component.d.ts

@@ -0,0 +1,53 @@
+import { EventEmitter, ElementRef, OnInit, OnDestroy, ChangeDetectorRef } from '@angular/core';
+import { cn } from './utils/cn';
+import * as i0 from "@angular/core";
+/**
+ * The ⌘K command palette: a `tolle-command` in a centred modal overlay.
+ *
+ * Project a full command menu inside:
+ *
+ * ```html
+ * <tolle-command-dialog [(open)]="paletteOpen">
+ *   <tolle-command (selected)="run($event)">
+ *     <tolle-command-input></tolle-command-input>
+ *     <tolle-command-list>…</tolle-command-list>
+ *   </tolle-command>
+ * </tolle-command-dialog>
+ * ```
+ *
+ * Set `shortcut` to bind a global hotkey (default ⌘K / Ctrl+K).
+ * @new
+ */
+export declare class CommandDialogComponent implements OnInit, OnDestroy {
+    private cdr;
+    /** Whether the palette is visible. Supports two-way binding via `[(open)]`. @default false */
+    open: boolean;
+    /**
+     * Global hotkey that toggles the palette, as `mod+key` where `mod` maps to ⌘
+     * on macOS and Ctrl elsewhere. Set to `''` to disable the binding.
+     * @default 'mod+k'
+     */
+    shortcut: string;
+    /** Close the palette when the backdrop is clicked. @default true */
+    closeOnBackdrop: boolean;
+    /** Accessible name for the dialog. @default 'Command palette' */
+    ariaLabel: string;
+    /** Extra Tailwind classes merged onto the panel via `cn()` (last-wins). */
+    class: string;
+    /** Two-way binding partner for `open`. */
+    openChange: EventEmitter<boolean>;
+    /** Emitted when the palette opens. */
+    opened: EventEmitter<void>;
+    /** Emitted when the palette closes. */
+    closed: EventEmitter<void>;
+    panelEl?: ElementRef<HTMLElement>;
+    protected cn: typeof cn;
+    constructor(cdr: ChangeDetectorRef);
+    private readonly onKeyDown;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    onBackdropClick(): void;
+    private setOpen;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CommandDialogComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CommandDialogComponent, "tolle-command-dialog", never, { "open": { "alias": "open"; "required": false; }; "shortcut": { "alias": "shortcut"; "required": false; }; "closeOnBackdrop": { "alias": "closeOnBackdrop"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, { "openChange": "openChange"; "opened": "opened"; "closed": "closed"; }, never, ["*"], true, never>;
+}

package/lib/command.component.d.ts

@@ -0,0 +1,189 @@
+import { EventEmitter, OnInit, OnChanges, OnDestroy } from '@angular/core';
+import { cn } from './utils/cn';
+import * as i0 from "@angular/core";
+/**
+ * A filterable command menu — the list half of a command palette (⌘K),
+ * a searchable dropdown, or an inline action list.
+ *
+ * Compose it from `tolle-command-input`, `tolle-command-list`,
+ * `tolle-command-group`, `tolle-command-item` and `tolle-command-empty`.
+ * Filtering, keyboard navigation and `aria-activedescendant` are handled for
+ * you by the `CommandService` this component provides.
+ *
+ * For the ⌘K modal version use `tolle-command-dialog`; for a form control use
+ * `tolle-combobox`.
+ * @new
+ */
+export declare class CommandComponent implements OnInit, OnChanges, OnDestroy {
+    /**
+     * Set false to keep every item visible and filter the list yourself —
+     * for server-side or fuzzy search. @default true
+     */
+    shouldFilter: boolean;
+    /** Accessible name for the command menu. @default '' */
+    ariaLabel: string;
+    /** Extra Tailwind classes merged onto the menu via `cn()` (last-wins). */
+    class: string;
+    /** Emitted with the chosen item's `value` when the user selects one. */
+    selected: EventEmitter<any>;
+    /** Emitted with the query text whenever the search input changes. */
+    queryChange: EventEmitter<string>;
+    private readonly service;
+    private readonly subscriptions;
+    ngOnInit(): void;
+    ngOnChanges(): void;
+    ngOnDestroy(): void;
+    get computedClass(): string;
+    /**
+     * Menu-level keyboard handling, so the arrows work whether focus is in the
+     * search input or on the menu itself.
+     */
+    onKeyDown(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CommandComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CommandComponent, "tolle-command", never, { "shouldFilter": { "alias": "shouldFilter"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, { "selected": "selected"; "queryChange": "queryChange"; }, never, ["*"], true, never>;
+}
+/** Search box for a `tolle-command`. Typing here drives the filtering. */
+export declare class CommandInputComponent implements OnInit, OnDestroy {
+    /** Placeholder shown when the query is empty. @default 'Type a command or search…' */
+    placeholder: string;
+    /** Accessible name for the search box. @default '' */
+    ariaLabel: string;
+    /** Extra Tailwind classes merged onto the search row via `cn()` (last-wins). */
+    class: string;
+    /** Extra Tailwind classes merged onto the `<input>` itself via `cn()` (last-wins). */
+    inputClass: string;
+    private readonly service;
+    private readonly subscriptions;
+    private readonly cdr;
+    value: string;
+    activeId: string | null;
+    protected cn: typeof cn;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    onInput(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CommandInputComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CommandInputComponent, "tolle-command-input", never, { "placeholder": { "alias": "placeholder"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "class": { "alias": "class"; "required": false; }; "inputClass": { "alias": "inputClass"; "required": false; }; }, {}, never, never, true, never>;
+}
+/** Scrolling container for the command items. */
+export declare class CommandListComponent implements OnChanges {
+    private readonly cdr;
+    /**
+     * Angular writes a bound `class` input through its styling path, which does
+     * not mark an OnPush component dirty — without this hook the component keeps
+     * rendering the class it was born with.
+     */
+    ngOnChanges(): void;
+    /** Accessible name for the list. @default '' */
+    ariaLabel: string;
+    /** Extra Tailwind classes merged onto the list via `cn()` (last-wins). */
+    class: string;
+    protected cn: typeof cn;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CommandListComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CommandListComponent, "tolle-command-list", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+/**
+ * Shown only when the query matches nothing. Renders nothing otherwise, so it
+ * can live in the template permanently.
+ */
+export declare class CommandEmptyComponent implements OnInit, OnDestroy {
+    /** Extra Tailwind classes merged onto the empty state via `cn()` (last-wins). */
+    class: string;
+    private readonly service;
+    private readonly subscriptions;
+    private readonly cdr;
+    isEmpty: boolean;
+    protected cn: typeof cn;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CommandEmptyComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CommandEmptyComponent, "tolle-command-empty", never, { "class": { "alias": "class"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+/**
+ * A labelled section of items. The heading hides itself when filtering removes
+ * every item in the group, so you never get a stranded header.
+ */
+export declare class CommandGroupComponent implements OnInit, OnDestroy {
+    /** Section heading. @default '' */
+    heading: string;
+    /** Extra Tailwind classes merged onto the group via `cn()` (last-wins). */
+    class: string;
+    private readonly service;
+    private readonly subscriptions;
+    private readonly cdr;
+    private readonly memberIds;
+    hidden: boolean;
+    protected cn: typeof cn;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /** Called by child items so the group knows which ids belong to it. */
+    addMember(id: string): void;
+    removeMember(id: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CommandGroupComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CommandGroupComponent, "tolle-command-group", never, { "heading": { "alias": "heading"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+/** A selectable row in a command menu. */
+export declare class CommandItemComponent implements OnInit, OnChanges, OnDestroy {
+    /** Value emitted from the menu's `selected` output when this row is chosen. */
+    value: any;
+    /**
+     * Text matched against the query. Defaults to `value` when omitted — set it
+     * explicitly whenever the row's visible text differs from its value.
+     * @default ''
+     */
+    label: string;
+    /** Extra terms that should also match this row, e.g. synonyms. @default [] */
+    keywords: string[];
+    /** Makes the row unselectable and skipped by the arrow keys. @default false */
+    disabled: boolean;
+    /** Extra Tailwind classes merged onto the row via `cn()` (last-wins). */
+    class: string;
+    /** Emitted when this specific row is chosen. */
+    selected: EventEmitter<any>;
+    private readonly service;
+    private readonly group;
+    private readonly subscriptions;
+    private readonly cdr;
+    readonly id: string;
+    visible: boolean;
+    active: boolean;
+    ngOnInit(): void;
+    ngOnChanges(): void;
+    ngOnDestroy(): void;
+    /** Label plus keywords, so synonyms match without being displayed. */
+    private get searchText();
+    get computedClass(): string;
+    onClick(): void;
+    onMouseEnter(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CommandItemComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CommandItemComponent, "tolle-command-item", never, { "value": { "alias": "value"; "required": false; }; "label": { "alias": "label"; "required": false; }; "keywords": { "alias": "keywords"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, { "selected": "selected"; }, never, ["*"], true, never>;
+}
+/** Divider between command groups. */
+export declare class CommandSeparatorComponent implements OnChanges {
+    private readonly cdr;
+    /**
+     * Angular writes a bound `class` input through its styling path, which does
+     * not mark an OnPush component dirty — without this hook the component keeps
+     * rendering the class it was born with.
+     */
+    ngOnChanges(): void;
+    /** Extra Tailwind classes merged onto the separator via `cn()` (last-wins). */
+    class: string;
+    protected cn: typeof cn;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CommandSeparatorComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CommandSeparatorComponent, "tolle-command-separator", never, { "class": { "alias": "class"; "required": false; }; }, {}, never, never, true, never>;
+}
+/** Right-aligned shortcut hint inside a command item. Pairs with `tolle-kbd`. */
+export declare class CommandShortcutComponent implements OnChanges {
+    private readonly cdr;
+    /**
+     * Angular writes a bound `class` input through its styling path, which does
+     * not mark an OnPush component dirty — without this hook the component keeps
+     * rendering the class it was born with.
+     */
+    ngOnChanges(): void;
+    /** Extra Tailwind classes merged onto the shortcut via `cn()` (last-wins). */
+    class: string;
+    protected cn: typeof cn;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CommandShortcutComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CommandShortcutComponent, "tolle-command-shortcut", never, { "class": { "alias": "class"; "required": false; }; }, {}, never, ["*"], true, never>;
+}

package/lib/command.service.d.ts

@@ -0,0 +1,67 @@
+import * as i0 from "@angular/core";
+/** One registered `tolle-command-item`, as seen by the service. */
+export interface CommandItemState {
+    id: string;
+    /** Text the query is matched against — the item's label plus any `keywords`. */
+    searchText: string;
+    value: any;
+    disabled: boolean;
+    /** Registration order, used to keep the visible list in DOM order. */
+    order: number;
+}
+/**
+ * Coordinates a `tolle-command` and its descendants: owns the query, decides
+ * which items survive filtering, and tracks the active (highlighted) item for
+ * `aria-activedescendant`.
+ *
+ * Provided on `CommandComponent`, so each command menu gets its own instance.
+ */
+export declare class CommandService {
+    private readonly items;
+    private nextOrder;
+    private readonly querySubject;
+    /** Current search query. */
+    readonly query$: import("rxjs").Observable<string>;
+    private readonly visibleSubject;
+    /** Ids of the items surviving the current query, in DOM order. */
+    readonly visible$: import("rxjs").Observable<string[]>;
+    private readonly activeIdSubject;
+    /** Id of the highlighted item, or null when nothing matches. */
+    readonly activeId$: import("rxjs").Observable<string | null>;
+    private readonly selectedSubject;
+    /** Emits the value of the item the user chose. */
+    readonly selected$: import("rxjs").Observable<any>;
+    /**
+     * When set, filtering is left entirely to the consumer — every registered
+     * item stays visible regardless of the query. Use for server-side search.
+     */
+    shouldFilter: boolean;
+    get query(): string;
+    get visibleIds(): string[];
+    get activeId(): string | null;
+    /**
+     * True when there is nothing to show.
+     *
+     * With built-in filtering that means items exist but the query excluded them
+     * all. With `shouldFilter = false` the consumer renders the result set itself,
+     * so "no items registered" IS the empty result — requiring items to exist
+     * would make `tolle-command-empty` permanently invisible in that mode.
+     */
+    get isEmpty(): boolean;
+    register(item: Omit<CommandItemState, 'order'>): void;
+    /** Keeps the stored search text/value in sync when an item's inputs change. */
+    update(id: string, patch: Partial<Omit<CommandItemState, 'id' | 'order'>>): void;
+    unregister(id: string): void;
+    setQuery(query: string): void;
+    isVisible(id: string): boolean;
+    /** Moves the highlight by `delta` positions, wrapping at both ends. */
+    move(delta: number): void;
+    setActive(id: string | null): void;
+    /** Selects the highlighted item, if there is one. */
+    selectActive(): void;
+    selectById(id: string): void;
+    /** Recomputes the visible set and keeps the highlight on something valid. */
+    private recompute;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CommandService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<CommandService>;
+}

package/lib/confirmation.component.d.ts

@@ -0,0 +1,70 @@
+import { EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
+import { type VariantProps } from 'class-variance-authority';
+import * as i0 from "@angular/core";
+/** Whether the user has answered the prompt yet, and how. */
+export type ConfirmationState = 'pending' | 'confirmed' | 'cancelled';
+declare const confirmationVariants: (props?: ({
+    state?: "pending" | "confirmed" | "cancelled" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type ConfirmationProps = VariantProps<typeof confirmationVariants>;
+/**
+ * An inline approve / deny prompt for an agent action that needs a human to
+ * sign off. While `state` is `'pending'` it shows both buttons; once the user
+ * answers — or the host sets `state` — the buttons collapse into a compact
+ * resolved row.
+ *
+ * ```html
+ * <tolle-confirmation
+ *   title="Delete 12 rows from the orders table?"
+ *   description="This cannot be undone."
+ *   (confirmed)="run()"
+ *   (cancelled)="skip()"
+ * ></tolle-confirmation>
+ * ```
+ * @new
+ */
+export declare class ConfirmationComponent implements OnChanges {
+    private readonly cdr;
+    /** Headline describing the action awaiting approval. @default '' */
+    title: string;
+    /** Supporting detail shown under the title. @default '' */
+    description: string;
+    /** Label of the approve button. @default 'Approve' */
+    confirmLabel: string;
+    /** Label of the deny button. @default 'Deny' */
+    cancelLabel: string;
+    /** Text shown in the resolved row after approval. @default 'Approved' */
+    confirmedLabel: string;
+    /** Text shown in the resolved row after denial. @default 'Denied' */
+    cancelledLabel: string;
+    /** Whether the prompt is still open, and how it was answered. @default 'pending' */
+    state: ConfirmationState;
+    /** Blocks both buttons without resolving the prompt. @default false */
+    disabled: boolean;
+    /** Extra Tailwind classes merged onto the prompt via `cn()` (last-wins). */
+    class: string;
+    /** Emitted when the user approves the action. */
+    confirmed: EventEmitter<void>;
+    /** Emitted when the user denies the action. */
+    cancelled: EventEmitter<void>;
+    /**
+     * Set when the user answers, so the prompt resolves on its own without the
+     * host having to bind `state` back. Cleared whenever `state` is pushed in.
+     */
+    private answer;
+    ngOnChanges(changes: SimpleChanges): void;
+    /** The state actually rendered: the user's answer if there is one, else `state`. */
+    get currentState(): ConfirmationState;
+    get resolvedLabel(): string;
+    get iconName(): string;
+    get computedClass(): string;
+    get iconClass(): string;
+    get resolvedClass(): string;
+    get confirmButtonClass(): string;
+    get cancelButtonClass(): string;
+    confirm(): void;
+    cancel(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ConfirmationComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ConfirmationComponent, "tolle-confirmation", never, { "title": { "alias": "title"; "required": false; }; "description": { "alias": "description"; "required": false; }; "confirmLabel": { "alias": "confirmLabel"; "required": false; }; "cancelLabel": { "alias": "cancelLabel"; "required": false; }; "confirmedLabel": { "alias": "confirmedLabel"; "required": false; }; "cancelledLabel": { "alias": "cancelledLabel"; "required": false; }; "state": { "alias": "state"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, { "confirmed": "confirmed"; "cancelled": "cancelled"; }, never, ["*"], true, never>;
+}
+export {};

package/lib/context-menu-trigger.directive.d.ts

@@ -0,0 +1,12 @@
+import { EventEmitter } from '@angular/core';
+import { ContextMenuItem } from './context-menu.service';
+import * as i0 from "@angular/core";
+export declare class ContextMenuTriggerDirective {
+    private elementRef;
+    private contextMenuService;
+    items: ContextMenuItem[];
+    action: EventEmitter<string>;
+    onContextMenu(event: MouseEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ContextMenuTriggerDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ContextMenuTriggerDirective, "[tolleContextMenuTrigger]", never, { "items": { "alias": "tolleContextMenuTrigger"; "required": false; }; }, { "action": "action"; }, never, never, true, never>;
+}

package/lib/context-menu.component.d.ts

@@ -0,0 +1,41 @@
+import { ElementRef, OnDestroy, OnInit, QueryList } from '@angular/core';
+import { ContextMenuItem } from './context-menu.service';
+import { cn } from './utils/cn';
+import * as i0 from "@angular/core";
+export declare class ContextMenuComponent implements OnInit, OnDestroy {
+    private contextMenuService;
+    private elementRef;
+    private cdr;
+    menuElement: ElementRef<HTMLDivElement>;
+    submenuElement: ElementRef<HTMLDivElement>;
+    itemButtons: QueryList<ElementRef<HTMLButtonElement>>;
+    isOpen: boolean;
+    isPositioned: boolean;
+    isSubmenuPositioned: boolean;
+    items: ContextMenuItem[];
+    openSubmenuId: string | null;
+    activeSubmenuTrigger: HTMLElement | null;
+    activeIndex: number;
+    private stateSubscription;
+    private submenuTimeout;
+    protected readonly cn: typeof cn;
+    ngOnInit(): void;
+    get activeSubmenuItems(): ContextMenuItem[];
+    onDocumentEvents(event: MouseEvent): void;
+    positionMenu(): Promise<void>;
+    focusFirstItem(): void;
+    onItemClick(item: ContextMenuItem): void;
+    onItemMouseEnter(item: ContextMenuItem, trigger: HTMLButtonElement): void;
+    onItemMouseLeave(): void;
+    onSubmenuMouseEnter(): void;
+    onSubmenuMouseLeave(): void;
+    private closeSubmenu;
+    private positionSubmenu;
+    onSubItemClick(item: ContextMenuItem): void;
+    onKeyDown(event: KeyboardEvent): void;
+    private navigate;
+    onEscape(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ContextMenuComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ContextMenuComponent, "tolle-context-menu", never, {}, {}, never, never, true, never>;
+}

package/lib/context-menu.service.d.ts

@@ -0,0 +1,38 @@
+import { EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+export type ContextMenuItem = {
+    id?: string;
+    label?: string;
+    icon?: string;
+    disabled?: boolean;
+    destructive?: boolean;
+    separator?: boolean;
+    submenu?: ContextMenuItem[];
+    shortcut?: string;
+    checked?: boolean;
+    type?: 'default' | 'checkbox' | 'radio';
+};
+export type ContextMenuState = {
+    x: number;
+    y: number;
+    items: ContextMenuItem[];
+    isOpen: boolean;
+    triggerElement?: HTMLElement;
+    onAction?: (actionId: string) => void;
+};
+export declare class ContextMenuService {
+    private _state;
+    readonly stateChanged: EventEmitter<ContextMenuState>;
+    open(config: {
+        event: MouseEvent;
+        items?: ContextMenuItem[];
+        triggerElement?: HTMLElement;
+        onAction?: (actionId: string) => void;
+    }): void;
+    close(): void;
+    positionMenu(menuElement: HTMLElement): Promise<void>;
+    positionSubmenu(triggerElement: HTMLElement, submenuElement: HTMLElement): Promise<void>;
+    performAction(actionId: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ContextMenuService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ContextMenuService>;
+}