@nanahoshi/mona-ui 0.20.1 → 0.22.0

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

@@ -1,2 +1,2 @@
-export { C as CellEditEvent, A as GRID_DEFAULT_MESSAGES, B as GridAddCommandDirective, D as GridAddEvent, E as GridCancelCommandDirective, F as GridCancelEvent, H as GridCellTemplateDirective, I as GridColumnComponent, J as GridColumnTitleTemplateDirective, K as GridCommandColumnComponent, L as GridComponent, M as GridContextMenuDirective, N as GridDetailTemplateDirective, O as GridEditCommandDirective, P as GridEditEvent, Q as GridEditTemplateDirective, R as GridEditableDirective, S as GridExportDirective, T as GridFilterableDirective, U as GridFooterTemplateDirective, V as GridGroupFooterTemplateDirective, W as GridGroupableDirective, X as GridHeaderTemplateDirective, Y as GridNoDataTemplateDirective, Z as GridRemoveCommandDirective, _ as GridRemoveEvent, $ as GridReorderableDirective, a0 as GridResizableDirective, a1 as GridRowReorderableDirective, a2 as GridSaveCommandDirective, a3 as GridSaveEvent, a4 as GridSelectableDirective, a5 as GridSortableDirective, a6 as GridStatePersistenceDirective, a7 as GridToolbarTemplateDirective, a8 as GridVirtualScrollDirective, a9 as RowEditEvent, aa as RowReorderEvent } from './nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-BIK61ieq.mjs';
+export { C as CellEditEvent, B as GRID_DEFAULT_MESSAGES, D as GridAddCommandDirective, E as GridAddEvent, F as GridCancelCommandDirective, H as GridCancelEvent, I as GridCellTemplateDirective, J as GridColumnComponent, K as GridColumnTitleTemplateDirective, L as GridCommandColumnComponent, M as GridComponent, N as GridContextMenuDirective, O as GridDetailTemplateDirective, P as GridEditCommandDirective, Q as GridEditEvent, R as GridEditTemplateDirective, S as GridEditableDirective, T as GridExportDirective, U as GridFilterableDirective, V as GridFooterTemplateDirective, W as GridGroupFooterTemplateDirective, X as GridGroupableDirective, Y as GridHeaderTemplateDirective, Z as GridNoDataTemplateDirective, _ as GridRemoveCommandDirective, $ as GridRemoveEvent, a0 as GridReorderableDirective, a1 as GridResizableDirective, a2 as GridRowReorderableDirective, a3 as GridSaveCommandDirective, a4 as GridSaveEvent, a5 as GridSelectableDirective, a6 as GridServerBindingDirective, a7 as GridSortableDirective, a8 as GridStatePersistenceDirective, a9 as GridToolbarTemplateDirective, aa as GridVirtualScrollDirective, ab as RowEditEvent, ac as RowReorderEvent } from './nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-CIfTr1Qm.mjs';
 //# sourceMappingURL=nanahoshi-mona-ui-grid.mjs.map

package/fesm2022/nanahoshi-mona-ui-internal-filter-input.mjs

@@ -1,5 +1,6 @@
 import * as i0 from '@angular/core';
 import { inject, DestroyRef, ElementRef, signal, input, output, effect, untracked, afterNextRender, Component } from '@angular/core';
