@nanahoshi/mona-ui 0.18.6 → 0.20.0

package/fesm2022/nanahoshi-mona-ui-tree-view.mjs

@@ -1,10 +1,11 @@
 import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Directive, inject, DestroyRef, contentChild, TemplateRef, computed, input, output, effect, untracked, afterNextRender, Component } from '@angular/core';
+import { Directive, inject, DestroyRef, computed, contentChild, TemplateRef, input, output, effect, untracked, afterNextRender, Component } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { FilterInputComponent } from '@nanahoshi/mona-ui/internal/filter-input';
-import { TreeService, TreeComponent, TreeNodeTemplateDirective, NodeDropEvent } from '@nanahoshi/mona-ui/internal/tree';
+import { TREE_DEFAULT_MESSAGES, TreeService, TreeComponent, TreeNodeTemplateDirective, NodeDropEvent } from '@nanahoshi/mona-ui/internal/tree';
 export { NodeCheckEvent, NodeClickEvent, NodeDragEndEvent, NodeDragEvent, NodeDragStartEvent, NodeDropEvent, moveFlatTreeNode, moveTreeNode } from '@nanahoshi/mona-ui/internal/tree';
+import { MonaI18nService } from '@nanahoshi/mona-ui/i18n';
 import { sequenceEqual } from '@mirei/ts-collections';
 import { pairwise } from 'rxjs';
 
@@ -19,17 +20,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
                 }]
         }] });
 
