@wirekyt/angular 0.0.31 → 0.0.32

package/dist/fesm2022/wirekyt-angular-menu.mjs

@@ -0,0 +1,1041 @@
+import * as menu from '@wirekyt/dom/machines/menu';
+export { anatomy as menuAnatomy } from '@wirekyt/dom/machines/menu';
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, input, model, booleanAttribute, output, EnvironmentInjector, Injector, computed, DestroyRef, afterNextRender, forwardRef, Directive, Renderer2, ElementRef, TemplateRef, ViewContainerRef, effect, untracked } from '@angular/core';
+import { injectLocale, injectEnvironment, createId, useMachine, buildRootCarrier, bindProps } from '@wirekyt/angular';
+import { PresenceBase, PRESENCE_CONTEXT, injectPresenceContext } from '@wirekyt/angular/presence';
+
+const MENU_CONTEXT = new InjectionToken("WIREKYT.MENU_CONTEXT");
+function injectMenuContext() {
+    return inject(MENU_CONTEXT);
+}
+const MENU_CONTEXT_CARRIER = new InjectionToken("WIREKYT.MENU_CONTEXT_CARRIER");
+function injectMenuContextCarrier() {
+    return inject(MENU_CONTEXT_CARRIER);
+}
+
+function useMenu(options) {
+    const locale = injectLocale();
+    const environment = injectEnvironment();
+    const fallbackId = createId();
+    return useMachine({
+        machine: menu.machine,
+        context: () => {
+            const props = options.context();
+            return {
+                ...props,
+                dir: locale.dir,
+                getRootNode: environment.getRootNode,
+                id: props.id ?? fallbackId,
+            };
+        },
+        connect: (service, normalize) => menu.connect(service, normalize),
+    });
+}
+
+const MENU_TRIGGER_ITEM_CONTEXT = new InjectionToken("WIREKYT.MENU_TRIGGER_ITEM_CONTEXT");
+function injectMenuTriggerItemContext() {
+    return inject(MENU_TRIGGER_ITEM_CONTEXT);
+}
+
+class MenuRoot extends PresenceBase {
+    id = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    ids = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ids" }] : /* istanbul ignore next */ []));
+    open = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    defaultOpen = input(false, { ...(ngDevMode ? { debugName: "defaultOpen" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    highlightedValue = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "highlightedValue" }] : /* istanbul ignore next */ []));
+    defaultHighlightedValue = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "defaultHighlightedValue" }] : /* istanbul ignore next */ []));
+    loopFocus = input(false, { ...(ngDevMode ? { debugName: "loopFocus" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    closeOnSelect = input(undefined, { ...(ngDevMode ? { debugName: "closeOnSelect" } : /* istanbul ignore next */ {}), transform: optionalBooleanAttribute });
+    typeahead = input(undefined, { ...(ngDevMode ? { debugName: "typeahead" } : /* istanbul ignore next */ {}), transform: optionalBooleanAttribute });
+    composite = input(undefined, { ...(ngDevMode ? { debugName: "composite" } : /* istanbul ignore next */ {}), transform: optionalBooleanAttribute });
+    positioning = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "positioning" }] : /* istanbul ignore next */ []));
+    ariaLabel = input(undefined, { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: "aria-label" });
+    anchorPoint = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "anchorPoint" }] : /* istanbul ignore next */ []));
+    navigate = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "navigate" }] : /* istanbul ignore next */ []));
+    triggerValue = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "triggerValue" }] : /* istanbul ignore next */ []));
+    defaultTriggerValue = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "defaultTriggerValue" }] : /* istanbul ignore next */ []));
+    select = output();
+    escapeKeyDown = output();
+    focusOutside = output();
+    highlightChange = output();
+    interactOutside = output();
+    openChangeDetails = output();
+    pointerDownOutside = output();
+    requestDismiss = output();
+    triggerValueChangeDetails = output();
+    machine = useMenu({
+        context: () => ({
+            id: this.id(),
+            ids: this.ids(),
+            open: this.open(),
+            defaultOpen: this.defaultOpen(),
+            highlightedValue: this.highlightedValue(),
+            defaultHighlightedValue: this.defaultHighlightedValue(),
+            loopFocus: this.loopFocus(),
+            closeOnSelect: this.closeOnSelect(),
+            typeahead: this.typeahead(),
+            composite: this.composite(),
+            positioning: this.positioning(),
+            "aria-label": this.ariaLabel(),
+            anchorPoint: this.anchorPoint(),
+            navigate: this.navigate(),
+            triggerValue: this.triggerValue(),
+            defaultTriggerValue: this.defaultTriggerValue(),
+            onOpenChange: (details) => {
+                if (this.open() !== details.open)
+                    this.open.set(details.open);
+                this.openChangeDetails.emit(details);
+            },
+            onHighlightChange: (details) => {
+                if (this.highlightedValue() !== details.highlightedValue) {
+                    this.highlightedValue.set(details.highlightedValue);
+                }
+                this.highlightChange.emit(details);
+            },
+            onSelect: (details) => {
+                this.select.emit(details);
+            },
+            onTriggerValueChange: (details) => {
+                if (this.triggerValue() !== details.value)
+                    this.triggerValue.set(details.value);
+                this.triggerValueChangeDetails.emit(details);
+            },
+            onEscapeKeyDown: (event) => this.escapeKeyDown.emit(event),
+            onFocusOutside: (event) => this.focusOutside.emit(event),
+            onInteractOutside: (event) => this.interactOutside.emit(event),
+            onPointerDownOutside: (event) => this.pointerDownOutside.emit(event),
+            onRequestDismiss: (event) => this.requestDismiss.emit(event),
+        }),
+    });
+    state = this.machine.state;
+    api = this.machine.api;
+    service = this.machine.service;
+    send = this.machine.send;
+    presence = this.createPresence(() => this.api().open);
+    contextCarrier = buildRootCarrier({
+        providers: [{ provide: PRESENCE_CONTEXT, useValue: this.presence }],
+        root: this,
+        rootToken: MENU_CONTEXT,
+        originInjector: inject(Injector),
+        environmentInjector: inject(EnvironmentInjector),
+    });
+    parentMenu = inject(MENU_CONTEXT, {
+        optional: true,
+        skipSelf: true,
+    });
+    triggerItemProps = computed(() => this.parentMenu?.api().getTriggerItemProps(this.api()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "triggerItemProps" }] : /* istanbul ignore next */ []));
+    constructor() {
+        super();
+        const parent = this.parentMenu;
+        if (parent) {
+            const destroyRef = inject(DestroyRef);
+            let connected = false;
+            let destroyed = false;
+            destroyRef.onDestroy(() => {
+                destroyed = true;
+                if (!connected)
+                    return;
+                const childId = this.machine.service.prop("id");
+                if (!childId)
+                    return;
+                const children = parent.service.refs.get("children");
+                const nextChildren = { ...children };
+                delete nextChildren[childId];
+                parent.service.refs.set("children", nextChildren);
+                this.machine.service.refs.set("parent", null);
+                this.machine.service.context.set("isSubmenu", false);
+            });
+            afterNextRender(() => {
+                if (destroyed)
+                    return;
+                parent.api().setChild(this.machine.service);
+                this.machine.api().setParent(parent.service);
+                connected = true;
+            });
+        }
+    }
+    getContextCarrier() {
+        return this.contextCarrier;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuRoot, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: MenuRoot, isStandalone: true, selector: "[menu-root]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, ids: { classPropertyName: "ids", publicName: "ids", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, highlightedValue: { classPropertyName: "highlightedValue", publicName: "highlightedValue", isSignal: true, isRequired: false, transformFunction: null }, defaultHighlightedValue: { classPropertyName: "defaultHighlightedValue", publicName: "defaultHighlightedValue", isSignal: true, isRequired: false, transformFunction: null }, loopFocus: { classPropertyName: "loopFocus", publicName: "loopFocus", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null }, typeahead: { classPropertyName: "typeahead", publicName: "typeahead", isSignal: true, isRequired: false, transformFunction: null }, composite: { classPropertyName: "composite", publicName: "composite", isSignal: true, isRequired: false, transformFunction: null }, positioning: { classPropertyName: "positioning", publicName: "positioning", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, anchorPoint: { classPropertyName: "anchorPoint", publicName: "anchorPoint", isSignal: true, isRequired: false, transformFunction: null }, navigate: { classPropertyName: "navigate", publicName: "navigate", isSignal: true, isRequired: false, transformFunction: null }, triggerValue: { classPropertyName: "triggerValue", publicName: "triggerValue", isSignal: true, isRequired: false, transformFunction: null }, defaultTriggerValue: { classPropertyName: "defaultTriggerValue", publicName: "defaultTriggerValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", highlightedValue: "highlightedValueChange", triggerValue: "triggerValueChange", select: "select", escapeKeyDown: "escapeKeyDown", focusOutside: "focusOutside", highlightChange: "highlightChange", interactOutside: "interactOutside", openChangeDetails: "openChangeDetails", pointerDownOutside: "pointerDownOutside", requestDismiss: "requestDismiss", triggerValueChangeDetails: "triggerValueChangeDetails" }, providers: [
+            {
+                provide: PRESENCE_CONTEXT,
+                useFactory: (root) => root.presence,
+                deps: [forwardRef(() => MenuRoot)],
+            },
+            { provide: MENU_CONTEXT, useExisting: forwardRef(() => MenuRoot) },
+            {
+                provide: MENU_TRIGGER_ITEM_CONTEXT,
+                useFactory: (root) => root.triggerItemProps,
+                deps: [forwardRef(() => MenuRoot)],
+            },
+            {
+                provide: MENU_CONTEXT_CARRIER,
+                useFactory: (root) => root.getContextCarrier(),
+                deps: [forwardRef(() => MenuRoot)],
+            },
+        ], exportAs: ["menuRoot"], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuRoot, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-root]",
+                    standalone: true,
+                    exportAs: "menuRoot",
+                    providers: [
+                        {
+                            provide: PRESENCE_CONTEXT,
+                            useFactory: (root) => root.presence,
+                            deps: [forwardRef(() => MenuRoot)],
+                        },
+                        { provide: MENU_CONTEXT, useExisting: forwardRef(() => MenuRoot) },
+                        {
+                            provide: MENU_TRIGGER_ITEM_CONTEXT,
+                            useFactory: (root) => root.triggerItemProps,
+                            deps: [forwardRef(() => MenuRoot)],
+                        },
+                        {
+                            provide: MENU_CONTEXT_CARRIER,
+                            useFactory: (root) => root.getContextCarrier(),
+                            deps: [forwardRef(() => MenuRoot)],
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], ids: [{ type: i0.Input, args: [{ isSignal: true, alias: "ids", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], highlightedValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlightedValue", required: false }] }, { type: i0.Output, args: ["highlightedValueChange"] }], defaultHighlightedValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultHighlightedValue", required: false }] }], loopFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "loopFocus", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }], typeahead: [{ type: i0.Input, args: [{ isSignal: true, alias: "typeahead", required: false }] }], composite: [{ type: i0.Input, args: [{ isSignal: true, alias: "composite", required: false }] }], positioning: [{ type: i0.Input, args: [{ isSignal: true, alias: "positioning", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], anchorPoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "anchorPoint", required: false }] }], navigate: [{ type: i0.Input, args: [{ isSignal: true, alias: "navigate", required: false }] }], triggerValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "triggerValue", required: false }] }, { type: i0.Output, args: ["triggerValueChange"] }], defaultTriggerValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultTriggerValue", required: false }] }], select: [{ type: i0.Output, args: ["select"] }], escapeKeyDown: [{ type: i0.Output, args: ["escapeKeyDown"] }], focusOutside: [{ type: i0.Output, args: ["focusOutside"] }], highlightChange: [{ type: i0.Output, args: ["highlightChange"] }], interactOutside: [{ type: i0.Output, args: ["interactOutside"] }], openChangeDetails: [{ type: i0.Output, args: ["openChangeDetails"] }], pointerDownOutside: [{ type: i0.Output, args: ["pointerDownOutside"] }], requestDismiss: [{ type: i0.Output, args: ["requestDismiss"] }], triggerValueChangeDetails: [{ type: i0.Output, args: ["triggerValueChangeDetails"] }] } });
+function optionalBooleanAttribute(value) {
+    return value === undefined || value === null ? undefined : booleanAttribute(value);
+}
+
+class MenuRootProvider extends PresenceBase {
+    value = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    state = computed(() => this.value().state(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+    api = computed(() => this.value().api(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "api" }] : /* istanbul ignore next */ []));
+    send = (event) => this.value().send(event);
+    get service() {
+        return this.value().service;
+    }
+    presence = this.createPresence(() => {
+        try {
+            return this.api().open;
+        }
+        catch {
+            return false;
+        }
+    });
+    contextCarrier = buildRootCarrier({
+        providers: [{ provide: PRESENCE_CONTEXT, useValue: this.presence }],
+        root: this,
+        rootToken: MENU_CONTEXT,
+        originInjector: inject(Injector),
+        environmentInjector: inject(EnvironmentInjector),
+    });
+    parentMenu = inject(MENU_CONTEXT, {
+        optional: true,
+        skipSelf: true,
+    });
+    triggerItemProps = computed(() => this.parentMenu?.api().getTriggerItemProps(this.api()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "triggerItemProps" }] : /* istanbul ignore next */ []));
+    constructor() {
+        super();
+        const parent = this.parentMenu;
+        if (!parent)
+            return;
+        const destroyRef = inject(DestroyRef);
+        let connected = false;
+        let destroyed = false;
+        destroyRef.onDestroy(() => {
+            destroyed = true;
+            if (!connected)
+                return;
+            const childId = this.service.prop("id");
+            if (!childId)
+                return;
+            const children = parent.service.refs.get("children");
+            const nextChildren = { ...children };
+            delete nextChildren[childId];
+            parent.service.refs.set("children", nextChildren);
+            this.service.refs.set("parent", null);
+            this.service.context.set("isSubmenu", false);
+        });
+        afterNextRender(() => {
+            if (destroyed)
+                return;
+            parent.api().setChild(this.service);
+            this.api().setParent(parent.service);
+            connected = true;
+        });
+    }
+    getContextCarrier() {
+        return this.contextCarrier;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuRootProvider, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: MenuRootProvider, isStandalone: true, selector: "[menu-root-provider]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
+            {
+                provide: PRESENCE_CONTEXT,
+                useFactory: (provider) => provider.presence,
+                deps: [forwardRef(() => MenuRootProvider)],
+            },
+            { provide: MENU_CONTEXT, useExisting: forwardRef(() => MenuRootProvider) },
+            {
+                provide: MENU_TRIGGER_ITEM_CONTEXT,
+                useFactory: (provider) => provider.triggerItemProps,
+                deps: [forwardRef(() => MenuRootProvider)],
+            },
+            {
+                provide: MENU_CONTEXT_CARRIER,
+                useFactory: (provider) => provider.getContextCarrier(),
+                deps: [forwardRef(() => MenuRootProvider)],
+            },
+        ], exportAs: ["menuRootProvider"], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuRootProvider, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-root-provider]",
+                    standalone: true,
+                    exportAs: "menuRootProvider",
+                    providers: [
+                        {
+                            provide: PRESENCE_CONTEXT,
+                            useFactory: (provider) => provider.presence,
+                            deps: [forwardRef(() => MenuRootProvider)],
+                        },
+                        { provide: MENU_CONTEXT, useExisting: forwardRef(() => MenuRootProvider) },
+                        {
+                            provide: MENU_TRIGGER_ITEM_CONTEXT,
+                            useFactory: (provider) => provider.triggerItemProps,
+                            deps: [forwardRef(() => MenuRootProvider)],
+                        },
+                        {
+                            provide: MENU_CONTEXT_CARRIER,
+                            useFactory: (provider) => provider.getContextCarrier(),
+                            deps: [forwardRef(() => MenuRootProvider)],
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }] } });
+
+class MenuTrigger {
+    value = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const context = injectMenuContext();
+        const presence = injectPresenceContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => {
+                const props = context.api().getTriggerProps({ value: this.value() });
+                return {
+                    ...props,
+                    "aria-controls": presence.unmounted() ? undefined : props["aria-controls"],
+                };
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: MenuTrigger, isStandalone: true, selector: "[menu-trigger]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["menuTrigger"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuTrigger, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-trigger]",
+                    standalone: true,
+                    exportAs: "menuTrigger",
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }] } });
+
+class MenuContextTrigger {
+    value = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const context = injectMenuContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getContextTriggerProps({ value: this.value() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuContextTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: MenuContextTrigger, isStandalone: true, selector: "[menu-context-trigger]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["menuContextTrigger"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuContextTrigger, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-context-trigger]",
+                    standalone: true,
+                    exportAs: "menuContextTrigger",
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }] } });
+
+class MenuPositioner {
+    constructor() {
+        const context = injectMenuContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getPositionerProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuPositioner, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuPositioner, isStandalone: true, selector: "[menu-positioner]", exportAs: ["menuPositioner"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuPositioner, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-positioner]",
+                    standalone: true,
+                    exportAs: "menuPositioner",
+                }]
+        }], ctorParameters: () => [] });
+
+class MenuContent {
+    constructor() {
+        const context = injectMenuContext();
+        const presence = injectPresenceContext();
+        const template = inject((TemplateRef), { optional: true });
+        const container = inject(ViewContainerRef);
+        const host = inject(ElementRef);
+        const elementRef = template ? { nativeElement: null } : host;
+        let view;
+        effect(() => {
+            const unmounted = presence.unmounted();
+            if (template) {
+                if (unmounted) {
+                    elementRef.nativeElement = null;
+                    container.clear();
+                    view = undefined;
+                }
+                else if (!view) {
+                    view = container.createEmbeddedView(template);
+                    elementRef.nativeElement =
+                        view.rootNodes.find((node) => node.nodeType === 1) ?? null;
+                }
+            }
+            untracked(() => presence.setNode(elementRef.nativeElement));
+        });
+        bindProps({
+            elementRef,
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => {
+                presence.unmounted();
+                return { ...context.api().getContentProps(), ...presence.getPresenceProps() };
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuContent, isStandalone: true, selector: "[menu-content]", exportAs: ["menuContent"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuContent, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-content]",
+                    standalone: true,
+                    exportAs: "menuContent",
+                }]
+        }], ctorParameters: () => [] });
+
+const MENU_ITEM_CONTEXT = new InjectionToken("WIREKYT.MENU_ITEM_CONTEXT");
+function injectMenuItemContext() {
+    return inject(MENU_ITEM_CONTEXT);
+}
+
+const MENU_ITEM_PROPS_CONTEXT = new InjectionToken("WIREKYT.MENU_ITEM_PROPS_CONTEXT");
+function injectMenuItemPropsContext() {
+    return inject(MENU_ITEM_PROPS_CONTEXT);
+}
+
+class MenuItem {
+    value = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    valueText = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "valueText" }] : /* istanbul ignore next */ []));
+    closeOnSelect = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "closeOnSelect" }] : /* istanbul ignore next */ []));
+    select = output();
+    context = injectMenuContext();
+    api = computed(() => this.context.api(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "api" }] : /* istanbul ignore next */ []));
+    checked = computed(() => undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
+    itemProps = computed(() => ({
+        value: this.value(),
+        disabled: this.disabled(),
+        valueText: this.valueText(),
+        closeOnSelect: this.closeOnSelect(),
+    }), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "itemProps" }] : /* istanbul ignore next */ []));
+    state = computed(() => this.context.api().getItemState(this.itemProps()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+    highlighted = computed(() => this.state().highlighted, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "highlighted" }] : /* istanbul ignore next */ []));
+    itemId = computed(() => this.state().id, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "itemId" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const destroyRef = inject(DestroyRef);
+        const elementRef = inject(ElementRef);
+        const renderer = inject(Renderer2);
+        bindProps({
+            elementRef,
+            renderer,
+            destroyRef,
+            props: () => this.context.api().getItemProps(this.itemProps()),
+        });
+        let dispose;
+        let destroyed = false;
+        destroyRef.onDestroy(() => {
+            destroyed = true;
+            dispose?.();
+        });
+        afterNextRender(() => {
+            if (destroyed)
+                return;
+            dispose = this.context
+                .api()
+                .addItemListener({ id: this.state().id, onSelect: () => this.select.emit() });
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: MenuItem, isStandalone: true, selector: "[menu-item]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, valueText: { classPropertyName: "valueText", publicName: "valueText", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { select: "select" }, providers: [
+            { provide: MENU_ITEM_CONTEXT, useExisting: forwardRef(() => MenuItem) },
+            {
+                provide: MENU_ITEM_PROPS_CONTEXT,
+                useFactory: (item) => item.itemProps,
+                deps: [forwardRef(() => MenuItem)],
+            },
+        ], exportAs: ["menuItem"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItem, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-item]",
+                    standalone: true,
+                    exportAs: "menuItem",
+                    providers: [
+                        { provide: MENU_ITEM_CONTEXT, useExisting: forwardRef(() => MenuItem) },
+                        {
+                            provide: MENU_ITEM_PROPS_CONTEXT,
+                            useFactory: (item) => item.itemProps,
+                            deps: [forwardRef(() => MenuItem)],
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], valueText: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueText", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }], select: [{ type: i0.Output, args: ["select"] }] } });
+
+class MenuContext {
+    static ngTemplateContextGuard(_directive, context) {
+        void context;
+        return true;
+    }
+    menu = injectMenuContext();
+    templateRef = inject(TemplateRef);
+    viewContainer = inject(ViewContainerRef);
+    constructor() {
+        const view = this.viewContainer.createEmbeddedView(this.templateRef, {
+            $implicit: this.menu.api,
+            api: this.menu.api,
+        });
+        effect(() => {
+            this.menu.api();
+            view.detectChanges();
+        });
+        inject(DestroyRef).onDestroy(() => view.destroy());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuContext, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuContext, isStandalone: true, selector: "[menu-context]", exportAs: ["menuContext"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuContext, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-context]",
+                    standalone: true,
+                    exportAs: "menuContext",
+                }]
+        }], ctorParameters: () => [] });
+
+class MenuItemContextDirective {
+    static ngTemplateContextGuard(_directive, context) {
+        void context;
+        return true;
+    }
+    item = injectMenuItemContext();
+    templateRef = inject(TemplateRef);
+    viewContainer = inject(ViewContainerRef);
+    constructor() {
+        const view = this.viewContainer.createEmbeddedView(this.templateRef, {
+            $implicit: this.item,
+            item: this.item,
+        });
+        effect(() => {
+            this.item.state();
+            view.detectChanges();
+        });
+        inject(DestroyRef).onDestroy(() => view.destroy());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItemContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuItemContextDirective, isStandalone: true, selector: "[menu-item-context]", exportAs: ["menuItemContext"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItemContextDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-item-context]",
+                    standalone: true,
+                    exportAs: "menuItemContext",
+                }]
+        }], ctorParameters: () => [] });
+
+class MenuItemText {
+    value = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    valueText = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "valueText" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const context = injectMenuContext();
+        const item = inject(MENU_ITEM_CONTEXT, { optional: true });
+        const itemProps = inject(MENU_ITEM_PROPS_CONTEXT, { optional: true });
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getItemTextProps(itemProps?.() ?? {
+                value: item?.value() ?? this.value() ?? "",
+                disabled: item?.disabled() ?? this.disabled(),
+                valueText: item?.valueText() ?? this.valueText(),
+                ...(item?.checked() !== undefined ? { checked: item.checked() } : {}),
+            }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItemText, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: MenuItemText, isStandalone: true, selector: "[menu-item-text]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, valueText: { classPropertyName: "valueText", publicName: "valueText", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["menuItemText"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItemText, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-item-text]",
+                    standalone: true,
+                    exportAs: "menuItemText",
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], valueText: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueText", required: false }] }] } });
+
+class MenuSeparator {
+    constructor() {
+        const context = injectMenuContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getSeparatorProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuSeparator, isStandalone: true, selector: "[menu-separator]", exportAs: ["menuSeparator"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuSeparator, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-separator]",
+                    standalone: true,
+                    exportAs: "menuSeparator",
+                }]
+        }], ctorParameters: () => [] });
+
+class MenuIndicator {
+    constructor() {
+        const context = injectMenuContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getIndicatorProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuIndicator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuIndicator, isStandalone: true, selector: "[menu-indicator]", exportAs: ["menuIndicator"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuIndicator, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-indicator]",
+                    standalone: true,
+                    exportAs: "menuIndicator",
+                }]
+        }], ctorParameters: () => [] });
+
+class MenuArrow {
+    constructor() {
+        const context = injectMenuContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getArrowProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuArrow, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuArrow, isStandalone: true, selector: "[menu-arrow]", exportAs: ["menuArrow"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuArrow, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-arrow]",
+                    standalone: true,
+                    exportAs: "menuArrow",
+                }]
+        }], ctorParameters: () => [] });
+
+class MenuArrowTip {
+    constructor() {
+        const context = injectMenuContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getArrowTipProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuArrowTip, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuArrowTip, isStandalone: true, selector: "[menu-arrow-tip]", exportAs: ["menuArrowTip"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuArrowTip, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-arrow-tip]",
+                    standalone: true,
+                    exportAs: "menuArrowTip",
+                }]
+        }], ctorParameters: () => [] });
+
+class MenuCheckboxItem {
+    value = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    checked = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
+    disabledInput = input(false, { ...(ngDevMode ? { debugName: "disabledInput" } : /* istanbul ignore next */ {}), alias: "disabled",
+        transform: booleanAttribute });
+    valueText = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "valueText" }] : /* istanbul ignore next */ []));
+    closeOnSelect = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "closeOnSelect" }] : /* istanbul ignore next */ []));
+    disabled = computed(() => this.disabledInput(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    context = injectMenuContext();
+    api = computed(() => this.context.api(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "api" }] : /* istanbul ignore next */ []));
+    optionItemProps = computed(() => ({
+        type: "checkbox",
+        value: this.value(),
+        checked: this.checked() ?? false,
+        disabled: this.disabledInput(),
+        valueText: this.valueText(),
+        closeOnSelect: this.closeOnSelect(),
+        onCheckedChange: (next) => {
+            if (this.checked() !== next)
+                this.checked.set(next);
+        },
+    }), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "optionItemProps" }] : /* istanbul ignore next */ []));
+    state = computed(() => this.context.api().getOptionItemState(this.optionItemProps()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+    constructor() {
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => this.context.api().getOptionItemProps(this.optionItemProps()),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuCheckboxItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: MenuCheckboxItem, isStandalone: true, selector: "[menu-checkbox-item]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, valueText: { classPropertyName: "valueText", publicName: "valueText", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, providers: [
+            { provide: MENU_ITEM_CONTEXT, useExisting: forwardRef(() => MenuCheckboxItem) },
+            {
+                provide: MENU_ITEM_PROPS_CONTEXT,
+                useFactory: (item) => item.optionItemProps,
+                deps: [forwardRef(() => MenuCheckboxItem)],
+            },
+        ], exportAs: ["menuCheckboxItem"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuCheckboxItem, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-checkbox-item]",
+                    standalone: true,
+                    exportAs: "menuCheckboxItem",
+                    providers: [
+                        { provide: MENU_ITEM_CONTEXT, useExisting: forwardRef(() => MenuCheckboxItem) },
+                        {
+                            provide: MENU_ITEM_PROPS_CONTEXT,
+                            useFactory: (item) => item.optionItemProps,
+                            deps: [forwardRef(() => MenuCheckboxItem)],
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], valueText: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueText", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }] } });
+
+const MENU_RADIO_ITEM_GROUP_CONTEXT = new InjectionToken("WIREKYT.MENU_RADIO_ITEM_GROUP_CONTEXT");
+function injectMenuRadioItemGroupContext() {
+    return inject(MENU_RADIO_ITEM_GROUP_CONTEXT);
+}
+
+class MenuRadioItem {
+    value = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    disabledInput = input(false, { ...(ngDevMode ? { debugName: "disabledInput" } : /* istanbul ignore next */ {}), alias: "disabled",
+        transform: booleanAttribute });
+    valueText = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "valueText" }] : /* istanbul ignore next */ []));
+    closeOnSelect = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "closeOnSelect" }] : /* istanbul ignore next */ []));
+    disabled = computed(() => this.disabledInput(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    context = injectMenuContext();
+    radioGroup = injectMenuRadioItemGroupContext();
+    api = computed(() => this.context.api(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "api" }] : /* istanbul ignore next */ []));
+    checked = computed(() => this.radioGroup.value() === this.value(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
+    optionItemProps = computed(() => ({
+        type: "radio",
+        value: this.value(),
+        checked: this.checked(),
+        disabled: this.disabledInput(),
+        valueText: this.valueText(),
+        closeOnSelect: this.closeOnSelect(),
+        onCheckedChange: () => this.radioGroup.setValue(this.value()),
+    }), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "optionItemProps" }] : /* istanbul ignore next */ []));
+    state = computed(() => this.context.api().getOptionItemState(this.optionItemProps()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+    constructor() {
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => this.context.api().getOptionItemProps(this.optionItemProps()),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuRadioItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: MenuRadioItem, isStandalone: true, selector: "[menu-radio-item]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, valueText: { classPropertyName: "valueText", publicName: "valueText", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+            { provide: MENU_ITEM_CONTEXT, useExisting: forwardRef(() => MenuRadioItem) },
+            {
+                provide: MENU_ITEM_PROPS_CONTEXT,
+                useFactory: (item) => item.optionItemProps,
+                deps: [forwardRef(() => MenuRadioItem)],
+            },
+        ], exportAs: ["menuRadioItem"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuRadioItem, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-radio-item]",
+                    standalone: true,
+                    exportAs: "menuRadioItem",
+                    providers: [
+                        { provide: MENU_ITEM_CONTEXT, useExisting: forwardRef(() => MenuRadioItem) },
+                        {
+                            provide: MENU_ITEM_PROPS_CONTEXT,
+                            useFactory: (item) => item.optionItemProps,
+                            deps: [forwardRef(() => MenuRadioItem)],
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], valueText: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueText", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }] } });
+
+class MenuRadioItemGroup {
+    idInput = input(undefined, { ...(ngDevMode ? { debugName: "idInput" } : /* istanbul ignore next */ {}), alias: "id" });
+    value = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    valueChangeDetails = output();
+    fallbackId = createId();
+    id = computed(() => this.idInput() ?? this.fallbackId, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    setValue(next) {
+        if (this.value() === next)
+            return;
+        this.value.set(next);
+        this.valueChangeDetails.emit({ value: next });
+    }
+    constructor() {
+        const context = injectMenuContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getItemGroupProps({ id: this.id() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuRadioItemGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: MenuRadioItemGroup, isStandalone: true, selector: "[menu-radio-item-group]", inputs: { idInput: { classPropertyName: "idInput", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", valueChangeDetails: "valueChangeDetails" }, providers: [
+            { provide: MENU_RADIO_ITEM_GROUP_CONTEXT, useExisting: forwardRef(() => MenuRadioItemGroup) },
+        ], exportAs: ["menuRadioItemGroup"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuRadioItemGroup, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-radio-item-group]",
+                    standalone: true,
+                    exportAs: "menuRadioItemGroup",
+                    providers: [
+                        { provide: MENU_RADIO_ITEM_GROUP_CONTEXT, useExisting: forwardRef(() => MenuRadioItemGroup) },
+                    ],
+                }]
+        }], ctorParameters: () => [], propDecorators: { idInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], valueChangeDetails: [{ type: i0.Output, args: ["valueChangeDetails"] }] } });
+
+const MENU_ITEM_GROUP_CONTEXT = new InjectionToken("WIREKYT.MENU_ITEM_GROUP_CONTEXT");
+function injectMenuItemGroupContext() {
+    return inject(MENU_ITEM_GROUP_CONTEXT);
+}
+
+class MenuItemGroup {
+    idInput = input(undefined, { ...(ngDevMode ? { debugName: "idInput" } : /* istanbul ignore next */ {}), alias: "id" });
+    fallbackId = createId();
+    id = computed(() => this.idInput() ?? this.fallbackId, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const context = injectMenuContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getItemGroupProps({ id: this.id() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItemGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: MenuItemGroup, isStandalone: true, selector: "[menu-item-group]", inputs: { idInput: { classPropertyName: "idInput", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MENU_ITEM_GROUP_CONTEXT, useExisting: forwardRef(() => MenuItemGroup) }], exportAs: ["menuItemGroup"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItemGroup, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-item-group]",
+                    standalone: true,
+                    exportAs: "menuItemGroup",
+                    providers: [{ provide: MENU_ITEM_GROUP_CONTEXT, useExisting: forwardRef(() => MenuItemGroup) }],
+                }]
+        }], ctorParameters: () => [], propDecorators: { idInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+class MenuItemGroupLabel {
+    constructor() {
+        const context = injectMenuContext();
+        const itemGroup = inject(MENU_ITEM_GROUP_CONTEXT, { optional: true });
+        const radioGroup = inject(MENU_RADIO_ITEM_GROUP_CONTEXT, { optional: true });
+        const groupId = itemGroup?.id ?? radioGroup?.id;
+        if (!groupId) {
+            throw new Error("[menu-item-group-label] requires a parent [menu-item-group] or [menu-radio-item-group] in the injection tree.");
+        }
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getItemGroupLabelProps({ htmlFor: groupId() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItemGroupLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuItemGroupLabel, isStandalone: true, selector: "[menu-item-group-label]", exportAs: ["menuItemGroupLabel"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItemGroupLabel, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-item-group-label]",
+                    standalone: true,
+                    exportAs: "menuItemGroupLabel",
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Nested-submenu trigger item. The directive must live inside a child menu's
+ * `[menu-root]` root that is itself a descendant of a parent `[menu-root]` root.
+ * The parent menu's `getTriggerItemProps(childApi)` is applied so clicking or
+ * hovering this element opens the child submenu while leaving the parent open.
+ */
+class MenuTriggerItem {
+    triggerItemProps = injectMenuTriggerItemContext();
+    itemProps = computed(() => ({
+        value: String(this.triggerItemProps()?.["data-value"] ?? ""),
+    }), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "itemProps" }] : /* istanbul ignore next */ []));
+    constructor() {
+        if (!this.triggerItemProps()) {
+            throw new Error("[menu-trigger-item] must live inside a nested [menu-root] under a parent [menu-root] root.");
+        }
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => this.triggerItemProps() ?? {},
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuTriggerItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuTriggerItem, isStandalone: true, selector: "[menu-trigger-item]", providers: [
+            {
+                provide: MENU_ITEM_PROPS_CONTEXT,
+                useFactory: (item) => item.itemProps,
+                deps: [forwardRef(() => MenuTriggerItem)],
+            },
+        ], exportAs: ["menuTriggerItem"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuTriggerItem, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-trigger-item]",
+                    standalone: true,
+                    exportAs: "menuTriggerItem",
+                    providers: [
+                        {
+                            provide: MENU_ITEM_PROPS_CONTEXT,
+                            useFactory: (item) => item.itemProps,
+                            deps: [forwardRef(() => MenuTriggerItem)],
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [] });
+
+class MenuItemIndicator {
+    constructor() {
+        const context = injectMenuContext();
+        const itemProps = injectMenuItemPropsContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getItemIndicatorProps(itemProps()),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItemIndicator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: MenuItemIndicator, isStandalone: true, selector: "[menu-item-indicator]", exportAs: ["menuItemIndicator"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: MenuItemIndicator, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[menu-item-indicator]",
+                    standalone: true,
+                    exportAs: "menuItemIndicator",
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MENU_CONTEXT, MENU_CONTEXT_CARRIER, MENU_ITEM_CONTEXT, MenuArrow, MenuArrowTip, MenuCheckboxItem, MenuContent, MenuContext, MenuContextTrigger, MenuIndicator, MenuItem, MenuItemContextDirective, MenuItemGroup, MenuItemGroupLabel, MenuItemIndicator, MenuItemText, MenuPositioner, MenuRadioItem, MenuRadioItemGroup, MenuRoot, MenuRootProvider, MenuSeparator, MenuTrigger, MenuTriggerItem, injectMenuContext, injectMenuContextCarrier, injectMenuItemContext, useMenu };
+//# sourceMappingURL=wirekyt-angular-menu.mjs.map