@nanahoshi/mona-ui 0.1.0

package/fesm2022/nanahoshi-mona-ui-contextmenu.mjs

@@ -0,0 +1,485 @@
+import { NgTemplateOutlet } from '@angular/common';
+import * as i0 from '@angular/core';
+import { forwardRef, Directive, inject, DestroyRef, signal, contentChildren, contentChild, TemplateRef, computed, viewChild, input, output, effect, afterNextRender, ElementRef, Component } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { PopupMenuGroupTemplateDirective, PopupMenuTemplateOrigin, PopupMenuGroupTemplateToken, PopupMenuIconTemplateDirective, PopupMenuIconTemplateToken, PopupMenuShortcutTemplateDirective, PopupMenuShortcutTemplateToken, PopupMenuTextTemplateDirective, PopupMenuTextTemplateToken, PopupMenuItemType, PopupMenuTemplateType, ensurePopupComponentTypes, PopupMenuOrigin, ensurePopupTemplateTypes, PopupMenuToken, PopupMenuComponent, PopupMenuGroupComponent, PopupMenuCheckboxItemComponent, PopupMenuItemComponent, PopupMenuRadioGroupComponent, PopupMenuRadioItemComponent, PopupMenuRadioItemToken, PopupMenuSeparatorComponent } from '@nanahoshi/mona-ui/popup-menu';
+import { createElementControlId } from '@nanahoshi/mona-ui/internal';
+import { any } from '@mirei/ts-collections';
+import { fromEvent } from 'rxjs';
+
+class ContextMenuGroupTemplateDirective extends PopupMenuGroupTemplateDirective {
+    constructor() {
+        super(...arguments);
+        this.origin = PopupMenuTemplateOrigin.ContextMenu;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuGroupTemplateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.6", type: ContextMenuGroupTemplateDirective, isStandalone: true, selector: "ng-template[monaContextMenuGroupTemplate]", providers: [
+            {
+                provide: PopupMenuGroupTemplateToken,
+                useExisting: forwardRef(() => ContextMenuGroupTemplateDirective)
+            }
+        ], usesInheritance: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuGroupTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[monaContextMenuGroupTemplate]",
+                    providers: [
+                        {
+                            provide: PopupMenuGroupTemplateToken,
+                            useExisting: forwardRef(() => ContextMenuGroupTemplateDirective)
+                        }
+                    ]
+                }]
+        }] });
+
+class ContextMenuIconTemplateDirective extends PopupMenuIconTemplateDirective {
+    constructor() {
+        super(...arguments);
+        this.origin = PopupMenuTemplateOrigin.ContextMenu;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuIconTemplateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.6", type: ContextMenuIconTemplateDirective, isStandalone: true, selector: "ng-template[monaContextMenuIconTemplate]", providers: [
+            {
+                provide: PopupMenuIconTemplateToken,
+                useExisting: forwardRef(() => ContextMenuIconTemplateDirective)
+            }
+        ], usesInheritance: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuIconTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[monaContextMenuIconTemplate]",
+                    providers: [
+                        {
+                            provide: PopupMenuIconTemplateToken,
+                            useExisting: forwardRef(() => ContextMenuIconTemplateDirective)
+                        }
+                    ]
+                }]
+        }] });
+
+class ContextMenuShortcutTemplateDirective extends PopupMenuShortcutTemplateDirective {
+    constructor() {
+        super(...arguments);
+        this.origin = PopupMenuTemplateOrigin.ContextMenu;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuShortcutTemplateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.6", type: ContextMenuShortcutTemplateDirective, isStandalone: true, selector: "ng-template[monaContextMenuShortcutTemplate]", providers: [
+            {
+                provide: PopupMenuShortcutTemplateToken,
+                useExisting: forwardRef(() => ContextMenuShortcutTemplateDirective)
+            }
+        ], usesInheritance: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuShortcutTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[monaContextMenuShortcutTemplate]",
+                    providers: [
+                        {
+                            provide: PopupMenuShortcutTemplateToken,
+                            useExisting: forwardRef(() => ContextMenuShortcutTemplateDirective)
+                        }
+                    ]
+                }]
+        }] });
+
+class ContextMenuTextTemplateDirective extends PopupMenuTextTemplateDirective {
+    constructor() {
+        super(...arguments);
+        this.origin = PopupMenuTemplateOrigin.ContextMenu;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuTextTemplateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.6", type: ContextMenuTextTemplateDirective, isStandalone: true, selector: "ng-template[monaContextMenuTextTemplate]", providers: [
+            {
+                provide: PopupMenuTextTemplateToken,
+                useExisting: forwardRef(() => ContextMenuTextTemplateDirective)
+            }
+        ], usesInheritance: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuTextTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[monaContextMenuTextTemplate]",
+                    providers: [
+                        {
+                            provide: PopupMenuTextTemplateToken,
+                            useExisting: forwardRef(() => ContextMenuTextTemplateDirective)
+                        }
+                    ]
+                }]
+        }] });
+
+const componentTypeMap = {
+    [PopupMenuItemType.CheckboxMenuItem]: "mona-contextmenu-checkbox-item",
+    [PopupMenuItemType.MenuGroup]: "mona-contextmenu-group",
+    [PopupMenuItemType.MenuItem]: "mona-contextmenu-item",
+    [PopupMenuItemType.RadioGroup]: "mona-contextmenu-radio-group",
+    [PopupMenuItemType.RadioItem]: "mona-contextmenu-radio-item",
+    [PopupMenuItemType.Separator]: "mona-contextmenu-separator"
+};
+const templateTypeMap = {
+    [PopupMenuTemplateType.Group]: "monaContextMenuGroupTemplate",
+    [PopupMenuTemplateType.Icon]: "monaContextMenuIconTemplate",
+    [PopupMenuTemplateType.Shortcut]: "monaContextMenuShortcutTemplate",
+    [PopupMenuTemplateType.Text]: "monaContextMenuTextTemplate"
+};
+const ensureContextMenuComponentTypes = (components) => {
+    ensurePopupComponentTypes({
+        components,
+        componentTypeMap,
+        origin: PopupMenuOrigin.ContextMenu,
+        prefix: "mona-contextmenu"
+    });
+};
+const ensureContextMenuTemplateTypes = (templates) => {
+    ensurePopupTemplateTypes({
+        templates,
+        templateTypeMap,
+        origin: PopupMenuTemplateOrigin.ContextMenu,
+        prefix: "mona-contextmenu"
+    });
+};
+
+class ContextMenuComponent {
+    #destroyRef;
+    #isMenuOpen;
+    constructor() {
+        this.#destroyRef = inject(DestroyRef);
+        this.#isMenuOpen = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#isMenuOpen" }] : /* istanbul ignore next */ []));
+        this.menuItemComponents = contentChildren(PopupMenuToken, { ...(ngDevMode ? { debugName: "menuItemComponents" } : /* istanbul ignore next */ {}), descendants: false });
+        this.groupTemplate = contentChild(ContextMenuGroupTemplateDirective, { ...(ngDevMode ? { debugName: "groupTemplate" } : /* istanbul ignore next */ {}), read: TemplateRef,
+            descendants: false });
+        this.iconTemplate = contentChild(ContextMenuIconTemplateDirective, { ...(ngDevMode ? { debugName: "iconTemplate" } : /* istanbul ignore next */ {}), read: TemplateRef,
+            descendants: false });
+        this.menuId = createElementControlId();
+        this.menuItems = computed(() => {
+            if (any(this.items())) {
+                return this.items();
+            }
+            return this.menuItemComponents()
+                .map(item => item.getPopupMenuItem())
+                .flatMap(i => i);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "menuItems" }] : /* istanbul ignore next */ []));
+        this.popupMenuRef = viewChild("popupMenu", /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "popupMenuRef" }] : /* istanbul ignore next */ []));
+        this.shortcutTemplate = contentChild(ContextMenuShortcutTemplateDirective, { ...(ngDevMode ? { debugName: "shortcutTemplate" } : /* istanbul ignore next */ {}), read: TemplateRef,
+            descendants: false });
+        this.textTemplate = contentChild(ContextMenuTextTemplateDirective, { ...(ngDevMode ? { debugName: "textTemplate" } : /* istanbul ignore next */ {}), read: TemplateRef,
+            descendants: false });
+        /**
+         * @description Reserved for an ARIA label on the context menu.
+         * Not currently applied to the target element or the rendered menu.
+         */
+        this.ariaLabel = input("", /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+        /**
+         * @description The menu items to render. When provided, these take precedence over
+         * content-projected `mona-contextmenu-item` (and related) components.
+         */
+        this.items = input([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+        /**
+         * @description Emits when a menu item is clicked.
+         */
+        this.menuClick = output();
+        /**
+         * @description Sets the minimum width of the context menu.
+         * This will be applied to the root menu and all submenus.
+         */
+        this.minWidth = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "minWidth" }] : /* istanbul ignore next */ []));
+        /**
+         * @description Sets the rounded state of the context menu.
+         */
+        this.rounded = input("medium", /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "rounded" }] : /* istanbul ignore next */ []));
+        /**
+         * @description Sets the size of the context menu.
+         */
+        this.size = input("medium", /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+        /**
+         * @description The target element that will be used to trigger the context menu.
+         */
+        this.target = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "target" }] : /* istanbul ignore next */ []));
+        /**
+         * @description Sets the width of the context menu.
+         * This will be applied to the root menu and all submenus.
+         */
+        this.width = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "width" }] : /* istanbul ignore next */ []));
+        effect(() => ensureContextMenuComponentTypes(this.menuItemComponents()));
+        afterNextRender({
+            read: () => {
+                this.setTargetAriaAttributes();
+                this.setKeyboardEvents();
+            }
+        });
+    }
+    onMenuClose() {
+        this.#isMenuOpen.set(false);
+        this.updateTargetAriaAttributes();
+    }
+    onMenuOpen() {
+        this.#isMenuOpen.set(true);
+        this.updateTargetAriaAttributes();
+    }
+    openMenuViaKeyboard() {
+        const popupMenu = this.popupMenuRef();
+        if (popupMenu && !this.#isMenuOpen()) {
+            popupMenu.openMenuViaKeyboard(true);
+        }
+    }
+    setKeyboardEvents() {
+        const target = this.target();
+        const targetElement = target instanceof ElementRef ? target.nativeElement : target;
+        if (!targetElement) {
+            return;
+        }
+        fromEvent(targetElement, "keydown")
+            .pipe(takeUntilDestroyed(this.#destroyRef))
+            .subscribe(event => {
+            if (event.key === "ContextMenu" || (event.key === "F10" && event.shiftKey)) {
+                event.preventDefault();
+                this.openMenuViaKeyboard();
+            }
+        });
+    }
+    setTargetAriaAttributes() {
+        const target = this.target();
+        const targetElement = target instanceof ElementRef ? target.nativeElement : target;
+        if (!targetElement) {
+            return;
+        }
+        targetElement.setAttribute("aria-haspopup", "menu");
+        targetElement.setAttribute("aria-controls", this.menuId);
+        this.updateTargetAriaAttributes();
+    }
+    updateTargetAriaAttributes() {
+        const target = this.target();
+        const targetElement = target instanceof ElementRef ? target.nativeElement : target;
+        if (!targetElement) {
+            return;
+        }
+        targetElement.setAttribute("aria-expanded", this.#isMenuOpen().toString());
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: ContextMenuComponent, isStandalone: true, selector: "mona-contextmenu", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: true, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuClick: "menuClick" }, queries: [{ propertyName: "menuItemComponents", predicate: PopupMenuToken, isSignal: true }, { propertyName: "groupTemplate", first: true, predicate: ContextMenuGroupTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "iconTemplate", first: true, predicate: ContextMenuIconTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "shortcutTemplate", first: true, predicate: ContextMenuShortcutTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "textTemplate", first: true, predicate: ContextMenuTextTemplateDirective, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "popupMenuRef", first: true, predicate: ["popupMenu"], descendants: true, isSignal: true }], ngImport: i0, template: "<mona-popup-menu\n    [target]=\"target()\"\n    [trigger]=\"'contextmenu'\"\n    [items]=\"menuItems()\"\n    [minWidth]=\"minWidth()\"\n    [width]=\"width()\"\n    [rounded]=\"rounded()\"\n    [size]=\"size()\"\n    [precise]=\"true\"\n    (menuClick)=\"menuClick.emit($event)\"\n    (open)=\"onMenuOpen()\"\n    (close)=\"onMenuClose()\"\n    [id]=\"menuId\"\n    #popupMenu>\n    @if (groupTemplate()) {\n        <ng-template monaPopupMenuGroupTemplate let-group>\n            <ng-container\n                [ngTemplateOutlet]=\"groupTemplate()\"\n                [ngTemplateOutletContext]=\"{ $implicit: group }\"></ng-container>\n        </ng-template>\n    }\n    @if (iconTemplate()) {\n        <ng-template monaPopupMenuIconTemplate let-item>\n            <ng-container\n                [ngTemplateOutlet]=\"iconTemplate()\"\n                [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n        </ng-template>\n    }\n    @if (shortcutTemplate()) {\n        <ng-template monaPopupMenuShortcutTemplate let-item>\n            <ng-container\n                [ngTemplateOutlet]=\"shortcutTemplate()\"\n                [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n        </ng-template>\n    }\n    @if (textTemplate()) {\n        <ng-template monaPopupMenuTextTemplate let-item>\n            <ng-container\n                [ngTemplateOutlet]=\"textTemplate()\"\n                [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n        </ng-template>\n    }\n</mona-popup-menu>\n", dependencies: [{ kind: "component", type: PopupMenuComponent, selector: "mona-popup-menu", inputs: ["anchor", "anchorConnectionPoint", "items", "id", "minWidth", "offset", "popupConnectionPoint", "precise", "rounded", "size", "target", "trigger", "width"], outputs: ["close", "menuClick", "navigate", "open"] }, { kind: "directive", type: PopupMenuTextTemplateDirective, selector: "ng-template[monaPopupMenuTextTemplate]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: PopupMenuIconTemplateDirective, selector: "ng-template[monaPopupMenuIconTemplate]" }, { kind: "directive", type: PopupMenuShortcutTemplateDirective, selector: "ng-template[monaPopupMenuShortcutTemplate]" }, { kind: "directive", type: PopupMenuGroupTemplateDirective, selector: "ng-template[monaPopupMenuGroupTemplate]" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "mona-contextmenu", imports: [
+                        PopupMenuComponent,
+                        PopupMenuTextTemplateDirective,
+                        NgTemplateOutlet,
+                        PopupMenuIconTemplateDirective,
+                        PopupMenuShortcutTemplateDirective,
+                        PopupMenuGroupTemplateDirective
+                    ], template: "<mona-popup-menu\n    [target]=\"target()\"\n    [trigger]=\"'contextmenu'\"\n    [items]=\"menuItems()\"\n    [minWidth]=\"minWidth()\"\n    [width]=\"width()\"\n    [rounded]=\"rounded()\"\n    [size]=\"size()\"\n    [precise]=\"true\"\n    (menuClick)=\"menuClick.emit($event)\"\n    (open)=\"onMenuOpen()\"\n    (close)=\"onMenuClose()\"\n    [id]=\"menuId\"\n    #popupMenu>\n    @if (groupTemplate()) {\n        <ng-template monaPopupMenuGroupTemplate let-group>\n            <ng-container\n                [ngTemplateOutlet]=\"groupTemplate()\"\n                [ngTemplateOutletContext]=\"{ $implicit: group }\"></ng-container>\n        </ng-template>\n    }\n    @if (iconTemplate()) {\n        <ng-template monaPopupMenuIconTemplate let-item>\n            <ng-container\n                [ngTemplateOutlet]=\"iconTemplate()\"\n                [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n        </ng-template>\n    }\n    @if (shortcutTemplate()) {\n        <ng-template monaPopupMenuShortcutTemplate let-item>\n            <ng-container\n                [ngTemplateOutlet]=\"shortcutTemplate()\"\n                [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n        </ng-template>\n    }\n    @if (textTemplate()) {\n        <ng-template monaPopupMenuTextTemplate let-item>\n            <ng-container\n                [ngTemplateOutlet]=\"textTemplate()\"\n                [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n        </ng-template>\n    }\n</mona-popup-menu>\n" }]
+        }], ctorParameters: () => [], propDecorators: { menuItemComponents: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => PopupMenuToken), { ...{ descendants: false }, isSignal: true }] }], groupTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ContextMenuGroupTemplateDirective), { ...{
+                            read: TemplateRef,
+                            descendants: false
+                        }, isSignal: true }] }], iconTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ContextMenuIconTemplateDirective), { ...{
+                            read: TemplateRef,
+                            descendants: false
+                        }, isSignal: true }] }], popupMenuRef: [{ type: i0.ViewChild, args: ["popupMenu", { isSignal: true }] }], shortcutTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ContextMenuShortcutTemplateDirective), { ...{
+                            read: TemplateRef,
+                            descendants: false
+                        }, isSignal: true }] }], textTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ContextMenuTextTemplateDirective), { ...{
+                            read: TemplateRef,
+                            descendants: false
+                        }, isSignal: true }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], menuClick: [{ type: i0.Output, args: ["menuClick"] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: true }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }] } });
+
+class ContextMenuGroupComponent extends PopupMenuGroupComponent {
+    constructor() {
+        super();
+        this.origin = PopupMenuOrigin.ContextMenu;
+        effect(() => ensureContextMenuComponentTypes(this.items()));
+        effect(() => ensureContextMenuTemplateTypes([this.groupTemplateConfig()].filter(t => t !== undefined)));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: ContextMenuGroupComponent, isStandalone: true, selector: "mona-contextmenu-group", providers: [
+            {
+                provide: PopupMenuToken,
+                useExisting: forwardRef(() => ContextMenuGroupComponent)
+            }
+        ], usesInheritance: true, ngImport: i0, template: "", isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuGroupComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "mona-contextmenu-group",
+                    template: "",
+                    providers: [
+                        {
+                            provide: PopupMenuToken,
+                            useExisting: forwardRef(() => ContextMenuGroupComponent)
+                        }
+                    ]
+                }]
+        }], ctorParameters: () => [] });
+
+class ContextMenuCheckboxItemComponent extends PopupMenuCheckboxItemComponent {
+    constructor() {
+        super();
+        this.origin = PopupMenuOrigin.ContextMenu;
+        effect(() => ensureContextMenuTemplateTypes([this.shortcutTemplateConfig(), this.textTemplateConfig()].filter(t => t !== undefined)));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuCheckboxItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: ContextMenuCheckboxItemComponent, isStandalone: true, selector: "mona-contextmenu-checkbox-item", providers: [
+            {
+                provide: PopupMenuToken,
+                useExisting: forwardRef(() => ContextMenuCheckboxItemComponent)
+            }
+        ], usesInheritance: true, ngImport: i0, template: "", isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuCheckboxItemComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "mona-contextmenu-checkbox-item",
+                    template: "",
+                    providers: [
+                        {
+                            provide: PopupMenuToken,
+                            useExisting: forwardRef(() => ContextMenuCheckboxItemComponent)
+                        }
+                    ]
+                }]
+        }], ctorParameters: () => [] });
+
+class ContextMenuItemComponent extends PopupMenuItemComponent {
+    constructor() {
+        super();
+        this.origin = PopupMenuOrigin.ContextMenu;
+        effect(() => ensureContextMenuComponentTypes(this.items()));
+        effect(() => ensureContextMenuTemplateTypes([this.iconTemplateConfig(), this.shortcutTemplateConfig(), this.textTemplateConfig()].filter(t => t !== undefined)));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: ContextMenuItemComponent, isStandalone: true, selector: "mona-contextmenu-item", providers: [
+            {
+                provide: PopupMenuToken,
+                useExisting: forwardRef(() => ContextMenuItemComponent)
+            }
+        ], usesInheritance: true, ngImport: i0, template: ``, isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuItemComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "mona-contextmenu-item",
+                    template: ``,
+                    providers: [
+                        {
+                            provide: PopupMenuToken,
+                            useExisting: forwardRef(() => ContextMenuItemComponent)
+                        }
+                    ]
+                }]
+        }], ctorParameters: () => [] });
+
+class ContextMenuRadioGroupComponent extends PopupMenuRadioGroupComponent {
+    constructor() {
+        super();
+        this.origin = PopupMenuOrigin.ContextMenu;
+        effect(() => ensureContextMenuComponentTypes(this.items()));
+        effect(() => ensureContextMenuTemplateTypes([this.groupTemplateConfig()].filter(t => t !== undefined)));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuRadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: ContextMenuRadioGroupComponent, isStandalone: true, selector: "mona-contextmenu-radio-group", providers: [
+            {
+                provide: PopupMenuToken,
+                useExisting: forwardRef(() => ContextMenuRadioGroupComponent)
+            }
+        ], usesInheritance: true, ngImport: i0, template: "", isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuRadioGroupComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "mona-contextmenu-radio-group",
+                    template: "",
+                    providers: [
+                        {
+                            provide: PopupMenuToken,
+                            useExisting: forwardRef(() => ContextMenuRadioGroupComponent)
+                        }
+                    ]
+                }]
+        }], ctorParameters: () => [] });
+
+class ContextMenuRadioItemComponent extends PopupMenuRadioItemComponent {
+    constructor() {
+        super();
+        this.origin = PopupMenuOrigin.ContextMenu;
+        effect(() => ensureContextMenuTemplateTypes([this.shortcutTemplateConfig(), this.textTemplateConfig()].filter(t => t !== undefined)));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuRadioItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: ContextMenuRadioItemComponent, isStandalone: true, selector: "mona-contextmenu-radio-item", providers: [
+            {
+                provide: PopupMenuToken,
+                useExisting: forwardRef(() => ContextMenuRadioItemComponent)
+            },
+            {
+                provide: PopupMenuRadioItemToken,
+                useExisting: forwardRef(() => ContextMenuRadioItemComponent)
+            }
+        ], usesInheritance: true, ngImport: i0, template: "", isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuRadioItemComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "mona-contextmenu-radio-item",
+                    template: "",
+                    providers: [
+                        {
+                            provide: PopupMenuToken,
+                            useExisting: forwardRef(() => ContextMenuRadioItemComponent)
+                        },
+                        {
+                            provide: PopupMenuRadioItemToken,
+                            useExisting: forwardRef(() => ContextMenuRadioItemComponent)
+                        }
+                    ]
+                }]
+        }], ctorParameters: () => [] });
+
+class ContextMenuSeparatorComponent extends PopupMenuSeparatorComponent {
+    constructor() {
+        super(...arguments);
+        this.origin = PopupMenuOrigin.ContextMenu;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuSeparatorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: ContextMenuSeparatorComponent, isStandalone: true, selector: "mona-contextmenu-separator", providers: [
+            {
+                provide: PopupMenuToken,
+                useExisting: forwardRef(() => ContextMenuSeparatorComponent)
+            }
+        ], usesInheritance: true, ngImport: i0, template: "", isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ContextMenuSeparatorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "mona-contextmenu-separator",
+                    template: "",
+                    providers: [
+                        {
+                            provide: PopupMenuToken,
+                            useExisting: forwardRef(() => ContextMenuSeparatorComponent)
+                        }
+                    ]
+                }]
+        }] });
+
+/*
+ * Public API Surface of @nanahoshi/mona-ui/contextmenu
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ContextMenuCheckboxItemComponent, ContextMenuComponent, ContextMenuGroupComponent, ContextMenuGroupTemplateDirective, ContextMenuIconTemplateDirective, ContextMenuItemComponent, ContextMenuRadioGroupComponent, ContextMenuRadioItemComponent, ContextMenuSeparatorComponent, ContextMenuShortcutTemplateDirective, ContextMenuTextTemplateDirective };
+//# sourceMappingURL=nanahoshi-mona-ui-contextmenu.mjs.map

package/fesm2022/nanahoshi-mona-ui-date-input.mjs

@@ -0,0 +1,132 @@
+import * as i0 from '@angular/core';
+import { Directive, Pipe, Injectable } from '@angular/core';
+import { toImmutableSet, where, select, sequence } from '@mirei/ts-collections';
+import { cva } from 'class-variance-authority';
+import { Subject } from 'rxjs';
+
+class DateInputPrefixTemplateDirective {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: DateInputPrefixTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.6", type: DateInputPrefixTemplateDirective, isStandalone: true, selector: "ng-template[monaDateInputPrefixTemplate]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: DateInputPrefixTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[monaDateInputPrefixTemplate]"
+                }]
+        }] });
+
+class TimeLimiterPipe {
+    transform(timeValues, type, currentDate, min, max) {
+        if (!min && !max) {
+            return toImmutableSet(timeValues);
+        }
+        const normalizedMin = min
+            ? min.set({ year: currentDate.year, month: currentDate.month, day: currentDate.day })
+            : null;
+        const normalizedMax = max
+            ? max.set({ year: currentDate.year, month: currentDate.month, day: currentDate.day })
+            : null;
+        const unitMap = { h: "hour", m: "minute", s: "second" };
+        const luxonUnit = unitMap[type];
+        const result = where(timeValues, timeUnit => {
+            const testDate = currentDate.set({ [luxonUnit]: timeUnit.value });
+            const isAfterMin = normalizedMin ? testDate >= normalizedMin.startOf(luxonUnit) : true;
+            const isBeforeMax = normalizedMax ? testDate <= normalizedMax.endOf(luxonUnit) : true;
+            return isAfterMin && isBeforeMax;
+        });
+        return result.toImmutableSet();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TimeLimiterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.6", ngImport: i0, type: TimeLimiterPipe, isStandalone: true, name: "timeLimiter" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TimeLimiterPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: "timeLimiter"
+                }]
+        }] });
+
+const datePopupVariants = cva(`
+        bg-background shadow-md
+        border border-input-border
+        h-full overflow-auto
+        [&_mona-calendar]:border-none
+        [&_mona-calendar]:shadow-none
+    `, {
+    variants: {
+        rounded: {
+            none: "rounded-none",
+            small: "rounded-sm",
+            medium: "rounded-md",
+            large: "rounded-lg",
+            full: "rounded-lg"
+        },
+        size: {
+            large: "text-lg",
+            medium: "text-md",
+            small: "text-sm"
+        }
+    },
+    defaultVariants: {
+        rounded: "medium",
+        size: "medium"
+    }
+});
+
+const datePopupThemeVariants = (theme) => {
+    switch (theme) {
+        case "mona":
+            return datePopupVariants;
+        default:
+            return datePopupVariants;
+    }
+};
+
+class CalendarService {
+    constructor() {
+        this.keydown$ = new Subject();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: CalendarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: CalendarService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: CalendarService, decorators: [{
+            type: Injectable
+        }] });
+
+class TimeSelectorService {
+    constructor() {
+        this.keydown$ = new Subject();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TimeSelectorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TimeSelectorService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TimeSelectorService, decorators: [{
+            type: Injectable
+        }] });
+
+const generateHourSet = (hourFormat, meridiem, step = 1) => {
+    if (hourFormat === "24") {
+        return select(sequence(0, 23, step), h => ({ value: h, viewValue: h })).toImmutableSet();
+    }
+    if (meridiem === "AM") {
+        return select(sequence(1, 11, step), h => ({ value: h, viewValue: h }))
+            .prepend({ value: 0, viewValue: 12 })
+            .toImmutableSet();
+    }
+    return select(sequence(1, 11, step), h => ({ value: h + 12, viewValue: h }))
+        .prepend({ value: 12, viewValue: 12 })
+        .toImmutableSet();
+};
+const generateMinuteSet = (step = 1) => {
+    return select(sequence(0, 59, step), m => ({ value: m, viewValue: m })).toImmutableSet();
+};
+const generateSecondSet = (step = 1) => {
+    return select(sequence(0, 59, step), s => ({ value: s, viewValue: s })).toImmutableSet();
+};
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CalendarService, DateInputPrefixTemplateDirective, TimeLimiterPipe, TimeSelectorService, datePopupThemeVariants, generateHourSet, generateMinuteSet, generateSecondSet };
+//# sourceMappingURL=nanahoshi-mona-ui-date-input.mjs.map