+const TREE_VIEW_DEFAULT_MESSAGES = TREE_DEFAULT_MESSAGES;
+
 class TreeViewComponent {
     #destroyRef;
+    #i18n;
     constructor() {
         this.#destroyRef = inject(DestroyRef);
-        this.nodeTemplate = contentChild(TreeViewNodeTemplateDirective, { ...(ngDevMode ? { debugName: "nodeTemplate" } : /* istanbul ignore next */ {}), read: TemplateRef });
-        this.treeService = inject((TreeService));
+        this.#i18n = inject(MonaI18nService);
         this.filterAriaLabel = computed(() => {
             const ariaLabel = this.ariaLabel();
-            return ariaLabel ? `Filter ${ariaLabel}` : "Filter tree";
+            return ariaLabel ? `${this.messages().filter} ${ariaLabel}` : this.messages().filterTree;
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "filterAriaLabel" }] : /* istanbul ignore next */ []));
+        this.messages = this.#i18n.componentMessages("treeView", TREE_VIEW_DEFAULT_MESSAGES);
+        this.nodeTemplate = contentChild(TreeViewNodeTemplateDirective, { ...(ngDevMode ? { debugName: "nodeTemplate" } : /* istanbul ignore next */ {}), read: TemplateRef });
+        this.treeService = inject((TreeService));
         /**
          * @description Enables CSS transitions when nodes expand or collapse.
          * @default true
@@ -42,6 +48,11 @@ class TreeViewComponent {
          */
         this.ariaLabel = input("", /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+        /**
+         * @description Emitted when the tree-view loses focus.
+         */
+        // eslint-disable-next-line @angular-eslint/no-output-native
+        this.blur = output();
         /**
          * @description Property name or accessor used to derive a node's children from a data item. Accepts a property name, a function returning the children, or a function returning an observable of the children.
          * @default ""
@@ -54,6 +65,11 @@ class TreeViewComponent {
          */
         this.data = input([], /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
+        /**
+         * @description Emitted when the tree-view gains focus.
+         */
+        // eslint-disable-next-line @angular-eslint/no-output-native
+        this.focus = output();
         /**
          * @description Predicate that determines whether a node has children. Required when the children selector returns an observable.
          * @default null
@@ -72,14 +88,6 @@ class TreeViewComponent {
          */
         this.mode = input("hierarchical", /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
-        /**
-         * @description Emitted when the tree-view loses focus.
-         */
-        this.blur = output();
-        /**
-         * @description Emitted when the tree-view gains focus.
-         */
-        this.focus = output();
         /**
          * @description Emitted when a node is clicked.
          */
@@ -193,7 +201,7 @@ class TreeViewComponent {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TreeViewComponent, decorators: [{
             type: Component,
             args: [{ selector: "mona-tree-view", imports: [FilterInputComponent, TreeComponent, TreeNodeTemplateDirective, NgTemplateOutlet], providers: [TreeService], template: "@if (treeService.filterableOptions().enabled) {\n    <div role=\"search\" [attr.aria-label]=\"filterAriaLabel()\">\n        <mona-filter-input\n            [filter]=\"treeService.filterText()\"\n            [debounce]=\"treeService.filterableOptions().debounce\"\n            [placeholder]=\"treeService.filterPlaceholder()\"\n            (filterChange)=\"onFilterChange($event)\"></mona-filter-input>\n    </div>\n}\n<div class=\"flex-1 overflow-auto\">\n    <mona-tree [ariaLabel]=\"ariaLabel()\">\n        @if (nodeTemplate()) {\n            <ng-template monaTreeNodeTemplate let-dataItem let-element=\"element\">\n                <ng-container\n                    [ngTemplateOutlet]=\"nodeTemplate() ?? null\"\n                    [ngTemplateOutletContext]=\"{ $implicit: dataItem, element }\"></ng-container>\n            </ng-template>\n        }\n    </mona-tree>\n</div>\n" }]
-        }], ctorParameters: () => [], propDecorators: { nodeTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TreeViewNodeTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], children: [{ type: i0.Input, args: [{ isSignal: true, alias: "children", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], hasChildren: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasChildren", required: false }] }], idField: [{ type: i0.Input, args: [{ isSignal: true, alias: "idField", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], blur: [{ type: i0.Output, args: ["blur"] }], focus: [{ type: i0.Output, args: ["focus"] }], nodeClick: [{ type: i0.Output, args: ["nodeClick"] }], parentIdField: [{ type: i0.Input, args: [{ isSignal: true, alias: "parentIdField", required: false }] }], textField: [{ type: i0.Input, args: [{ isSignal: true, alias: "textField", required: false }] }] } });
+        }], ctorParameters: () => [], propDecorators: { nodeTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TreeViewNodeTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], blur: [{ type: i0.Output, args: ["blur"] }], children: [{ type: i0.Input, args: [{ isSignal: true, alias: "children", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], focus: [{ type: i0.Output, args: ["focus"] }], hasChildren: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasChildren", required: false }] }], idField: [{ type: i0.Input, args: [{ isSignal: true, alias: "idField", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], nodeClick: [{ type: i0.Output, args: ["nodeClick"] }], parentIdField: [{ type: i0.Input, args: [{ isSignal: true, alias: "parentIdField", required: false }] }], textField: [{ type: i0.Input, args: [{ isSignal: true, alias: "textField", required: false }] }] } });
 
 class TreeViewCheckableDirective {
     #defaultOptions;
@@ -729,5 +737,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { TreeViewCheckableDirective, TreeViewComponent, TreeViewDisableDirective, TreeViewDragAndDropDirective, TreeViewExpandableDirective, TreeViewFilterableDirective, TreeViewNodeTemplateDirective, TreeViewSelectableDirective };
+export { TREE_VIEW_DEFAULT_MESSAGES, TreeViewCheckableDirective, TreeViewComponent, TreeViewDisableDirective, TreeViewDragAndDropDirective, TreeViewExpandableDirective, TreeViewFilterableDirective, TreeViewNodeTemplateDirective, TreeViewSelectableDirective };
 //# sourceMappingURL=nanahoshi-mona-ui-tree-view.mjs.map

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

@@ -9,6 +9,7 @@ import { CdkTrapFocus } from '@angular/cdk/a11y';
 import { NgTemplateOutlet } from '@angular/common';
 import { LucideMinimize, LucideMaximize, LucideMinus, LucideDynamicIcon, LucideX } from '@lucide/angular';
 import { ButtonDirective } from '@nanahoshi/mona-ui/button';
+import { MonaI18nService, mergeMessages } from '@nanahoshi/mona-ui/i18n';
 import { cva } from 'class-variance-authority';
 
 class WindowActionTemplateDirective {
@@ -55,13 +56,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
                 }]
         }] });
 
-const DefaultMaxWindowHeight = 800;
-const DefaultMaxWindowWidth = 1200;
-const DefaultMinWindowHeight = 50;
-const DefaultMinWindowWidth = 50;
+const DEFAULT_MAX_WINDOW_HEIGHT = 800;
+const DEFAULT_MAX_WINDOW_WIDTH = 1200;
+const DEFAULT_MIN_WINDOW_HEIGHT = 50;
+const DEFAULT_MIN_WINDOW_WIDTH = 50;
 
-const KeyboardMoveStep = 10;
-const KeyboardMoveStepFine = 1;
+const KEYBOARD_MOVE_STEP = 10;
+const KEYBOARD_MOVE_STEP_FINE = 1;
 class WindowDragHandlerDirective {
     #destroyRef;
     #document;
@@ -86,10 +87,10 @@ class WindowDragHandlerDirective {
         if (!this.draggable()) {
             return;
         }
-        const step = event.shiftKey ? KeyboardMoveStepFine : KeyboardMoveStep;
+        const step = event.shiftKey ? KEYBOARD_MOVE_STEP_FINE : KEYBOARD_MOVE_STEP;
         const element = this.windowRef().element;
-        const innerWidth = this.#document.defaultView?.innerWidth || DefaultMaxWindowWidth;
-        const innerHeight = this.#document.defaultView?.innerHeight || DefaultMaxWindowHeight;
+        const innerWidth = this.#document.defaultView?.innerWidth || DEFAULT_MAX_WINDOW_WIDTH;
+        const innerHeight = this.#document.defaultView?.innerHeight || DEFAULT_MAX_WINDOW_HEIGHT;
         const initialTop = element.getBoundingClientRect().top;
         const initialLeft = element.getBoundingClientRect().left;
         let top = initialTop;
@@ -126,8 +127,8 @@ class WindowDragHandlerDirective {
         const initialY = event.clientY;
         const initialTop = element.getBoundingClientRect().top;
         const initialLeft = element.getBoundingClientRect().left;
-        const innerWidth = this.#document.defaultView?.innerWidth || DefaultMaxWindowWidth;
-        const innerHeight = this.#document.defaultView?.innerHeight || DefaultMaxWindowHeight;
+        const innerWidth = this.#document.defaultView?.innerWidth || DEFAULT_MAX_WINDOW_WIDTH;
+        const innerHeight = this.#document.defaultView?.innerHeight || DEFAULT_MAX_WINDOW_HEIGHT;
         let dragInitiated = false;
         const onPointerMove = (event) => {
             if (!dragInitiated) {
@@ -181,8 +182,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
                 }]
         }], ctorParameters: () => [], propDecorators: { draggable: [{ type: i0.Input, args: [{ isSignal: true, alias: "draggable", required: false }] }], windowRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "windowRef", required: true }] }] } });
 
-const KeyboardResizeStep = 10;
-const KeyboardResizeStepFine = 1;
+const KEYBOARD_RESIZE_STEP = 10;
+const KEYBOARD_RESIZE_STEP_FINE = 1;
 class WindowResizeHandlerDirective {
     #destroyRef;
     #document;
@@ -212,7 +213,7 @@ class WindowResizeHandlerDirective {
         this.#destroyRef.onDestroy(() => this.#activeCleanup?.());
     }
     onKeydown(event) {
-        const step = event.shiftKey ? KeyboardResizeStepFine : KeyboardResizeStep;
+        const step = event.shiftKey ? KEYBOARD_RESIZE_STEP_FINE : KEYBOARD_RESIZE_STEP;
         let deltaX = 0;
         let deltaY = 0;
         switch (event.key) {
@@ -262,13 +263,13 @@ class WindowResizeHandlerDirective {
         });
     }
     #bounds() {
-        const innerWidth = this.#document.defaultView?.innerWidth || DefaultMaxWindowWidth;
-        const innerHeight = this.#document.defaultView?.innerHeight || DefaultMaxWindowHeight;
+        const innerWidth = this.#document.defaultView?.innerWidth || DEFAULT_MAX_WINDOW_WIDTH;
+        const innerHeight = this.#document.defaultView?.innerHeight || DEFAULT_MAX_WINDOW_HEIGHT;
         return {
             innerWidth,
             innerHeight,
-            minWidth: this.minWidth() || DefaultMinWindowWidth,
-            minHeight: this.minHeight() || DefaultMinWindowHeight,
+            minWidth: this.minWidth() || DEFAULT_MIN_WINDOW_WIDTH,
+            minHeight: this.minHeight() || DEFAULT_MIN_WINDOW_HEIGHT,
             maxWidth: this.maxWidth() ?? innerWidth,
             maxHeight: this.maxHeight() ?? innerHeight
         };
@@ -431,6 +432,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
                 }]
         }], ctorParameters: () => [], propDecorators: { direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: true }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], minHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "minHeight", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], windowRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "windowRef", required: true }] }] } });
 