+import { LucideSearch } from '@lucide/angular';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
@@ -68,11 +69,11 @@ class FilterInputComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FilterInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.6", type: FilterInputComponent, isStandalone: true, selector: "mona-filter-input", inputs: { debounce: { classPropertyName: "debounce", publicName: "debounce", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filterChange: "filterChange", inputBlur: "inputBlur", inputFocus: "inputFocus" }, ngImport: i0, template: "<mona-text-box\n    [ngModel]=\"filterText()\"\n    [clearButton]=\"true\"\n    [placeholder]=\"placeholder()\"\n    (inputFocus)=\"inputFocus.emit($event)\"\n    (inputBlur)=\"inputBlur.emit($event)\"\n    [tabindex]=\"0\"\n    [size]=\"size()\"\n    class=\"outline-none shadow-none focus-within:ring-1 focus-within:ring-primary/40\"\n    (ngModelChange)=\"filter$.next($event)\">\n    <ng-template monaTextBoxPrefixTemplate>\n        <div class=\"h-full flex items-center justify-center ps-2\">\n            <i class=\"ri-search-line\"></i>\n        </div>\n    </ng-template>\n</mona-text-box>\n", dependencies: [{ kind: "component", type: TextBoxComponent, selector: "mona-text-box", inputs: ["clearButton", "disabled", "inputAttributes", "inputClass", "inputStyle", "invalid", "placeholder", "readonly", "required", "rounded", "size", "touched", "type", "class", "value"], outputs: ["inputBlur", "inputFocus", "touch", "valueChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: TextBoxPrefixTemplateDirective, selector: "ng-template[monaTextBoxPrefixTemplate]" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.6", type: FilterInputComponent, isStandalone: true, selector: "mona-filter-input", inputs: { debounce: { classPropertyName: "debounce", publicName: "debounce", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filterChange: "filterChange", inputBlur: "inputBlur", inputFocus: "inputFocus" }, ngImport: i0, template: "<mona-text-box\n    [ngModel]=\"filterText()\"\n    [clearButton]=\"true\"\n    [placeholder]=\"placeholder()\"\n    (inputFocus)=\"inputFocus.emit($event)\"\n    (inputBlur)=\"inputBlur.emit($event)\"\n    [tabindex]=\"0\"\n    [size]=\"size()\"\n    class=\"outline-none shadow-none focus-within:ring-1 focus-within:ring-primary/40\"\n    (ngModelChange)=\"filter$.next($event)\">\n    <ng-template monaTextBoxPrefixTemplate>\n        <div class=\"h-full flex items-center justify-center ps-2\">\n            <svg lucideSearch [size]=\"16\" aria-hidden=\"true\"></svg>\n        </div>\n    </ng-template>\n</mona-text-box>\n", dependencies: [{ kind: "component", type: LucideSearch, selector: "svg[lucideSearch]" }, { kind: "component", type: TextBoxComponent, selector: "mona-text-box", inputs: ["clearButton", "disabled", "inputAttributes", "inputClass", "inputStyle", "invalid", "placeholder", "readonly", "required", "rounded", "size", "touched", "type", "class", "value"], outputs: ["inputBlur", "inputFocus", "touch", "valueChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: TextBoxPrefixTemplateDirective, selector: "ng-template[monaTextBoxPrefixTemplate]" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FilterInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: "mona-filter-input", imports: [TextBoxComponent, FormsModule, TextBoxPrefixTemplateDirective], template: "<mona-text-box\n    [ngModel]=\"filterText()\"\n    [clearButton]=\"true\"\n    [placeholder]=\"placeholder()\"\n    (inputFocus)=\"inputFocus.emit($event)\"\n    (inputBlur)=\"inputBlur.emit($event)\"\n    [tabindex]=\"0\"\n    [size]=\"size()\"\n    class=\"outline-none shadow-none focus-within:ring-1 focus-within:ring-primary/40\"\n    (ngModelChange)=\"filter$.next($event)\">\n    <ng-template monaTextBoxPrefixTemplate>\n        <div class=\"h-full flex items-center justify-center ps-2\">\n            <i class=\"ri-search-line\"></i>\n        </div>\n    </ng-template>\n</mona-text-box>\n" }]
+            args: [{ selector: "mona-filter-input", imports: [LucideSearch, TextBoxComponent, FormsModule, TextBoxPrefixTemplateDirective], template: "<mona-text-box\n    [ngModel]=\"filterText()\"\n    [clearButton]=\"true\"\n    [placeholder]=\"placeholder()\"\n    (inputFocus)=\"inputFocus.emit($event)\"\n    (inputBlur)=\"inputBlur.emit($event)\"\n    [tabindex]=\"0\"\n    [size]=\"size()\"\n    class=\"outline-none shadow-none focus-within:ring-1 focus-within:ring-primary/40\"\n    (ngModelChange)=\"filter$.next($event)\">\n    <ng-template monaTextBoxPrefixTemplate>\n        <div class=\"h-full flex items-center justify-center ps-2\">\n            <svg lucideSearch [size]=\"16\" aria-hidden=\"true\"></svg>\n        </div>\n    </ng-template>\n</mona-text-box>\n" }]
         }], ctorParameters: () => [], propDecorators: { debounce: [{ type: i0.Input, args: [{ isSignal: true, alias: "debounce", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], filterChange: [{ type: i0.Output, args: ["filterChange"] }], inputBlur: [{ type: i0.Output, args: ["inputBlur"] }], inputFocus: [{ type: i0.Output, args: ["inputFocus"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
 
 /*

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

@@ -10,11 +10,11 @@ import { v4 } from 'uuid';
 import { cva } from 'class-variance-authority';
 import { themeOverlaySurfaceClasses } from '@nanahoshi/mona-ui/internal';
 import { CdkDropList, CdkDrag, CdkDragPreview } from '@angular/cdk/drag-drop';
+import { LucideArrowDown, LucideArrowUp, LucideBan, LucideChevronDown, LucideChevronRight, LucideLoaderCircle, LucidePlus } from '@lucide/angular';
 import * as i1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import { CheckBoxComponent } from '@nanahoshi/mona-ui/check-box';
 import { NgTemplateOutlet } from '@angular/common';
-import { twMerge } from 'tailwind-merge';
 
 class TreeNodeTemplateDirective {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TreeNodeTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
@@ -1199,7 +1199,7 @@ const treeDropHintBaseThemeVariants = cva(`
     `);
 const treeDropHintIconThemeVariants = cva(`
         absolute flex items-center justify-center
-        -top-3.25 -start-3.5 text-xl rtl:rotate-180
+        -top-2.25 -start-3.5 text-xl rtl:rotate-180
     `);
 const treeNodeBaseThemeVariants = cva(`
         cursor-default px-2 py-1 text-foreground
@@ -1710,11 +1710,18 @@ class SubTreeComponent {
         element.focus();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: SubTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: SubTreeComponent, isStandalone: true, selector: "mona-sub-tree", inputs: { depth: { classPropertyName: "depth", publicName: "depth", isSignal: true, isRequired: true, transformFunction: null }, nodes: { classPropertyName: "nodes", publicName: "nodes", isSignal: true, isRequired: true, transformFunction: null }, parent: { classPropertyName: "parent", publicName: "parent", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ul\n    [class]=\"listClass()\"\n    [attr.role]=\"parent() ? 'group' : null\"\n    cdkDropList\n    [cdkDropListSortingDisabled]=\"true\"\n    (cdkDropListDropped)=\"onNodeDrop($event)\">\n    @for (node of visibleNodes(); track node.uid) {\n        <li\n            [attr.id]=\"node.uid | treeNodeElementId\"\n            [attr.data-uid]=\"node.uid\"\n            [class]=\"listItemClass()\"\n            [tabindex]=\"-1\"\n            role=\"treeitem\"\n            [attr.aria-level]=\"depth() + 1\"\n            [attr.aria-setsize]=\"visibleNodes().length\"\n            [attr.aria-posinset]=\"$index + 1\"\n            [attr.aria-expanded]=\"nodeComponent.expandable() ? nodeComponent.expanded() : null\"\n            [attr.aria-selected]=\"treeService.selectableOptions().enabled ? nodeComponent.selected() : null\"\n            [attr.aria-disabled]=\"nodeComponent.disabled() ? true : null\"\n            [attr.aria-checked]=\"\n                nodeComponent.checkable() ? (nodeComponent.indeterminate() ? 'mixed' : nodeComponent.checked()) : null\n            \"\n            (focus)=\"treeService.navigatedNode.set(node)\"\n            cdkDrag\n            [cdkDragData]=\"node\"\n            [cdkDragDisabled]=\"!treeService.draggableOptions().enabled\"\n            (cdkDragStarted)=\"onNodeDragStart($event)\"\n            (cdkDragEnded)=\"onNodeDragEnd($event)\"\n            (cdkDragMoved)=\"onNodeDragMove($event, node)\">\n            <div [class]=\"nodeContainerClass()\">\n                @if (treeService.expandableOptions().enabled && nodeComponent.expandable()) {\n                    <button\n                        type=\"button\"\n                        tabindex=\"-1\"\n                        [class]=\"nodeExpanderClass()\"\n                        [class.mona-disabled]=\"nodeComponent.disabled()\"\n                        [attr.aria-label]=\"\n                            (nodeComponent.expanded() ? messages().collapse : messages().expand) + ' ' + nodeComponent.nodeText()\n                        \"\n                        (click)=\"onExpandStateChange(node)\">\n                        @if (node.loading()) {\n                            <i class=\"ri-loader-2-line\"></i>\n                        } @else if (nodeComponent.expanded()) {\n                            <i class=\"ri-arrow-down-s-fill\"></i>\n                        } @else {\n                            <i class=\"ri-arrow-right-s-fill rtl:rotate-180\"></i>\n                        }\n                    </button>\n                }\n                @if (nodeComponent.checkable()) {\n                    <mona-check-box\n                        aria-hidden=\"true\"\n                        [tabIndex]=\"-1\"\n                        [disabled]=\"nodeComponent.disabled()\"\n                        [indeterminate]=\"nodeComponent.indeterminate()\"\n                        [ngModel]=\"nodeComponent.checked()\"\n                        (click)=\"nodeComponent.checkboxClick$.next($event)\"\n                        (ngModelChange)=\"nodeComponent.checkboxCheck$.next($event)\"></mona-check-box>\n                }\n                <mona-tree-node [node]=\"node\" [depth]=\"depth()\" #nodeComponent></mona-tree-node>\n            </div>\n            @if (node.children().length > 0 && nodeComponent.expanded()) {\n                <div\n                    class=\"grid overflow-hidden\"\n                    [animate.enter]=\"nodeExpandEnterClass()\"\n                    [animate.leave]=\"nodeExpandLeaveClass()\">\n                    <div class=\"min-h-0 overflow-hidden\">\n                        <mona-sub-tree [nodes]=\"node.children()\" [depth]=\"depth() + 1\" [parent]=\"node\"></mona-sub-tree>\n                    </div>\n                </div>\n            }\n            @if (!nodeComponent.disabled()) {\n                <div *cdkDragPreview [class]=\"nodeDraggingClass()\">\n                    <span>\n                        @switch (treeService.dropPositionSignal()?.position) {\n                            @case (\"before\") {\n                                @if (treeService.dropAllowed()) {\n                                    <i class=\"ri-arrow-up-line\"></i>\n                                } @else {\n                                    <i class=\"ri-prohibited-2-line\"></i>\n                                }\n                            }\n                            @case (\"after\") {\n                                @if (treeService.dropAllowed()) {\n                                    <i class=\"ri-arrow-down-line\"></i>\n                                } @else {\n                                    <i class=\"ri-prohibited-2-line\"></i>\n                                }\n                            }\n                            @case (\"inside\") {\n                                <i class=\"ri-add-line\"></i>\n                            }\n                            @default {\n                                <i class=\"ri-prohibited-2-line\"></i>\n                            }\n                        }\n                    </span>\n                    <span>{{ nodeComponent.nodeText() }}</span>\n                </div>\n            } @else {\n                <div *cdkDragPreview [class]=\"nodeDraggingClass()\"></div>\n            }\n        </li>\n    }\n</ul>\n", styles: [".mona-tree-node-expand-enter{animation:mona-tree-node-expand-in .15s ease-out}.mona-tree-node-expand-leave{animation:mona-tree-node-expand-out .15s ease-out}@keyframes mona-tree-node-expand-in{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@keyframes mona-tree-node-expand-out{0%{grid-template-rows:1fr;opacity:1}to{grid-template-rows:0fr;opacity:0}}@media(prefers-reduced-motion:reduce){.mona-tree-node-expand-enter,.mona-tree-node-expand-leave{animation-duration:1ms}}\n"], dependencies: [{ kind: "component", type: SubTreeComponent, selector: "mona-sub-tree", inputs: ["depth", "nodes", "parent"] }, { kind: "component", type: TreeNodeComponent, selector: "mona-tree-node", inputs: ["depth", "node"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragPreview, selector: "ng-template[cdkDragPreview]", inputs: ["data", "matchSize"] }, { kind: "component", type: CheckBoxComponent, selector: "mona-check-box", inputs: ["checked", "disabled", "indeterminate", "invalid", "label", "labelPosition", "labelSize", "required", "rounded", "tabIndex", "touched", "class"], outputs: ["checkedChange", "inputBlur", "inputChange", "inputFocus", "touch"] }, { kind: "pipe", type: TreeNodeElementIdPipe, name: "treeNodeElementId" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: SubTreeComponent, isStandalone: true, selector: "mona-sub-tree", inputs: { depth: { classPropertyName: "depth", publicName: "depth", isSignal: true, isRequired: true, transformFunction: null }, nodes: { classPropertyName: "nodes", publicName: "nodes", isSignal: true, isRequired: true, transformFunction: null }, parent: { classPropertyName: "parent", publicName: "parent", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ul\n    [class]=\"listClass()\"\n    [attr.role]=\"parent() ? 'group' : null\"\n    cdkDropList\n    [cdkDropListSortingDisabled]=\"true\"\n    (cdkDropListDropped)=\"onNodeDrop($event)\">\n    @for (node of visibleNodes(); track node.uid) {\n        <li\n            [attr.id]=\"node.uid | treeNodeElementId\"\n            [attr.data-uid]=\"node.uid\"\n            [class]=\"listItemClass()\"\n            [tabindex]=\"-1\"\n            role=\"treeitem\"\n            [attr.aria-level]=\"depth() + 1\"\n            [attr.aria-setsize]=\"visibleNodes().length\"\n            [attr.aria-posinset]=\"$index + 1\"\n            [attr.aria-expanded]=\"nodeComponent.expandable() ? nodeComponent.expanded() : null\"\n            [attr.aria-selected]=\"treeService.selectableOptions().enabled ? nodeComponent.selected() : null\"\n            [attr.aria-disabled]=\"nodeComponent.disabled() ? true : null\"\n            [attr.aria-checked]=\"\n                nodeComponent.checkable() ? (nodeComponent.indeterminate() ? 'mixed' : nodeComponent.checked()) : null\n            \"\n            (focus)=\"treeService.navigatedNode.set(node)\"\n            cdkDrag\n            [cdkDragData]=\"node\"\n            [cdkDragDisabled]=\"!treeService.draggableOptions().enabled\"\n            (cdkDragStarted)=\"onNodeDragStart($event)\"\n            (cdkDragEnded)=\"onNodeDragEnd($event)\"\n            (cdkDragMoved)=\"onNodeDragMove($event, node)\">\n            <div [class]=\"nodeContainerClass()\">\n                @if (treeService.expandableOptions().enabled && nodeComponent.expandable()) {\n                    <button\n                        type=\"button\"\n                        tabindex=\"-1\"\n                        [class]=\"nodeExpanderClass()\"\n                        [class.mona-disabled]=\"nodeComponent.disabled()\"\n                        [attr.aria-label]=\"\n                            (nodeComponent.expanded() ? messages().collapse : messages().expand) +\n                            ' ' +\n                            nodeComponent.nodeText()\n                        \"\n                        (click)=\"onExpandStateChange(node)\">\n                        @if (node.loading()) {\n                            <svg lucideLoaderCircle [size]=\"16\" aria-hidden=\"true\" class=\"animate-spin\"></svg>\n                        } @else if (nodeComponent.expanded()) {\n                            <svg lucideChevronDown [size]=\"16\" aria-hidden=\"true\"></svg>\n                        } @else {\n                            <svg lucideChevronRight [size]=\"16\" aria-hidden=\"true\" class=\"rtl:rotate-180\"></svg>\n                        }\n                    </button>\n                }\n                @if (nodeComponent.checkable()) {\n                    <mona-check-box\n                        aria-hidden=\"true\"\n                        [tabIndex]=\"-1\"\n                        [disabled]=\"nodeComponent.disabled()\"\n                        [indeterminate]=\"nodeComponent.indeterminate()\"\n                        [ngModel]=\"nodeComponent.checked()\"\n                        (click)=\"nodeComponent.checkboxClick$.next($event)\"\n                        (ngModelChange)=\"nodeComponent.checkboxCheck$.next($event)\"></mona-check-box>\n                }\n                <mona-tree-node [node]=\"node\" [depth]=\"depth()\" #nodeComponent></mona-tree-node>\n            </div>\n            @if (node.children().length > 0 && nodeComponent.expanded()) {\n                <div\n                    class=\"grid overflow-hidden\"\n                    [animate.enter]=\"nodeExpandEnterClass()\"\n                    [animate.leave]=\"nodeExpandLeaveClass()\">\n                    <div class=\"min-h-0 overflow-hidden\">\n                        <mona-sub-tree [nodes]=\"node.children()\" [depth]=\"depth() + 1\" [parent]=\"node\"></mona-sub-tree>\n                    </div>\n                </div>\n            }\n            @if (!nodeComponent.disabled()) {\n                <div *cdkDragPreview [class]=\"nodeDraggingClass()\">\n                    <span>\n                        @switch (treeService.dropPositionSignal()?.position) {\n                            @case (\"before\") {\n                                @if (treeService.dropAllowed()) {\n                                    <svg lucideArrowUp [size]=\"16\" aria-hidden=\"true\"></svg>\n                                } @else {\n                                    <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n                                }\n                            }\n                            @case (\"after\") {\n                                @if (treeService.dropAllowed()) {\n                                    <svg lucideArrowDown [size]=\"16\" aria-hidden=\"true\"></svg>\n                                } @else {\n                                    <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n                                }\n                            }\n                            @case (\"inside\") {\n                                <svg lucidePlus [size]=\"16\" aria-hidden=\"true\"></svg>\n                            }\n                            @default {\n                                <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n                            }\n                        }\n                    </span>\n                    <span>{{ nodeComponent.nodeText() }}</span>\n                </div>\n            } @else {\n                <div *cdkDragPreview [class]=\"nodeDraggingClass()\"></div>\n            }\n        </li>\n    }\n</ul>\n", styles: [".mona-tree-node-expand-enter{animation:mona-tree-node-expand-in .15s ease-out}.mona-tree-node-expand-leave{animation:mona-tree-node-expand-out .15s ease-out}@keyframes mona-tree-node-expand-in{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@keyframes mona-tree-node-expand-out{0%{grid-template-rows:1fr;opacity:1}to{grid-template-rows:0fr;opacity:0}}@media(prefers-reduced-motion:reduce){.mona-tree-node-expand-enter,.mona-tree-node-expand-leave{animation-duration:1ms}}\n"], dependencies: [{ kind: "component", type: SubTreeComponent, selector: "mona-sub-tree", inputs: ["depth", "nodes", "parent"] }, { kind: "component", type: LucideArrowDown, selector: "svg[lucideArrowDown]" }, { kind: "component", type: LucideArrowUp, selector: "svg[lucideArrowUp]" }, { kind: "component", type: LucideBan, selector: "svg[lucideBan]" }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }, { kind: "component", type: LucideChevronRight, selector: "svg[lucideChevronRight]" }, { kind: "component", type: LucideLoaderCircle, selector: "svg[lucideLoaderCircle], svg[lucideLoader2]" }, { kind: "component", type: LucidePlus, selector: "svg[lucidePlus]" }, { kind: "component", type: TreeNodeComponent, selector: "mona-tree-node", inputs: ["depth", "node"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragPreview, selector: "ng-template[cdkDragPreview]", inputs: ["data", "matchSize"] }, { kind: "component", type: CheckBoxComponent, selector: "mona-check-box", inputs: ["checked", "disabled", "indeterminate", "invalid", "label", "labelPosition", "labelSize", "required", "rounded", "tabIndex", "touched", "class"], outputs: ["checkedChange", "inputBlur", "inputChange", "inputFocus", "touch"] }, { kind: "pipe", type: TreeNodeElementIdPipe, name: "treeNodeElementId" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: SubTreeComponent, decorators: [{
             type: Component,
             args: [{ selector: "mona-sub-tree", changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        LucideArrowDown,
+                        LucideArrowUp,
+                        LucideBan,
+                        LucideChevronDown,
+                        LucideChevronRight,
+                        LucideLoaderCircle,
+                        LucidePlus,
                         TreeNodeComponent,
                         FormsModule,
                         CdkDropList,
@@ -1722,23 +1729,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
                         CdkDragPreview,
                         CheckBoxComponent,
                         TreeNodeElementIdPipe
-                    ], template: "<ul\n    [class]=\"listClass()\"\n    [attr.role]=\"parent() ? 'group' : null\"\n    cdkDropList\n    [cdkDropListSortingDisabled]=\"true\"\n    (cdkDropListDropped)=\"onNodeDrop($event)\">\n    @for (node of visibleNodes(); track node.uid) {\n        <li\n            [attr.id]=\"node.uid | treeNodeElementId\"\n            [attr.data-uid]=\"node.uid\"\n            [class]=\"listItemClass()\"\n            [tabindex]=\"-1\"\n            role=\"treeitem\"\n            [attr.aria-level]=\"depth() + 1\"\n            [attr.aria-setsize]=\"visibleNodes().length\"\n            [attr.aria-posinset]=\"$index + 1\"\n            [attr.aria-expanded]=\"nodeComponent.expandable() ? nodeComponent.expanded() : null\"\n            [attr.aria-selected]=\"treeService.selectableOptions().enabled ? nodeComponent.selected() : null\"\n            [attr.aria-disabled]=\"nodeComponent.disabled() ? true : null\"\n            [attr.aria-checked]=\"\n                nodeComponent.checkable() ? (nodeComponent.indeterminate() ? 'mixed' : nodeComponent.checked()) : null\n            \"\n            (focus)=\"treeService.navigatedNode.set(node)\"\n            cdkDrag\n            [cdkDragData]=\"node\"\n            [cdkDragDisabled]=\"!treeService.draggableOptions().enabled\"\n            (cdkDragStarted)=\"onNodeDragStart($event)\"\n            (cdkDragEnded)=\"onNodeDragEnd($event)\"\n            (cdkDragMoved)=\"onNodeDragMove($event, node)\">\n            <div [class]=\"nodeContainerClass()\">\n                @if (treeService.expandableOptions().enabled && nodeComponent.expandable()) {\n                    <button\n                        type=\"button\"\n                        tabindex=\"-1\"\n                        [class]=\"nodeExpanderClass()\"\n                        [class.mona-disabled]=\"nodeComponent.disabled()\"\n                        [attr.aria-label]=\"\n                            (nodeComponent.expanded() ? messages().collapse : messages().expand) + ' ' + nodeComponent.nodeText()\n                        \"\n                        (click)=\"onExpandStateChange(node)\">\n                        @if (node.loading()) {\n                            <i class=\"ri-loader-2-line\"></i>\n                        } @else if (nodeComponent.expanded()) {\n                            <i class=\"ri-arrow-down-s-fill\"></i>\n                        } @else {\n                            <i class=\"ri-arrow-right-s-fill rtl:rotate-180\"></i>\n                        }\n                    </button>\n                }\n                @if (nodeComponent.checkable()) {\n                    <mona-check-box\n                        aria-hidden=\"true\"\n                        [tabIndex]=\"-1\"\n                        [disabled]=\"nodeComponent.disabled()\"\n                        [indeterminate]=\"nodeComponent.indeterminate()\"\n                        [ngModel]=\"nodeComponent.checked()\"\n                        (click)=\"nodeComponent.checkboxClick$.next($event)\"\n                        (ngModelChange)=\"nodeComponent.checkboxCheck$.next($event)\"></mona-check-box>\n                }\n                <mona-tree-node [node]=\"node\" [depth]=\"depth()\" #nodeComponent></mona-tree-node>\n            </div>\n            @if (node.children().length > 0 && nodeComponent.expanded()) {\n                <div\n                    class=\"grid overflow-hidden\"\n                    [animate.enter]=\"nodeExpandEnterClass()\"\n                    [animate.leave]=\"nodeExpandLeaveClass()\">\n                    <div class=\"min-h-0 overflow-hidden\">\n                        <mona-sub-tree [nodes]=\"node.children()\" [depth]=\"depth() + 1\" [parent]=\"node\"></mona-sub-tree>\n                    </div>\n                </div>\n            }\n            @if (!nodeComponent.disabled()) {\n                <div *cdkDragPreview [class]=\"nodeDraggingClass()\">\n                    <span>\n                        @switch (treeService.dropPositionSignal()?.position) {\n                            @case (\"before\") {\n                                @if (treeService.dropAllowed()) {\n                                    <i class=\"ri-arrow-up-line\"></i>\n                                } @else {\n                                    <i class=\"ri-prohibited-2-line\"></i>\n                                }\n                            }\n                            @case (\"after\") {\n                                @if (treeService.dropAllowed()) {\n                                    <i class=\"ri-arrow-down-line\"></i>\n                                } @else {\n                                    <i class=\"ri-prohibited-2-line\"></i>\n                                }\n                            }\n                            @case (\"inside\") {\n                                <i class=\"ri-add-line\"></i>\n                            }\n                            @default {\n                                <i class=\"ri-prohibited-2-line\"></i>\n                            }\n                        }\n                    </span>\n                    <span>{{ nodeComponent.nodeText() }}</span>\n                </div>\n            } @else {\n                <div *cdkDragPreview [class]=\"nodeDraggingClass()\"></div>\n            }\n        </li>\n    }\n</ul>\n", styles: [".mona-tree-node-expand-enter{animation:mona-tree-node-expand-in .15s ease-out}.mona-tree-node-expand-leave{animation:mona-tree-node-expand-out .15s ease-out}@keyframes mona-tree-node-expand-in{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@keyframes mona-tree-node-expand-out{0%{grid-template-rows:1fr;opacity:1}to{grid-template-rows:0fr;opacity:0}}@media(prefers-reduced-motion:reduce){.mona-tree-node-expand-enter,.mona-tree-node-expand-leave{animation-duration:1ms}}\n"] }]
+                    ], template: "<ul\n    [class]=\"listClass()\"\n    [attr.role]=\"parent() ? 'group' : null\"\n    cdkDropList\n    [cdkDropListSortingDisabled]=\"true\"\n    (cdkDropListDropped)=\"onNodeDrop($event)\">\n    @for (node of visibleNodes(); track node.uid) {\n        <li\n            [attr.id]=\"node.uid | treeNodeElementId\"\n            [attr.data-uid]=\"node.uid\"\n            [class]=\"listItemClass()\"\n            [tabindex]=\"-1\"\n            role=\"treeitem\"\n            [attr.aria-level]=\"depth() + 1\"\n            [attr.aria-setsize]=\"visibleNodes().length\"\n            [attr.aria-posinset]=\"$index + 1\"\n            [attr.aria-expanded]=\"nodeComponent.expandable() ? nodeComponent.expanded() : null\"\n            [attr.aria-selected]=\"treeService.selectableOptions().enabled ? nodeComponent.selected() : null\"\n            [attr.aria-disabled]=\"nodeComponent.disabled() ? true : null\"\n            [attr.aria-checked]=\"\n                nodeComponent.checkable() ? (nodeComponent.indeterminate() ? 'mixed' : nodeComponent.checked()) : null\n            \"\n            (focus)=\"treeService.navigatedNode.set(node)\"\n            cdkDrag\n            [cdkDragData]=\"node\"\n            [cdkDragDisabled]=\"!treeService.draggableOptions().enabled\"\n            (cdkDragStarted)=\"onNodeDragStart($event)\"\n            (cdkDragEnded)=\"onNodeDragEnd($event)\"\n            (cdkDragMoved)=\"onNodeDragMove($event, node)\">\n            <div [class]=\"nodeContainerClass()\">\n                @if (treeService.expandableOptions().enabled && nodeComponent.expandable()) {\n                    <button\n                        type=\"button\"\n                        tabindex=\"-1\"\n                        [class]=\"nodeExpanderClass()\"\n                        [class.mona-disabled]=\"nodeComponent.disabled()\"\n                        [attr.aria-label]=\"\n                            (nodeComponent.expanded() ? messages().collapse : messages().expand) +\n                            ' ' +\n                            nodeComponent.nodeText()\n                        \"\n                        (click)=\"onExpandStateChange(node)\">\n                        @if (node.loading()) {\n                            <svg lucideLoaderCircle [size]=\"16\" aria-hidden=\"true\" class=\"animate-spin\"></svg>\n                        } @else if (nodeComponent.expanded()) {\n                            <svg lucideChevronDown [size]=\"16\" aria-hidden=\"true\"></svg>\n                        } @else {\n                            <svg lucideChevronRight [size]=\"16\" aria-hidden=\"true\" class=\"rtl:rotate-180\"></svg>\n                        }\n                    </button>\n                }\n                @if (nodeComponent.checkable()) {\n                    <mona-check-box\n                        aria-hidden=\"true\"\n                        [tabIndex]=\"-1\"\n                        [disabled]=\"nodeComponent.disabled()\"\n                        [indeterminate]=\"nodeComponent.indeterminate()\"\n                        [ngModel]=\"nodeComponent.checked()\"\n                        (click)=\"nodeComponent.checkboxClick$.next($event)\"\n                        (ngModelChange)=\"nodeComponent.checkboxCheck$.next($event)\"></mona-check-box>\n                }\n                <mona-tree-node [node]=\"node\" [depth]=\"depth()\" #nodeComponent></mona-tree-node>\n            </div>\n            @if (node.children().length > 0 && nodeComponent.expanded()) {\n                <div\n                    class=\"grid overflow-hidden\"\n                    [animate.enter]=\"nodeExpandEnterClass()\"\n                    [animate.leave]=\"nodeExpandLeaveClass()\">\n                    <div class=\"min-h-0 overflow-hidden\">\n                        <mona-sub-tree [nodes]=\"node.children()\" [depth]=\"depth() + 1\" [parent]=\"node\"></mona-sub-tree>\n                    </div>\n                </div>\n            }\n            @if (!nodeComponent.disabled()) {\n                <div *cdkDragPreview [class]=\"nodeDraggingClass()\">\n                    <span>\n                        @switch (treeService.dropPositionSignal()?.position) {\n                            @case (\"before\") {\n                                @if (treeService.dropAllowed()) {\n                                    <svg lucideArrowUp [size]=\"16\" aria-hidden=\"true\"></svg>\n                                } @else {\n                                    <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n                                }\n                            }\n                            @case (\"after\") {\n                                @if (treeService.dropAllowed()) {\n                                    <svg lucideArrowDown [size]=\"16\" aria-hidden=\"true\"></svg>\n                                } @else {\n                                    <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n                                }\n                            }\n                            @case (\"inside\") {\n                                <svg lucidePlus [size]=\"16\" aria-hidden=\"true\"></svg>\n                            }\n                            @default {\n                                <svg lucideBan [size]=\"16\" aria-hidden=\"true\"></svg>\n                            }\n                        }\n                    </span>\n                    <span>{{ nodeComponent.nodeText() }}</span>\n                </div>\n            } @else {\n                <div *cdkDragPreview [class]=\"nodeDraggingClass()\"></div>\n            }\n        </li>\n    }\n</ul>\n", styles: [".mona-tree-node-expand-enter{animation:mona-tree-node-expand-in .15s ease-out}.mona-tree-node-expand-leave{animation:mona-tree-node-expand-out .15s ease-out}@keyframes mona-tree-node-expand-in{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@keyframes mona-tree-node-expand-out{0%{grid-template-rows:1fr;opacity:1}to{grid-template-rows:0fr;opacity:0}}@media(prefers-reduced-motion:reduce){.mona-tree-node-expand-enter,.mona-tree-node-expand-leave{animation-duration:1ms}}\n"] }]
         }], propDecorators: { depth: [{ type: i0.Input, args: [{ isSignal: true, alias: "depth", required: true }] }], nodes: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodes", required: true }] }], parent: [{ type: i0.Input, args: [{ isSignal: true, alias: "parent", required: true }] }] } });
 
 class TreeDropHintComponent {
     #direction;
     #dropPositionChange;
     #hostElementRef;
-    #i18n;
     constructor() {
         this.#direction = injectComponentDirection();
         this.#dropPositionChange = toSignal(inject(TreeService).dropPositionChange$, {
             initialValue: null
         });
         this.#hostElementRef = inject(ElementRef);
-        this.#i18n = inject(MonaI18nService);
-        this.isRtl = computed(() => this.#direction() === "rtl", /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "isRtl" }] : /* istanbul ignore next */ []));
         this.baseClass = computed(() => {
             return treeDropHintBaseThemeVariants();
         }, /* @ts-ignore */
@@ -1780,11 +1783,11 @@ class TreeDropHintComponent {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "dropHintStyles" }] : /* istanbul ignore next */ []));
         this.iconClass = computed(() => {
-            const icon = "ri-arrow-right-s-fill";
-            const variantClass = treeDropHintIconThemeVariants();
-            return twMerge(icon, variantClass);
+            return treeDropHintIconThemeVariants();
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "iconClass" }] : /* istanbul ignore next */ []));
+        this.isRtl = computed(() => this.#direction() === "rtl", /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isRtl" }] : /* istanbul ignore next */ []));
         afterRenderEffect({
             write: () => {
                 const styles = this.dropHintStyles();
@@ -1793,13 +1796,13 @@ class TreeDropHintComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TreeDropHintComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: TreeDropHintComponent, isStandalone: true, selector: "mona-tree-drop-hint", host: { properties: { "class": "baseClass()" } }, ngImport: i0, template: "<i [class]=\"iconClass()\"></i>\n" }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: TreeDropHintComponent, isStandalone: true, selector: "mona-tree-drop-hint", host: { properties: { "class": "baseClass()" } }, ngImport: i0, template: "<svg lucideChevronRight [size]=\"20\" [class]=\"iconClass()\" aria-hidden=\"true\"></svg>\n", dependencies: [{ kind: "component", type: LucideChevronRight, selector: "svg[lucideChevronRight]" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TreeDropHintComponent, decorators: [{
             type: Component,
-            args: [{ selector: "mona-tree-drop-hint", host: {
+            args: [{ selector: "mona-tree-drop-hint", imports: [LucideChevronRight], host: {
                         "[class]": "baseClass()"
-                    }, template: "<i [class]=\"iconClass()\"></i>\n" }]
+                    }, template: "<svg lucideChevronRight [size]=\"20\" [class]=\"iconClass()\" aria-hidden=\"true\"></svg>\n" }]
         }], ctorParameters: () => [] });
 
 class TreeComponent {

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

@@ -246,6 +246,7 @@ const AR_SA_MESSAGES = {
         rowReorderDisabledEditing: "أكمل التحرير قبل إعادة ترتيب الصفوف.",
         rowReorderDisabledFiltered: "امسح التصفية قبل إعادة ترتيب الصفوف.",
         rowReorderDisabledGrouped: "ألغِ التجميع قبل إعادة ترتيب الصفوف.",
+        rowReorderDisabledServerBinding: "لا يمكن إعادة ترتيب الصفوف مع ربط الخادم.",
         rowReorderDisabledSingleRow: "يلزم صفّان على الأقل لإعادة ترتيب الصفوف.",
         rowReorderDisabledSorted: "ألغِ الفرز قبل إعادة ترتيب الصفوف.",
         rowReorderDisabledVirtualScroll: "لا يمكن إعادة ترتيب الصفوف أثناء استخدام التمرير الافتراضي.",
@@ -624,6 +625,7 @@ const ES_ES_MESSAGES = {
         rowReorderDisabledEditing: "Termina la edición para reordenar las filas.",
         rowReorderDisabledFiltered: "Limpia los filtros para reordenar las filas.",
         rowReorderDisabledGrouped: "Quita la agrupación para reordenar las filas.",
+        rowReorderDisabledServerBinding: "No se pueden reordenar filas con vinculación al servidor.",
         rowReorderDisabledSingleRow: "Se necesitan al menos dos filas para reordenarlas.",
         rowReorderDisabledSorted: "Quita la ordenación para reordenar las filas.",
         rowReorderDisabledVirtualScroll: "La reordenación de filas no está disponible mientras el desplazamiento virtual está activado.",
@@ -669,8 +671,8 @@ const ES_ES_MESSAGES = {
     },
     pager: {
         firstPageLabel: "Primera página",
-        jumpBackwardLabel: (pages) => pages === 1 ? "Retroceder 1 página" : `Retroceder ${pages} páginas`,
-        jumpForwardLabel: (pages) => pages === 1 ? "Avanzar 1 página" : `Avanzar ${pages} páginas`,
+        jumpBackwardLabel: (pages) => (pages === 1 ? "Retroceder 1 página" : `Retroceder ${pages} páginas`),
+        jumpForwardLabel: (pages) => (pages === 1 ? "Avanzar 1 página" : `Avanzar ${pages} páginas`),
         lastPageLabel: "Última página",
         nextPageLabel: "Página siguiente",
         ofText: "de",
@@ -891,7 +893,7 @@ const DE_DE_MESSAGES = {
     dropdowns: {
         itemPosition: (text, position, total) => `${text}, ${position} von ${total}`,
         noResultsFound: "Keine Ergebnisse gefunden",
-        resultsAvailable: (count) => count === 1 ? "1 Ergebnis verfügbar" : `${count} Ergebnisse verfügbar`
+        resultsAvailable: (count) => (count === 1 ? "1 Ergebnis verfügbar" : `${count} Ergebnisse verfügbar`)
     },
     editor: {
         addColumnAfter: "Spalte danach einfügen",
@@ -978,7 +980,7 @@ const DE_DE_MESSAGES = {
         cancel: "Abbrechen",
         cancelRowEdit: "Zeilenbearbeitung abbrechen",
         columns: "Spalten",
-        columnsSelected: (count) => count === 1 ? "1 Spalte ausgewählt" : `${count} Spalten ausgewählt`,
+        columnsSelected: (count) => (count === 1 ? "1 Spalte ausgewählt" : `${count} Spalten ausgewählt`),
         delete: "Löschen",
         deleteRowConfirmation: "Diese Zeile wirklich löschen?",
         deleteRowTitle: "Zeile löschen?",
@@ -1002,6 +1004,7 @@ const DE_DE_MESSAGES = {
         rowReorderDisabledEditing: "Bearbeitung abschließen, um Zeilen neu anzuordnen.",
         rowReorderDisabledFiltered: "Filter aufheben, um Zeilen neu anzuordnen.",
         rowReorderDisabledGrouped: "Gruppierung aufheben, um Zeilen neu anzuordnen.",
+        rowReorderDisabledServerBinding: "Bei Serverbindung können Zeilen nicht neu angeordnet werden.",
         rowReorderDisabledSingleRow: "Zum Neuanordnen sind mindestens zwei Zeilen erforderlich.",
         rowReorderDisabledSorted: "Sortierung aufheben, um Zeilen neu anzuordnen.",
         rowReorderDisabledVirtualScroll: "Bei aktiviertem virtuellem Scrollen können Zeilen nicht neu angeordnet werden.",
@@ -1269,7 +1272,7 @@ const FR_FR_MESSAGES = {
     dropdowns: {
         itemPosition: (text, position, total) => `${text}, ${position} sur ${total}`,
         noResultsFound: "Aucun résultat trouvé",
-        resultsAvailable: (count) => count === 1 ? "1 résultat disponible" : `${count} résultats disponibles`
+        resultsAvailable: (count) => (count === 1 ? "1 résultat disponible" : `${count} résultats disponibles`)
     },
     editor: {
         addColumnAfter: "Insérer une colonne après",
@@ -1380,6 +1383,7 @@ const FR_FR_MESSAGES = {
         rowReorderDisabledEditing: "Terminez la modification avant de réordonner les lignes.",
         rowReorderDisabledFiltered: "Supprimez les filtres avant de réordonner les lignes.",
         rowReorderDisabledGrouped: "Supprimez le regroupement avant de réordonner les lignes.",
+        rowReorderDisabledServerBinding: "La réorganisation des lignes est indisponible avec la liaison serveur.",
         rowReorderDisabledSingleRow: "Au moins deux lignes sont nécessaires pour les réordonner.",
         rowReorderDisabledSorted: "Supprimez le tri avant de réordonner les lignes.",
         rowReorderDisabledVirtualScroll: "La réorganisation des lignes n’est pas disponible lorsque le défilement virtuel est activé.",
@@ -1425,8 +1429,8 @@ const FR_FR_MESSAGES = {
     },
     pager: {
         firstPageLabel: "Première page",
-        jumpBackwardLabel: (pages) => pages === 1 ? "Reculer de 1 page" : `Reculer de ${pages} pages`,
-        jumpForwardLabel: (pages) => pages === 1 ? "Avancer de 1 page" : `Avancer de ${pages} pages`,
+        jumpBackwardLabel: (pages) => (pages === 1 ? "Reculer de 1 page" : `Reculer de ${pages} pages`),
+        jumpForwardLabel: (pages) => (pages === 1 ? "Avancer de 1 page" : `Avancer de ${pages} pages`),
         lastPageLabel: "Dernière page",
         nextPageLabel: "Page suivante",
         ofText: "sur",
@@ -1734,7 +1738,7 @@ const IT_IT_MESSAGES = {
         cancel: "Annulla",
         cancelRowEdit: "Annulla modifica della riga",
         columns: "Colonne",
-        columnsSelected: (count) => count === 1 ? "1 colonna selezionata" : `${count} colonne selezionate`,
+        columnsSelected: (count) => (count === 1 ? "1 colonna selezionata" : `${count} colonne selezionate`),
         delete: "Elimina",
         deleteRowConfirmation: "Sei sicuro di voler eliminare questo elemento?",
         deleteRowTitle: "Eliminare la riga?",
@@ -1758,6 +1762,7 @@ const IT_IT_MESSAGES = {
         rowReorderDisabledEditing: "Completa la modifica prima di riordinare le righe.",
         rowReorderDisabledFiltered: "Rimuovi i filtri prima di riordinare le righe.",
         rowReorderDisabledGrouped: "Rimuovi il raggruppamento prima di riordinare le righe.",
+        rowReorderDisabledServerBinding: "Il riordino delle righe non è disponibile con il binding al server.",
         rowReorderDisabledSingleRow: "Sono necessarie almeno due righe per riordinarle.",
         rowReorderDisabledSorted: "Rimuovi l'ordinamento prima di riordinare le righe.",
         rowReorderDisabledVirtualScroll: "Il riordinamento delle righe non è disponibile con lo scorrimento virtuale attivo.",
@@ -1804,7 +1809,7 @@ const IT_IT_MESSAGES = {
     pager: {
         firstPageLabel: "Prima pagina",
         jumpBackwardLabel: (pages) => pages === 1 ? "Torna indietro di 1 pagina" : `Torna indietro di ${pages} pagine`,
-        jumpForwardLabel: (pages) => pages === 1 ? "Avanza di 1 pagina" : `Avanza di ${pages} pagine`,
+        jumpForwardLabel: (pages) => (pages === 1 ? "Avanza di 1 pagina" : `Avanza di ${pages} pagine`),
         lastPageLabel: "Ultima pagina",
         nextPageLabel: "Pagina successiva",
         ofText: "di",
@@ -2136,6 +2141,7 @@ const JA_JP_MESSAGES = {
         rowReorderDisabledEditing: "行を並べ替える前に編集を完了してください。",
         rowReorderDisabledFiltered: "行を並べ替える前にフィルターを解除してください。",
         rowReorderDisabledGrouped: "行を並べ替える前にグループ化を解除してください。",
+        rowReorderDisabledServerBinding: "サーバーバインディングでは行を並べ替えられません。",
         rowReorderDisabledSingleRow: "行を並べ替えるには2行以上必要です。",
         rowReorderDisabledSorted: "行を並べ替える前にソートを解除してください。",
         rowReorderDisabledVirtualScroll: "仮想スクロールが有効な場合、行の並べ替えは使用できません。",
@@ -2514,6 +2520,7 @@ const KO_KR_MESSAGES = {
         rowReorderDisabledEditing: "편집을 완료한 후 행 순서를 변경하세요.",
         rowReorderDisabledFiltered: "필터를 지운 후 행 순서를 변경하세요.",
         rowReorderDisabledGrouped: "그룹화를 해제한 후 행 순서를 변경하세요.",
+        rowReorderDisabledServerBinding: "서버 바인딩에서는 행 순서를 변경할 수 없습니다.",
         rowReorderDisabledSingleRow: "행 순서를 변경하려면 행이 두 개 이상 필요합니다.",
         rowReorderDisabledSorted: "정렬을 해제한 후 행 순서를 변경하세요.",
         rowReorderDisabledVirtualScroll: "가상 스크롤을 사용하는 동안에는 행 순서를 변경할 수 없습니다.",
@@ -2868,7 +2875,7 @@ const PT_BR_MESSAGES = {
         cancel: "Cancelar",
         cancelRowEdit: "Cancelar edição da linha",
         columns: "Colunas",
-        columnsSelected: (count) => count === 1 ? "1 coluna selecionada" : `${count} colunas selecionadas`,
+        columnsSelected: (count) => (count === 1 ? "1 coluna selecionada" : `${count} colunas selecionadas`),
         delete: "Excluir",
         deleteRowConfirmation: "Tem certeza de que deseja excluir este item?",
         deleteRowTitle: "Excluir linha?",
@@ -2892,6 +2899,7 @@ const PT_BR_MESSAGES = {
         rowReorderDisabledEditing: "Conclua a edição antes de reordenar as linhas.",
         rowReorderDisabledFiltered: "Remova os filtros antes de reordenar as linhas.",
         rowReorderDisabledGrouped: "Remova o agrupamento antes de reordenar as linhas.",
+        rowReorderDisabledServerBinding: "A reordenação de linhas não está disponível com vinculação ao servidor.",
         rowReorderDisabledSingleRow: "São necessárias pelo menos duas linhas para reordenar.",
         rowReorderDisabledSorted: "Remova a ordenação antes de reordenar as linhas.",
         rowReorderDisabledVirtualScroll: "A reordenação de linhas não está disponível com a rolagem virtual ativada.",
@@ -2937,8 +2945,8 @@ const PT_BR_MESSAGES = {
     },
     pager: {
         firstPageLabel: "Primeira página",
-        jumpBackwardLabel: (pages) => pages === 1 ? "Retroceder 1 página" : `Retroceder ${pages} páginas`,
-        jumpForwardLabel: (pages) => pages === 1 ? "Avançar 1 página" : `Avançar ${pages} páginas`,
+        jumpBackwardLabel: (pages) => (pages === 1 ? "Retroceder 1 página" : `Retroceder ${pages} páginas`),
+        jumpForwardLabel: (pages) => (pages === 1 ? "Avançar 1 página" : `Avançar ${pages} páginas`),
         lastPageLabel: "Última página",
         nextPageLabel: "Próxima página",
         ofText: "de",
@@ -3270,6 +3278,7 @@ const ZH_CN_MESSAGES = {
         rowReorderDisabledEditing: "请完成编辑后再重新排列行。",
         rowReorderDisabledFiltered: "请清除筛选后再重新排列行。",
         rowReorderDisabledGrouped: "请清除分组后再重新排列行。",
+        rowReorderDisabledServerBinding: "服务器绑定时无法重新排列行。",
         rowReorderDisabledSingleRow: "至少需要两行才能重新排列。",
         rowReorderDisabledSorted: "请清除排序后再重新排列行。",
         rowReorderDisabledVirtualScroll: "启用虚拟滚动时无法重新排列行。",
@@ -3648,6 +3657,7 @@ const ZH_TW_MESSAGES = {
         rowReorderDisabledEditing: "請完成編輯後再重新排列資料列。",
         rowReorderDisabledFiltered: "請清除篩選後再重新排列資料列。",
         rowReorderDisabledGrouped: "請清除群組後再重新排列資料列。",
+        rowReorderDisabledServerBinding: "伺服器繫結時無法重新排列資料列。",
         rowReorderDisabledSingleRow: "至少需要兩個資料列才能重新排序。",
         rowReorderDisabledSorted: "請清除排序後再重新排列資料列。",
         rowReorderDisabledVirtualScroll: "啟用虛擬捲動時無法重新排列資料列。",
@@ -4026,6 +4036,7 @@ const TR_TR_MESSAGES = {
         rowReorderDisabledEditing: "Satırları yeniden sıralamadan önce düzenlemeyi tamamlayın.",
         rowReorderDisabledFiltered: "Satırları yeniden sıralamadan önce filtreleri kaldırın.",
         rowReorderDisabledGrouped: "Satırları yeniden sıralamadan önce gruplamayı kaldırın.",
+        rowReorderDisabledServerBinding: "Sunucu bağlaması etkinken satırlar yeniden sıralanamaz.",
         rowReorderDisabledSingleRow: "Yeniden sıralamak için en az iki satır gerekir.",
         rowReorderDisabledSorted: "Satırları yeniden sıralamadan önce sıralamayı kaldırın.",
         rowReorderDisabledVirtualScroll: "Sanal kaydırma etkinken satırlar yeniden sıralanamaz.",
@@ -4404,6 +4415,7 @@ const ID_ID_MESSAGES = {
         rowReorderDisabledEditing: "Selesaikan pengeditan sebelum menyusun ulang baris.",
         rowReorderDisabledFiltered: "Hapus filter sebelum menyusun ulang baris.",
         rowReorderDisabledGrouped: "Hapus pengelompokan sebelum menyusun ulang baris.",
+        rowReorderDisabledServerBinding: "Baris tidak dapat disusun ulang saat pengikatan server aktif.",
         rowReorderDisabledSingleRow: "Diperlukan setidaknya dua baris untuk menyusun ulang.",
         rowReorderDisabledSorted: "Hapus pengurutan sebelum menyusun ulang baris.",
         rowReorderDisabledVirtualScroll: "Baris tidak dapat disusun ulang saat pengguliran virtual aktif.",
@@ -4811,6 +4823,7 @@ const RU_RU_MESSAGES = {
         rowReorderDisabledEditing: "Завершите редактирование перед изменением порядка строк.",
         rowReorderDisabledFiltered: "Очистите фильтры перед изменением порядка строк.",
         rowReorderDisabledGrouped: "Отмените группировку перед изменением порядка строк.",
+        rowReorderDisabledServerBinding: "Изменение порядка строк недоступно при привязке к серверу.",
         rowReorderDisabledSingleRow: "Для изменения порядка нужны как минимум две строки.",
         rowReorderDisabledSorted: "Сбросьте сортировку перед изменением порядка строк.",
         rowReorderDisabledVirtualScroll: "Нельзя изменять порядок строк при включённой виртуальной прокрутке.",
@@ -4896,7 +4909,7 @@ const RU_RU_MESSAGES = {
     },
     splitButton: {
         menuButtonAriaLabel: "Показать параметры меню",
-        splitButton: (text) => text ? `${text}, разделённая кнопка` : "Разделённая кнопка"
+        splitButton: (text) => (text ? `${text}, разделённая кнопка` : "Разделённая кнопка")
     },
     splitter: {
         collapseDown: "Свернуть нижнюю панель",