+const WINDOW_DEFAULT_MESSAGES = {
+    close: "Close",
+    closeWindow: "Close window",
+    maximize: "Maximize",
+    minimize: "Minimize",
+    moveWindow: "Move window. Use arrow keys to move.",
+    resizeBottom: "Resize window from the bottom. Use arrow keys to resize.",
+    resizeBottomLeft: "Resize window from the bottom-left corner. Use arrow keys to resize.",
+    resizeBottomRight: "Resize window from the bottom-right corner. Use arrow keys to resize.",
+    resizeLeft: "Resize window from the left. Use arrow keys to resize.",
+    resizeRight: "Resize window from the right. Use arrow keys to resize.",
+    resizeTop: "Resize window from the top. Use arrow keys to resize.",
+    resizeTopLeft: "Resize window from the top-left corner. Use arrow keys to resize.",
+    resizeTopRight: "Resize window from the top-right corner. Use arrow keys to resize.",
+    restore: "Restore"
+};
+
 const windowBaseThemeVariants = cva(`
         flex h-full w-full flex-col
         ${themeOverlaySurfaceClasses} text-foreground
@@ -470,14 +488,14 @@ const windowResizerThemeVariants = cva(`
     `, {
     variants: {
         position: {
-            east: "top-0 bottom-0 -right-0.5 w-2 cursor-ew-resize",
-            north: "left-0 right-0 -top-0.5 h-2 cursor-ns-resize",
-            south: "left-0 right-0 -bottom-0.5 h-2 cursor-ns-resize",
-            west: "top-0 bottom-0 -left-0.5 w-2 cursor-ew-resize",
-            northeast: "-top-0.5 -right-0.5 w-2 h-2 cursor-nesw-resize",
-            northwest: "-top-0.5 -left-0.5 w-2 h-2 cursor-nwse-resize",
-            southeast: "-bottom-0.5 -right-0.5 w-2 h-2 cursor-nwse-resize",
-            southwest: "-bottom-0.5 -left-0.5 w-2 h-2 cursor-nesw-resize"
+            east: "inset-y-0 -end-0.5 w-2 cursor-ew-resize rtl:-start-0.5 rtl:end-auto",
+            north: "inset-x-0 -top-0.5 h-2 cursor-ns-resize",
+            south: "inset-x-0 -bottom-0.5 h-2 cursor-ns-resize",
+            west: "inset-y-0 -start-0.5 w-2 cursor-ew-resize rtl:-end-0.5 rtl:start-auto",
+            northeast: "-top-0.5 -end-0.5 w-2 h-2 cursor-nesw-resize rtl:-start-0.5 rtl:end-auto",
+            northwest: "-top-0.5 -start-0.5 w-2 h-2 cursor-nwse-resize rtl:-end-0.5 rtl:start-auto",
+            southeast: "-bottom-0.5 -end-0.5 w-2 h-2 cursor-nwse-resize rtl:-start-0.5 rtl:end-auto",
+            southwest: "-bottom-0.5 -start-0.5 w-2 h-2 cursor-nesw-resize rtl:-end-0.5 rtl:start-auto"
         }
     }
 });
@@ -538,7 +556,9 @@ class WindowContentComponent {
     #appRef;
     #document;
     #hostElementRef;
+    #i18n;
     #injector;
+    #localeMessages;
     #sizeBeforeMaximize;
     #sizeBeforeMinimize;
     #trapFocus;
@@ -547,7 +567,9 @@ class WindowContentComponent {
         this.#appRef = inject(ApplicationRef);
         this.#document = inject(DOCUMENT);
         this.#hostElementRef = inject(ElementRef);
+        this.#i18n = inject(MonaI18nService);
         this.#injector = inject(Injector);
+        this.#localeMessages = this.#i18n.componentMessages("window", WINDOW_DEFAULT_MESSAGES);
         this.#sizeBeforeMaximize = signal({ width: 0, height: 0, top: 0, left: 0 }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "#sizeBeforeMaximize" }] : /* istanbul ignore next */ []));
         this.#sizeBeforeMinimize = signal(0, /* @ts-ignore */
@@ -583,6 +605,10 @@ class WindowContentComponent {
         ...(ngDevMode ? [{ debugName: "maximizeIcon" }] : /* istanbul ignore next */ []));
         this.maximized = signal(false, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "maximized" }] : /* istanbul ignore next */ []));
+        this.messages = computed(() => {
+            return mergeMessages(this.#localeMessages(), this.windowData.messages);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "messages" }] : /* istanbul ignore next */ []));
         this.minimized = signal(false, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "minimized" }] : /* istanbul ignore next */ []));
         this.titleBarActionClass = computed(() => {
@@ -709,7 +735,7 @@ class WindowContentComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: WindowContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: WindowContentComponent, isStandalone: true, selector: "mona-window-content", host: { attributes: { "role": "dialog" }, properties: { "class": "baseClass()", "attr.aria-labelledby": "headerId", "attr.aria-modal": "windowData.modal ?? false" } }, viewQueries: [{ propertyName: "componentAnchor", first: true, predicate: ["componentAnchor"], descendants: true, read: ViewContainerRef, isSignal: true }], hostDirectives: [{ directive: i1.CdkTrapFocus }], ngImport: i0, template: "<div [class]=\"contentContainerClass()\">\n    <div\n        [class]=\"titleBarClass()\"\n        monaWindowDragHandler\n        (dblclick)=\"onMaximizeClick()\"\n        [draggable]=\"windowData.draggable\"\n        [windowRef]=\"windowData.windowReference\"\n        [attr.tabindex]=\"windowData.draggable ? 0 : null\"\n        [attr.aria-label]=\"windowData.draggable ? 'Move window. Use arrow keys to move.' : null\">\n        <div [id]=\"headerId\" [class]=\"titleContainerClass()\">\n            @if (windowData.titleTemplate) {\n                <ng-container [ngTemplateOutlet]=\"windowData.titleTemplate\"></ng-container>\n            } @else {\n                <span [class]=\"titleClass()\">{{ windowData.title ?? \"\" }}</span>\n            }\n        </div>\n        <div [class]=\"titleBarActionClass()\">\n            @if (windowData.actionTemplate) {\n                <ng-container\n                    [ngTemplateOutlet]=\"windowData.actionTemplate\"\n                    [ngTemplateOutletContext]=\"{ $implicit: windowData.windowReference.windowRef }\">\n                </ng-container>\n            }\n            @let maximizeTitle = maximized() || minimized() ? \"Restore\" : \"Maximize\";\n            @if (windowData.minimizable && !minimized()) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    [title]=\"'Minimize'\"\n                    aria-label=\"Minimize\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onMinimizeClick()\">\n                    <svg lucideMinus [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n            @if (windowData.maximizable) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    [title]=\"maximizeTitle\"\n                    [attr.aria-label]=\"maximizeTitle\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onMaximizeClick()\">\n                    <svg [lucideIcon]=\"maximizeIcon()\" [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n            @if (windowData.closable) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    title=\"Close\"\n                    aria-label=\"Close window\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onCloseClick($event)\">\n                    <svg lucideX [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n        </div>\n    </div>\n    @if (!minimized()) {\n        <div [class]=\"contentClass()\">\n            @switch (contentType()) {\n                @case (\"template\") {\n                    <ng-container [ngTemplateOutlet]=\"contentTemplate()!\"></ng-container>\n                }\n                @case (\"component\") {\n                    <ng-container #componentAnchor></ng-container>\n                }\n            }\n        </div>\n        @if (windowData.footerTemplate) {\n            <div>\n                <ng-container [ngTemplateOutlet]=\"windowData.footerTemplate\"></ng-container>\n            </div>\n        }\n    }\n    @if (windowData.resizable && !maximized()) {\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"north\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the top. Use arrow keys to resize.\"\n            [class]=\"'north' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"south\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the bottom. Use arrow keys to resize.\"\n            [class]=\"'south' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"east\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the right. Use arrow keys to resize.\"\n            [class]=\"'east' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"west\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the left. Use arrow keys to resize.\"\n            [class]=\"'west' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"northeast\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the top-right corner. Use arrow keys to resize.\"\n            [class]=\"'northeast' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"northwest\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the top-left corner. Use arrow keys to resize.\"\n            [class]=\"'northwest' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"southeast\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the bottom-right corner. Use arrow keys to resize.\"\n            [class]=\"'southeast' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"southwest\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the bottom-left corner. Use arrow keys to resize.\"\n            [class]=\"'southwest' | monaResizePosition\"></div>\n    }\n</div>\n", dependencies: [{ kind: "directive", type: WindowDragHandlerDirective, selector: "div[monaWindowDragHandler]", inputs: ["draggable", "windowRef"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: WindowResizeHandlerDirective, selector: "div[monaWindowResizeHandler]", inputs: ["direction", "maxHeight", "maxWidth", "minHeight", "minWidth", "windowRef"] }, { kind: "component", type: LucideMinus, selector: "svg[lucideMinus]" }, { kind: "component", type: LucideDynamicIcon, selector: "svg[lucideIcon]", inputs: ["lucideIcon"] }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }, { kind: "pipe", type: ResizePositionPipe, name: "monaResizePosition" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: WindowContentComponent, isStandalone: true, selector: "mona-window-content", host: { attributes: { "role": "dialog" }, properties: { "class": "baseClass()", "attr.aria-labelledby": "headerId", "attr.aria-modal": "windowData.modal ?? false" } }, viewQueries: [{ propertyName: "componentAnchor", first: true, predicate: ["componentAnchor"], descendants: true, read: ViewContainerRef, isSignal: true }], hostDirectives: [{ directive: i1.CdkTrapFocus }], ngImport: i0, template: "<div [class]=\"contentContainerClass()\">\n    <div\n        [class]=\"titleBarClass()\"\n        monaWindowDragHandler\n        (dblclick)=\"onMaximizeClick()\"\n        [draggable]=\"windowData.draggable\"\n        [windowRef]=\"windowData.windowReference\"\n        [attr.tabindex]=\"windowData.draggable ? 0 : null\"\n        [attr.aria-label]=\"windowData.draggable ? messages().moveWindow : null\">\n        <div [id]=\"headerId\" [class]=\"titleContainerClass()\">\n            @if (windowData.titleTemplate) {\n                <ng-container [ngTemplateOutlet]=\"windowData.titleTemplate\"></ng-container>\n            } @else {\n                <span [class]=\"titleClass()\">{{ windowData.title ?? \"\" }}</span>\n            }\n        </div>\n        <div [class]=\"titleBarActionClass()\">\n            @if (windowData.actionTemplate) {\n                <ng-container\n                    [ngTemplateOutlet]=\"windowData.actionTemplate\"\n                    [ngTemplateOutletContext]=\"{ $implicit: windowData.windowReference.windowRef }\">\n                </ng-container>\n            }\n            @let maximizeTitle = maximized() || minimized() ? messages().restore : messages().maximize;\n            @if (windowData.minimizable && !minimized()) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    [title]=\"messages().minimize\"\n                    [attr.aria-label]=\"messages().minimize\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onMinimizeClick()\">\n                    <svg lucideMinus [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n            @if (windowData.maximizable) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    [title]=\"maximizeTitle\"\n                    [attr.aria-label]=\"maximizeTitle\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onMaximizeClick()\">\n                    <svg [lucideIcon]=\"maximizeIcon()\" [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n            @if (windowData.closable) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    [title]=\"messages().close\"\n                    [attr.aria-label]=\"messages().closeWindow\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onCloseClick($event)\">\n                    <svg lucideX [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n        </div>\n    </div>\n    @if (!minimized()) {\n        <div [class]=\"contentClass()\">\n            @switch (contentType()) {\n                @case (\"template\") {\n                    <ng-container [ngTemplateOutlet]=\"contentTemplate()!\"></ng-container>\n                }\n                @case (\"component\") {\n                    <ng-container #componentAnchor></ng-container>\n                }\n            }\n        </div>\n        @if (windowData.footerTemplate) {\n            <div>\n                <ng-container [ngTemplateOutlet]=\"windowData.footerTemplate\"></ng-container>\n            </div>\n        }\n    }\n    @if (windowData.resizable && !maximized()) {\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"north\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeTop\"\n            [class]=\"'north' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"south\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeBottom\"\n            [class]=\"'south' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"east\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeRight\"\n            [class]=\"'east' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"west\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeLeft\"\n            [class]=\"'west' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"northeast\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeTopRight\"\n            [class]=\"'northeast' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"northwest\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeTopLeft\"\n            [class]=\"'northwest' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"southeast\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeBottomRight\"\n            [class]=\"'southeast' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"southwest\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeBottomLeft\"\n            [class]=\"'southwest' | monaResizePosition\"></div>\n    }\n</div>\n", dependencies: [{ kind: "directive", type: WindowDragHandlerDirective, selector: "div[monaWindowDragHandler]", inputs: ["draggable", "windowRef"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: WindowResizeHandlerDirective, selector: "div[monaWindowResizeHandler]", inputs: ["direction", "maxHeight", "maxWidth", "minHeight", "minWidth", "windowRef"] }, { kind: "component", type: LucideMinus, selector: "svg[lucideMinus]" }, { kind: "component", type: LucideDynamicIcon, selector: "svg[lucideIcon]", inputs: ["lucideIcon"] }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }, { kind: "pipe", type: ResizePositionPipe, name: "monaResizePosition" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: WindowContentComponent, decorators: [{
             type: Component,
@@ -727,7 +753,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
                         "[attr.aria-labelledby]": "headerId",
                         "[attr.aria-modal]": "windowData.modal ?? false",
                         role: "dialog"
-                    }, hostDirectives: [CdkTrapFocus], template: "<div [class]=\"contentContainerClass()\">\n    <div\n        [class]=\"titleBarClass()\"\n        monaWindowDragHandler\n        (dblclick)=\"onMaximizeClick()\"\n        [draggable]=\"windowData.draggable\"\n        [windowRef]=\"windowData.windowReference\"\n        [attr.tabindex]=\"windowData.draggable ? 0 : null\"\n        [attr.aria-label]=\"windowData.draggable ? 'Move window. Use arrow keys to move.' : null\">\n        <div [id]=\"headerId\" [class]=\"titleContainerClass()\">\n            @if (windowData.titleTemplate) {\n                <ng-container [ngTemplateOutlet]=\"windowData.titleTemplate\"></ng-container>\n            } @else {\n                <span [class]=\"titleClass()\">{{ windowData.title ?? \"\" }}</span>\n            }\n        </div>\n        <div [class]=\"titleBarActionClass()\">\n            @if (windowData.actionTemplate) {\n                <ng-container\n                    [ngTemplateOutlet]=\"windowData.actionTemplate\"\n                    [ngTemplateOutletContext]=\"{ $implicit: windowData.windowReference.windowRef }\">\n                </ng-container>\n            }\n            @let maximizeTitle = maximized() || minimized() ? \"Restore\" : \"Maximize\";\n            @if (windowData.minimizable && !minimized()) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    [title]=\"'Minimize'\"\n                    aria-label=\"Minimize\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onMinimizeClick()\">\n                    <svg lucideMinus [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n            @if (windowData.maximizable) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    [title]=\"maximizeTitle\"\n                    [attr.aria-label]=\"maximizeTitle\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onMaximizeClick()\">\n                    <svg [lucideIcon]=\"maximizeIcon()\" [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n            @if (windowData.closable) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    title=\"Close\"\n                    aria-label=\"Close window\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onCloseClick($event)\">\n                    <svg lucideX [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n        </div>\n    </div>\n    @if (!minimized()) {\n        <div [class]=\"contentClass()\">\n            @switch (contentType()) {\n                @case (\"template\") {\n                    <ng-container [ngTemplateOutlet]=\"contentTemplate()!\"></ng-container>\n                }\n                @case (\"component\") {\n                    <ng-container #componentAnchor></ng-container>\n                }\n            }\n        </div>\n        @if (windowData.footerTemplate) {\n            <div>\n                <ng-container [ngTemplateOutlet]=\"windowData.footerTemplate\"></ng-container>\n            </div>\n        }\n    }\n    @if (windowData.resizable && !maximized()) {\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"north\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the top. Use arrow keys to resize.\"\n            [class]=\"'north' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"south\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the bottom. Use arrow keys to resize.\"\n            [class]=\"'south' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"east\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the right. Use arrow keys to resize.\"\n            [class]=\"'east' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"west\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the left. Use arrow keys to resize.\"\n            [class]=\"'west' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"northeast\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the top-right corner. Use arrow keys to resize.\"\n            [class]=\"'northeast' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"northwest\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the top-left corner. Use arrow keys to resize.\"\n            [class]=\"'northwest' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"southeast\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the bottom-right corner. Use arrow keys to resize.\"\n            [class]=\"'southeast' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"southwest\"\n            tabindex=\"0\"\n            aria-label=\"Resize window from the bottom-left corner. Use arrow keys to resize.\"\n            [class]=\"'southwest' | monaResizePosition\"></div>\n    }\n</div>\n" }]
+                    }, hostDirectives: [CdkTrapFocus], template: "<div [class]=\"contentContainerClass()\">\n    <div\n        [class]=\"titleBarClass()\"\n        monaWindowDragHandler\n        (dblclick)=\"onMaximizeClick()\"\n        [draggable]=\"windowData.draggable\"\n        [windowRef]=\"windowData.windowReference\"\n        [attr.tabindex]=\"windowData.draggable ? 0 : null\"\n        [attr.aria-label]=\"windowData.draggable ? messages().moveWindow : null\">\n        <div [id]=\"headerId\" [class]=\"titleContainerClass()\">\n            @if (windowData.titleTemplate) {\n                <ng-container [ngTemplateOutlet]=\"windowData.titleTemplate\"></ng-container>\n            } @else {\n                <span [class]=\"titleClass()\">{{ windowData.title ?? \"\" }}</span>\n            }\n        </div>\n        <div [class]=\"titleBarActionClass()\">\n            @if (windowData.actionTemplate) {\n                <ng-container\n                    [ngTemplateOutlet]=\"windowData.actionTemplate\"\n                    [ngTemplateOutletContext]=\"{ $implicit: windowData.windowReference.windowRef }\">\n                </ng-container>\n            }\n            @let maximizeTitle = maximized() || minimized() ? messages().restore : messages().maximize;\n            @if (windowData.minimizable && !minimized()) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    [title]=\"messages().minimize\"\n                    [attr.aria-label]=\"messages().minimize\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onMinimizeClick()\">\n                    <svg lucideMinus [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n            @if (windowData.maximizable) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    [title]=\"maximizeTitle\"\n                    [attr.aria-label]=\"maximizeTitle\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onMaximizeClick()\">\n                    <svg [lucideIcon]=\"maximizeIcon()\" [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n            @if (windowData.closable) {\n                <button\n                    monaButton\n                    look=\"ghost\"\n                    size=\"small\"\n                    type=\"button\"\n                    [iconOnly]=\"true\"\n                    [rounded]=\"windowData.rounded\"\n                    [title]=\"messages().close\"\n                    [attr.aria-label]=\"messages().closeWindow\"\n                    (dblclick)=\"$event.stopPropagation()\"\n                    (click)=\"onCloseClick($event)\">\n                    <svg lucideX [size]=\"16\" aria-hidden=\"true\"></svg>\n                </button>\n            }\n        </div>\n    </div>\n    @if (!minimized()) {\n        <div [class]=\"contentClass()\">\n            @switch (contentType()) {\n                @case (\"template\") {\n                    <ng-container [ngTemplateOutlet]=\"contentTemplate()!\"></ng-container>\n                }\n                @case (\"component\") {\n                    <ng-container #componentAnchor></ng-container>\n                }\n            }\n        </div>\n        @if (windowData.footerTemplate) {\n            <div>\n                <ng-container [ngTemplateOutlet]=\"windowData.footerTemplate\"></ng-container>\n            </div>\n        }\n    }\n    @if (windowData.resizable && !maximized()) {\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"north\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeTop\"\n            [class]=\"'north' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"south\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeBottom\"\n            [class]=\"'south' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"east\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeRight\"\n            [class]=\"'east' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"west\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeLeft\"\n            [class]=\"'west' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"northeast\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeTopRight\"\n            [class]=\"'northeast' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"northwest\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeTopLeft\"\n            [class]=\"'northwest' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"southeast\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeBottomRight\"\n            [class]=\"'southeast' | monaResizePosition\"></div>\n        <div\n            monaWindowResizeHandler\n            [minWidth]=\"windowData.minWidth\"\n            [minHeight]=\"windowData.minHeight\"\n            [maxWidth]=\"windowData.maxWidth\"\n            [maxHeight]=\"windowData.maxHeight\"\n            [windowRef]=\"windowData.windowReference\"\n            direction=\"southwest\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"messages().resizeBottomLeft\"\n            [class]=\"'southwest' | monaResizePosition\"></div>\n    }\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { componentAnchor: [{ type: i0.ViewChild, args: ["componentAnchor", { ...{
                             read: ViewContainerRef
                         }, isSignal: true }] }] } });
@@ -805,8 +831,8 @@ class WindowReference {
         const element = this.#popupRefOrThrow.overlayRef.overlayElement;
         const width = element.getBoundingClientRect().width;
         const height = element.getBoundingClientRect().height;
-        const left = (this.document.defaultView?.innerWidth || DefaultMaxWindowWidth - width) / 2;
-        const top = (this.document.defaultView?.innerHeight || DefaultMaxWindowHeight - height) / 2;
+        const left = (this.document.defaultView?.innerWidth || DEFAULT_MAX_WINDOW_WIDTH - width) / 2;
+        const top = (this.document.defaultView?.innerHeight || DEFAULT_MAX_WINDOW_HEIGHT - height) / 2;
         element.style.left = `${left}px`;
         element.style.top = `${top}px`;
     }
@@ -903,6 +929,7 @@ const createWindowInjectorData = (settings) => {
         maxHeight: settings.maxHeight,
         maxWidth: settings.maxWidth,
         maximizable: settings.maximizable ?? true,
+        messages: settings.messages,
         minHeight: settings.minHeight ?? 50,
         minWidth: settings.minWidth ?? 50,
         minimizable: settings.minimizable ?? true,
@@ -991,20 +1018,18 @@ class WindowComponent {
          */
         this.closable = input(true, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "closable" }] : /* istanbul ignore next */ []));
-        /**
-         * @description Emits when the window is about to be closed.
-         */
+        // eslint-disable-next-line @angular-eslint/no-output-native
         this.close = output();
-        /**
-         * @description Emitted after the window has fully closed (post-animation). Preventing this event has no effect.
-         */
-        this.closed = output();
         /**
          * @description Sets whether the window should close when the escape key is pressed.
          * @default true
          */
         this.closeOnEscape = input(true, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "closeOnEscape" }] : /* istanbul ignore next */ []));
+        /**
+         * @description Emitted after the window has fully closed (post-animation). Preventing this event has no effect.
+         */
+        this.closed = output();
         /**
          * @description Emits when the window dragging ends.
          */
@@ -1057,6 +1082,11 @@ class WindowComponent {
          */
         this.maximizable = input(/* @ts-ignore */
         ...(ngDevMode ? [undefined, { debugName: "maximizable" }] : /* istanbul ignore next */ []));
+        /**
+         * @description Internationalization message overrides for accessible labels.
+         */
+        this.messages = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "messages" }] : /* istanbul ignore next */ []));
         /**
          * @description Sets the minimum height of the window.
          */
@@ -1157,6 +1187,7 @@ class WindowComponent {
             maxHeight: this.maxHeight(),
             maxWidth: this.maxWidth(),
             maximizable: this.maximizable(),
+            messages: this.messages(),
             minHeight: this.minHeight(),
             minWidth: this.minWidth(),
             minimizable: this.minimizable(),
@@ -1224,7 +1255,7 @@ class WindowComponent {
         this.#setResizeSubscription();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: WindowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.6", type: WindowComponent, isStandalone: true, selector: "mona-window", inputs: { closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, focusedElement: { classPropertyName: "focusedElement", publicName: "focusedElement", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, left: { classPropertyName: "left", publicName: "left", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, maximizable: { classPropertyName: "maximizable", publicName: "maximizable", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, minimizable: { classPropertyName: "minimizable", publicName: "minimizable", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, top: { classPropertyName: "top", publicName: "top", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close", closed: "closed", dragEnd: "dragEnd", dragStart: "dragStart", height: "heightChange", left: "leftChange", top: "topChange", width: "widthChange" }, host: { classAttribute: "hidden" }, queries: [{ propertyName: "actionTemplate", first: true, predicate: WindowActionTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "contentTemplate", first: true, predicate: WindowContentTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "footerTemplate", first: true, predicate: WindowFooterTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "titleTemplate", first: true, predicate: WindowTitleTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: ``, isInline: true }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.6", type: WindowComponent, isStandalone: true, selector: "mona-window", inputs: { closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, focusedElement: { classPropertyName: "focusedElement", publicName: "focusedElement", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, left: { classPropertyName: "left", publicName: "left", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, maximizable: { classPropertyName: "maximizable", publicName: "maximizable", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, minimizable: { classPropertyName: "minimizable", publicName: "minimizable", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, top: { classPropertyName: "top", publicName: "top", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close", closed: "closed", dragEnd: "dragEnd", dragStart: "dragStart", height: "heightChange", left: "leftChange", top: "topChange", width: "widthChange" }, host: { classAttribute: "hidden" }, queries: [{ propertyName: "actionTemplate", first: true, predicate: WindowActionTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "contentTemplate", first: true, predicate: WindowContentTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "footerTemplate", first: true, predicate: WindowFooterTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "titleTemplate", first: true, predicate: WindowTitleTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: ``, isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: WindowComponent, decorators: [{
             type: Component,
@@ -1235,7 +1266,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
                         class: "hidden"
                     }
                 }]
-        }], ctorParameters: () => [], propDecorators: { actionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => WindowActionTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], contentTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => WindowContentTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], footerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => WindowFooterTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], titleTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => WindowTitleTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], closable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closable", required: false }] }], close: [{ type: i0.Output, args: ["close"] }], closed: [{ type: i0.Output, args: ["closed"] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], dragEnd: [{ type: i0.Output, args: ["dragEnd"] }], dragStart: [{ type: i0.Output, args: ["dragStart"] }], draggable: [{ type: i0.Input, args: [{ isSignal: true, alias: "draggable", required: false }] }], focusedElement: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusedElement", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }, { type: i0.Output, args: ["heightChange"] }], left: [{ type: i0.Input, args: [{ isSignal: true, alias: "left", required: false }] }, { type: i0.Output, args: ["leftChange"] }], look: [{ type: i0.Input, args: [{ isSignal: true, alias: "look", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], maximizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "maximizable", required: false }] }], minHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "minHeight", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], minimizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "minimizable", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], resizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizable", required: false }] }], rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], top: [{ type: i0.Input, args: [{ isSignal: true, alias: "top", required: false }] }, { type: i0.Output, args: ["topChange"] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }, { type: i0.Output, args: ["widthChange"] }] } });
+        }], ctorParameters: () => [], propDecorators: { actionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => WindowActionTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], contentTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => WindowContentTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], footerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => WindowFooterTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], titleTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => WindowTitleTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], closable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closable", required: false }] }], close: [{ type: i0.Output, args: ["close"] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }], dragEnd: [{ type: i0.Output, args: ["dragEnd"] }], dragStart: [{ type: i0.Output, args: ["dragStart"] }], draggable: [{ type: i0.Input, args: [{ isSignal: true, alias: "draggable", required: false }] }], focusedElement: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusedElement", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }, { type: i0.Output, args: ["heightChange"] }], left: [{ type: i0.Input, args: [{ isSignal: true, alias: "left", required: false }] }, { type: i0.Output, args: ["leftChange"] }], look: [{ type: i0.Input, args: [{ isSignal: true, alias: "look", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], maximizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "maximizable", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], minHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "minHeight", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], minimizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "minimizable", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], resizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizable", required: false }] }], rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], top: [{ type: i0.Input, args: [{ isSignal: true, alias: "top", required: false }] }, { type: i0.Output, args: ["topChange"] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }, { type: i0.Output, args: ["widthChange"] }] } });
 
 /*
  * Public API Surface of @nanahoshi/mona-ui/window
@@ -1245,5 +1276,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { WindowActionTemplateDirective, WindowComponent, WindowContentTemplateDirective, WindowFooterTemplateDirective, WindowRef, WindowService, WindowTitleTemplateDirective };
+export { WINDOW_DEFAULT_MESSAGES, WindowActionTemplateDirective, WindowComponent, WindowContentTemplateDirective, WindowFooterTemplateDirective, WindowRef, WindowService, WindowTitleTemplateDirective };
 //# sourceMappingURL=nanahoshi-mona-ui-window.mjs.map

package/i18n/package.json

@@ -0,0 +1,4 @@
+{
+  "module": "../fesm2022/nanahoshi-mona-ui-i18n.mjs",
+  "typings": "../types/nanahoshi-mona-ui-i18n.d.ts"
+}

package/locales/package.json

@@ -0,0 +1,4 @@
+{
+  "module": "../fesm2022/nanahoshi-mona-ui-locales.mjs",
+  "typings": "../types/nanahoshi-mona-ui-locales.d.ts"
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nanahoshi/mona-ui",
-  "version": "0.18.6",
+  "version": "0.20.0",
   "description": "A very light Angular UI framework",
   "author": "Nanahoshi",
   "repository": {
@@ -187,6 +187,10 @@
       "types": "./types/nanahoshi-mona-ui-grid.d.ts",
       "default": "./fesm2022/nanahoshi-mona-ui-grid.mjs"
     },
+    "./i18n": {
+      "types": "./types/nanahoshi-mona-ui-i18n.d.ts",
+      "default": "./fesm2022/nanahoshi-mona-ui-i18n.mjs"
+    },
     "./internal": {
       "types": "./types/nanahoshi-mona-ui-internal.d.ts",
       "default": "./fesm2022/nanahoshi-mona-ui-internal.mjs"
@@ -223,6 +227,10 @@
       "types": "./types/nanahoshi-mona-ui-list-view.d.ts",
       "default": "./fesm2022/nanahoshi-mona-ui-list-view.mjs"
     },
+    "./locales": {
+      "types": "./types/nanahoshi-mona-ui-locales.d.ts",
+      "default": "./fesm2022/nanahoshi-mona-ui-locales.mjs"
+    },
     "./menubar": {
       "types": "./types/nanahoshi-mona-ui-menubar.d.ts",
       "default": "./fesm2022/nanahoshi-mona-ui-menubar.mjs"

package/types/nanahoshi-mona-ui-auto-complete.d.ts

@@ -1,3 +1,5 @@
+import * as _nanahoshi_mona_ui_i18n from '@nanahoshi/mona-ui/i18n';
+import { MonaAutoCompleteMessages } from '@nanahoshi/mona-ui/i18n';
 import * as _angular_core from '@angular/core';
 import { TemplateRef } from '@angular/core';
 import { FormValueControl } from '@angular/forms/signals';
@@ -50,6 +52,7 @@ declare class AutoCompleteComponent<TData = unknown> implements FormValueControl
     protected readonly isEmpty: _angular_core.Signal<boolean>;
     protected readonly listId: string;
     protected readonly listPopupClass: _angular_core.Signal<string>;
+    protected readonly messages: _angular_core.Signal<_nanahoshi_mona_ui_i18n.MonaAutoCompleteMessages>;
     protected readonly noDataTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
     protected readonly popupTemplate: _angular_core.Signal<TemplateRef<any>>;
     protected readonly prefixTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
@@ -219,4 +222,6 @@ declare class AutoCompleteComponent<TData = unknown> implements FormValueControl
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AutoCompleteComponent<any>, "mona-auto-complete", never, { "ariaDescribedBy": { "alias": "aria-describedby"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "aria-labelledby"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "itemDisabled": { "alias": "itemDisabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "highlightFirst": { "alias": "highlightFirst"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "popupClass": { "alias": "popupClass"; "required": false; "isSignal": true; }; "popupHeight": { "alias": "popupHeight"; "required": false; "isSignal": true; }; "popupWidth": { "alias": "popupWidth"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "rounded": { "alias": "rounded"; "required": false; "isSignal": true; }; "showClearButton": { "alias": "showClearButton"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "textField": { "alias": "textField"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "valueField": { "alias": "valueField"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "close": "close"; "closed": "closed"; "disabled": "disabledChange"; "open": "open"; "opened": "opened"; "touch": "touch"; "value": "valueChange"; }, ["footerTemplate", "groupHeaderTemplate", "headerTemplate", "itemTemplate", "noDataTemplate", "prefixTemplate", "suffixTemplate"], never, true, [{ directive: typeof i1.DropdownDataHandlerDirective; inputs: {}; outputs: {}; }, { directive: typeof i1.DropdownListPopupHandlerDirective; inputs: {}; outputs: {}; }]>;
 }
 
-export { AutoCompleteComponent };
+declare const AUTO_COMPLETE_DEFAULT_MESSAGES: MonaAutoCompleteMessages;
+
+export { AUTO_COMPLETE_DEFAULT_MESSAGES, AutoCompleteComponent };

package/types/nanahoshi-mona-ui-breadcrumb.d.ts

@@ -1,3 +1,5 @@
+import * as _nanahoshi_mona_ui_i18n from '@nanahoshi/mona-ui/i18n';
+import { MonaBreadcrumbMessages } from '@nanahoshi/mona-ui/i18n';
 import * as _angular_core from '@angular/core';
 import { TemplateRef } from '@angular/core';
 import * as class_variance_authority_types from 'class-variance-authority/types';
@@ -35,14 +37,16 @@ declare class BreadcrumbItemComponent {
 }
 
 declare class BreadcrumbComponent implements BreadcrumbVariantInput {
-    protected readonly itemComponents: _angular_core.Signal<readonly BreadcrumbItemComponent[]>;
+    #private;
     protected readonly currentItemClass: _angular_core.Signal<string>;
+    protected readonly itemComponents: _angular_core.Signal<readonly BreadcrumbItemComponent[]>;
     protected readonly listClass: _angular_core.Signal<string>;
+    protected readonly messages: _angular_core.Signal<_nanahoshi_mona_ui_i18n.MonaBreadcrumbMessages>;
     protected readonly separatorTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
     /**
      * @description Accessible name for the breadcrumb navigation landmark.
      * Override when multiple breadcrumb components appear on the same page.
-     * @default "Breadcrumb"
+     * @default ""
      */
     readonly ariaLabel: _angular_core.InputSignal<string>;
     /**
@@ -65,4 +69,6 @@ declare class BreadcrumbSeparatorTemplateDirective {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BreadcrumbSeparatorTemplateDirective, "ng-template[monaBreadcrumbSeparatorTemplate]", never, {}, {}, never, never, true, never>;
 }
 
-export { BreadcrumbComponent, BreadcrumbItemComponent, BreadcrumbSeparatorTemplateDirective };
+declare const BREADCRUMB_DEFAULT_MESSAGES: MonaBreadcrumbMessages;
+
+export { BREADCRUMB_DEFAULT_MESSAGES, BreadcrumbComponent, BreadcrumbItemComponent, BreadcrumbSeparatorTemplateDirective };